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

• Управление контентом
• Дизайн
• Публикация
• Социальные сети
• Поиск
• Комментарии
• Подписка на обновления

Поехали!

Управление контентом

Для управления контентом я выбрал генератор статических сайтов по нескольким причинам. Прежде всего, это гибкость, скорость работы и безопасность. У меня shared hosting, что предполагает очень ограниченные ресурсы веб-сервера, здесь и возникает проблема. Лично мне очень нравится drupal, но в руководстве хостинга ясно написано, что это достаточно ресурсоёмкий движок, для которого рекомендуется VPS, что несколько больше по деньгам. Если вы выбираете движок (то есть приложение на сервере), то даже с точки зрения безопасности (ну и для появления новых возможностей) его нужно обновлять, и для Drupal наиболее простой способ – drush. Пробовал его использовать, он просто вылетал именно из-за ограничения ресурсов.

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

Ещё один важный нюанс: VPS требует настройки и обновления операционной системы, а это тоже время. Итого, если взять только один критерий – требуемые затраты времени – shared hosting + статический генератор сайтов для небольшого блога выглядят наиболее предпочтительно. Но тут есть ещё один момент, скорость работы. Ведь для веб-сервера быстрее всего – выдавать набор HTML-файлов. А скорость работы – это ощущения пользователей от работы с сайтом.

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

Стандартный процесс публикации опишу в разделе "Публикация" ниже, а пока перейдём к подбору дизайна.

Дизайн

Поскольку с приложением для создания сайта я уже определился, осталось подобрать дизайн. Как вы уже поняли, я склоняюсь к минимализму, а любимый цвет у меня – синий, что и определило выбор темы Pelican-blue. Тема состоит из небольшого числа иконок, HTML- и CSS- файлов. Пришлось тряхнуть стариной и разобраться в HTML и CSS, чтобы подправить отдельные моменты, но в целом всё в пределах 3% доработок.

Есть момент именно для Pelican: темы несут разную функциональность, конкретно выбранная мной тема изначально была связана с Twitter, Facebook (как – чуть ниже) и предполагала ряд других настроек, которые мне были нужны. У каждой темы есть страница на GitHub, где описываются её настройки и возможности. Есть вариант установить все темы сразу и переключаться между ними, чтобы примерить на свой контент. Например, у вас больше или меньше разделов, или заголовки длиннее, и крупным шрифтом они будут некрасиво расползаться и т.п.

В целом тема дизайна достаточно сложная (особенно для тех, кто в нём плохо разбирается, вроде меня), поэтому на выбор темы уходит целый день. Потом читаешь книгу "Don't Make Me Think", хватаешься за голову и переделываешь. Из последних обновлений, например:

• Заголовок в левом верхнем углу теперь работает как ссылка на главную страницу
• Страницы ведут только на контент на сайте, а все внешние ссылки сделаны иконками
• В CSS исправлено выравнивание рисунков, иначе мобильный сайт работал откровенно криво
• Заменил и добавил иконки социальных сетей с сайта icon8
• Поскольку записей блога накопилось достаточно много, добавил страницу с тегами (темами), но и они выведены не простым списком: размер шрифта определяется количеством публикаций по теме (больше публикаций – больше шрифт)

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

Публикация

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

1. Сначала необходимо создать файл с Markdown-разметкой и достаточно специфическим заголовком, в котором определяется название, подзаголовок, теги и другие моменты. Для этого понадобится текстовый редактор с подсветкой Markdown-разметки, лично я пользуюсь Geany. До этого работал в vim, но постоянно переключаться между языками откровенно неудобно. После сохранения статьи проверяю правописание (aspell в моём случае).
2. Обновляем сайт, в случае с pelican понадобится команда make publish. Обновляются только изменённые и связанные страницы, поэтому это происходит достаточно быстро. На выходе все файлы складываются в каталог output. То, что получилось, я смотрю в браузере и вычитываю (пока сайт обновился только на моём компьютере).
3. Теперь нужно закинуть содержимое папки output на сервер. Какое-то время пользовался ftp, но затем стал использовать git, поскольку мой хостинг (Dreamhost) поддерживает такую возможность. Это позволяет не только обновлять только то, что изменилось, но и делать это очень быстро (передаются только изменения), а ещё сохраняется предыдущая версия. Например, если я меняю что-то в дизайне или структуре, есть возможность откатиться на предыдущую версию.

