Редизайн сайта

bestarticle

Второй день уже не высыпаюсь, зато доделал новый дизайн у блога

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

сайт до

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

новый дизайн

Как все это было

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

Потом я натолкнулся на генератор текста в стиле long shadows и оформил надпись сверху. Не думал что такое можно сделать с помощью одного лишь CSS.

Изменил превьюшки постов, теперь это не маленькие квадратики, а полосочки. Пришлось только в последних 10 постах изменить в ручную миниатюры через файловый менджер и сделать их широкими. Остальные старые посты остались с маленькими квадратными превью, но это не так уж и страшно. Если есть желания, полистайте страницы и сами все увидите.

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

gAJayoKERww

Посмотрел по статистике сайта разрешения экранов моих читаелей и даже слегка удивился, оказывается, самый популярное разрешение у моих читателей нетбуковский 1366×768

разрешение

Потом следом идет 1920×1080, у меня такое же разрешение, поэтому у таких людей сайт будет лучше всего отображаться. А у кого-то до сих пор 640×480, у тех заголовок сайта выглядит слегка печально, но все остальное будет нормальное, так как оптимизировано по умолчанию в шаблоне.

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

Если есть какие-то предложения по дизайну или просто что сказать, то пишите комментарии.