Как создать сайт самому — пошаговая инструкция для новичка

0

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

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

Главный вопрос для создания сайта: где его делать или правильнее на чем? Если обобщить, существует всего две платформы:

1) Конструкторы — это сайты, на которых можно сделать свой сайт.

Плюсы:

  • Легки в освоении.
  • Не нужно знание кодов (JS, PHP, CSS и др.).
  • Возможность быстро сделать сайт.
  • Подсказки и удобная навигация.

Минусы:

  • Их может и не быть, а может быть бесконечно много. Все начнется с момента, когда вы захотите использовать что-то нестандартное.
  • Производительность могла бы быть получше.

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

КонструкторТариф (без рекламы)Сложность
1uKit ۞ Рекомендуем!5$/мес или 48$/годЛегко
2Wix ۞10.95$/мес или 99$/годЛегко
3uCoz ۞5.99$/мес или 71,88$/годСредне
4A5 ۞250р/мес или 2550р/годЛегко
5Setup ۞2388р/годЛегко

Мировым лидером, считается конечно же Wix, почему мы рекомендуем uKit? Цена. Бесплатные тарифы не позволят вам создать серьезный проект. Рано или поздно вы упретесь в необходимость платной версии.

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

2) CMS — система управления сайтом (WordPress, Joomla и др.).

Плюсы:

  • Полная свобода действий, вы ничем не ограничены.
  • Наличие множества дополнений (плагинов), тем оформления.
  • Возможность достичь максимальной производительности.

Минусы:

  • Чтобы использовать весь потенциал собственного сайта на CMS, придется много чего узнать и изучить.
  • Знание кодов, также желательно, но не обязательно, так как многие изменения которые вы захотите реализовать на сайте, можно осуществить с помощью плагинов.
  • Сложнее чем конструктор, поэтому создание сайта занимает больше времени.

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

Для большей наглядности сравнительная таблица (CMS vs Конструктор):

Сравнительная характеристикаКонструкторCMS
1Процесс создания

Легко

Сложно

2Скорость создания

Быстро

Средне

3Изменение кода

Нет

Да

4Поисковое продвижение

Имеются нюансы

Нет ограничений

5Функционал и дизайн сайта

Ограничен

Не ограничен

6Смена хостинга

Нет

Да

7Потенциальная производительность

Средняя

Максимальная

Как сделать сайт на WordPress

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

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

Как мы это будем делать?

  • WordPress является самой простой и популярной CMS, для нее существует большое множество плагинов, тем оформления и других дополнений, которые позволят существенно облегчить создание сайта.
  • Также, мы будем будем использовать хостинг Fozzy в качестве примера. Один из самых быстрых в странах СНГ и лучшая тех. поддержка которую мы встречали. Если хотите подробнее разобраться в этой теме, рекомендую к прочтению: Выбираем лучший хостинг, описание видов и рекомендации.

Весь процесс будет поделен на 6 несложных этапов, следуйте инструкциям и скоро у вас будет полноценный сайт!

Примечание. Если вы уверены в серьезности своих намерений, вы можете приобрести тариф хостинга на 1 год, в данном случае, вы получите домен в подарок! (пропустите Этап 1.)

Этап 1. Выбор и регистрация доменного имени.

Подробно об этом можно прочесть здесь: Как выбрать домен и где его лучше купить. Ежели не желаете, вкратце:

Рекомендую покупать здесь — 2domains.ru (самые низкие цены). Для этого необходимо зарегистрироваться на сайте, придумать доменное имя и оплатить его.

Примечание. 1 марта 2017 года, Координационный центр доменов (.ru и .рф), приняли решение об удорожании доменов. На скриншотах вы увидите 99 рублей, на данный момент, стоимость — 149 руб.

⇐ Слайдер ⇒

Этап 2. Регистрация хостинга и привязка домена.

Этап 2.1. Регистрация хостинга. Это даже проще чем покупка домена. Переходим на сайт хостинга Fozzy и выполняем несложные действия:

