Seo-Бизнес блог Progress-project

Все о создании, продвижении сайтов и заработке в интернете

Обновлённый дизайн блога Progress-project
logotip «Progress-project»
logotip «Progress-project»

Новый дизайн блога Progress-project

Добрый день уважаемые друзья, сегодня на «Progress-project» я хочу поговорить с вами о обновлённом дизайне блога!

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

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

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

И хотя прежняя тема abrek-ad-abra.ru не к одной из данных категорий не относится, меня не совсем устраивал её внешний вид.

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

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

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

Нужно признаться, что создать сегодня для своего блога боле менее приглядное оформление оказалось делом не из дешевых. Заглянув к флерайсерам которые просят по 7 — 10 тысяч рублей за создание одной лишь шапки и столько же за подвал я решил, что искать хорошего художника-иллюстратора нужно среди знакомых или в социальных сетях.

После непродолжительной переписки с несколькими людьми предлагающих подобные услуги, я остановился на девушке с ником: «Светка Конфетка», вот ссылка на её профиль в ВК.
Которая любезно согласилась, сославшись на то, что это её первые работы, создать мне шапку и подвал по 5 тысяч рублей за штуку.

После этого я подобрал необходимые изображения на прозрачном фоне, данное условие конечно же необязательно просто мне хотелось, чтобы элементы на изображениях были именно такими:

Далее окончательно определился с фоном и размерами, на мой взгляд самый оптимальный размер шапки в подобном случае является 1920 x 600, также мне пришлось немного сузить основное содержание статьи, чтобы проверить, как именно отображается ваш блог на различных устройствах можно воспользоваться специальным сервисом например: quirktools.com.

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

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

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

Далее всё это богатство я запаковал в архив и передал ссылку на его скачивание вместе с подробным описанием желаемого «Светке Конфетке» оплатив половину стоимости работы.

На всём протяжении выполнения работы примерно в трое суток оставался на связи уточняя те или иные нюансы.

Что же изменилось на «Прогресс-проект» ещё?

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

Скорость загрузки, до и после

Здесь очень много зависит конечно же от вёрстки, я не могу утверждать, что мои темы идеальные, но в них уже сделано очень многое в плане комфорта для пользователей оптимизации и избавления от плагинов кодовыми вариантами начиная от вывода миниатюр, карты сайта, постраничной навигации, кнопок, в верх и вниз, формы обратной связи, до сео оптимизации, избавления от дублей, закрытия исходящих ссылок или даже вывода мета-тегов; «rel=canonical», «Title», «description», «keywords» и «Мета-тегов robots».

Так же существует мнение, что подобные довольно обширные шапки заметно замедляют ресурс, вот несколько скриншотов до и после изменения темы:


Так было до внесения изменений в тему «Прогресс-проекта».

А вот так стало сейчас:


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

Очень интересует ваше мнение по поводу изменений, стал ли блог лучше и нужно ли, что то исправить? Каково вообще ваше мнение по поводу широких шапок и подвалов?

Собственно это и всё чем я хотел с вами поделиться.

Если кому то нужна визуально простая но максимально SEO оптимизированная WordPress тема пишите, через форму обратной связи продам прежний вариант за 6000 рублей, именно такую сумму в своё время я потратил на её разработку.

Как вы могли видеть на скриншотах выше тема имеет достаточно высокие показатели, полностью валидна с точки зрения W3C и размечена с учётом всех последних нововведений: google, в том числе и «schema.org/NewsArticle» + микро-разметка для социальных сетей.

Вот ещё несколько скриншотов:

Внедрены функции вывода мета-тегов: «Title», «description», «keywords», заменяющие известные seo плагины + «rel=canonical» и «Мета-тег robots».

Закрытие исходящих ссылок через: «go to», защита от регистраций спам-ботов, защита от дублей: «replytocom», что позволяет без малейшего риска использовать древовидные комментарии, закрытие ссылок в теле комментария, функция вывода своей аватарки по умолчанию, мобильная версия, версия для печати и множество мелочей, как; вывод ссылок на следующую и предыдущую статьи, хлебные крошки, поддержка миниатюр, увеличение изображений в статье, спойлер, постраничная навигация, вывод похожих записей с миниатюрами после каждого поста а также в сайт-баре, форма подписки на блог и конечно же favicon.

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

