Подсказки и советы для веб-мастеров - Топ
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 пиксела), поскольку это
может раздражать глаз.
Если Вы можете гарантировать, что ваш сайт следует
всем этим правилам и предложениям, то он будет
пользоваться успехом, и ваши посетители будет
благодарны за хороший дизайн.