Скидка! Когда вы дойдете до 6 пункта (Способ оплаты), нажмите на корзину и используйте промокод: blogforest — скидка 10%.

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

⇐ Слайдер ⇒

Этап 2.2. Привязка домена. Что ж, теперь нам необходимо связать наше купленное доменное имя с хостингом, для этого снова перейдите на сайт регистратора 2domains.ru. Войдите в личный кабинет и действуйте по скришотам:

Примечание. DNS сервера хостинга: ns1.fozzy.com и ns2.fozzy.com (см. 3 скриншот).

⇐ Слайдер ⇒

Поздравляю! Еще одна маленькая победа на пути к великим свершениям. Осталось только подождать, пока DNS зона распространится на ваш домен (обычно до 12 часов, в редких случаях до 48 часов). Тем не менее, приступить к следующему этапу, вы можете незамедлительно, зайти на сайт вы сможете после распространения зоны.

Этап 3. Установка WordPress в cPanel и немного о SSL

Этап 3.1. Что такое SSL-сертификат и зачем он нужен? После приобретения домена у вас будет стандартный протокол: HTTP, пример: http://azzure.ru/. Мы не будем вдаваться в технические подробности, если хотите больше информации, рекомендуем статью: Простым языком об HTTP. Но наверное вы видели и другие варианты, где вместо HTTP, было HTTPS, пример: https://azzure.ru/. 

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

С 2014 года, протокол HTTPS, является положительным сигналом для Google, что позволит вашему сайту занимать более высокие позиции в поисковой выдаче. Также, браузер Google Chrome, с 1 января 2017 года, помечает сайты, которые собирают любую информацию и не имеют SSL-сертификат, как небезопасные. В будущем, Chrome планирует помечать все сайты на HTTP как небезопасные, даже те, которые не собирают информацию о пользователях. Поисковик Яндекс, на данный момент, не учитывает наличие SSL-сертификата и не понижает в поисковой выдаче сайты за его отсутствие.

Приобрести SSL-сертификат можно у Fozzy (Услуги→SSL сертификаты), в данном случае можно рассчитывать на помощь техподдержки в его установке. Можно и не покупать вовсе, существует бесплатный SSL — сертификат «Lets Encrypt«, получить его можно, также обратившись в техподдержку Fozzy. Разница между платным и бесплатным сертификатом не большая (для некоммерческих сайтов), однако если вы планируете принимать оплаты через сайт, рекомендую установить платный.

Если вы отложите это занятие, при переходе на HTTPS в будущем: вероятнее всего, временно снизится посещаемость сайта из поисковых систем (обычно, от 2-ух недель — до 2-ух месяцев). Ряд ошибок, которые потом придется исправлять, может быть, даже у опытных вебмастеров (сложно все учесть и ничего не забыть).

Предлагаю вам сделать свой выбор в начале пути:

  • Сделать сейчас — легко, с помощью «Lets Encrypt«, для коммерческих сайтов — годовая оплата SSL ~ 450 руб.
  • Сделать потом — сложно, минусы: склейка зеркал, потеря трафика, ошибки сайта.

Переход на HTTPS, не такая уж и страшная процедура. Почему мы так акцентируем на этом внимание? Потому что большинство начинающих сайтостроителей, пренебрегают SSL — сертификатом откладывая его на «потом», о чем в итоге сожалеют.

3.2 Установка WordPress в cPanel. Сейчас нам нужно установить систему с помощью которой мы будем управлять сайтом. Это своего рода, как windows для компьютера.

Примечание. Если вы приобретали домен у Fozzy, у вас уже предустановлен WordPress (этап 2.1, скриншот 4).

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

Смена языка в Cpanel

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

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

Вернемся в настоящее. Теперь когда мы выбрали необходимый язык, перейдем непосредственно к установке WordPress. Делается это очень просто: находим раздел «Softaculous apps installer» и нажимаем на иконку WordPress.

cPanel установка WordPress

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

Сейчас, нас интересует WordPress:

⇐ Слайдер ⇒

На этапе установки WordPress, выберете совершенно любую тему (шаблон) сайта.

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

Мы ее сменим на следующем этапе создания сайта. Ну а в целом, на ваш сайт, уже можно заходить. Попробуйте! (Если ДНС зона уже распространилась, этап 2.2.)

Этап 4. Настройка сайта и выбор темы оформления.

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

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

Настало время войти на свой сайт в качестве администратора. Для этого вводим в браузерную строку: ваш-домен/wp-admin Пример: azzure.ru/wp-admin

Далее вводим логин и пароль, вы их задавали во время установки WordPress. В итоге попадаем в «админку». Встает резонный вопрос: как этим пользоваться? Существует справочник WordPress, там довольно много информации — читать не перечитать, поэтому я введу вас в краткий экскурс:

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

Также, немного базовой информации по интерфейсу:

Как работать в админке WordPress?

Этап 4.1. Базовая настройка.

Сейчас нам необходимо установить несколько основных настроек.

⇐ Слайдер ⇒

В разделе «постоянные ссылки» мы можем выбрать, как будут выглядеть наши ссылки на страницы, записи и т.д. Стандартно в WordPress, ссылки выглядят примерно так: http://blogforest.ru/?p=234

Если вы посмотрите на ссылку статьи, которую вы читаете, то увидите, что она повторяет название записи, только на латинице (транслитом). Их называют ЧПУ — «человекопонятный урл». Такие ссылки, эстетически выглядят гораздо приятнее, поисковые системы (ПС), также умеют их читать. Это увеличивает релевантность (соответствие) поисковому запросу, как следствие, небольшой плюс для ранжирования в ПС.

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

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

  • Установить галочку на «Название записи» — ссылки автоматически будут формироваться исходя из названия страницы или записи. Если запись находится в рубрике, структура ссылки будет выглядеть так: http://blogforest.ru/Название рубрики/Название поста
  • Установить галочку на «Произвольно» и вписать необходимую структуру, например: /%category%/%postname%/, это тоже самое, что и в первом варианте.

Какие теги можно использовать:

  • %year% — год (2017);
  • %monthnum% — месяц (06);
  • %day% — день; (12)
  • %hour% — час; (15)
  • %minute% — минуты; (56)
  • %second% — секунды; (26)
  • %post_id%; — ID поста (267);
  • %postname% — название поста;
  • %category% — рубрика;
  • %author% — имя автора статьи.

Многие утверждают, что лучшая структура /%category%/%postname%/, так ПС может понять структуру сайта лучше. По моему скромному мнению — это вчерашний день, сегодня это не на что не влияет. Поэтому я предпочитаю использовать: /%postname%.html Большим плюсом является, то что в данном случае можно свободно перемещать статьи из одной рубрики в другую. Так как ссылка на пост не изменится, ведь название рубрики в ней не фигурирует.

Касательно .html — это тоже своего рода, моя прихоть, это никак не отражается на поисковом ранжировании. 

4.2 Выбор шаблона (темы) оформления. Для WordPress существует множество тем, как платных, так и бесплатных. Давайте подробнее разберемся, что же это такое?

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

Моя тема называется Newspaper, в подобных шаблонах существует множество настроек позволяющих с легкостью вносить необходимые изменения, без знания кодов. То есть, это возможность изменить все цвета, расположение и вид основных элементов, отображение всех видов страниц, шрифтов и многое другое. Имеется отдельная мобильная версия, которая также имеет свои настройки. Как это выглядит:

Настройки в теме оформления Newspaper

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

По каким критериям выбирать тему:

Самое главное — тематика. Если вы планируете туристический сайт — ищите темы туристической направленности, если про авто — автомобильные темы и т.д. Конечно, это не обязательно, можно использовать и стандартные шаблоны, даже те, которые предустанавливаются вместе с WordPress (Внешний вид — темы). Но зачем изобретать велосипед? В тематических темах, уже предусмотрена большая часть необходимых вам функций.

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

Где покупать или скачать тему сайта:

