Как создать сайт бесплатно? Как сделать сайт? Журнал для веб-мастеров и блогеров от школы создания сайтов

Автор: SmashingMagazine.com
Перевод: Всеволод Козлов

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

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

Итак, основным преимуществом облака тегов является их способность моментально дать понять посетителю, какие темы, освещаемые на сайте, являются приоритетными и важными, а какие затрагиваются изредка или вовсе не затрагиваются.

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

Очень часто я слышу вопрос: «А почему именно название облако тегов?». На самом деле все просто. Это название отражает визуальное отображение тегов в виде облака.

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

В этой статье-обзоре я ознакомлю Вас с примерами различных способов представления и оформления облака тегов и очень надеюсь, что Вы почерпнете отсюда много интересных идей для себя!

Облако тегов: Принцип работы

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

Т.е. самые важные или часто повторяемые теги будут либо самыми крупными по размеру, либо самыми насыщенными по цвету.

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

В то же время некоторые известные и авторитетные блогеры отказались от использования облака тегов, например авангардист Web 2.0 O’Reilly.

Облака тегов: Виды

Существуют различные способы реализации облако тегов. Какие-то способы более популярны, какие-то менее.

• Теги сортируются по алфавиту. Наиболее важные или часто повторяемые теги имеют наибольший размер шрифта.
• Теги сортируются по алфавиту. Все теги имеют одинаковый размер шрифта и начертание. Самые важные или часто повторяемые теги выделены либо цветом шрифта, либо цветом фона.
• Теги сортируются в зависимости от их важности или частоты использования. Тут для выделения могут использоваться как размер шрифта, так и цвета.
• Теги не сортируются вовсе. Для выделения используются размеры шрифта, его плотность и цвет.
• Теги сортируются по подобию. Подобные теги располагаются рядом друг с другом. Для выделения используются все вышеназванные способы.

Облако тегов: Большой недостаток

На первый взгляд все кажется очень удобным, интуитивно понятным и лишенным абсолютно любых изъянов. Но давайте посмотрим пристальнее… Сразу же замечается большой недостаток такого способа навигации – разность восприятия одного и того же тега.

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

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

• Если Вы работаете в команде, то объясните этот момент всем членам Вашей команды. Придерживайтесь конкретики – это самое главное!
• Придерживайтесь установленного заранее стиля оформления тегов. Все Ваши теги должны быть выполнены в одном стиле оформления, например, состоять только из прописных или заглавных букв. Так же очень важно избегать ошибок в написании тегов.

Оглавление тегов вместо облака тегов

Недавно нами была отмечена интересная замена облака тегов на оглавление тегов. Идея довольно-таки нераспространенная, даже уникальная!

Облако тегов с шрифтовым выделением

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

Цветные облака тегов

Выделение цветом так же используется для выделения тегов, как и манипуляции со шрифтом.

Запомните! Чем больше цветов Вы используете, тем более раздражающим становится облако тегов. Не совершайте этой грубейшей ошибки.

Максимально можно использовать 2-3 различных цвета – этого вполне достаточно.

Форма отображения тегов в облаке

В то время как одни дизайнеры экспериментируют со шрифтами и цветами, другие экспериментируют с формой отображения тегов.

Облака тегов на службе онлайн-магазинов

Интернет-магазины постепенно начинают осознавать пользу от использования облака тегов на своих сайтах.

Замаскированные облака тегов

Некоторые дизайнеры ухитряются очень реалистично замаскировать облако тегов под какой-либо элемент сайта.

Облако тегов в качестве входной страницы сайта

На следующем сайте облако тегов является единственным элементом, предстающим перед взором посетителя.

Облако тегов как полноценная страница сайта

Как только тегов набирается столько, что размещать их все на сайте становится просто невозможно, под них создается специальная страница.

Облако тегов: Генераторы

• Google Tag Cloud Maker
• TagCrowd
• TagmyCloud
• Tag Cloud
• Text Tagcloud
• Tag Cloud Generator
• MakeCloud
• Winkwaves Tag Cloud Generator
• Tag Cloud Builder
• ZoomClouds

Оригинал статьи: Tag Clouds Gallery: Examples And Good Practices

Смотрите также:

• Оформление таблиц css
• Ajax формы
• Css формы
• Ajax скрипты
• Вкладки css
• Сайт портфолио
• Footer
• Сборник иконок для рабочего стола
• Красивые таблицы css
• День рождения

Понравилась статья? Поделитесь ей в социальных сетях: