Static site generators (генераторы статических сайтов), обновление блога, "переезд" на Hexo

Как вы могли заметить, блог кардинально обновился — от дизайна до новых категорий. А это значит, что скоро здесь появится много новых интересных постов.

Ну а пока расскажу, что было сделано в процессе обновления блога.

Если кто раньше посещал мой блог, то наверное помнит как он выглядел:

По современным меркам — ужасно. Картину дополняли “кракозябры” под блоком “Новые заметки”. Наверное, тот факт, что мне самому мой блог не нравился, очень сильно отгонял от меня желание писать сюда посты. А на самом деле за всё то время, прошедшее с момента последнего поста (10 февраля 2014 года), можно было написать наверное постов 100 — уж очень много я всего нового узнал. Ну да ладно… Проехали. Теперь остаётся только нагонять упущенное.

Вернёмся к процессу обновления блога. Изначально мой блог работал под управлением CMS WordPress. Это длилось наверное год, а может и больше. Время шло, а посетителей всё не было. Пришлось приступить к анализу причин. В ходе такого анализа нашлось много факторов, отрицательно влиявших на мои позиции в поисковых системах. Как потом выяснилось — это было связанно с WordPress и от части с той темой оформления, что я выбрал для блога: куча дублей страниц, отсутствие семантической разметки. И тогда блог был перенесён на написанную на коленке CMS’ку. Вместе с тем был полностью перевёрстан, но сохранил внешний вид. Дела пошли в гору. Бывало по 100 человек в день, велись обсуждения в комментариях под постами… Но сейчас пришло время опять обновлять блог: по-моему мнению — это единственный вариант хоть как-то вернуться к былой посещаемости.

Первым делом предстояло выбрать технологии. Ну наверное ключевое решение, которое пришлось принять — это отказ от CMS и переход к статическому сайту (целиком и полностью состоящего из кучи HTML, CSS и JS файлов). Как результат:

  • Простота в управлении
  • Простота в обслуживании
  • Широкие возможности по размещению в Интернете
  • Безопасность (просто нечего взламывать)

Как известно, если говорят о статических сайтах (и тем более блогах), то подразумевают генераторы статических сайтов.

Генератором статических сайтов называется программный инструмент, превращающий текстовые записи (с разметкой или без) в статичные HTML-страницы.

– Цитата из поста в блоге компании Селектел на Habrahabr

Собственно это означает, что у вас есть шаблон (включающий в себя элементы дизайна сайта, т.е. шапку, футер и т.д., а также подключающий на страницу скрипты и стили) и есть посты в виде обычных файлов (в моём случае это файлы содержащие в себе текст, размеченный с помощью Markdown). И чтобы получить (сгенерировать) файлы вашего сайта нужно запустить генератор. Таких генераторов существует великое множество (Jekyll, Middleman, Hugo и т.д.). Но я как “адепт” Node.JS выбрал генератор под названием Hexo.

Как выглядел процесс создания новой версии блога:

1
2
3
4
5
$ npm install -g hexo
$ cd ~/projects
$ hexo init new-live-notes
$ cd new-live-notes/
$ git clone https://github.com/ppoffice/hexo-theme-icarus.git themes/icarus # установка темы

Ну а дальше правка конфигов, немного затачивания шаблона под себя, перенос постов и, наконец, публикация.

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