Бесплатные шаблоны, могут не отвечать всем вашим нуждам, но зато они бесплатные 🙂 . Чтобы найти их, введите в любом поисковике «Бесплатные шаблоны WordPress«. Думаю указывать конкретные ресурсы не имеет смысла, так как их очень много и они по сути схожи.

Что касается платных премиальных тем, то одним из мировых лидеров является Themeforest, большинство шаблонов англоязычные, однако есть и мультиязычные (включая русский). Например, одна из самых популярных премиальных тем в мире: Avada, имеет русский язык, на момент написания статьи было 336,589 продаж. Покупая премиальную тему, вы получаете пожизненные обновления, а также техническую поддержку (пол года или год), как правило, на английском языке. Для общения можно использовать онлайн-переводчики (если необходимо).

Как установить тему?

Если вы скачали тему, установить ее можно в разделе: «Внешний вид→Темы→Добавить новую»

Устновка темы оформления (шаблона) WordPress

Как вы видите, далеко «ходить» не обязательно, WordPress предлагает свою собственную бесплатную базу шаблонов.

Этап 5. Что такое FTP и как в него войти?

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

Главная цель этого подраздела, научить вас базовым навыкам пользования FTP-клиентами. Для того, чтобы вы как минимум, могли подтвердить права на сайт или добавить код отслеживания счетчика посещаемости. И все же, рекомендую изучить основы технологий HTML и CSS, с этим знанием, для вас откроется больше возможностей. Конечно, можно уделить внимание и языкам программирования (PHP, JS), но это немного сложнее.

Для использования FTP, нам понадобятся две программы:

  • NotePad++ — слегка усовершенствованный блокнот, с помощью него можно: вносить, удалять или изменять код файлов.
  • FileZilla — FTP-клиент, с помощью которого, можно: копировать, удалять, перемещать файлы вашего сайта.

Обратите внимание, FileZilla подходит для всех разрядностей Windows: x32(x86) и x64. Для NotPad++, необходимо выбирать архив для скачивания, в зависимости от разрядности вашего Windows. Скачайте их и установите.

Как узнать разрядность Windows? Правая кнопка мыши на мой компьютер→свойства. Раздел «Тип системы» — 32(x86) или 64-разрядная операционная система.

На вашем email имеется письмо от Fozzy, где вам были высланы логин, пароль и адрес FTP-сервера (тоже самое письмо, в котором были входные данные для cPanel, этап 3.).

FileZilla (⇐ Слайдер ⇒)

После соединения с FTP, вы видите два окна, левое — ваши жесткие диски, правое — файлы сервера и сайта. Если вам, допустим необходимо добавить файл в корневую папку сайта (для подтверждения прав), копируйте его в папку с названием вашего домена, путь должен быть таким: public_html/Ваш-домен.

Notepad++

Для этой программы, необходимо дополнительно скачать мини-плагин: NppFTP. Также учитывайте версию в зависимости от установленной программы (x86 или x64). В скаченном архиве NppFTP у вас две папки: doc и bin.

  • Целиком копируем папку «doc» в C:\Program Files\Notepad++\plugins.
  • Достаем из папки «bin» файл «NppFTP.dll» и также кидаем в C:\Program Files\Notepad++\plugins

С установкой закончили, перейдем к настройке.

(⇐ Слайдер ⇒)

Прежде чем вы начнете «ломать» свой сайт, помните: вы можете сделать резервную копию любого файла или даже всего сайта, проще всего это реализовать через FileZilla. Также, техподдержка хостинга, делает ежедневные бэкапы (резервные копии) всего сайта.

Если вам необходимо вставить код счетчика посещений (Google Analytics, Яндекс Метрику и др.) на сайт, легче это сделать с помощью виджета. Если вы хотите вставить его в низ сайта (футер), для этого нужно добавить код в файл footer.php. Если вы изучите основы HTML, вы легко с этим справитесь, если не изучите — метод «тыка» никто не отменял 🙂 .

Footer.php расположен в корневой папке ТЕМЫ ОФОРМЛЕНИЯ (не сайта), путь должен быть таким: public_html/Ваш-домен/wp-content/themes/Название шаблона/

