Использование генераторов сайтов
Итак, представим задачу - донести до потенциальной интернет-аудитории свой глас. Конечно, вы можете просто принять участие в цифровом обмене информацией и использовать любую из различных социальных сетей, чтобы представить свою работу на всеобщее обозрение. Конечно, тут есть из чего выбирать... И не только из "обычных" социальных сетей. Можно попытать счастья в таких местах, как Artstation, Flickr, Soundcloud и Wattpad, независимо от вашего уровня.
И на самом деле, вы должны использовать эти сайты. В конце концов, там много людей. Однако ни одно из этих мест не является действительно вашим. Ни одну из этих площадок нельзя назвать родным местом, которое вы контролируете и которое изменяете так, чтобы люди могли его найти, независимо от растущих и убывающих тенденций в социальных сетях.
Контроль. Именно в этом ценность того, чтобы иметь свое место в интернете.
Но эта статья не о настройке доменного имени и хостинга для вашего сайта. Она о шаге после фактического создание сайта. Типичный выбор для многих людей – использовать что-то вроде WordPress. У большинства хостинг-провайдеров установка происходит одним щелчком мыши, и существует огромный рынок плагинов и тем, доступных для выбора, в зависимости от типа сайта, который вы пытаетесь создать. Но WordPress не только немного излишен для большинства сайтов, но и дает динамически генерируемый сайт с множеством движущихся частей. Если вы не обновите все эти части, они могут представлять значительную угрозу безопасности, и ваш сайт может быть взломан.
Альтернативой может быть статический веб-сайт без динамической генерации на стороне сервера. Просто старый добрый HTML и CSS (и, возможно, немного JavaScript для функциональности). Недостатком этого варианта является то, что вам пришлось бы самостоятельно кодировать все это вручную. Это выполнимо, но что если вы просто хотите место, где можно поделиться своей работой. Вам не нужно знать все особенности низкоуровневого веб-дизайна (и огромную головную боль кросс-браузерной совместимости), чтобы сделать это.
Представляем вашему внимание статические генераторы сайта. Вы получаете скорость и безопасность статических HTML-страниц, но функционал, который ближе к удобству динамического сайта. Двумя лидерами в мире генераторов статических сайтов являются Hugo и Jekyll. Но какой из них вам подходит? Надеюсь, к концу этой статьи у вас уже такого вопроса не возникнет. Мы оцениваем статические генераторы сайтов, основываясь на том, как быстро вы можете начать с ними работу, количестве и доступности тем, рабочем процессе редактирования и расширяемости.
Начало работы
Справедливое предупреждение: оба эти инструмента потребуют от вас работы с ними из командной строки. Большинство команд просты и легко запоминаются, но давайте все же немного сбавим наши ожидания. Это не интерфейс типа "укажи и нажми".
Установка Jekyll и Hugo довольно проста. Jekyll устанавливается как RubyGem, а Hugo предлагает очень удобный двоичный файл (все в одном), чтобы быстро приступить к работе. Из-за единого пакета установки, Хьюго немного предпочтительнее. Хотя метод установки RubyGems для Jekyll сам по себе прост, он требует наличия на вашем компьютере правильно установленной и настроенной среды Ruby. За пределами сообщества дизайнеров и разработчиков сети, большинство людей и понятие не имеют об этом программном обеспечении.
Однако после установки и Hugo, и Jekyll имеют много похожего. У них обоих есть отличная документация и руководства по быстрому старту. Вы запускаете новый сайт с помощью одной команды (в Jekyll это jekyll new <your_site>, а в Hugo, hugo new site <your_site>). Таким образом устанавливается общая структура каталогов и кодогенерация для вашего сайта. Структура каталогов и базовая конфигурация очень похожи. Jekyll использует файл _config.yml, а Hugo использует config.toml (хотя вы можете использовать синтаксис YAML или даже JSON с конфигурацией Hugo, если вам удобнее использовать любой из них). Метаданные в верхней части каждого файла содержимого используют тот же синтаксис, что и конфигурация. После этого все содержимое страницы записывается в Markdown.
Смею отметить, что с точки зрения начала работы с вашим самым первым статически сгенерированным сайтом, Jekyll имеет небольшое преимущество перед Hugo, потому что он начинается с некого основного контента и темы по умолчанию. Вы можете использовать их в качестве примеров шаблонов, когда начинаете создавать свой сайт. У Хьюго нет примеров контента или даже темы по умолчанию. Тем не менее, пример содержимого и темы по умолчанию обычно являются первыми вещами, которые я удаляю, когда создаю новый сайт с помощью любого инструмента, поэтому Хьюго фактически экономит мне время на это действие.
Темы
Как я уже говорил, Хьюго вообще не поставляется с темой по умолчанию, так что это, вероятно, одна из первых вещей, которую вы захотите настроить. У Jekyll есть достойная тема по умолчанию, хотя она довольно голая. Так что вероятнее всего, в первую очередь вы пойдете выбирать себе какую-то другую тему для Jekyll.
И у Hugo, и у Jekyll есть довольно разнообразный ассортимент тем для всех типов веб-сайтов: от одностраничных идентификаторов до полноценных многостраничных сайтов с постами и комментариями в блоге. Несмотря на это, не совсем легко найти тему, которая бы полностью соответствовала всем вашим требованиям. В любом случае, место для поиска тем – themes.gohugo.io для Hugo и jekyllthemes.org для Jekyll. Это, в основном, одна большая страница, полная скриншотов тем. Как только вы нажмете на тему, вы можете получить довольно подробную информацию о ней, но начальная страница поиска довольно безлика. Страница тем Hugo имеет некоторые базовые теги, встроенные в нее, но в целом поиск и презентация тем – это то, над чем, как мне кажется, нужно работать обоим проектам.
Про управление темами забывать также не стоит. В обоих случаях почти каждая тема – это Git-репозиторий (часто размещаемый на GitHub), который вы клонируете в структуру своего сайта. В Jekyll есть дополнительный шаг использования комплекта RubyGems, чтобы обеспечить управление темой с сайтом. Большинство тем уже поставляются с Gemfile, что делает этот шаг относительно безболезненным. Если в теме еще нет Gemfile, ее довольно легко добавить. В Hugo нет шага привязки. Просто укажите тему из вашего config.toml, и все готово.
Рабочий процесс
Рабочие процессы для создания вашего сайта в Jekyll и Hugo очень похожи, когда вы настроили свою первоначальную конфигурацию. У обоих есть команда live serve, которая запускает небольшой и легкий веб-сервер на вашем компьютере, поэтому вы можете проверить свой сайт локально, не загружая его куда-либо. Очень приятно то, что независимо от того, используете ли вы jekyll serve или hugo serve, оба настроены по умолчанию для отслеживания любых изменений, которые вы вносите в свой сайт во время работы над ним. Когда вы просматриваете локально обслуживаемую версию вашего сайта в браузере, она автоматически обновляется с любым внесенным вами изменением, независимо от того, относится ли это к содержанию, конфигурации, теме или просто изображению. Это действительно очень удобно и отлично экономит время.
Вы пишете контент для своего сайта в обеих системах, используя синтаксис Markdown. Если вы не знакомы с Markdown, это очень упрощенный способ написания обычным текстом, но при этом допускается несколько хороших тметок форматирования. Он очень легко работает и читается человеком. А поскольку он находится в виде обычного текста, ваш контент (и, следовательно, ваш сайт) легко контролируется версией.
Когда ваш сайт будет готов к отправке, вы можете отключить сервер предварительного просмотра и выполнить команду для создания реальных страниц сайта. В Jekyll это будет jekyll build. В Хьюго это просто hugo. Jekyll помещает готовый сайт в подкаталог _site, а Hugo помещает их в подкаталог public. В любом случае, после того, как вы это сделаете, у вас будет готовый статический веб-сайт, который вы можете загрузить и разместить почти в любом месте.
Расширяемость
И Хьюго, и Джекилл дают вам возможность настроить ваш сайт до самых маленьких вещей. Тем не менее, с точки зрения расширяемости, Jekyll в настоящее время занимает лидирующие позиции благодаря API своего плагина. Из-за этой архитектуры плагинов относительно легко добавить новый функционал вашему сайту, сгенерированному Jekyll. Это делается с помощью достаточно коротких фрагментов кода, доступных в сообществе Jekyll или написанных вами.
У Hugo в настоящее время вообще нет API плагинов, поэтому добавить такую же функциональность немного сложнее. Есть надежда, что возможность писать и включать плагины будет добавлена в будущем, но, похоже, разработчики об этом пока даже не думают.