Подсказки и советы для веб-мастеров - Топ 100+
Они все короткие и со смыслом, подобно моей жизни в эти дни!
Теория и практика навигации по сайту
Правило: Используйте простые и запоминаемые URL, чтобы улучшить навигацию.
Правило: Не скрывайте URL - сложный он, или простой - если только Вы не хотите, чтобы люди не могли ссылаться напрямую.
Правило: Используйте непротиворечивые и ясные метки позволяющие отличать одну страницу от другой.
Правило: Слова типа названия учреждения или логотип должны всегда возвращать посетителя на главную страницу сайта.
Предложение: Состояние кнопок должно рассматриваться как дополнительная форма метки страницы. Кнопка в нажатом состоянии должна всегда быть вдавленной, а не выпуклой.
Предложение: При использовании цветной маркировки для указания расположения на сайте, убедитесь, что использованные цвета сильно отличаются друг от друга.
Предложение: Не пытайтесь повторять в ссылках механизм истории броузера.
Правило: Избегите ссылок, названных просто "Назад". Всегда явно укажите, куда будет идти обратная связь.
Правило: Избегайте создавать страницы, на которые нельзя вернуться использованием кнопки броузера "Назад".
Предложение: Не скрывайте выбранный адрес от посетителя, если только ссылка неважна или не создает помехи.
Предложение: Избегайте размещать основную навигацию в самом правом краю экрана.
Предложение: Главные страницы или другие страницы-ориентиры должны использовать центральную навигацию, чтобы отличаться от других страниц сайта.
Правило: Размещение навигации должно быть постоянно в пределах макета страницы.
Правило: Навигация должна быть постоянна, и элементы страницы должны располагаться в одинаковом порядке.
Предложение: Ориентированные на навигацию страницы должны помещаться по вертикали на один экран когда это только возможно, то же самое должно выполняться для основной навигации во всех других типах страниц.
Предложение: Минимизируйте расстояние между кнопками основной навигации вашего сайта и кнопкой "Назад".
Предложение: Всегда пытайтесь ограничивать перемещение мыши между последовательными элементами навигации.
Предложение: Избегайте использовать фреймы для создания структуры страницы. Используйте их для навигации.
Предложение: При использовании фреймов, сделайте в меньшем фрейме управление большим.
Предложение: Не отключайте возможность изменения размеров фрейма и прокрутку, если только разрешение не подобрано очень хорошо.
Правило: Максимально ограничьте прокрутку и передвижение мыши, необходимые для навигации.
Правило: Посетитель не должен делать более трех переходов со страницы на страницу для того, чтобы найти информацию.
Ссылки: Текст, Кнопки, Иконки и Графика
Предложение: Всегда создавайте текстовые ссылки внизу страниц при использовании длинных страниц или страниц с графическими кнопками.
Предложение: При использовании карт изображения (image maps), всегда обеспечивайте дополнительную текстовую навигацию.
Правило: Никогда полностью не удаляйте индикацию посещенных ссылок.
Правило: Избегайте изменять цвета ссылок.
Правило: Избегайте подчеркивать текст, не являющийся ссылкой. Вместо этого используйте курсив или полужирный шрифт.
Предложение: Избегайте выключать подчеркивание ссылок. Если же Вы это делаете, то придумайте другую форму пометки ссылок.
Предложение: Графические кнопки должны иметь как минимум невыбранное и выбранное состояние. Состояние с наведенной на кнопку мышью и нажатое состояние должны рассматриваться отдельно.
Предложение: Обеспечьте хорошие обозначения, указывающие формат документа. Используйте иконки, чтобы его показать.
Предложение: Указывайте, ведет ли ссылка к переходу в пределах страницы, в пределах сайта, или на другой сайт. Не прячьте URL, посетитель может получить из него ответ на этот вопрос.
Предложение: Указывайте внешние ссылки, показывая URL или используя иконку. Указывайте размер файла, который предлагаете скачивать.
Предложение: Используйте иконки или символы, или диалог предупреждения перед ссылкой.
Предложение: Избегайте изменения цвета посещенных ссылок.
Предложение: Прибавляйте дату последней модификации документа и, где необходимо, используйте значок New.
Предложение: Используйте предупреждения, или очевидные обозначения.
Предложение: При использовании сообщений в строке состояния, обеспечивайте информацию об URL для внешних ссылок.
Правило: Неверные ссылки, должны рассматриваться, как катастрофа.
Предложение: Избегайте автоматической переадресации при ошибке 404.
Поиск и Дизайн
Правило: Используйте опыт поcетителя в работе с поисковыми системами. Используйте такое же размещение и обозначение, как и в средствах локального поиска на компьютере, но избегайте подражать механизмам поиска на известных сайтах.
Правило: Не проектируйте страницы исключительно для того, чтобы привлечь поисковые системы. В конечном счете, страницы предназначены для людей.
Правило: Если сайт состоит из одинаково оформленных данных, сложных для поиска, или содержит более 100 страниц, создайте механизм поиска на сайте.
Правило: Если вы хотите, чтобы посетители часто возвращались на ваш сайт, обеспечьте средства поиска на сайте.
Предложение: Если сайт располагает поисковым механизмом, включите кнопку поиска во все страницы.
Правило: Поисковая форма, также как и страница выдачи результатов, должна соответствовать дизайну сайта.
Правило: Поисковая форма должна соответствовать содержанию того, что посетитель может искать на сайте.
Предложение: Основные текстовые поля формы поиска должны быть в два раза больше чем дополнительные.
Предложение: Лучше ограничить поиск темой, категорией, или идеей, чем разделом сайта.
Правило: Продвинутые поисковые механизмы должны иметь инструкции по использованию и примеры.
Правило: Страницы с результатами поиска должны предоставлять посетителю как можно больше информации, чтобы он мог решить, какие страницы смотреть далее.
Правило: Формат результатов поиска должен включать возвращенные поисковым механизмом данные.
Правило: Страница, говорящая об отрицательном результате поиска должна включать информацию о том, почему запрос потерпел неудачу, и, возможно, как исправить запрос.
Типы страниц и Макеты
Правило: Выбирайте размер страниц таким, чтобы их содержание всегда было под рукой.
Правило: Избегайте широких страниц, особенно с горизонтальной прокруткой.
Правило: Старайтесь разместить важные элементы, например основную панель навигации, на первом экране.
Предложение: Определите, что помещается в видимую на экране часть страницы, и пробуйте намекнуть на содержание страницы вне первого экрана.
Правило: Если есть возможность, избегайте ограничивать разрешение сайта.
Правило: При создании страниц для WebTV, создавайте страницы с жесткой структурой шириной 544 пиксела.
Предложение: При создании дизайна для определенных размеров экрана, оставьте свободными 10 процентов от доступного места.
Предложение: Позволяйте посетителю растягивать и сворачивать страницы. Не делайте страницы, заполняющие все свободное место при любом разрешении монитора, только если структура не будет потеряна без увеличения размера.
Предложение: При использовании страниц фиксированной ширины, выровняйте содержимое по центру, чтобы уменьшить восприятие пустого пространства на больших дисплеях.
Предложение: Избегайте использовать растягивающиеся конструкции с небольшим количеством содержания.
Предложение: Если это возможно, старайтесь умещать содержание страницы в пределах 3-5 экранов по вертикали.
Предложение: Управляйте полями страницы с некоторым коэффициентом.
Предложение: Обеспечивайте явную ссылку, чтобы можно было быстро пропустить страницу с заставкой.
Правило: Основная страница должна задавать визуальный и навигационный тон сайта.
Правило: Основная страница должна грузиться быстро, но быть достаточно интересной, чтобы привлекать посетителей.
Правило: Основная страница должна ясно указывать на содержание сайта.
Предложение: Основная страница должна обеспечивать основную информацию о сайте и информацию об изменениях на сайте.
Предложение: Если отдельная страница является важной или служит началом раздела, то выделите ее визуально.
Правило: Страницы сайта должны следовать стилю и навигационной системе главной страницы, по крайней мере по духу.
Предложение: Делайте ЧАСТО ЗАДАВАЕМЫЕ ВОПРОСЫ одной легко печатаемой страницей, если они имеют разумную длину.
Предложение: Обеспечивайте ссылку для возвращения к началу документа или к списку вопросов после каждого ответа.
Предложение: Консультируйтесь с профессионалом для составления или проверки любых использованных юридических терминов.
Предложение: Указывайте на страницах дату последнего изменения.
Правило: Если на сайте собирается персональная информация, обеспечьте легкодоступные, понятные правила и условия сохранения конфиденциальности.
Правило: Полная контактная информация должна быть доступна по ссылке с любой страницы сайта; адрес электронной почты должен быть включен в каждую страницу.
Предложение: Предупредите посетителей, что напечатанные страницы будут отличаться от того, что видно на экране, или укажите версию для печати.
Предложение: Используйте PDF-файлы для сложно оформленной информации, которая должна быть хорошо напечатана, вроде таблиц, технических рисунков, и сложной финансовой или математической информации.
Предложение: Указывайте на PDF-файлы при помощи текста и иконки, и обеспечьте информацию об использовании этого файла.
Правило: Создавайте заключительную страницу для каждого раздела.
Предложение: Обеспечьте ссылку для возврата к основной странице сайта со страницы выхода.
Правило: Отпускайте посетителя с миром. Избегайте фраз вроде "пожалуйста не уходите " или всплывающих окон.
Предложение: При использовании текстового дизайна, предусматривайте навигационную панель наравне с контекстными ссыками.
Предложение: Рассмотрите возможность использования текстового дизайна для сайта, где скоростью загрузки или гибкость отображения имеют наивысший приоритет.
Предложение: Избегайте использовать метафорический дизайн на сайтах для опытных посетителей или для активно посещаемых.
Предложение: Избегайте нетрадиционных интерфейсов на часто посещаемых сайтах.
Предложение: Используйте верхние и нижние колонтитулы для сайтов, ориентированных на предоставление большого объема информации.
Правило: В веб-дизайне стремитесь всегда быть последовательным, но оригинальным.
Текст
Правило: Увеличивайте размер текста, чтобы улучшить его читабельность.
Предложение: Создайте иерархию типов, изменяя цвет текста, его размер, стиль и позицию, чтобы улучшить читабельность страницы.
Правило: Отдельные детали в дизайне сайта могут сильно влиять на его восприятие.
Предложение: Избегайте использовать сглаживание в надписях, сделанных мелким шрифтом.
Предложение: Используйте три шрифта в дизайне страницы: один для заголовков, один для основного текста, и один для элементов навигации.
Правило: Текст в столбцах текста на веб-страницах никогда не должен переноситься с низа одного столбца на верх другого.
Правило: Навигационные страницы страницы требуют меньшего количества свободного пространства в тексте, чем страницы информационные.
Предложение: Будьте внимательны при использовании слов, которые имеют альтернативные значения в сети.
Цвета, Изображения и Фоны
Правило: Чтобы цвет был воспроизведен точно, всегда используйте его шестнадцатеричное значение кроме случая основных цветов: белого, черного, красного и так далее.
Предложение: Чтобы безопасно использовать более 216 цветов, используйте так называемые гибридные цвета.
Предложение: Из-за плохой совместимости браузеров избегайте использовать тег <BASEFONT> для установки шрифта в документе - особенно, если идет работа с цветами.
Правило: Всегда храните изображения в отдельном каталоге.
Правило: Называйте изображения значащими именами, группируя их по цели использования.
Правило: Вы не можете использовать тэг <IMG> без атрибута SRC.
Предложение: Текст из атрибута ALT должен усилить значение важных изображений; если изображение не несет важной смысловой нагрузки, то лучше оставить его пустым, чем загромождать страницу ненужными подсказками..
Правило: Всегда используйте атрибуты WIDTH и HEIGHT в тэге <IMG>.
Правило: Никогда не используйте атрибуты WIDTH и HEIGHT для изменения размеров изображений в HTML. Если необходимо изображение меньшего размера, создайте отдельную меньшую версию.
Правило: Всегда устанавливайте атрибут BORDER равным нулю, если только у Вас нет причины делать иначе, и помните, что изображения внутри ссылки без нулевого атрибута BORDER будут по умолчанию иметь цветную границу.
Предложение: Ограничьтесь форматами JPEG и GIF до тех пор, пока остальные не станут общеупотребимыми.
Предложение: Не полагайтесь исключительно на цвет в ссылках и информационной графике.
Правило: При создании макета страницы с нарезанными изображениями, помещенными в таблицу, убедитесь, что атрибуты WIDTH и HEIGHT у изображений и ячеек таблицы совпадают.
Правило: Для корректного расположения порезанного изображения в ячейках таблицы установите атрибуты таблицы CELLPADDING и CELLSPACING равными нулю.
Предложение: Не делайте фоновое изображение очень маленьким (например 1-2 пиксела), поскольку это может раздражать глаз.
Если Вы можете гарантировать, что ваш сайт следует всем этим правилам и предложениям, то он будет пользоваться успехом, и ваши посетители будет благодарны за хороший дизайн.
