WEBLEDI.RUВебледи Форум успешных женщин-вебмастеров
26 Сентябрь 2017, 08:54:43 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.

Войти
Правила Реклама
 
5
10
15
Свежие ответы
от OlgaGetman (Сервисы и SEO программы)
от polyakovka (Работа и услуги)
от ZarinaF (Раскрутка сайтов в поисковиках)
от Yula (Контент, копирайтинг, переводы)
от Петрова (Юзабилити)
от WantGirls (Теория и практика)
от OlgaGetman (Наши сайты)
от ladyclick.ru (Реклама и доход)
от salemed (SMM для сайта)
от WantGirls (Финансы)
от Yula (Нужна помощь по сайтам)
от osesakuf (Новичку)
от osesakuf (Yandex)
от osesakuf (Юкоз (ucoz))
от Уля67 (Обо всем)
Свежие темы
Показать ещё
  Печать  
Страниц: 1 2 3
Автор

Тема: Верстка статьи. Часть первая - Заголовки  (Прочитано 4799 раз)

0 Пользователей и 1 Гость смотрят эту тему.
Akara
Offline Offline

Пол: Женский
Сообщений: 33


Просмотр профиля
« : 12 Февраль 2014, 15:13:58 »

Ко мне часто обращаются с просьбами «сделать семантическую верстку», «почистить тему от мусора», «найти косяки в шаблоне». Но самая важная часть - непосредственно разметка статьи иногда ускользает от внимания моих заказчиков. А ведь это нельзя поправить в теме, только вы сами можете правильно размечать свои тексты. Ошибки в верстке статей встречаются довольно часто, поэтому я решила собрать их в кучу, немного приправить теорией и выложить в виде серии статей. Которые, надеюсь, будет полезны не только самым зеленым новичкам.

Так же статья преследует еще одну цель. Форум webledi дал мне массу клиентов, многих из них я искренне уважаю и люблю. Поэтому эта статья - моя благодарность. И людям находящимся здесь, и создателям форума, и самой площадке. В общем, мой маленький и скромный вклад в развитие сообщества)

Еще пара оговорок

  • В жизни теория часто расходится с практикой, а спецификации html с требованиями seo. Поэтому это не статья "Делай так и только так", а скорее "Как бы сделала я, исходя из своего опыта и понимания". Поэтому любые поправки и замечания только приветствуются)
  • В практической части будет описан редактор wordpress, так как работаю только с этим движком. Но, думаю, теории будет достаточно, чтобы использовать полученные знания на других cms.

Итак начинаем.

Почему я вообще считаю разметку важной? Поисковый робот не видит того, что видно человеческому глазу. Не видит всяких декоративных элементов, размера шрифтов, отступов, выделений цветом. Всего того, что расставляет акценты, структурирует и облегчает восприятие текста для человека. Зато он видит html-теги и благодаря им понимает, какую смысловую нагрузку несет тот или иной блок. Без тегов статьи для него выглядели бы примерно так



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

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

Заголовки h1-h6

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

1. Нарушение иерархии

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

Поясню на примере все той же статьи из Википедии о Яндексе Улыбка



Мы видим четкую иерархическую структуру. h1 - название статьи, h2 - это как бы подразделы, отдельные самостоятельные составляющие основной темы, h3 - подразделы подразделов) И так далее по порядку, получается своеобразная матрешка из смысловых блоков. Конечно, нарушение порядка не приведет к страшной каре в виде фильтра, но правильное и разумное использование позволит извлечь больше пользы из текста.

2. Двойной акцент на выделенном тексте

Такое часто встречается в плохо сверстанных темах, где верстальщик не потрудился прописать стили для всех элементов оформления текста. Например, сначала сбросил все стили, а потом забыл про жирное начертание для заголовков. Владелец сайта, публикуя статью, вставил заголовок как и положено, но на странице ничего не изменилось. И он просто нажал на кнопочку B (Жирный) в визуальном редакторе. Или обычное начертание было предусмотрено в дизайне, заголовки от основного текста отличались только размером. А человек, публикующий статью, ради декоративных целей выделил нежирный заголовок с помощью все той же кнопочки «B». В итоге получилось что-то типа такого