Волшебные комбинации клавиш, для работы в Notepad++:

  • Ctrl+z — отменить последнее действие.
  • Ctrl+y — повторить последнее действие.
  • Ctrl+s — сохранить изменения в текущем документе.

Если вы ничего не знаете про HTML — маленький совет: Обратите внимание, на то как устроена структура кодов, все они начинаются c открытого тега и заканчиваются закрывающим. Например: <footer></footer>, <div></div>, <head></head>,<body></body> и др.

Это своего рода блоки, в них расположен код, часто возможен «принцип матрешки», когда блоки находятся в блоках, а они в еще одном блоке и так до бесконечности (ну почти 🙂 ).

Если вы пытаетесь вставить свой код методом «тыка», вставляйте его сразу перед или после тега (открывающегося или закрывающегося). Единственное условие — не ломайте (не изменяйте) цельную сточку кода. После чего сохраняем изменения в Notpad++ (дискета), обновляем страницу сайта в браузере и смотрим на изменения. Если все плохо — возвращаемся в Notpad++, нажимаем волшебную комбинацию ctrl+z и снова пытаемся вставить в другое место.

Этап 6. Установка рекомендуемых плагинов.

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

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

Как установить плагин?

Способ №1:

Необходимо войти в раздел: «Плагины→Добавить новый»

Как установить плагин wordpress

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

Способ №2:

Через FTP используя FileZilla. Скачайте необходимый плагин и разархивируйте его. Далее, копируйте в папку: public_html/Ваш-домен/wp-content/plugins. Останется только активировать его в админ-панели, в разделе «Плагины».

Где скачать плагин?

Основная масса плагинов располагается, конечно же на сайте ru.wordpress.org. Есть также западные сайты, где продаются премиальные плагины, самый популярный: CodeCanyon, обычно они англоязычные. В любом случае, рекомендую искать плагины через Yandex или Google. Пишите запрос-проблему и подставляете слово «плагин», пример: «Социальные кнопки плагин wordpress», «Красивое меню плагин wordpress» и т.д.

Если вы скачиваете плагины на сторонних сайтах, можно нарваться на злоумышленников, которые внедряют в них свои ссылки или вирусы. Чаще всего, основного каталога WordPress достаточно. Масштабные площадки, типа CodeCanyon, также, обычно надежны.

Плагины, которые мы рекомендуем.

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

Cyr-To-Lat  автоматически переводит русскоязычные ссылки, на всем сайте в транслит (латиницу), относиться к этапу 4.1, где мы рассматривали раздел «постоянные ссылки». Плагин, можно и не устанавливать, однако русскоязычные ссылки вызывают ряд проблем, которые придется решать посредством перевода их в Punycode (паникод), например для добавления в sitemap.xml или Robots.txt (позже вы узнаете, что это такое).

Yoast Seo — Отличный плагин, который поможет вам, занимать более высокие позиции в поисковой выдаче. Про его настройку и возможности читайте здесь: Yoast SEO WordPress. Перед настройкой рекомендую добавить сайт в вебмастерские поисковых систем (следующий этап).

WP Super Cache — плагин кэширования, позволяет значительно увеличить скорость загрузки сайта. Настройка плагина WP Super Cache.

Akismet — по умолчанию присутствует в WordPress, позволяет защитится от спама в комментариях. Как настроить… 

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

Добавление сайта в вебмастерские поисковых систем.

Вы создали сайт, но как поисковикам узнать, что он вообще существует? Все поисковые системы «ходят» по ссылкам. Если на ваш проект не ведет ни одной ссылки, на известных поисковику сайтах, он может и не проиндексировать ваш сайт.

Индексация — процесс добавления вашего сайта (страниц) в базу данных поисковых систем.

Для этого и не только, существуют вебмастерские: Яндекс.Вебмастер и Google Search Console. Обязательно добавьте сайт в эти сервисы, у вас должны быть зарегистрированы аккаунты Google и Яндекс.

