7 передовых тенденций веб-дизайна (которые действительно могут улучшить SEO)

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

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

# 1 — Дизайн, который вызывает и передает эмоции

Феноменальная статья Ааррона Уолтера из Mailchimp о ThinkVitamin — Emotional Interface Design: The Gateway to Passionate Users — глубоко исследует тенденцию дизайнеров, использующих свои таланты, чтобы запечатлеть эмоции в пользователях. Лично мне нравится эта практика, и в профессиональном плане я считаю ее невероятно ценной для SEO.

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

Для McMiller’s Sweets ниже веб-сайт выражает юмор, прихоть и одержимость бренда своим продуктом. Я только хотел бы купить онлайн — прямо сейчас в офисы SEOmoz было бы направлено несколько коробок.

Box.net, компания-разработчик программного обеспечения, ориентированная на предприятия, стремится к созданию атмосферы простоты и ощущения легкости, возникающей при использовании базового, потребительского приложения, но нацеленного на бизнес-аудиторию. Их редизайн убедил меня — он легкий и воздушный, он витает в облаках (возможно, имеет двойное значение, поскольку они размещаются в «облаке»), и он даже подчеркивает «сексуальность» приложения.

Когда пользователи эмоционально вкладываются в посещаемые веб-сайты, они с большей вероятностью:

• Ссылка на сайт
• доля
• Добавить контент
• Принимать участие
• Оставаться верным
• Инвестируйте в опыт
• Просмотреть больше страниц

Все это положительно влияет на SEO как первого, так и второго порядка.

# 2 — Призыв к действию, запускаемый с помощью прокрутки

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

Просмотрите любую статью на веб-сайте New York Times, и вы увидите это поведение в действии, побуждающее вас прочитать следующую статью в серии только после того, как вы дойдете до конца текущей статьи:

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

В следующем примере блог OKCupid использует точно такую ​​же тактику:

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

Прокрутка + триггеры = больше просмотров, больше осведомленности и больше обмена (и я думаю, что потенциальных приложений для SEO намного больше, чем только то, что было опубликовано выше).

# 3 — Значки пользователей

Если ваши пользователи увлечены вашим сайтом, их опытом или участием, почему бы не упростить обмен?

В течение многих лет сайты предлагали пользователям виртуальные поощрения в виде баллов, значков и статуса, чтобы стимулировать более активное участие. Эндрю Фоллет из Concept Feedback написал блестящую статью, в которой анализируется это точное поведение и приводится несколько потрясающих примеров.

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

Урок? Создавайте отличные сообщества, поощряйте участие и награждайте своих пользователей значками, которые сделают их сайты привлекательными. Это онлайн-эквивалент раздачи высококачественных футболок с хорошим дизайном — фанаты не будут носить их просто так, чтобы спать; они действительно будут хвастаться вашим брендом.

# 4 — Анимированный HTML-заголовок

Я писал о мультихедерах много лет назад, и с тех пор эволюция дизайна сделала их намного более привлекательными и полезными. Примером может служить Unbounce, у которого на домашней странице есть 5 различных сообщений / функций, все они доступны для движков и являются частью единого мультизаголовка. Я сделал снимок экрана, элегантно «прыгая» в заголовок и выходя из него:

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

Кстати — Кстати о Unbounce, если вы еще не читали 12-шаговую программу реабилитации целевой страницы Оли Гарднера, вы серьезно упускаете ее.

# 5 — Сексуальная, встраиваемая инфографика

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

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

И этот умный вклад от Visual Economics:

Как и в случае со значками, применяется «правило красоты» — чем привлекательнее ваша инфографика (и наиболее интересна / полезна / убедительна ее содержание), тем выше будет ее принятие.

# 6 — Дизайн вокруг иллюстрации (с помощью CSS)

Раньше я видел веб-сайт, построенный вокруг иллюстраций и артистизма, и качал головой от печали, зная, что красоту пользовательского интерфейса вряд ли сможет ощутить кто-либо, кроме тех, кто пришел через ввод текста. Сегодня, благодаря поразительному прогрессу CSS, такие сайты, как Carbon Made, тоже могут получить свой дизайнерский торт и воспользоваться своим SEO.

Кэш Google «только текст» показывает каждое слово, которое вы видите на скриншоте — мы действительно прошли долгий путь. И, черт возьми, если этот дизайн не вызывает у меня желания просто взобраться на гору и спрыгнуть со скалы в озеро, заполненное осьминогами внизу … эээ … сделайте онлайн-портфолио (да, это то самое!)

Чтобы еще раз взглянуть на Ruby on Rails разработчиков, Pioneers:

Красиво, доступно и индексируется, чего еще может попросить оптимизатор?

# 7 — Раскрытие форматов творческого контента

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

Некоторые из моих любимых недавних столкновений в этой сфере включают:

Вверху: Джентльменский журнал Grain and Gram Gentleman’s Journal

Вверху: Магазин Sanctuary T (кто знал, что небольшой интернет-магазин может быть таким красивым?)

Вверху: Heart Directed (отличное место, чтобы найти более замечательные творческие форматы, хотя ему не хватает машиночитаемого контента, чтобы быть самим примером SEO)

Это прекрасное время, чтобы побыть в сети, подумать о SEO, дизайне и блестящих вещах, которые могут произойти, если они стратегически пересекаются. Будем надеяться, что все больше из нас, кто вкладывает средства в органический поисковый трафик, выполнят эту задачу с помощью потрясающего дизайна. Это не просто больше ссылок — это большее участие и более высокая вероятность того, что произойдет обмен всеми видами. Как бы ни развивались поисковые системы, вы можете быть уверены, что именно за такое поведение они будут стремиться вознаградить.

ps Если дизайн вас вдохновляет, я бы порекомендовал проверить список 10 свежих галерей Drawar и Six Revisions из 10 свежих галерей для вдохновения.