Правила дизайна сайта

Прочитав множество книг о дизайне сайта, я нигде не нашел конкретных правил, которые бы помогали создавать дизайн сайта. Поэтому цель данной статьи, собрать все идеи и правила, которыми нужно руководствоваться при разработке интерфейса.

Идеи и правила дизайна сайта

Ссылки должны быть подчеркнуты, или четко отделяться от текста. Это дает возможность сориентироваться новому пользователю.

Кнопки должны быть похожи на кнопки (выпуклые с окантовкой и т.д.). Это также дает возможность понять, куда можно нажимать.

Вверху слева, должен быть логотип, под которым слоган, отображающий концепцию сайта. Пользователь читает страницу, слева направо двигаясь вниз. Первым, что он должен понять – это то, что он находится на вашем сайте.

У каждой страницы должно быть четко выделенное название.

Наиболее выраженный элемент – контент страницы (та информация, которую предположительно ожидает увидеть пользователь).

Нужно учитывать психологию цвета (о ней читайте здесь),  при создании дизайна.

Иконки лучше воспринимаются, если они монохромные и широко известные.

Правило трех кликов. К любой странице сайта, можно добраться не более чем в 3 клика.

Дизайн главной страницы должен отличаться от других страниц, это стартовая точка. Главная страница показывает все, что есть на сайте вообще.

На сайтах фирмы, компании, должна присутствовать система FAQ(часто задаваемых вопросов). 5 наиболее задаваемых, следует вывести на главной странице.

Стоит упрощать путь к поиску информации и ожиданиям пользователей (всплывающие подсказки, ajaxподгрузка данных).

Тексты на страницы должны быть максимально краткими, информативными, в противном случае, разделены на смысловые блоки. Если текст слишком длинный, вначале следует раскрыть основные темы статьи.

Контент должен быть максимально информирован с помощью: картинок, видео, таблиц, схем.

Как насчет ваших правил?

Это все правила, которыми я руководствуюсь при создании дизайна сайта. Какими правилами пользуетесь вы? Своими идеями и правилами можно поделиться в комментариях ниже.

Дальше: CSS псевдоэлементы :before и :after, изучение и применение