Как добавить сайт в Вебмастрскую?

Перейдите в Яндекс.Вебмастер.

Добавление в Яндекс.Вебмастер сайта

Нажимаем плюсик и вводим сайт, если вы приобретали SSL-сертификат (этап 3.1.), вводить надо с протоколом HTTPS: https://azzure.ru, если нет — просто домен: azzure.ru.

Ввод название сайта

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

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

Процесс добавления сайта в Google Search Console схожий, индексация вашего ресурса в Goolge, а также отображение его в поисковой выдаче пройдет значительно быстрее (1-2 недели).

SEO — поисковая оптимизация сайта (продвижение сайта).

Seo-тизерSeo продвижение (оптимизация) — очень обширная тема, которая нацелена на повышение позиций вашего ресурса в поисковой выдаче.

На сегодняшний день, этот термин отходит на задний план, сейчас более актуален термин: «интернет-маркетинг».

Интернет-маркетинг включает в себя:

  • поисковое продвижение (SEO).
  • контекстная реклама и медийная реклама.
  • продвижение в соц сетях: SMO и SMM, вирусный маркетинг.
  • директ (прямой) маркетинг (рассылки на email, RSS, push-уведомления).
  • интернет-брендинг.

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

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

Как успешно продвигаться в поисковых системах:

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

ДЕЛАЙТЕ САЙТ ДЛЯ ЧЕЛОВЕКА, А НЕ ДЛЯ ПОИСКОВОЙ СИСТЕМЫ.

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

Давайте разберемся как это происходит, с самого начала:

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

Поисковые системы периодически посещают ваш сайт, в автоматическом режиме, для сканирования новых, так и старых страниц.

Что нужно использовать и улучшать на сайте?

Контент (статьи, описания):

  • Ключевые слова — как правило, некоторые слова (словосочетания) повторяются в контенте чаще других. По ним ПС понимает о чем идет речь на конкретной странице. А также на какие поисковые запросы данная статья будет отвечать большей релевантностью (соответствием). Слишком частое использование одних и тех же ключевых слов в статье или описании, может плохо отразиться на ранжировании. Пишите естественно, не нужно нарочно «втыкать» ключ там где он не уместен. Однако, чтобы понимать какие ключевые слова больше распространены или наоборот, необходимо использовать сервисы наподобие Wordstat.Yandex. Чем более высокочастотный (популярный) запрос — тем выше по нему конкуренция.
  • Семантическое ядро — при создании разделов сайта, чаще руководствуются принципом: Высокочастотный→Среднечастотный→Низкочастотный запрос. Например, туристический сайт, может иметь структуру: Туры→Автобусные туры→Автобусные туры в Испанию. Как правило, каждая страница имеет свое описание. Не стоит создавать слишком большую глубину вложенности. Оптимальный вариант 2-3 клика, для того чтобы дойти до любой страницы. Для некоторых сайтов, составление семантического ядра может быть не обязательным, например, многие блоговые сайты, вовсе не продвигают рубрики, так как вся основная информация находится в статьях.
  • Уникальность — копирование чужих описаний и статей не принесет ничего хорошего. С точки зрения ПС, это совершенно бесполезный контент, который уже и так имеется в его базе.
  • Салат полезныйПолезность — тексты в которых куча не связанных смыслом слов, напичканные ключевыми словами не будут ранжироваться в ПС успешно, по крайней мере на длительной основе. Чтобы ваш контент был более полезным, изучите конкурентов в топе и сделайте лучше.
  • Полнота — Пример: если заголовок вашей статьи «Танки времен второй мировой войны», недостаточно описать только танки одной страны. В топе, вероятнее всего будет конкурент который охватил все страны. Однако, ПС может выдать более релевантный ответ исходя из популярности и геолокации: в Германии — немецкие, в России — советские и т.д.
  • Востребованность — Если то о чем вы пишите не ищут в интернете, то и посетителей из поисковика вы не дождетесь. Если вы продвигаете какой-то «ноу-хау», придется создавать спрос другими составляющими интернет-маркетинга.
  • Актуальность — Вы часто натыкаетесь на статьи 2003 года? Конечно это не главенствующий фактор, но если есть современный аналог, ПС отдаст предпочтение ему.
  • ТекстУдобная подача — Использование графиков, картинок, видео, оглавления для больших статей. Правильная структура заголовков H1 и далее в порядке уменьшения H2,H3,H4 и т.д. Правильная смысловая последовательность.

