Скорее всего вы являетесь web-программистом и не раз сталкивались со списком правок от заказчика, которых в свою очередь получил их от SEO специалиста. Или же вы начинающий программист и хотите обладать базовыми навыками SEO, чтобы написанный вами сайт был лучше. В данной статье мы дадим несколько базовых советов, следуя которым вы создадите во много раз более эффективный сайт.
Выставляйте правильные теги
Каждый HTML тег имеет свое предназначение и стоит использовать все по своему назначению. Для заголовков первого уровня используйте тег H1. Данный тег показывает основной заголовок страницы, на которой находится посетитель. Контент внутри тега H1 должен соответствовать заголовку title страницы, а также анкору ссылки, по которой человек произвел переход. Кроме этого, ЧПУ URL страницы должен соответствовать заголовку страницы.
Например на главной странице размещена ссылка ‹a href="/auto/ford/"›Автомобили Ford‹/a›, которая содержит правильный ЧПУ URL и анкор «Автомобили Ford». После перехода по данной ссылке, H1 заголовок и META TITLE должны содержать текст «Автомобили Ford»
Уникальные и правильные META теги
Часто программисты не придают особого значения META тегам, особенно во внутренних страницах. Однозначно стоит сделать функциональность, для редактирования любых мета тегов на любой странице. Кроме этого, стоит сделать автоматическое и логическое создание META-тегов. Представьте, что вы создали крупный интернет магазин или же сайт по объявлениям, в котором за первый год набралось большое количество динамичных страниц. Писать для каждой страницы индивидуальные META теги – абсурд. Для этого стоит создать индивидуальный и умный алгоритм, который будет вычислять необходимые параметры страницы и создавать для него META теги. Вам стоит также потратить полчаса для поиска популярных ключевых запросов по данной тематике, чтобы ваш алгоритм был максимально эффективным.
Приведем пример: интернет магазин цифровой техники. На сайте есть более 200 категорий и более 5000 наименований. Каждое наименование может иметь свой уникальный ЧПУ URL, даже если есть похожие наименования. Пример похожих наименований iPhone 7, 64gb, silver и iPhone 7, 64gb, gold. Многие пишут одинаковые заголовки и URL-ы для данных товаров, а в описании и фото описывают товар с параметрами. Это не правильно! Указывайте дополнительные характеристики в названии и ссылке, это поможет поисковым системам привести к вам целевых клиентов. Исходя из вышеупомянутых наименований, ссылки должны быть iphone7-64gb-silver.html и iphone7-64gb-gold.html. Также заметим, если вы используете ID в ссылках для идентификации товара, то лучше всего проставлять его в конце ссылки, а не в начале. Итого получается: /iphone7-64gb-silver-379.html, где 379 и будет нашим ID.
На примере того же магазина, рекомендуем проставлять слово "Купить" перед товаром. Предварительно проконсультируйтесь с SEO специалистом, если он присутствует в проекте, если же нет - смело ставьте. Дело в том, что люди, которые ищут «iPhone 7» и люди, которые ищут «Купить iPhone 7» часто преследуют разные цели. Во-первых, пробиться в поиске по «iPhone 7» будет труднее, чем по «Купить iPhone 7». Во-вторых, вы интернет магазин и ваша страница с iPhone 7 преследует цель именно продать его. А человек, который хочет купить его, часто задает в поиске именно «Купить iPhone 7». Сужая сегмент входящего трафика до логичного минимума, вы повышаете ваши позиции в поиске и увеличиваете вероятность получения целевого посетителя.
Соотношение текста и HTML тегов
Есть также такое понятие как соотношение текстов и HTML тегов. Вы можете подумать, что это не задача программиста. Но добавив несколько лишних условий, которые будут «заставлять» вашего клиента писать более длинный текст, в конечном итоге вы сделаете благое дело для него. При возмущении клиента, объясните ему, что товар, который содержит описание из 1 предложения, не может быть эффективным. Человек, зашедший на страницу, в первую очередь хочет получить ответы на свои запросы. Сам контент должен подаваться максимально информативно. Все элементы дизайна, фотографии и прочее - это всего лишь красочная оболочка для более удобного восприятия контента. Вся страница должна формироваться вокруг именно контента, а не наоборот. Считается эффективным соотношение как минимум 40% / 60% в пользу текстов.
Используйте HTTP заголовки
Все ваши страницы должны отвечать правильными HTTP заголовками. Если человек попал на страницу с контентом, то соответственно заголовок должен быть 200. Если попал на страницу ошибки 404, то и HTTP заголовок должен быть 404. Немало сайтов, где человек попадает на страницу с ошибкой 404, но на деле браузер получает ответ 200. Это не правильно. Поисковые системы сочтут подобную страницу за действительную, а так как таких страниц скорее всего много, то пойдет еще и второй негативный фактор - дубли.
В PHP заголовки обозначаются следующим образом:
# Рабочая страница
header("HTTP/1.0 200 OK");
# Страница не найдена
header("HTTP/1.0 404 Not Found");
# Страница перемещена навсегда
header("HTTP/1.0 301 Moved Permanently");
# Страница временно перемещена
header("HTTP/1.0 302 Moved Temporarily");
# Страница не изменена (использование кеша браузера)
header("HTTP/1.0 304 Not Modified");Список всех HTTP кодов вы можете найти, например на официальном сайте PHP.
Избегайте технологии Flash и iFrame-ов
Относительно веб стандартов, к счастью, все пошло именно в наилучшем направлении. Когда-то, в далеком 2000-ом, Macromedia Flash (до покупки Adobe) была очень крута. Интернет стал более интерактивным и живым с ее помощью. Ранее мы не могли получать такую же интерактивность и подобное взаимодействие с клиентом посредствами HTML5, CSS3. Было печально. Даже все браузеры работали сами по себе. Чтобы добиться чего-либо кроссбраузерно, нужно было очень сильно попыхтеть. Сегодня же все представлено в лучшем свете. Посредством HTML5, CSS3, JavaScript можно творить все, что придет в голову. Кроме этого, Adobe официально заявила о приостановке поддержки Adobe Flash с 2020 года. Остерегайтесь Flash и iFrame, делайте все альтернативными путями, которые в разы эффективны и доступны.
Следите за скоростью загрузки страницы
Еще один очень важный фактор при построении сайта - это скорость генерации и конечной загрузки страницы. Львиная доля посетителей покидают сайт из-за долгой загрузки страницы. Наверное и сами вы не раз закрывали вкладку в браузере после перехода из поисковой системы, которая грузилась очень очень долго. Альтернативу вы всегда найдете. А для того, чтобы ваши посетители не искали альтернативы, порадуйте их быстрой подачей информации. Рекомендуемое время генерации и загрузки страницы 1-2 секунда. Это тот идеал, к которому вы должны стремиться. И пусть эти цифры вас не пугают – они вполне реализуемы с нынешними технологиями.
Несколько советов по ускорению загрузки страницы:
- настройте кеширование статики на стороне сервера;
- используйте кеш браузера насколько это возможно;
- включите GZIP сжатие;
- минифицируйте JS, CSS файлы, а также желательно и HTML страницы;
- оптимизируйте все изображения и элементы дизайна, которые построены с картинками;
- используйте шрифтовые иконки;
- кешируйте запросы к базе данных;
- уменьшите число последовательных соеденений с браузером;
- ну и конечно, выбирайте хороший сервер, с правильной конфигурацией и высоким uptime-ом;
Используйте «хлебные крошки» правильно
Внутренняя перелинковка, «хлебные крошки» и структурированные данные, также очень важны для высоких результатов в поисковой выдаче. Ваш сайт может иметь логическую навигацию, логические разделы для обычного посетителя, но совершенно непонятную структуру для поисковой системы. В связи с тем, что одно другому не мешает, однозначно стоит придерживаться некоторых рекомендаций при построении навигации и «хлебных крошек». Если вдруг кто-то не знает, что именно называют «хлебными крошками» (с английского Breadcrumbs), так это элемент навигации, представляющий собой путь от главной страницы до той, в которой находится посетитель.
Например, человек с главной перешел в категорию «Смартфоны», далее перешел на внутреннюю категорию «Apple», а после – на страницу товара «iPhone 7». На конечной странице товара «хлебные крошки» должны иметь следующий вид:
Главная › Смартфоны › Apple › iPhone 7
Все логично и понятно для пользователя. Чтобы было понятно и поисковым системам, нужно соблюдать некоторые правила для формирования структурированных данных. Информации для формирования правильных структурированных данных достаточно на официальных сайтах Google, Yandex, Bing. В ближайшем будущем мы напишем статью описывающую «структурированные данные» на основе распространенных примеров и в более легкой интерпретации.
Используйте доверенные SSL сертификаты
Экономить, особенно на начальных стадиях бизнеса – то, что делают многие. И дело это вполне справедливое. Так как на начальных стадиях построения нового бизнеса очень важно сделать основной акцент именно на продукт. Но, порой, экономия везде приводит к плачевным результатам. Данное утверждение относится к самодельным или бесплатным SSL сертификатам, которые могут работать, а могут и нет. Вы поставили свой самодельный SSL сертификат, чтобы сэкономить 10-20$, все работает - все супер. В один прекрасный день заходите на сайт и замечаете, что он выдает ошибку net::ERR_CERT_COMMON_NAME_INVALID или же, браузер сообщает, что установлен какой-то сомнительный SSL и доверять ему не стоит (The site's security certificate is not trusted!). И пишется это вполне так пугающе, на красном, заднем фоне, красными большими буквами. Во избежание подобных ситуаций, стоит покупать сертификат у доверенных поставщиков, а их всего несколько в мире. Дабы не тратить много денег на начальной стадии, вам скорее всего будет достаточно приобрести SSL с проверкой домена Comodo Positive SSL, который в среднем стоит в пределах $8. Вы также можете ознакомиться с нашей предыдущей статьей о преимуществах HTTPS против HTTP.
Обязательно используйте SEO URL-ы
Хотя и затронули коротко данную рекомендацию в пункте 1, но считаем нужным изложить более подробную информацию об организации правильных и понятных ссылок на сайте. Правильная SEO оптимизированная ссылка должна содержать в себе логическую цепочку навигации. Давайте возьмем тот же пример интернет магазина, где человек перешел с главной в категорию «Смартфоны», далее перешел на внутреннюю категорию «Apple», и в конце пришел на страницу товара «iPhone 7». Конечная страница должна иметь, как пример, ссылку /smartphones/apple/iphone-7.html. Такой вариант можно считать идеальным. Но если вам нужно также проставлять ID категорий и товара, то можно использовать и вариант /smartphones-3/apple-1/iphone-7-56.html, где 3, 1 и 56 в конце каждого блока является идентификатором. Такая ссылка вполне отвечает всем требованиям, а также имеет логический вид для обычного пользователя. Соответственно и страница категории должна иметь ссылку вида: /smartphones/apple/. Не пренебрегайте данной рекомендацией, от правильных SEO ссылок зависят результаты ранжирования вашего сайта поисковой системой.
Бывают моменты, когда встает вопрос использования больших ресурсов для формирования подобной ссылки или же использования «программных» ссылок, но экономии при этом на времени загрузки страницы. Это не исключение и лично мы сталкивались с подобной ситуацией не раз. Тут приоритет стоит отдавать именно SEO ссылкам, и пусть страница генерируется на 0.01с дольше, но все публичные, заметьте именно публичные, ссылки имеют SEO вид. Для компенсации затрат ресурсов вы можете использовать альтернативные варианты ссылок в тех местах, где их не увидит поисковая система и поставить редирект на SEO ссылку.
Давайте приведем пример, чтобы вы четко поняли о чем речь. Пример будет касаться той же страницы /smartphones/apple/iphone-7.html. На всех публичных страницах данная ссылка должна выглядеть именно так. Публичные страницы, это те, которые видит поисковик и индексирует. В нашем примере данную ссылку поисковик может увидеть в категории /smartphones/apple/. Есть еще и не публичные страницы. Например, аккаунт пользователя, e-mail рассылки и прочее. Этого поисковик не увидит, и там можно спокойно установить ссылку, например: /?product=56. Человек переходит по данной ссылке, далее происходит редирект на страницу /smartphones/apple/iphone-7.html. Вы скажете, какая же это экономия, если в итоге для редиректа нужно все же выполнить вычислительные действия? Экономия в том, что с личного кабинета, с рассылки и прочих, не публичных мест, человек может как перейти, так и не перейти по ссылке. И наша вычислительная мощь будет задействована исключительно в момент перехода. В противовес тому, что в списке товаров, в каталоге, данная вычислительная мощь используется для всех товаров, не считая тот факт, что посетитель перейдет всего по одному товару из выдачи.
Немного полезного
Напоследок оставим несколько ссылок на полезные материалы и ресурсы.Запомните: чем качественнее ваш продут, тем ценнее вы!
Русский
English