У моего блога новый дизайн

495  
37
новый дизайн

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

Перед тем, как мы перейдём далее, я хочу отметить важную вещь:

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

Подробнее об этом всё я расскажу далее…

Содержание

  1. С чего всё начиналось
  2. Почему это не просто смена шаблона?
  3. Что вы думаете о новом внешнем виде?
  4. Как повлияют изменение на отношение поисковых систем?
  5. Заключение и выводы

1. С чего всё начиналось

Итак, начнём по порядку, с чего это вдруг вообще я решил внести столь глобальные изменения?

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

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

  • современнее выглядел;
  • начал быстрее работать;
  • лучше воспринимался поисковыми системами;
  • давал больший CTR.

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

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

2. Почему это не просто смена шаблона?

На этот вопрос лично я ответить ещё затрудняюсь, так как и сам не до конца понимаю нововведений. Поэтому здесь расскажет Андрей.

Я не обещаю, что написанный мною текст поймут все читатели. Но все-таки напишу.

Создание этого проекта на React’е — лучший опыт для меня. У меня уже давно были мысли попробовать свои силы, используя эту библиотеку. 2 месяца назад я с Серёгой обсуждал возможные варианты сотрудничества. Возникла мысль полностью изменить сайт. Он долго был против, но со временем осознал, что его дизайн уже устарел и не соответствует сегодняшним нормам. На мой взгляд, дизайн был рисованный и ужасно неудобный.

Что-то я отвлекся. Сегодняшний дизайн — это нечто отличительное. В его основе лежат все новейшие технологии от 2016 года. Это — сам React, PHP 7.1, Docker, HTTPv2, ClickHouse (СУБД от Яндекса), ну и конечно же, MySQL.

Так какие же причины написания SPA приложения на React?

Первая причина. В отличии от нативного WordPress’а, техническая часть подразделяется на фронтенд и бэкенд. В данном случае — фронтенд — это все что Вы видите. Все вкладки, анимации, кнопки, ссылки и вообще вся визуальная сопоставляющая рендерится (отображается) силами браузера. Роль бэкенда — отдавать заголовки, тексты, картинки силами сервера в JSON. Для этого по-прежнему используется WordPress. То есть браузер получает сам пост и рендерит его на стороне клиента самостоятельно. Это главная особенность SPA (Single Page Application) приложений — сократить нагрузку на сервер, а следственно и время загрузки страницы.

Вторая — скорость разработки. Написать приложение на React’е можно гораздо проще и быстрее, чем на чистом HTML + jQuery, но эта причина мало относится к блогу. Вместе с Webpack’ом можно использовать все новые плюшки JS — ES6, JSX, модульность, и т. д.

Третья — как вы заметили, связана с юзабилити — клиенту практически не приходится ждать при загрузке между страницами. При навигации между постами, React получит нужные данные, сам заменит нужные заголовки, тексты и дело в шляпе. В случае с простыми сайтами, браузер должен подождать пока ответит сервер, заново отрисовать DOM дерево, загрузить заново рекламу, аналитику и прочие скрипты.

Я думаю, разница между простым и SPA приложением всем понятна. Уже сейчас многие популярные компании пишут на React (Instagram, Imgur, Web. WhatsApp, DropBox, Airbnb) и в будущем все перейдут на SPA. За ним — будущее.

В любом случае PageSpeed еще не показывает 100/100. Но в скором времени будет.

2.1. Что ещё изменилось?

Как вы могли заметить, я решил полностью убрать с блога все сомнительные проекты и всё что с ними связано, так как окончательно убедился, что заработать обычному обывателю таким образом невозможно. Также я ещё удалил десяток публикаций, которые я посчитал устаревшими и не интересными. Итого было удалено 36 статей. Как это отразится на посещаемости ещё не известно, но могу сказать, что удалённые материалы не приносили пользы.

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

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

3. Что вы думаете о новом внешнем виде?

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

Так вот, друзья, вопросы к вам:

  • Как вам новый дизайн? — Дайте оценку по десятибалльной шкале.
  • Что бы вы сделали по-другому или немного изменили?
  • Как вам скорость работы? Чувствуется моментальная загрузка страниц?

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

3.1. Помогите найти ошибки

Помимо перечисленных выше вопросов, у меня есть ещё одна просьба:

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

4. Как повлияют изменение на отношение поисковых систем?

Думаю, многим интересно, повлияют ли, проведённые работы на ранжирование в поисковых системах.

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