Юзабилити (удобство использования сайта):

  • Навигация — В первую очередь, это понятная структура, которая составляется еще на этапе создания семантического ядра. Используйте хлебные крошки, экспериментируйте и выявляйте более удобное расположение элементов. В этом деле помогут средства аналитики: Яндекс метрика и Google analytics.
  • Подсказки — если у вас сложный функционал: добавьте подсказки, обучающий ролик, выделите самые важные навигационные элементы другим цветом.
  • Поиск — основа любого интернет-магазина и других площадок, где необходим точный подбор по параметрам. Для информационных сайтов его роль значительно меньше, а на сайтах-визитка или лендингах он может быть даже лишним.

Технические характеристики:

  • скоростная ракетаСкорость загрузки сайта  важный показатель, который не только учитывается при ранжировании сайта поисковыми системами, но и влияет на конверсию (процент продаж, заказов и т.д.). Особенно важно для мобильных устройств. Проанализировать, что необходимо сделать для ускорения, можно с помощью сервиса developers.google.com.
  • Исключение дублей страниц — полные или частичные копии внутренних страниц вашего ресурса, будут понижаться в поисковой выдаче. Если одна и та же страница доступна по одной ссылке, имеет смысл склеить ее редиректом или указать каноническую ссылку (можно реализовать с помощью плагина Yoast Seo).
  • Мобильный телефонМобильная адаптивность — проверить отвечает ли ваш проект, требованиям мобильной адаптивности можно с помощью Mobile-Friendly.

Популярность:

  • Ссылки — Если на ваши страницы ссылаются авторитетные ресурсы, это может оказать значительное влияние на ранжирование для Google, Яндекс с недалеких пор не учитывает ссылки вовсе.
  • СемантикаСоциальная активность Репосты, лайки и другие действия в социальных сетях которые связаны с вашим проектом, положительно влияют на ПС.
  • Упоминания и брендовые поисковые запросы — Напрямую, важность упоминаний бренда на других сайтах не доказано, однако в Яндексе такой подсчет ведется, наверняка не просто так?  🙂

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

Использование «черных» методов ранжирования:

Не стоит думать, что если поисковик это робот — его можно легко обмануть. Теоретически это возможно, однако, если такой обман раскроется (чаще так и бывает ), ответные меры не заставят себя ждать: ПС наложит на сайт санкции (фильтры). Какие могут быть последствия? Частичное или полное понижение позиций в поисковой выдаче или полное исключение из нее.

Методы которые позволяют обмануть ПС называются — «Черным SEO», это различные искусственные манипуляции (покупка ссылок, спам ключевыми словами, злостное воровство контента, скрытый текст, дорвеии и многое другое).

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

Куда важнее чтобы эти ресурсы были авторитетными в глазах Google, 20 ссылок с хороших ресурсов принесут куда больше пользы, чем 500 с только что созданных сайтов.

Что такое sitemap.xml и robots.txt и зачем они нужны?

sitemap.xml — карта сайта для поисковиков (список всех ваших страниц, записей, рубрик и т.д.). Ее необходимо использовать чтобы ваши страницы быстрее индексировались. Если вы установили плагин Yoast Seo (Этап 6), сделать это можно через него.

Когда поисковики заходят на ваш сайт, первым делом, они читают файл robots.txt. Практически у любого сайта он доступен по адресу: домен/robots.txt. В нем вы можете запрещать индексировать некоторые страницы своего сайта. 

Зачем запрещать индексацию отдельных страниц?

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

