овая версия этого сайта

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

емного истории

Cамый первый мой сайт появился в интернетах четвёртого ноября 2001 года. Тогда я ещё не знал что такое CSS. Не знал совсем: даже не представлял, что такая вещь как CSS существует — сайт был сделан на фреймах и таблицах. На сайте располагалось, в основном, моё всяческое творчество. Например, карты для игры Heroes of Might and Magic III, дурацкая поэзия, а также всякая прочая ерунда. Поначалу сайт хостился на бесплатном bk.ru, потом — долгое время на «народе», где претерпел кучу изменений и ещё целых восемь версий не имел ничего общего с тем, что сейчас можно на нём обнаружить.

В декабре 2006 года я впервые прочитал спецификации CSS, и, чуть больше года спустя, в феврале 2008 года, запустил девятую версию сайта, уже на своём домене — kizu.ru. К тому моменту я уже что-то понимал в вёрстке — в те годы я очень активно пилил стили для ЖЖ, начиная с вёрстки только CSS-переопределениями, и заканчивая полностью кастомными раскладками. Потому новый сайт стал посвящён только вёрстке, а всё творчество осталось разве что у меня в архивах, да в том самом подзамочном ЖЖ.

В самом начале в качестве движка для kizu.ru я взял Movable Type. Потом, в августе 2009 года, когда я ещё глубже погрузился в вёрстку и научился делать совсем всё с ноля, я превратил сайт в набор обычных статичных html-файлов. А к февралю 2011 года мне уже немного надоело поддерживать сайт вручную (точнее, при помощи регулярных выражений и глобального поиска и замены в редакторе), так что я опять заморочился на какую-то автоматизацию и реализовал всё то, что на тот момент было готово в статике, но уже на генераторе статики nanoc.

И ещё два года спустя, 17 января 2013 года, я перезапустил сайт на Jekyll, с хостингом на GitHub Pages. Но на этот раз я полностью переосмыслил дизайн и всерьёз заморочился типографикой. Это была предыдущая, двенадцатая версия сайта, с которой я прожил больше трёх с половиной лет.

ринадцатая версия

вижок

На этот раз я снова всё переписал с ноля. Дважды! Так, мною хвалимый поначалу Jekyll начал мне жать. Из коробки (то бишь, в той версии, что поставляется с GitHub Pages), он умеет не так много. А всяких продвинутых возможностей (в основном, для заморочек с типографикой) в нём можно было достичь только либо очень адским кодом на встроенном шаблонизаторе Liquid, либо написанием сторонних плагинов на ruby. В Liquid я быстро упёрся в потолок его возможностей (хотя и натворив там того, что вряд ли кто-то на нём до этого делал), а плагины на ruby не поддерживались на GitHub Pages. А если же билдить сайт локально из исходников и потом пушить только статику, то мне показалось более разумной идеей взять какое-нибудь аналогичное решение, но только на JS, который я знаю и понимаю гораздо лучше, чем ruby.

Выбор пал на Docpad, на котором я практически полностью переделал сайт. Однако, чем дальше я заморачивался с плагинами для него, тем больше он начинал тормозить. В какой-то момент, когда сборка стала занимать уже больше 90 секунд, я решил остановиться и посмотреть на свой сайт свежим взглядом. После продолжительных раздумий и чтения документации других генераторов статики, я пришёл к выводу, что мне ничего из имеющегося не подходит. Везде мне пришлось бы лезть глубоко в ядро генераторов, писать кучу своего кода и не полагаться на сторонние плагины. А это бы значило, что мне пришлось бы бороться с тем, как работают сами генераторы, от чего я уже устал, работая с Джекиллом и Докпадом.

В итоге, я написал практически всё сам, взяв за основу gulp и тот свой JS, что я уже до этого написал для выкинутой версии на Докпаде. Сразу хочу сказать, что на исходники пока лучше не смотреть. Всё. Очень. Плохо. Я изучал gulp на лету, прототипировал, экспериментировал. Но даже текущий далеко не оптимальный код собирается на порядок быстрее, чем то, что было в Докпаде. Около 8-9 секунд, при большей функциональности и сложности. А с вотчерами отдельные части пересобираются и того быстрее. В планах есть добавить пересборку только контента конкретных изменившихся постов, тогда всё станет вообще молниеносно. А новые фичи, даже в текущий ужасный код, добавлять уже очень просто.

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

ёрстка, дизайн и типографика

На исходный код стилей аналогично не рекомендую смотреть. Большая часть стилей осталась от предыдущей версии сайта, возможно, что-то чуть-чуть причесалось, но… Я бы всё взял и переписал. Нет, большинство решений именно в вёрстке мне до сих пор нравится, но исходники — грязные, очень плохо структурированные, не смотрите на них. Самое вкусное я всё равно опишу в грядущих постах.

Дизайн, на первый взгляд, остался почти таким же. Но очень многое поменялось в мелочах и, особенно, в типографике. Я всё ещё использую шрифт 21 Cent от Letterhead, но докупил ещё одно начертание для заголовков. Стал использовать больше фичей опентайпа, добавил переносы слов и — какой кошмар! — стал выравнивать текст по ширине. Это даже не так страшно выглядит — всё благодаря переносам и чуть увеличившейся ширине колонки текста. В рамках типографики я, в итоге, применяю очень много экспериментального и спорного. Наверняка что-то ещё поменяется, что-то добавится, а что-то не выдержит проверки временем.

одержимое

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

Кроме регулярно (я надеюсь!) появляющегося контента, будет обновляться и базовая структура сайта. Скажем, может появиться стандартный раздел «обо мне», что-нибудь более похожее на резюме, а также какие-нибудь другие интересные страницы. Чтобы не быть голословным, вот пример: новая страница со списком всех моих докладов. Хотя я в последнее время практически не выступаю на конференциях, надежды на то, что этот раздел будет пополняться всё же есть.

обро пожаловать!

Спасибо, если дочитали этот пост до конца! Я планировал сделать просто короткую отписку о том, что вот она — новая версия сайта. Но сначала углубился в историю и версионирование, потом в историю с переписыванием сначала на докпад, а позже — на gulp; в общем, коротко не получилось, уж извините :)

Как обычно, если вы найдёте какие-то ошибки в текстах или баги вёрстки — пишите либо на почту, либо в ишьюс на Гитхабе, либо в мастодон, либо куда захотите. Буду рад и скажу спасибо. Если повнимательнее рассмотрите дизайн и типографику, и если у вас после этого возникнут по ним вопросы — также задавайте! Хотя у меня и есть идеи о будущих постах, интерес к чему-то конкретному будет хорошим мотиватором к тому, чтобы сесть и написать именно об этом.

Вы можете прокомментировать эту статью в Мастодоне.

Опубликовано с метками: #Blog #Meta