Мероприятия по оптимизации блога friendlycards (часть-1)


1. В раздел head добавлен такой участок кода:

<b:if cond='data:blog.pageType == &quot;archive&quot;'><meta content='noindex,follow' name='robots'/></b:if><b:if cond='data:blog.pageType == &quot;index&quot;'><b:if cond='data:blog.url != data:blog.homepageUrl'><meta content='noindex,follow' name='robots'/></b:if></b:if><b:include data='blog' name='all-head-content'/>
<meta content='INDEX,FOLLOW' name='robots'/>


<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
    <meta content='width=1100' name='viewport'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/>|<data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<link expr:href='data:blog.homepageUrl' rel='canonical'/>
</b:if>
<meta content='#' name='keywords'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<meta content='' name='author'/>
</b:if>

Это позволяет комплексно решить целый ряд задач:
а) закрытие от индексации архива

б) исправить баги для браузера IE7

в) Изменить структуру страницы - теперь в поиске сначала появляется заголовок поста, а потом название блога

г) Появилась строка, которая указывает поисковым роботам, какой URL является каноническим

д) В коде появилась строка для внесения ключевых слов (keywords)


2. Удалил виджет архива - он не несёт полезной нагрузки

3. Удаляем вредные внешние ссылки:

а) Добавляем в код картинок в сайдбаре отрывок rel="nofollow" (это команда поисковым системам не передавать с этой ссылкой вес страницы)

б) Удалил блок социальных кнопок от блоггер под статьями (в каждом таком блоке целых 6 вредных внешних ссылок) и заменил их полезным и функциональным скриптом соц.ссылок от Яндекс

в) удалил с главной страницы блок соц.ссылок и ярлык быстрого редактирования под каждым постом

г) удаляем в каждом виджете иконку быстрого редактирования, которая выглядит так:


Для этого в коде каждого виджета (в основном коде шаблона) удаляем строчку:

<b:include name='quickedit'/>

4. Для полноценного функционирования виджетов и картинок в блоге лучше пользоваться формой "HTML/JavaScript"

Для этого заходим в Панель управления -- Дизайн -- Добавить гаджет
и в открывшемся списке выбираем "HTML/JavaScript"
Он выглядит так:

У вас почему-то они были добавлены в форму "Текст"


5. Осуществляем настройки поиска:

а) Заходим в Панель управления -- Настройки -- Настройки поиска -- Пользовательский файл robots.txt -- Изменить

В открывшееся окно вставляем следующий код:

User-agent: Mediapartners-Google
Disallow: 

User-agent: *
Disallow: /search
Allow: /

Sitemap: http://www.friendlycards.me/feeds/posts/default?orderby=UPDATED

Сохраняем

б) Заходим в Панель управления -- Настройки -- Настройки поиска -- Персонализированные теги robots для заголовков -- Изменить

Настраиваем теги следующим образом:


Сохраняем!

в) Заходим в Панель управления -- Настройки -- Настройки поиска -- Метатеги -- Описание -- Изменить

В открывшееся окно вставляем краткое описание блога.

Сохраняем.

Пункты (б) и (в) позволят теперь настраивать теги роботс и создавать описания для каждого поста отдельно. Для этого в боковой колонке справа редактора сообщений появятся специальные формы.

Мероприятия по оптимизации блога friendlycards (часть-2)

Оптимизация изображений для блога

Иллюстрации к постам блога я обрабатываю следующим образом:

1. Закаченному из Интернета, или созданному самостоятельно изображению я в фотошопе сразу задаю размер, в котором оно будет опубликовано в блоге

2. После дополнительной обработки (коррекция, фильтры и т.д.) я захожу в "Файл" и выпадающем меню выбираю "Сохранить для WEB". Выбираю оптимальное решение (хорошее качество + минимальный размер) и сохраняю в удобное место жёсткого диска (отдельную папку)

ВАЖНО: Название картинке необходимо давать латиницей, по той причине, что кириллица будет автоматом преобразована при публикации в такие кракозябры:

%25D0%2591%25D0%25B5%25D0%25B7-%25D0%25B8%25D0%25BC%25D0%25B5%25D0%25BD%25D0%25B8

3. При публикации в редакторе сообщений Blogger выбираю "Исходный размер"

ВАЖНО: При публикации изображений в Blogger, они автоматически сохраняются в облачных хранилищах WEB-альбомов Picasa, привязанных к текущему аккаунту. Это позволяет не хранить картинки на жёстком диске после их публикации.