Могу сказать только то, что прежний блог приносил трафика из поисковой системы Яндекс в 5−6 раз больше. чем из Google. Но далеко не факт, что на это влияли используемые технологии, возможно причина была в чем-то другом.

5. Заключение и выводы

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

В общем-то у меня на этом всё. Всех благодарю за внимание и до новых встреч.

Свой путь — он самый правильный.

свой путь
Поделиться

Комментарии

avatar placeholderНапишите комментарий...
  • avatar
    VANDA

    Очень информативно! Спасибо!

    Ответить
  • avatar
    Алина

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

    Ответить
  • avatar
    Андрей

    Интересно, а что будет дальше !?👍

    Ответить
  • avatar
    Сергей Федотов

    Привет, Серёжа! Не узнал твой блог))) Богатым будешь)) Скорость реально запредельная. У меня дома один из компов просто тупенький, так на нем он в секунду загрузился. Минимализм приятный. Картинки в превьюшках вполне себе читабельны, хоть и поначалу кажутся маленькими. Но по сути там все видно и не рассматривать же их именно в превью в конце концов)) Скажи, а в поле для комментариев ты специально убрал место, где можно вписать ссылку на свой ресурс? Чтоб не только электронку свою писать, но и сайт? Это мешает твоему продвижению? Хороший шустрый блог! желаю удачи!👍

    Ответить
    • avatar
      Sergey Ivanisov

      Убрал, чтобы получать меньше некачественных комментариев от людей, которые пишут какую-то ерунду лишь бы ссылку оставить. Хотя из-за этого я теперь не могу видеть, какие блоги у других людей( В общем над этим ещё подумаю, может и верну)

      Ответить
  • avatar
    Асадбек

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

    Ответить
    • avatar
      Sergey Ivanisov

      Спасибо за комментарий, а как вам решение сверху ставить новые комменты? Вроде бы это лучше, чем вниз их убирать)

      Ответить
  • avatar
    emil

    Сергей, как у вас с доходностью блога?
    Раньше у вас было больше рекламы
    Сейчас только один блок - да и то в сайдбаре( а там вроде самое не кликабельное место)
    В чем причина ?

    Ответить
    • avatar
      Andrey

      Добавлю только то, что реклама не обязательно должна быть баннерной, мы больше подумываем о нативной (обзоры, ссылки на ПП)

      Ответить
    • avatar
      Sergey Ivanisov

      Привет, стала немного выше. Блоки рекламные есть ещё и в статьях и на главной странице под первой публикацией. В общем их хватает) Сейчас ещё буду бороться за Директ) размещу его в фиксированном блоке)

      Ответить
      • avatar
        Emil

        Да, но Сергей помню заходил к вам на блог и видел что вы экспериментируете с разными блоками adsense.
        Сейчас же вижу что в статье лишь 1 блок а остальные 2 в Сайдбаре.
        Но разве не прибыльнее расположить все 3 в самом контенте ???
        Что скажете Сергей?
        Мне просто интересно что у вас за стратегия ))

        Ответить
  • avatar
    Евгений

    Сергей приветствую! Приятно удивил новый дизайн, не ожидал такого строгого, но со вкусом сделанного. Чувствуется профессионализм и деловой подход, что важно учитывая тематику блога. Загрузка действительно на высоте, хочется пройтись по статьям автора и задержаться на блоге. Сергей желаю тебе успехов в твоем деле, здоровья и энтузиазма, чтобы люди продолжали получать пользу на твоем ресурсе и их благодарность возвращалась к тебе в форме хороших доходов, дружеских отношений и надежных партнеров! 👍👍👍👍👍👍👍
    С уважением Евгений Маляров

    Ответить
  • avatar
    Дмитрий

    Приветствую, Сергей! Хороший дизайн. Особенно на фоне все большего количества рисованных, которые уже не назовешь оригинальными. Скорость загрузки радует и уже одно это наталкивает на мысли о редизайне. Действительно, минимализм - это круто)

    Ответить
    • avatar
      Гарик

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

      Ответить
      • avatar
        Sergey Ivanisov

        Может быть вы и правы. Но для рисованного нужно наверно чтобы картинка была супер-качественная, от реально хорошего художника)

        Ответить
  • avatar
    Сергей Абалмасов

    Привет Сергей, на данный момент дизайн блога далёк от идеального, старый дизайн радовал глаз посетителя, что касается загрузки страниц, и оптимизации в целом твоего детища, здесь ты на высоте. Желаю тебе удачи и процветания в блогосфере, как в принципе и за я её пределами.👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍👍
    С уважением. Сергей Абалмасов

    Ответить
    • avatar
      Sergey Ivanisov

      Не понравился дизайн, который сейчас? Я правильно понял?) а что именно?

      Ответить
      • avatar
        Сергей Абалмасов

        Панель навигации смущает, странно выглядит, нет особого желания нажимать на тот или иной раздел, это моё личное мнение. Меня впечатлила скорость загрузки блога, PageSpeed Insights, показатели не могут не радовать. Молодец, так держать!!! 💪💪💪

        Ответить
  • avatar
    Татьяна

    Сергей привет, с новым дизайном поздравляю. Он конечно не привычный, я даже сначала подумала не туда попала, скорость классная, я тоже уже думала сменить дизайн, но пока ни чего менять не буду. Хотя и понимаю что он дольше грузится с рисованным.
    Листая странички и статьи, ошибки не обнаружила, всё работает замечательно.
    Удачи в развитии и жду результаты, хотя и сейчас видно, что блог пользуется спросом👍

    Ответить
  • avatar
    Дмитрий

    Сергей, привет. Поздравляю со сменой дизайна. На самом деле рисованные дизайны уже действительно как-то не очень смотрятся. Я уже сам начал отходить от этой темы. На контентнике я уже тоже поменял дизайн на более минималистический, а вот на блоге думаю сменить чуть позже, думаю, что примерно через годик (хотя я уже неоднократно говорил, что он мне поднадоел, действительно как клон смотрится).

    Ну а по теме. Ошибок, кроме указанных Антоном вроде не заметил. В плане дизайна мне кажется, что слишком большое преобладание белого цвета (я понимаю, минимализм, конечно), кажется слишком пустоватым. Я бы бэкграунд чуть потемнее может сделал бы (чуть-чуть). И еще мне кажется что размер шрифта великоват. Мне кажется в самый раз было бы 14, а не 15. Но это лично мое мнение). А так молодец, здорово. Видно, что новый уровень.👍

    Ответить
    • avatar
      Sergey Ivanisov

      Спасибо за коммент) Подумаем насчет твоих советов) И наверно введём обратно ссылки для блогов. А то хочется посмотреть на ресурсы комментатаров, а я не могу(

      Ответить
  • avatar
    Антон

    Отличный дизайн. Теперь реально кажется уникальным 👌
    Нашел 2 ошибки. Когда в шапке переходишь на страницы "О блоге" и "Контакты" выдается ошибку "Internet Server Error" и список строк с кодом каких-то.

    Ответить
    • avatar
      Andrey

      Видели, спасибо.
      В ближайшее время обновлю.

      Ответить
  • avatar
    Регина

    Отличный дизайн!! Честно говоря, я не сразу поняла, что зашла на блог Сергея. Молодец! Блог выглядит более солидным и взрослым. Очень удобный, скорость офигенная. Правильное решение обновить дизайн. Предыдущий мне не очень нравился. Даже немного завидно, белой завистью конечно. УДАЧИ, СЕРГЕЙ.

    Ответить
  • avatar
    Никита Машков

    Привет! Как только заходишь на этот сайт, чувствуешь себя с концентрированным на своих дальнейших действиях на нём, все разложено по своим полочкам, а самое главное ничего лишнего, дизайн действительно впечатляет своей простотой и качественной информацией, Блогеру, Сергею Иванисову желаю успехов и процветаний в дальнейшей работе над над своим проектом! Удачи.

    Ответить
    • avatar
      Сергей Иванисов

      Збазибо)👍

      Ответить
  • avatar
    Максим Козлов

    Приветствую!

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

    Я аналогично уже месяца 2-3 думаю и себе сменить дизайн, но пока к этому руки не доходят. Знаю точно, что менять нужно. К тому же, нужно менять и статьи, и концепцию, поскольку статьи о заработке в инвестиционных проектах, статьи о плагинах и настройках блога уже никого не интересуют и в некоторых случаях приносят только вред читателям.

    В общем, Сергей, правильно все делаешь!!! Желаю тебе только успешного роста и получения хороших результатов!

    Ответить
    • avatar
      Гарик

      Не согласен, как может быть рисованный дизайн прошлым, когда он не так уж давно и родился. Конечно понятно, что должен быть полезный контент, но так отзываться о рисованном тоже неправильно. Во всяком случае можно иметь два шаблона и переодически их менять когда надоест. 😊😭

      Ответить
    • avatar
      Sergey Ivanisov

      Благодарю))) Не забрасывай свой блог!

      Ответить
  • avatar
    Егор

    Новый дизайн понравился, 8 из 10. Один балл за неудобную кнопку "вверх" и один за шапку без фотки. С фоткой было прикольнее.

    Фон и вообще цветовая гамма поменялись в лучшую сторону, читать стало удобнее и приятнее как-то)

    Ответить
    • avatar
      Andrey

      Шапка с фоткой - это уже рисованный дизайн. Мы далеко ушли от него и вряд ли вернемся))

      Кнопка "вверх" занимает все левое пространство, а не только кнопку.

      Ответить
  • avatar
    Александр

    Сергей, привет! Я немножко пораньше смог увидеть, изменение твоего блога! Делился, скриншотами.. =) Интересное решение, с начало честно, было как то неуютно! Для меня, лично, заходя на старый блог, я сразу понимал, что захожу к Сергею Иванисову в гости, блог .. как бы это сказать имел лицо автора!

    Понимаю, что минимализм по своему интересен! Кстати по замечаниям.. считаю что раздел "похожие статьи" должен быть виден сразу после статей... убрав его в самый подвал.. ты теряешь внутренние переходы .. При написании комментария, увидел что нет окошка "ввести свой сайт" так же потеря комментирующих.. а почему ты сам прекрасно знаешь!

    Стрелка ввернуться ВВЕРХ находится... на противоположной стороне блога, да еще и в верхнем углу.. лично мое мнение для меня это не удобно переводить мышку в правый угол когда она (не знаю как у других) практически всегда находится в правой стороне сайта!

    Ответить
    • avatar
      Andrey

      Отвечу за Сергея.

      Рисованный дизайн давно уже ушел в прошлое, просто не все готовы с ним проститься и использовать современный плоский дизайн. Вам так кажется только потому, что вы привыкли. 🤗

      Насчет похожих статей. Если поместить их, к примеру перед комментами, то мы жертвуем шириной, или же, рекламным блоком 🤔. Да, с этим нужно что то делать, это лишь временное решение.

      Убрали поле ввода потому, что большинство авторов оставляют несодержательные комментарии ради одной ссылки. Это действительно напрягает, когда в комментариях один флуд, а-ля "Спасибо, очень полезная информация". Поэтому мы перестали мотивировать пользователей обратной ссылкой. В будущем нужно пересмотреть эту политику, но тогда мы просто жертвуем качеством дискуссии.

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

      В любом случае, спасибо за объективную критику 😉.

      Ответить
    • avatar
      Сергей Иванисов

      Кнопка дело привычки, я думаю) вообще никогда в жизни её не использовал)

      Ответить
  • avatar
    Лилия Мальцева

    Сергей, поменять внешний дизайн- отличное решение. Честно говоря твой рисованный шаблон до этого напоминал копипаст блога А Борисова. Сейчас чувствуется индивидуальный стиль. По скорости, действительно, стало грузится быстрее. Понравился виджет Похожие статьи, видно кол-во просмотров для оценки популярности статьи, это тоже приятно радует. Хотелось бы по подробней узнать что ты имел в виду под фразой "изменились некоторые взгляды на этот ресурс и на его будущее." Мне как блоггеру с 6 летним стажем- это особенно интересно. Удачи и процветания твоим проектам!

    Ответить
    • avatar
      Sergey Ivanisov

      Спасибо за первый комментарий, очень долго ждали его)) всё-таки интересно узнать, что думают люди, особенно интересно узнать, что думают блогеры.

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

      Ответить
      • avatar
        Николай

        Привет, Сергей! Признаться, был несколько удивлён переменами на твоём блоге, так как уже привык с Борисовскому дизайну...
        Ежели говорить о рисованном дизайне блогов-сайтов, то я изначально не был восхищён повальной и тотальной "рисованизацией" сайтов. Когда я впервые увидел блог Борисова (помню, тогда на Форуме целая тема была), я был очень сильно впечатлён его блогом в целом. Но мне не нравился отдельно рисованный дизайн. Свой сайт всегда хотел сделать на другом шаблоне и с другим дизайном. Что касается теперешнего дизайна у тебя - мне он нравится гораздо больше, чем предыдущий. Однозначно.

        Что касается скорости работы сайта в целом и отдельных его элементов - весьма на высоте. Так держать!

        Ответить

Рубрики

Показать все
Рассылка лучших статей блога

Первый манимэйкерский

Блог №1 для начинающих манимэйкеров

  — подписывайтесь!

© 2015 - 2017 Первый манимэйкерский
Почта для связи: me@sergey-ivanisov.ru
Все права защищены.