«WEB-мастерство для каждого»

  «Мой профиль»  

Уважаемые Посетители!

Этот выпуск посвящен некоторым нюансам верстки, не видимым глазу, но крайне важным с точки зрения кода и внутренней структуры web-страницы.

Alex_soldier
(alex_soldier@mail.ru)
Лаборатория FAQ Ноу-Хау Эффекты Мнения

25.01.2006: Заметка «Дизайн и элементы SEO»

Сегодня я затрону весьма неоднозначный момент. С одной стороны, работа web-мастера ограничивается созданием контента сайта, а дальше уже подключается промоутер. Но, с другой стороны, почти все мы сами себе и дазайнеры, и промоутеры, и программеры, и даже служба поддержки! К тому же, SEO (поисковая оптимизация) очень сильно переплетена со структурой и содержанием сайта.

Напомню основные моменты: оптимизация необходима, чтобы сайт повыше поднялся в результатах поиска по определенным ключевым запросам. На ранжирование влияют как внешние факторы (ИЦ), так и внутренние (релевантность, расположение текста). Вот на втором пункте мы остановимся подробнее.

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

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

Для начала разберемся с заголовком. Как правило, он не позволяет значительных вариаций, иначе утратится связь с остальным текстом. Самый простой выход из такой ситуации - заключить его внутрь тегов <noindex> ... </noindex> К сожалению, это не всегда срабатывает. Поисковые роботы каким-то образом просачиваются в закрытую зону.

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

Наиболее надежный, но и тернистый путь - генерировать надпись с помощью JavaScript. Дело в том, что тело скрипта обычно обрамляется в комментарии, а уж на закомментированный текст поисковики не должны обращать внимания по определению! Для пущей уверенности можно сделать еще и побуквенную генерацию, но думаю, для наших целей вполне достаточно будет и простого


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

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

Хочу сразу предостеречь от такого способа, как отказ от таблиц. Если вы решитесь использовать блоки, позиционируемые при помощи CSS, глюки могут многократно перекрыть все преимещество. Дело в том, что если происходит какой-либо сбой, браузеры обожают выстраивать такие блоки в столбик, один под другим. Такая же картина происходит и в браузерах, не поддерживающих CSS. Кроме того, разные элементы в разных браузерах отображаются немного по-разному, поэтому вы рискуете получить страшные наложения или обрезание элементов.

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

ТЕКСТ М
Е
Н
Ю

Так должно быть
М
Е
Н
Ю
ТЕКСТ

Так было бы лучше
М
Е
Н
Ю
ТЕКСТ

А вот как стало



Вместо таблицы из 1 строки и 2 столбцов я сделал таблицу 2х2, и во втором столбце склеил две ячейки в одну. Поскольку теперь меню описывается в первой строке, а текст - во второй, меню располагается раньше в документе! А чтобы вас не смущала пустая ячейка над текстом, задайте минимальную высоту первой строки (height = 1 или 0). Визуально не будет заметно никаких различий!



Ну и еще один простой способ, о котором я узнал уже позже. Попробуйте воспроизвести вот такой код (если перед s t y l e = появится х - удалите его):

Вот что получится - врезка в текст:

ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ

МЕНЮ

ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ ТЕКСТ



Вот сайт, на котором это очень неплохо сделано: www.exp-plant.nm.ru


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

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

Список выпусков  > Следующий выпуск  >>>

∙ Форумы ∙
∙ Космос ∙
∙ Игры ∙
∙ Heroes ∙
∙ WEB ∙
∙ AML ∙
∙ Delphi ∙
© Copyright 1998 – 2009 by Alex_soldier
Сайт сделан по технологии AML

РАЗДЕЛЫ САЙТА

Главная страница Мира Идей
Лаборатория WEB-мастера
Уголок Программиста
Игровая Зона
Статьи о Космосе и Вселенной

РАССЫЛКИ САЙТА
(Content.Mail.Ru)

Обзор интересных рассылок

Web-мастерство для каждого

Космос: Новости Вселенной

Чего нам не хватает в играх?

Heroes: только Новые Идеи

HTML, CSS, JS в примерах

Самые-самые убойные
анекдоты сети




Получить архивы на e-mail (RAR ~ 2 Мб)