Наверное лучшим вариантом будет захостить свой блог на Github Pages — быстро, просто, бесплатно! Но мой блог всегда жил на моём сервере и я решил ничего не менять. Собственно единственное, что мне пришлось сделать помимо доставки сгенерированных файлов на сервер, это — настроить веб-сервер. В моём случае это nginx. Конфиг примерно такой:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
server {
listen 80;
server_name www.live-notes.ru;
index index.html;
root /var/www/live-notes;

if ($request_uri ~* "^(.*/)index\.html$") {
return 301 $1;
}

location / {
rewrite ^/category/hardware/?$ /hardware/ redirect;
rewrite ^/category/software/?$ /software/ redirect;
rewrite ^/moyo-portfolio/?$ /portfolio/ redirect;
rewrite ^/obo-mne/?$ /aboutme/ redirect;
rewrite ^/hardware/vosstanovlenie-fleshki/?$ /hardware/7/ redirect;
rewrite ^/windows/winlocker-bannery-vymogateli/?$ /software/14/ redirect;
rewrite ^/networks/set-v-shkole/?$ /hardware/1/ redirect;
rewrite ^/networks/teamviewer-udalyonnoe-administrirovanie-cherez-internet/?$ /software/12/ redirect;
rewrite ^/networks/italc-udalennoe-upravlenie-v-kabinete-informatiki/?$ /software/8/ redirect;
rewrite ^/windows/zapret-na-izmenenie-vneshnego-vida-windows-xp-professional/?$ /software/9/ redirect;
rewrite ^/software/zapret-na-izmenenie-vneshnego-vida-windows-xp-professional/?$ /software/9/ redirect;
rewrite ^/hardware/sony-alpha-dslr-a380-zerkalka-s-dvumya-obektivami/?$ /hardware/11/ redirect;
rewrite ^/mobile/mobilnye-yandeks-karty-dlya-wave-525-i-533/?$ /software/13/ redirect;
rewrite ^/windows/lechenie-pk-ot-virusov-sposob-pervyj-kaspersky-rescue-disk/?$ /software/17/ redirect;
rewrite ^/hardware/usb-modem-alcatel-x060s-v-ubuntu-server-10-04/?$ /software/18/ redirect;
rewrite ^/linux/oshibka-pri-zapuske-eclipse-v-ubuntu-12-04-beta-2/?$ /software/20/ redirect;
rewrite ^/mobile/o-samsung-wave-533-gt-s5330-na-platforme-bada-1-1-2/?$ /hardware/10/ redirect;
rewrite ^/mobile/sony-ericsson-live-with-walkman-wt19i-on-android-i-on-zhe-walkman/?$ /hardware/16/ redirect;
rewrite ^/mobile/perenaznachenie-klavish-na-sony-ericsson-live-with-walkman-wt19i-i-ne-tolkoandroid/?$ /software/21/ redirect;
rewrite ^/mobile/sony-ericsson-live-with-walkman-wt19i-i-gryadushhee-obnovlenie-do-android-4-0-ics/?$ /software/19/ redirect;
rewrite ^/software/ustanovka-i-upravlenie-antivirusom-kasperskogo-6-0-dlya-windows-workstations-na-rabochix-stanciyax-s-pomoshhyu-kaspersky-administration-kit-8-0/?$ /software/15/ redirect;
rewrite ^/s/?$ /software/21/ redirect;
rewrite ^/software/36/?$ /life/36/ redirect;
rewrite ^/software/27/?$ /life/27/ redirect;
rewrite ^/software/18/?$ /devops/18/ redirect;
rewrite ^/software/31/?$ /coding/31/ redirect;
rewrite ^/software/24/?$ /coding/24/ redirect;
rewrite ^/software/34/?$ /coding/34/ redirect;
rewrite ^/software/35/?$ /coding/35/ redirect;
rewrite ^/software/37/?$ /coding/37/ redirect;
rewrite ^/aboutme/?$ /about/ redirect;
}
}

Проще — не бывает. Как вы можете видеть, в ходе всех переездов, что пережил блог, накопилась куча редиректов. Так же я установил редирект запрещающий открывать файлы index.html, потому что при открытии этих страниц человек видит ровным счётом то же самое что и на URL-адресе без index.html на конце. Т.е. у нас возникают дубли страниц, что негативно сказывается оценке блога со стороны поисковых систем.

На этом всё!

P.S.: Данный пост отчасти написан ради проверки возможностей генератора и синтаксиса разметки. Поэтому в посте могут встречаться уж совсем очевидные вещи, имеющие не столько смысловое значение, сколько визуальное.

Поделиться Комментарии