После индексации вашего сайта, введите в поисковик Google строчку: site:домен, пример: site:blogforest.ru, в поисковой выдаче отобразятся только страницы вашего проекта. Вы можете обнаружить различные «мусорные страницы», те которые не предназначены для посещения. Если речь идет о дублях, не забывайте про канонические ссылки, чаще это более предпочтительный метод.

Как создать robots.txt?

  1. Создайте текстовый документ на рабочем столе Windows (не используйте Microsoft Word или другие текстовые редакторы).
  2. Назовите его с маленькой буквы (важно): robots.txt.
  3. Далее, копируем пустой файл в корневую папку сайта (public_html/Ваш-домен) через FileZilla.
  4. Теперь заходим в Notepad++ и открываем его (Этап 5).

Внесите в него код:

User-agent: *
Disallow: /wp-json

Host: ваш-домен
Sitemap: полный путь к карте сайта

User-agent: * — этот параметр разрешает любому поисковому боту использовать директивы в robots.txt. Например, вместо «*» мы могли бы написать Yandex, тогда их мог бы читать только Яндекс. Но мы создаем для всех ПС, поэтому нас это не интересует.

Host: — ваш сайт может быть доступен через http, https, www, — чтобы поисковик понимал какое «зеркало» главное, укажите соответствующий протокол и домен, примеры:

  • Если используется https — Host: https://blogforest.ru
  • Если используется http — Host: blogforest.ru

Sitemap: — Если используете плагин Yoas Seo, укажите один из путей в зависимости от используемого протокола:

  • Sitemap: http://ваш-домен/sitemap_index.xml
  • Sitemap: https://ваш-домен/sitemap_index.xml

Существует две главные директивы robots.txt:

  • Disallow — запрещает индексировать.
  • Allow — разрешает индексировать.

В robots.txt мы добавили Disallow: /wp-json, в одной из версий WordPress был баг (ошибка разработчиков), который создавал множество «мусорных» страниц, примерно так они выглядели: http://blogforest.ru/wp-json/oembed/embed. В новых версиях это исправили, тем не менее, данную строчку можно оставить. 

Для примера давайте представим, что:

http://blogforest.ru/wp-json/oembed/embed это http://blogforest.ru/Рубрика/Дочерняя рубрика/Запись.

Как это работает (запрещено, разрешено индексировать):

  • Disallow: /wp-json/ — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /wp-json/* — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /wp-js         — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /wp-json/$ — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /oembed/ — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: */oembed/ — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /oembed/* — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: */oembed/* — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: */oembed/$ — http://blogforest.ru/wp-json/oembed/embed
  • Disallow: /wp-json/oembed/$ — http://blogforest.ru/wp-json/oembed/embed

Если вместе с Disallow используется:

  • «*» — звездочка, запрещает индексировать все, до или после (где встречается слово перед которым она ставится или после которого она ставится).
  • «$» — значок доллара, наоборот, ограничивает то что можно запретить индексировать.

Совместное использование Allow и Disallow:

Пример 1.

Allow имеет большую силу, нежели Disallow, соответственно, если мы зададим в robots.txt:

  • Disallow: /wp-json
  • Allow: /wp-json/oembed/embed

Мы получим такой результат: http://blogforest.ru/wp-json/oembed/embed

Пример 2.

  • Disallow: /wp-json
  • Allow: /wp-json/oembed

Результат: http://blogforest.ru/wp-json/oembed/embed

Пример 3.

  • Disallow: /wp-json
  • Allow: /wp-json/oembed/$

Результат: http://blogforest.ru/wp-json/oembed/embed

Если данных примеров не достаточно, дополнительно, вы можете ознакомится с описанием в Google и Яндекс.

Также, в Google Search Console, в разделе: Сканирование → Инструмент проверки файла robots.txt, есть удобный инструмент, для проведения тестов.

Заключение

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

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

Добавьте данную статью в закладки, на случай если что-то забудете. Плюс, она будет пополняться по мере возможности. Успехов! 

Отправить ответ

Будтье первым!

Подписаться на комментарии:
avatar
4000
wpDiscuz