Но вот и всё на сегодня, желаю вам всего доброго и до новых встреч!

С уважением, автор блога!
© progress-project
★Обновлено:2016-05-21

Введите свой e-mail:

Вы можете поделиться статьёй в социальных сетях:

Комментарии к статье

4 комментарияна “Новый дизайн блога Progress-project”
  1. Татьяна:

    Дизайн супер!!!

    Ответить
    • Administrator:

      Здравствуйте Татьяна!
      Рад видеть вас на блоге, большое спасибо за оценку, хочу заметить, что внешний вид вашего астрологического портала мне тоже весьма понравился!

      Ответить
  2. Елена Картавцева:

    Поздравляю! Дизайн великолепный! Могу только позавидовать. Конечно, лично меня МОЙ дизайн устраивает, хотя, есть ряд нюансов, по причине которых не мешает дизайн, точнее, шаблон, поменять.
    4 года тому назад, когда создавала сайт, даже не предполагала, что я такая тупая в технических вопросах, причем, они никак не хотят «укладываться» в моей голове, поэтому отказалась от каких-либо курсов — бесполезно. Дело в том, что сайт отражается не корректно на мобильных устройствах. Загадка для меня — шаблоны, которые я «прокатываю» на тестовом сайте, отражаются прекрасно. Переношу на основной сайт — все, ступор. На обоих сайтах стоят одни и те же плагины, единственное, на основном 2 года тому назад заплатила приличную денежку и мне сделали микроразметку. Вот и чешу затылок: что с чем не стыкуется?! Да, можно все сделать с нуля, заказать резиновый шаблон, поменять дизайн, но отрегулировать потом все вопросы, например, по плагинам и т.д., вряд ли самостоятельно смогу, значит за все надо выложить определенную сумму — благотворительностью никто заниматься не будет. Плюс к этому по-новой делать микроразметку, опять таки за деньги…Куда пенсионеру «играть» в такие игры, ладно бы я зарабатывала на сайте приличную копейку.
    Ой, только не подумайте, что я жалуюсь. Это просто мысли вслух. Когда знакомые загораются идеей создания своего сайта, стараюсь отговорить, ведь надо соизмерять жаления и возможности, как умственные, так и финансовые. Многие не верят, считая, что если я СМОГЛА, то они и подавно смогут. Наивные, ведь даже написание статьи — огромный труд. Кстати, обидно, когда их «тырят» без зазрения совести.
    Ладно, что-то я разговорилась! 🙂
    Всего доброго.. Буду заглядывать в гости.

    Ответить
    • Administrator:

      Здравствуйте Елена Алексеевна, рад видеть Вас на блоге, спасибо за тёплые слова, с Вами очень приятно общаться! Что же касаемо Вашего блога, то лично мне он очень даже понравился и судя по посещаемости не только мне одному. На страницах блога я как мог подробнее описал способы внедрения микро-разметки, по прицепу: Progress-project, но конечно же, чтобы во всём разобраться, необходимо потратить достаточное количество времени. По поводу мобильной версии, сервис: pagespeed показывает, что сайт вполне корректно отображается на всех мобильных устройствах, просто нуждается в небольшой оптимизации, как; уменьшение веса изображений, перенос JavaScript из header в footer либо отдельный файл, подключения кеш браузера и оптимизации css стилей, в общем всё это не настолько уж и критично и вполне исправимо. Очень рад буду видеть Вас снова и сам тоже непременно буду заходить к Вам!

      Ответить

Ваш комментарий

Внимание! Перед тем, как вставить в комментарий: html, php либо JavaScript, преобразуйте его в HTML сущность!

» Подписаться на комментарии по RSS
Поиск по блогу

Введите свой e-mail:

ВКонтакте Google+ Facebook RSS-лента сайта abrek-ad-abra.ru

Топ комментаторов

Виктор(6)
seoonly.ru(4)
Иван(3)
Олег(3)
Николай(3)

© 2015-2017

SEO-Бизнес блог «Progress-project».

Все материалы, опубликованные на сайте: принадлежат автору и охраняются в соответствии с законодательством РФ.

При использовании материалов сайта гиперссылка на обязательна!



seo-блог