4. Теперь, если кликнуть по изображению левой кнопкой мышки, появится полоса инструментов. Выбираем на ней справа пункт "Свойства". Перед нами появится такое окно:


Необходимо заполнить оба пункта. Как правило, я вставляю туда одинаковый текст с ключевым словом (чаще всего - просто копирую заголовок поста). Таким образом мы добавляем изображению теги title и alt. Это способствует полноценному участию картинок в поиске по изображениям.

5. Переходим на вкладку HTML редактора сообщений. Каждое изображение, загруженное с жёсткого диска компьютера или и непосредственно из Интернета, имеет такую структуру:

Код состоит из двух основных частей и закрывающего тега. Каждая часть ограничена такими скобками < >.

<Ссылка, которая начинается открывающим тегом а><сама картинка><закрывающий тег /а>


Вот, например, как выглядит упрощённая схема изображения в символах HTML:

<a href="#"><img src="#"></a>

 Где  img - тег изображения

src - тег, определяющий путь к изображению

Обычно к основным тегам добавляются ещё теги title (заголовок изображения), alt (альтернативный текст), height (высота изображения), width (ширина). В некоторых случаях к этому коду добавляются стили, указывающие положение изображения на странице.

Если мы хотим избавится от ссылки, но сохранить изображение - достаточно удалить жёлтые части и оставить зелёную часть.

Если мы хотим, что бы при клике по картинке, ссылка приводила нас на нужную страницу в Интернете, но при этом не отбирала вес у страницы, где расположена картинка - мы сохраняем все части, но сразу после открывающего тега а вставляем такой код - rel="nofollow"

Тогда схема кода изображения будет иметь такой вид:

<a rel="nofollow"href="#"><img src="#"></a>


Мероприятия по оптимизации блога friendlycards (часть-3)

Оптимизация статей

Продолжаем внутреннюю оптимизацию блога

1. Форматирование статьи:

а) Если статья большого объёма - необходимо текст разбивать на небольшие смысловые абзацы в 2-3 предложения, оставляя между абзацами пустую строку. Это делает текст визуально легче. Сплошной "кирпич" однообразного текста может отпугнуть читателя.

б) Поисковые системы рекомендуют разделять части текста, и снабжать их отдельными подзаголовками с тегами h2, h3, h4. В Blogger это осуществляется с помощью специальной функции на панели инструментов редактора статей:


в) В конце каждой статьи необходимо вставить открытую к индексации ссылку, ведущую на главную страницу блога. Например, в конце статьи мы набираем название блога и превращаем его в ссылку с помощью специального инструмента в верхнем меню редактора сообщений. Выделяем мышкой ссылку, кликаем по "ссылка" в меню редактора, заполняем появившуюся форму и кликаем по кнопке "ОК"



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

д) Ссылки на посторонние ресурсы необходимо закрывать тегом rel="nofollow" с помощью инструмента, описанного в пункте  "в)". Это защитит страницу блога от потери "ссылочного веса". Исключение могут составлять известные ресурсы с хорошими показателями, которые высоко ранжируются поиск.системами.

е) По возможности стоит использовать в тексте перечисление пунктов с использованием тегов ul и li. Это легко осуществить с помощью специальных инструментов форматирования:


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

з) Необходимо регулярно мониторить исправность ссылок. Битые (неисправные) ссылки, или ссылки, которые ведут на несуществующие ресурсы могут стать причиной штрафных санкций со стороны поисковых систем. Для проверки ссылок есть много инструментов (например - бесплатная программа Xenu)
Вот ссылка на статью, где это очень хорошо описано:
http://ktonanovenkogo.ru/wordpress/plagini_wordpress/bitye-ssylki-proverka-paneli-yandeksa-google-programmoj-xenu-link-sleuth-wordpress-plaginom-broken-link-checker.html


Мероприятия по оптимизации блога friendlycards (часть-4)

Внешняя оптимизация блога

Подтверждение авторства в поиске Google

Для подтверждения авторства необходимо соединить аккаунт в Google+ и свой блог.
Что это даёт:

1. Поисковая система более лояльно относится к ресурсам с подтверждённым авторством (проверено на опыте)

2. В поисковой выдаче, рядом со ссылкой и сниппетом (описанием) появляется картинка - аватарка автора. Это положительно влияет на количество переходов из поиска на ресурс с картинкой. Как следствие - рост трафика и повышение ранжирования блога в поиске (проверено и доказано)