Как вы можете видеть, я достаточно последователен в автоматизации. Когда я редактирую статью, я не хочу думать о дизайне, с одной стороны; с другой стороны, я могу вставить куски HTML-кода, если разметки мне не хватило. Когда я обновляю сайт, я не хочу сам выделять то, что изменилось. А ведение версий сайта спасает нервные клетки, даже если ничего страшного не произошло.

Социальные сети

Для публикации в социальных сетях требуется определённая информация в мета-тегах HTML, и это было встроено в дизайн. То есть на каждой странице содержимое этих тегов определяется содержанием страницы. Если бы я не выбрал этот дизайн, возможно, я бы этого и не узнал. Кроме этого, внизу страницы расположены кнопки "поделиться" (share), при нажатии на которые заполняется содержание твита / поста на Facebook или темы письма.

Для публикации обновлений сайта в Facebook, Twitter использую IFTTT. На вход IFTTT берёт RSS, который... встроен в дизайн. Работает всё хорошо, оперативно и переживает обновления страницы (например, когда я заметил ошибку после публикации).

Достаточно существенным новостным каналом стал Google News. Здесь эпопея длилась несколько месяцев, поскольку подтверждение сайта длится долго (несколько недель). Но в целом они пишут достаточно понятно, что им нужно, например:

• Лого сайта должно соответствовать лого в Google News
• Для РФ должна быть указана возрастная категория, у меня это 12+ внизу страницы
• Нужно определить регион и выбрать категории тем для этого региона

Опять же, Google News берёт новые страницы из RSS. Также в качестве картинки к статье Google News берёт первую картинку в статье. Выглядит всё достаточно прилично, элементы форматирования (выделение жирным, например) сохраняются.

Поиск

Собственный поиск на сайте может быть болью, если не умеет работать с морфологией (изменённой формой слова) либо искать по части слова. Но у меня статические HTML файлы, поэтому я выбрал поиск Google. Он открывается во внешнем окне и впихивает по пять рекламных ссылок в начало. Зато он работает с морфологией, честно индексирует все страницы, хорошо встраивается в дизайн (в том числе, в дизайн мобильной версии сайта).

Комментарии

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

• авторизацию из социальных сетей и собственную авторизацию
• рекомендовать, твитнуть, поделиться в Facebook
• подписаться по почте на новые комментарии к статье

Подписка на обновления

До недавнего времени я использовал почтовую рассылку Google Groups, куда раз в неделю высылал обновления. Казалось бы, всё просто работает. В чём проблема здесь:

• Требует аккаунт Google
• Достаточно архаичный дизайн писем и страниц
• Не сделаешь встроенную на сайт форму подписки

Эти проблемы решает большое количество сервисов, среди которых одним из лидеров является (остаётся) Mailchimp. И теперь можно подписаться с минимальным количеством усилий вверху каждой страницы. В бесплатный тариф входит 2000 адресов и одна аудитория, чего мне пока хватает. Как и средств дизайна рассылки в HTML, поэтому теперь рассылка выглядит намного приятнее.

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

К функциональным возможностям мне рекомендовали добавить канал в Telegram или VK, но... Скажем так, пока я к этому не пришёл. Как и к однообразным картинкам "неизвестные мне люди с (не)умным выражением лица" к каждой новой записи.

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

Поскольку это первая запись 2021-го года, всем успехов в новом году! У меня для вас заготовлено несколько интересных тем на ближайшее время. Подписывайтесь на богомерзкий Google News (иконка в меню слева) или православную рассылку (в почте вверху страницы).

Большое спасибо Айгуль за массу предложений по улучшению сайта и за моральную поддержку.