strong сам по себе является тегом акцентирования, указывает на высокую значимость выделенного текста, поэтому дополнять им и так уже важный заголовок по меньшей мере неправильно. А в некоторых случаях и вредно для продвижения. Поэтому будет правильнее добавить жирное начертание для нужного заголовка через стили, если оно не прописано в теме. Например, для указанного выше случая это будет h2 { font-weight: bold; } в файле style.css

Так же часто встречаются другие вариации, когда вместо strong вставляют b, em или i, только ради декоративных целей. Но об этом в следующий раз, теги акцентирования - довольно большая и очень противоречивая тема.

Как быстро узнать, какие заголовки используются в статье

Для этих целей я использую дополнение для firefox - RDS Bar. Для других браузеров, думаю, оно тоже имеется.



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

Теперь про кнопочки

В редакторе wp есть весь нужный нам функционал для добавления заголовков. Для тех, кто не знает, где его найти, небольшая фото-инструкция

1. Нажимаем последнюю кнопку на панели редактора


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



3. Выбираем нужный нам уровень заголовка



4. Все, наш заголовок готов



На этом пока все. И так пожалуй получилось слишком много текста. Да и, честно говоря, очень хочется поскорее получить обратную связь, так как статьи я пишу очень нечасто. Интересно, ваше мнение как в целом по статье, так и по форме подачи. Может стоит о чем-то писать подробнее? А от чего-то совсем отказаться? И вообще интересно ли вам читать дальше?
Записан
yasina
Offline Offline

Пол: Женский
Сообщений: 1546



Просмотр профиля
« Ответ #1 : 12 Февраль 2014, 15:40:34 »

Спасибо, Татьяна!!! любовь
"1. Нарушение иерархии" - раньше у меня с этим были проблемы. Я была убеждена, что нужно делать только так - заголовки, заголовки, и среди них нельзя влеплять подзаголовки В замешательстве
Записан
Katya13
Хочу на море (ни разу не была...)
Offline Offline

Пол: Женский
Сообщений: 1177


Будь оригинальной - добьешься успеха и вершины!


Просмотр профиля
« Ответ #2 : 12 Февраль 2014, 15:58:17 »

Татьяна, спасибо дарю цветочек дарю цветочек дарю цветочек
Записан

Seremetra
Offline Offline

Пол: Женский
Сообщений: 63



Просмотр профиля
« Ответ #3 : 12 Февраль 2014, 16:02:18 »

Замечательная тема. С нетерпением жду продолжения.  Подмигивающий
Записан

Я этого хочу, значит это будет (с)
Sunleo
Offline Offline

Сообщений: 271



Просмотр профиля
« Ответ #4 : 12 Февраль 2014, 16:14:48 »

Еще стоит отметить что структура статьи, нужна еще и для поведенческих факторов. Ведь когда удобно читать, то это плюс только.  дарю цветочек
Записан
Akara
Offline Offline

Пол: Женский
Сообщений: 33


Просмотр профиля
« Ответ #5 : 12 Февраль 2014, 16:29:56 »

Девочки, большое спасибо. Значит буду писать дальше)

Sunleo, да, конечно, это тоже может косвенно повлиять. Но суть в том, что для пользователя мы можем как угодно оформить статью с помощью файла стилей, используя при этом любые теги. И для человека все будет красиво, удобно и читабельно. А используя теги по назначению, мы как будто расставляем маячки для робота, типа: "Вот смотри это один абзац, это заголовок, это список" и тд. Таким образом, мы делаем делаем текст понятным, логичным, предсказуемым и для него.
Записан
АТВ
Как мотивировать себя что-то делать? Да никак - оставайтесь в жопе.(с)
Offline Offline

Сообщений: 758


Упорство, спонтанность, оригинальность - мой девиз


