X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Юзабильность vs. Дизайн
FordogeN
FordogeN
Topic Starter сообщение 3.12.2008, 5:38; Ответить: FordogeN
Сообщение #1


Старожил
******

Группа: User
Сообщений: 1877
Регистрация: 15.7.2008
Поблагодарили: 8 раз
Репутация:   1  


Что такое дизайн, думаю объяснять не нужно. Что такое "юзабильность" - объясняю:
Это не по боюсь так выразиться "наука" о том, как делать удобные для использования дизайны.
Дизайн - не обязательно сайта! Это может быть журнал, игровой или программный интерфейс...
Но по скольку это форум ВЕБ-мастеров - речь пойдет о дизайне и юзабильности дизайна сайтов.

В первую очередь хочу сказать о "правиле трех цветов". Соблюдая это правило Вам будет значительно проще создать приятный дизайн. Думаю из названия, можно понять что правило гласит о том, что в дизайне нужно использовать не более трез основных цветов! Этим я хочу сказать - в шапке нашего сайта может быть цветная иллюстрация или фотография, но основные элементы - не должны выходить за рамки 3х цветов.

Приведу пример на своем сайте - www.livekeep.ru.
[img]http://www.ii4.ru/images/270079like.jpg[/img]
В этой версии дизайна я использовал 3 основных цвета: белый, бирюзово-голубой, светло-желтый. Но в логотипе у меня так же присутствует зеленоватый цвет, если по листаете страницу - ниже ели-заметные светло-серые элементы дизайна.

Но обратите внимание - 3 основных цвета:
везде БЕЛЫЙ фон и СВЕТЛО-СЕРЫЕ элементы дизайна
Голубоватая шапка, все ссылки примерно того же цвета, категории в виде облака тегов - при наведении обретают синий фон.
И по всему сайту светло-желтое меню.

Можете по смотреть на сайт beon.ru - там преобладает белый цвет, и каждый блок выделен своим цветом, но при "многоцветности" сайт не теряет юзабильности.

Ладно, пора завязывать тему про цвета, поехали дальше!



На сайте, с любой его внутренней страницы должна быть прямая ссылка на главную и не желательно чтоб на странице на которой мы находимся - была ссылка на эту же страницу. А еще - навигация должна быть построена таким образом, чтоб к примеру если посетитель отошел сделать кофейку и вернулся назад - мог сразу понять, на какой странице он находится - это можно изобразить, как выделение нужного пункта меню цветом или использовать вот такую вспомогательную навигацию:
[img]http://www.ii4.ru/images/190975nav.jpg[/img]
Так же можно использовать в качестве выхода из этой ситуации титлы страниц и заголовки.

Еще пару слов о навигации - в ней обязательно должен присутствовать пункт "О нас" или "О проекте" и на соответствующей странице должен быть соответствующий контент))) Это я упомянул затем, чтоб если появится тот, кто захочет разместить рекламу на сайте - он мог в этом разделе найти какие либо статистические или контактные данные, а так же на этой странице можно написать описание сайта с ключевиками!

По поводу контента - никогда не делайте фон и текст похожих цветов, не делайте ярких фонов и не ставьте в качестве фона картинки с четкими линиями которые контрастируют с фоном!

Лично я рекомендую фон области контента делать белым, т.к. если Вам нужно будет вставить какую либо картинку, на пример если у Вас сайт о мобильниках и нужно вставить фотку мобильника - Вам проще будет найти фотку с белым фоном, чем, на пример - с красным.

Не забывайте о том, что разные люди используют разные браузеры и сидят под разными разрешениями экрана - делайте "резиновые дизайне" т.е. не привязывайте элементы к определенным точкам. Не вставляйте изображения, которые шире чем 1024 пиксела, т.к. на данный момент 45% пользователей, в том числе я используют разрешение 1024*768. Не вставляйте чего либо, чтоб не было горизонтального скроллинга - это не допустимо!

Так же - не размещайте много всяких счетчиков и баннеров - много рекламы не нравится пользователям!

Пока что всё. Спрашивайте что интересует - отвечу! ;)


--------------------


Поблагодарили: (4)
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Galeodor
Galeodor
сообщение 3.12.2008, 10:38; Ответить: Galeodor
Сообщение #2


Старожил
******

Группа: User
Сообщений: 1172
Регистрация: 27.7.2008
Из: Дзержинск
Поблагодарили: 0 раз
Репутация:   2  


Молодец =)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 3.12.2008, 12:45; Ответить: FordogeN
Сообщение #3


Старожил
******

Группа: User
Сообщений: 1877
Регистрация: 15.7.2008
Поблагодарили: 8 раз
Репутация:   1  


