Практическое руководство по поисковой оптимизации (SEO) с Google

  1. Сделайте хороший контент
  2. Сделайте ваш сайт мобильным
  3. Сделайте ваш сайт доступным
  4. Текст для чтения с экрана
  5. Используйте семантический HTML
  6. Сделай свой сайт быстрее
  7. Используйте CDN
  8. Сократить JavaScript и CSS
  9. Оптимизировать изображения
  10. Включить сжатие Gzip
  11. Используйте кеширование в браузере
  12. Создать аккаунт Google Analytics
  13. Подключиться к консоли поиска Google
  14. Использовать структурированные данные
  15. Создать карту сайта
  16. Использовать HTTPS-шифрование
  17. Заключение

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

Иногда алгоритм даже выберет мой результат в качестве рекомендуемый фрагмент ,

Вот график, сравнивающий мои аналитические данные с 21 марта 2016 г. по 21 марта 2017 г. и с теми же датами предыдущего года. 21 марта 2015 года - это первое свидание, на котором у меня была аналитика на моем сайте, поэтому сайт существует уже чуть более двух лет!

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

Кроме того, все, что я здесь упоминаю, будет бесплатным и без рекламы, и я не использую рекламу или рекламные слова и никогда не платил ни цента за какую-либо рекламу или SEO.

Эта статья посвящена оптимизации результатов поиска с помощью Google. Я ничего не знаю о Бинг, и я уверен, что они не знают, что я существую.

Для начала, первый и более важный шаг, безусловно.

Сделайте хороший контент

Google это очень ясно об этом:

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

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

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

Социальные медиа также не обязательно учитываются в поисковых рейтингах. Вот как люди находили мой сайт (данные о приобретении) с 1 по 28 февраля 2017 года .

Из всех сеансов 80% были органическими, 11% - прямыми, 4% - из рефералов и только 3% - из социальных средств (reddit, Twitter, Facebook и т. Д.). Я не публикую и не публикую часто, что может быть связано с низким процентом социальных сетей, но это не оказало негативного влияния на мой рейтинг.

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

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

Сделайте ваш сайт мобильным

У Google также есть [твердые мнения] (<a href =) по этому вопросу:

Если вы не сделали свой сайт мобильным, вам следует. Большинство пользователей, заходящих на ваш сайт, вероятно, используют мобильное устройство.

Вы можете запустить свой сайт через Мобильный тест Проверять.

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

Сделайте ваш сайт доступным

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

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

Ресурсы : ВОЛНА (Инструмент оценки доступности веб-сайтов), Wuhcag (Веб-доступ для разработчиков).

Текст для чтения с экрана

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

Чтобы предоставить контекст этим визуальным подсказкам, создайте класс screen-reader-text. Все, что вы поместите в этот класс, будет скрыто для экранов, но все равно будет содержать текст для читателей. Используйте это вместо отображения: нет или видимость: скрыто.

Этот класс также часто пишется как sr-only.

.screen-reader-text {clip: rect (1px, 1px, 1px, 1px); позиция: абсолютная! важная; высота: 1 пикс; ширина: 1px; переполнение: скрытое; }

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

<a href = "# main-content" class = "screen-reader-text"> Пропустить навигацию </ a> <nav> ... </ nav> <main id = "main-content"> </ main>

Еще один важный способ сделать ваш сайт более доступным - добавить альтернативные теги для описания изображений.

<img src = "image.jpg" alt = "Альтернативный текст для описания изображения." />

(Это то, над чем мне еще нужно поработать.)

Используйте семантический HTML

Используя правильное семантическая структура В вашем HTML важно, чтобы программы чтения с экрана могли быстро и точно находить контент. Это означает использование правильных тегов заголовка (от <h1> до <h5>), тегов списка (<ul>, <ol>) и тегов семантического макета (<article>, <section>).

Посмотреть полный Контрольный список WCAG 2.0 ,

Сделай свой сайт быстрее

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

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

Я упомяну несколько методов, которые относительно легко реализовать.

Ресурсы: Google PageSpeed ​​Insights , Тест скорости сайта Pingdom , WebPagetest , GT Metrix

Используйте CDN

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

Сократить JavaScript и CSS

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

Оптимизировать изображения

Изображения, как правило, являются самым большим ресурсом, который будет обслуживать ваш сайт. Оптимизация и сжатие изображений - это хороший и простой способ снизить скорость загрузки. Вы можете использовать инструмент на основе браузера, такой как Optimizilla или же TinyPNG Загрузите оптимизированное содержимое из Google PageSpeed ​​Insights или используйте бегун задач , Если вы используете WordPress, вы можете использовать плагин, такой как WP Smush It ,

Включить сжатие Gzip

Сжатие Gzip резко уменьшает размер файла вашего HTML и других ресурсов. Это руководство Патрик Секстон демонстрирует, как включить Gzip на различных типах серверов (Apache, NGINX).

Используйте кеширование в браузере

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

Создать аккаунт Google Analytics

Гугл Аналитика отслеживает и сообщает о посещаемости сайта. Графики и информация, которые я использовал в этом посте, взяты из Google Analytics. Зарегистрировать аккаунт и создайте собственность для своего веб-сайта, и подтвердите право собственности на домен.

В административной области вы найдете код отслеживания, который вы поместите в <head> всех страниц, которые нужно отслеживать. Как только это произойдет, Google Analytics начнет отслеживать ваш трафик.

Подключиться к консоли поиска Google

Google Search Console , часть Инструментов Google для веб-мастеров, является дополнением к Google Analytics для веб-разработчиков. Создайте учетную запись, добавив свойство, связав его с учетной записью Google Analytics и подтвердив свой домен.

Поисковая консоль расскажет вам поисковые термины, набранные вами, чтобы найти ваш сайт органически. Это также позволит вам проверять ошибки сканирования, проблемы безопасности и извлекать сайт как Google.

Использовать структурированные данные

Структурированные данные это еще один способ, которым поисковые системы распознают контент на сайте.

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

<script type = "application / ld + json"> {"@context": "http://schema.org", "@type": "Person", "image": "tania.jpg", "jobTitle" : "Веб-разработчик", "имя": "Таня Рассия", "пол": "женщина", "URL": "", "sameAs": ["https://github.com/taniarascia", "https: //twitter.com/taniarascia "]} </ script>

Список всех типов и свойств можно найти Вот ,

Microdata будет альтернативным, менее предпочтительным способом добавления данных схемы на ваш сайт.

Создать карту сайта

Карта сайта помогает поисковым системам индексировать и понимать ваш сайт. Вы можете создать карту сайта с помощью бесплатного инструмента на основе браузера, такого как XML Sitemap Generator , Если вы используете WordPress, используйте Google Sitemap Generator плагин.

Использовать HTTPS-шифрование

Стремясь улучшить интернет-безопасность, Google сделал шифрование HTTPS через SSL / TLS фактор ранжирования в 2014.

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

Заключение

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

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

Понравились посты, которые вы видите здесь?