Просмотр профиля WWW
« Ответ #6 : 12 Февраль 2014, 17:27:55 »

Подписалась буду постоянным читателем дарю цветочек
Записан

Марина13
Offline Offline

Пол: Женский
Сообщений: 2084



Просмотр профиля
« Ответ #7 : 12 Февраль 2014, 17:38:31 »

спасибо за ценную информацию
Записан
ewa
Я не ищу счастье, я его источник!!!
Offline Offline

Пол: Женский
Сообщений: 872



Просмотр профиля
« Ответ #8 : 12 Февраль 2014, 18:02:37 »

Танечка, статья супер. Все доходчиво написано, как по мне.  дарю цветочек
Записан

Gaume
Offline Offline

Пол: Женский
Сообщений: 675



Просмотр профиля
« Ответ #9 : 12 Февраль 2014, 20:14:25 »

Татьяна, спасибо за статью  Улыбка
С нетерпением буду ждать продолжения...
Записан
Valeriya
Offline Offline

Пол: Женский
Сообщений: 1582



Просмотр профиля
« Ответ #10 : 12 Февраль 2014, 20:17:54 »

Танюша, спасибо  дарю цветочек Жду продолжения  Улыбка
Записан
alenaDon
Offline Offline

Сообщений: 115



Просмотр профиля
« Ответ #11 : 13 Февраль 2014, 18:35:10 »

Танюша, спасибо большое!
Ждем продолжения. дарю цветочек
Лично мне еще было бы интересно почитать ваше мнение о простановке ссылок в статье (сколько и куда - на статьи, на рубрики, на главную) и распределении веса.
« Последнее редактирование: 13 Февраль 2014, 18:49:14 от alenaDon » Записан

Многолетняя проверенная партнерка, которая платит честно и принимает молодые сайты (от 100 уников на платном хостинге)
biovi
Offline Offline

Пол: Женский
Сообщений: 21


Оля, ко мне на ты =)


Просмотр профиля
« Ответ #12 : 13 Февраль 2014, 19:45:28 »

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

Девочки, присылайте фото не меньше 300кб каждое и размер не менее 1000 по ширине, благодарю за понимание
Mazajka
Всё-равно свой сайт не брошу. потому что он ХОРОШИЙ!
Offline Offline

Пол: Женский
Сообщений: 7411


Уже и аватарку нельзя поставить, какую хочу...


Просмотр профиля
« Ответ #13 : 13 Февраль 2014, 19:46:09 »

Я раньше тоже вставляла Н2 как раздел, а Н3 как подразделы, например:
Как приготовить ленивые вареники - Н2
Ленивые вареники с вишней - Н3
Ленивые вареники с картошкой - Н3
Ленивые вареники с творогом - Н3
Как подготовить посуду для ленивых вареников - Н2
Это логично, как по мне. Но СЕО_гуру, сказали, что так делать НИЗЯ!!! Только Н1, далее, Н2, и далее Н3-Н6. Теперь буду делать, как раньше, спасибо, Татьяна!
Записан


ingulec
Offline Offline

Пол: Женский
Сообщений: 341


Люблю свою страну, горжусь свои городом.


Просмотр профиля
« Ответ #14 : 13 Февраль 2014, 23:15:18 »

Отличная статья, спасибо  дарю цветочек Подписалась на тему.
А можно вопрос  стеснительный
Мне периодически на почту приходят письма от  мегаиндекс, что-то типа: "для вашего сайта такого-то только что был сделан новый SEO-аудит. Ознакомиться и рекомендациями по устранению ошибок: там-то. Я их обычно игнорирую, а вот сегодня решила посмотреть и первое, что увидела - замечания к Н1  (к нескольким)  Шокирован  Дословно: "количество слов: 8 (уровень проблемы 6)"
Т.е они хотят сказать, что количество слов в Н1 должно быть меньше? А сколько тогда оптимально?
Записан


Зарабатываю 
Страниц: 1 2 3
  Печать  
 
Перейти в:  

| Sitemap