спасиб.. эт первая мной написанная статья ;)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 3.12.2008, 21:36; Ответить: ZiTosS
Сообщение #4


Ваша совесть
*******

Группа: User
Сообщений: 5148
Регистрация: 18.2.2008
Из: Нижний Новгород
Поблагодарили: 0 раз
Репутация:   8  


Хотелось бы почитать про различные виды сетки в дизайне. Какие сейчас актуальны(не движковые), в чём их принципиальное различие.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 3.12.2008, 22:06; Ответить: FordogeN
Сообщение #5


Старожил
******

Группа: User
Сообщений: 1877
Регистрация: 15.7.2008
Поблагодарили: 8 раз
Репутация:   1  


Ты имеешь ввиду разметку?


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ZiTosS
ZiTosS
сообщение 3.12.2008, 22:24; Ответить: ZiTosS
Сообщение #6


Ваша совесть
*******

Группа: User
Сообщений: 5148
Регистрация: 18.2.2008
Из: Нижний Новгород
Поблагодарили: 0 раз
Репутация:   8  


Нет именно сетка, вот на форуме сетка такая(рисунок рисовать лень):
сверху-вниз
1) Шапка
2) Пользовательская панель
3) навигация
4) Блок с топиком и сообщениями
5) Блок быстрого ответа
6) Блок надстроек
7) Низ страницы

Просто форум под данное описание не подходит.
Я имел ввиду различное креативное расположение контента на странице ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 3.12.2008, 22:32; Ответить: FordogeN
Сообщение #7


Старожил
******

Группа: User
Сообщений: 1877
Регистрация: 15.7.2008
Поблагодарили: 8 раз
Репутация:   1  


ну это и есть разметка! По крайней мере я это так называю... ;)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Gaia
Gaia
сообщение 6.12.2008, 12:35; Ответить: Gaia
Сообщение #8


Новичок
*

Группа: User
Сообщений: 20
Регистрация: 7.11.2008
Поблагодарили: 0 раз
Репутация:   0  


но основные элементы - не должны выходить за рамки 3х цветов


В таком случае, как же быть, если надо оформлять текстовую часть? Например, заголовки выделять одним цветом, ссылки - другим, основной текст - третим, важные моменты - четвертым :)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FordogeN
FordogeN
Topic Starter сообщение 6.12.2008, 13:34; Ответить: FordogeN
Сообщение #9


Старожил
******

Группа: User
Сообщений: 1877
Регистрация: 15.7.2008
Поблагодарили: 8 раз
Репутация:   1  


(Gaia @ 6.12.2008, 13:35) *
В таком случае, как же быть, если надо оформлять текстовую часть? Например, заголовки выделять одним цветом, ссылки - другим, основной текст - третим, важные моменты - четвертым :)


3 цвета, а у каждого цвета миллионы оттенков...


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Gaia
Gaia
сообщение 6.12.2008, 13:42; Ответить: Gaia
Сообщение #10


Новичок
*

Группа: User
Сообщений: 20
Регистрация: 7.11.2008
Поблагодарили: 0 раз
Репутация:   0  


Ну, ведь не будем же оформлять текстовую часть, со всеми заголовками, ссылками, важными мометами одним цветом, просто с разными оттенками. Ссылки, вообще, должны быть не похожи не на один элемент текста, ведь так? :) Это уже 2 цвета (текст и ссылки).
Заголовки должны тоже отличаться от текста(хоть и не сильно, да, здесь согласен, оттенок). Но, ведь бывают ещё такие случаи, например в интернет магазинах, когда надо отделить товар и описание товара, но заголовок должен оставаться. Выделять его как заголовок?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Делаю полностью уникальный дизайн для сайтов!
103 AlexDIZ 44488 27.10.2020, 23:57
автор: AlexDIZ
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыДизайн. Сайты, Соц. сети, Полиграфия
Полная упаковка вашего бизнеса
17 M-seo 9075 24.10.2020, 23:53
автор: M-seo
Открытая тема (нет новых ответов) Качественный современный дизайн сайтов, логотипов, печатной продукции. Верстка.
9 zaiko 2104 15.10.2020, 19:47
автор: zaiko
Открытая тема (нет новых ответов) Дизайн любой сложности и вёрстка под любую CMS
6 IT_alien 404 14.10.2020, 19:58
автор: EvilGomel
Открытая тема (нет новых ответов) Дизайн любой сложности и вёрстка под любую CMS
0 IT_alien 256 6.10.2020, 22:12
автор: IT_alien


 



RSS Текстовая версия Сейчас: 29.10.2020, 7:58
Дизайн