Вот, как выглядит в поиске ссылка на мой блог с такой картинкой по запросу: "создание инфографики:



Действия по подтверждению аторства очень просты и осуществляются всего в два этапа:

1. В основной код шаблона, в разделе между тегами <head> и <head/> вставляем такой отрезок кода:

<a href='https://plus.google.com/103104959377713191450?rel=author'/>

и сохраняем шаблон.

Цифры, выделенные жёлтым - это цифры из адреса вашего аккаунта в Google+
(Этот шаг я уже выполнил!)

2. Второй этап вам придётся выполнить самостоятельно! :)

а) Заходите в свой аккаунт Google+

б) Слева вверху, сразу под логотипом Google+, кликаете мышкой по кнопке "Лента" и выпадающем меню выбираете "Профиль"



в) В горизонтальном меню выбираем вкладку "О себе"



г) Прокручиваем вниз до появления справа блока "Ссылки". В разделе этого блока "Мои публикации" выбираем внизу "Ссылки" -- и кликаем по  "Изменить"
Внизу, в появившемся списке выбираем "Мои публикации" -- "Добавить ссылку"
Появится такая форма:


Заполняем так, как показано на скриншоте: Верху слева - Название блога; Внизу слева - Полный адрес блога; Справа - должно быть указано "Текущие публикации". Когда всё заполнено кликаем внизу по кнопке "Сохранить". Если всё сделано правильно - рядом со ссылкой на блог появится иконка вашего блога.

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



Мероприятия по оптимизации блога friendlycards (часть-5)

Инструменты для веб-мастеров Гугл


1. На странице Панели инструментов в колонке справа , в части "Руководство по Blogger" кликаем по ссылке "Открыть Инструменты для веб-мастеров"


2. В пром верхнем углу кликаем по красной кнопке "Добавить сайт"

3. В появившуюся форму вставляем полный адрес блога (с http://). Нажимаем "Продолжить"

4. Выбираем вкладку "Альтернативные способы", активируем чекбокс "Тег HTML", копируем предложенный код верификации



Не закрывая это окно, переходим в другом окне в Панель инструментов -- Шаблон -- Изменить HTML. Перед нами откроется основной код шаблона. С помощью комбинации клавиш "Ctrl + F" находим в коде тег <head> (он всегда в одной из строчек в самом начале кода) и сразу после него вставляем скопированный код верификации (проверки).

5. Сохраняем шаблон и возвращаемся к окну Подтверждения. Внизу справа нажимаем красную кнопку "Подтвердить"

Если всё сделано правильно, у нас появится такая картинка:


6. Нажимаем "Продолжить" и перед нами откроется страница Инструментов для веб-мастеров Гугла

На этой странице слева находится Панель инструментов, а в центре - кнопки трёх основных разделов. Выбираем крайний справа раздел "Файлы Sitemap" и кликаем по нему мышкой.

7. На открывшейся странице вверху справа кликаем по красной кнопке "ДОБАВЛЕНИЕ/ПРОВЕРКА ФАЙЛА SITEMAP"
В открывшуюся форму надо вставить такой код:

atom.xml?redirect=false&start-index=1&max-results=500

и нажать синюю кнопку "Отправить файл Sitemap"/

Мы сделали это!:) Вся эта процедура необходима для привлечения внимания поисковых роботов к сайту и более полного сканирования его содержания. Инструменты для веб-мастеров - это самый надёжный и простой способ получать важные сообщения от поисковой системы (инструмент "Сообщения"). С их помощью легко отслеживать динамику продвижения блога, его качественный рост. Инструменты используют также для тонкой настройки, исправления ошибок и т.д.




Интеграция с  Яндекс. Вебмастер

1. Необходимо завести почту (аккаунт) в Яндекс

2. Заходим по этой ссылке: http://webmaster.yandex.ua/site/?wizard=add.site

3. В предложенную форму вводим адрес блога и кликаем по кнопке "Добавить сайт"

4. Мы попадаем на страницу проверки. Выбираем вкладку "Мета-тег", копируем предложенный отрывок, и вставляем его перед тегом <head> также, как описано (выше по тексту) для проверки в инструментах веб-мастеров Гугла. Сохраняем шаблон.

5. Возвращаемся на страницу проверки Яндекс. Вебмастер и нажимаем кнопку "Проверить"

6. Если всё сделано правильно, перед нами появится такая информация:





Счётчики