Дизайн блога (шапка+логотип) за 3600 рублей — часть 1

Дата публикации:

   Всем привет! Многим интересно, сколько стоил мне дизайн блога, поэтому решила сразу открыть все тайны. 3000 рублей — шапка и потом я заказала художнику-иллюстратору логотип, который вы видите сейчас на блоге — 600 рублей. Но сегодня я хочу поговорить не об этом. Рассказ сегодня будет серьезным и долгим. А говорить мы будем о том, как грамотно подготовить задание для художника-иллюстратора, чтобы в итоге мы получили все материалы (шапка + логотип + кое-что еще) в самом лучшем и нужном нам виде.

Шапка сайта

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

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

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

   Здесь нужно вспомнить, что пользователи заходят на ваш сайт с различных устройств с разным размером экранов. Поэтому, было бы замечательно, если пользователь самых небольших экранов, тоже имели возможность видеть меню сайта. За основу можно взять высоту 10-дюймового экрана — 600 px. То есть высота шапки + меню должны помещаться на этом пространстве, т.е. быть меньше 600 px по высоте.

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

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

   Для начала, вам необходимо узнать, с каких устройств с какими экранами чаще всего заходят на ваш сайт ваши посетители. Как это узнать? Очень просто! Через счетчик посещаемости liveinternet, который устанавливается в обязательном порядке на любой сайт. А если у вас нет сайта, прошу обратить внимание на статистику моих данных. Итак, заходим на сервис, нажимаем в самом нижу на вкладку разрешение.

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

   Следовательно, если человек заходит с небольшого монитора, то он не видит целиком всю информацию, которую можно увидеть на большом экране.

   Но как это проверить? Неужели нужно попросить у кого-то такое устройство или попросить его зайти на ваш сайт через свой ноутбук? Конечно же нет! Для этого есть специальный сервис, который нам поможет - http://quirktools.com/screenfly/. Заходим, вводим адрес своего сайта.

   Теперь мы видим, как отображается наш сайт. В верхнем левом углу можно выбрать размер нужного нам экрана. Я выберу самый «популярный» среди моих посетителей:

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

   Что же делать? Я предлагаю взглянуть на образцовый блог и посмотреть, как эта проблема решена у него. Под образцовым блогом я принимаю блог Александра Борисова — наверняка известного вам интернет-предпринимателя. Кто-то его обожает, кто-то испытывает к нему не самые лучшие чувства. Но, я абсолютно не беру это во внимание.

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

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

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

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

   Естественно, рисунок в шапке может быть шире, чем 980 px, но помните, что главная информация о блоге должна поместиться в эти пределы.

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

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

Логотип и слоган

   С логотипом все намного проще. Вам нужно всего лишь предоставить эскиз вашего логотипа, вашу идею, о которой мы говорили в прошлой статье. Может быть, цветовое решение, вид шрифта и т.д. Если у вас есть какие-то примеры из интернета, тоже их предоставьте. Ну и укажите, что логотип вместе со слоганом нужно разместить в такой части блога, чтобы его было видно на устройствах с экраном в 10 дюймов, то есть на участке по ширине 980 px.

   По поводу слогана хочу отметить еще один важный момент. Лучше, если он будет прописан текстом, а не сделан в виде изображения. Если вы решили использовать для слогана слишком сложный шрифт, то его лучше сделать его в виде изображение, так как сложные шрифты иногда могут не поддерживаться в разных браузерах. А если шрифт один из самых простых и широко используемых (у меня это Calibri), лучше прописать его текстом (это сделает программист), тогда заказывать его художнику не нужно.

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


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

Ваша, Елена Исхакова

36 комментариев
  • Алиса

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

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

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

      10 февраля 2015-02-10 Ответить
  • Алиса

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

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

      Отзывы тоже не могут дать полной картины. Хоть мы им и доверяем, но нужно помнить, что сейчас покупается все: хоть отзывы, хоть рекомендации. Исключение составляют только рекомендации от людей, которые дорожат своей репутацией и не станут советовать нечто вредное для своих зрителей или читателей.

      10 февраля 2015-02-10 Ответить
  • Алиса

    Меня удивило, что вы сказали, что есть всего один момент. Я всегда думала, что доверие завоевывается со временем и очень многими факторами. То, что я сказала выше + возраст, активность, посещаемость и не знаю что еще. В любом случае будет интересно узнать, что это всего ОДНО по вашему мнению.)) :unsure:

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

      ) Я напишу в следующей статье для блогеров.

      10 февраля 2015-02-10 Ответить
  • Валентина

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

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

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

      А в нашем случае я имею в виду как сайт отображается на 10-дюймовых экранах.

      10 февраля 2015-02-10 Ответить
  • Алиса

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

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

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

      10 февраля 2015-02-10 Ответить
    • Алиса

      Да, к сожалению, оно порой подводит, чутье это. Первое впечатление, да и не первое порой очень обманчиво, согласна. Хорошо иметь еще какие-либо аргументы.)

      10 февраля 2015-02-10 Ответить
      • Елена Исхакова

        Да, чем их больше, тем лучше.

        10 февраля 2015-02-10
  • Алиса

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

    10 февраля 2015-02-10 Ответить
    • Елена Исхакова

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

      10 февраля 2015-02-10 Ответить
    • Алиса

      Зашла к вам через ноот, аж блог не узнала!

      18 февраля 2015-02-18 Ответить
      • Елена Исхакова

        Он еще немного сыроват) К концу недели подточим)

        18 февраля 2015-02-18
  • Сергей

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

    12 февраля 2015-02-12 Ответить
    • Елена Исхакова

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

      13 февраля 2015-02-13 Ответить
  • Андрей Гончаров

    Я заказывал логотип так.

    «Сделай мне что-нибудь с моими инициалами»

    Я даже эскиз нарисовать не могу, курица лапой наверно лучше это сделает. :yes:

    18 февраля 2015-02-18 Ответить
    • Елена Исхакова

      Можно тогда примеры приводить в виде картинок, которые найдешь в инете

      18 февраля 2015-02-18 Ответить
  • Андрей Гончаров

    Так и делаю, когда заказываю картинки для блога. Присылаю похожие, и говорю — сделай то же самое, только в своем стиле)

    18 февраля 2015-02-18 Ответить
    • Елена Исхакова

      Ну хотя бы так. Все равно у людей, которые постоянно рисуют, есть некоторый опыт в этом. Так что они все равно могут сделать что-то, на что мы скажем ВАУ, когда увидим. Художники — молодцы...

      18 февраля 2015-02-18 Ответить
  • Алиса

    Андрей, а вам самому в тот раз понравилось, то, что вам сделали?

    19 февраля 2015-02-19 Ответить
  • Андрей Гончаров

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

    Елена, художниками восхищаюсь. Я даже по этому поводу им статью в черновике написал.

    gavbloger.blogspot.ru/2014/12/blog-post_25.html

    19 февраля 2015-02-19 Ответить
    • Елена Исхакова

      Мне очень нравится шапка вашего сайта. Очень философская тема. Это была ваша идея?

      19 февраля 2015-02-19 Ответить
  • Андрей Гончаров

    Можно на ты, я только на 3 года старше

    Всё, что есть на сайте — моя идея

    19 февраля 2015-02-19 Ответить
    • Елена Исхакова

      Конечно, можно)

      Это круто! Очень интересная идея, необычная

      19 февраля 2015-02-19 Ответить
  • Андрей Гончаров

    Это был не вопрос))))

    Идея — то, что происходит внутри меня. Вечная борьба с самим собой,

    можно сказать Бога и Дьявола внутри.

    Бросил пить алкоголь, похудел уже на 20 кг, встаю в свои выходные до 6 утра, перестал есть мясо, с нуля научился (надеюсь на это) вести блог,

    но на самом деле я лентяй и бездельник

    19 февраля 2015-02-19 Ответить
    • Елена Исхакова

      Все деятельные люди считают себя лентяями и бездельниками. Я тоже от этого страдаю)

      19 февраля 2015-02-19 Ответить
  • Алиса

    Самокритика, страшная вещь!

    20 февраля 2015-02-20 Ответить
    • Елена Исхакова

      Алиса, это просто убийственная вещь, я бы сказала)

      20 февраля 2015-02-20 Ответить
  • Оксана

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

    Я опять задаюсь вопросом — а есть ли качественный контент в инфобизнесе?

    21 апреля 2015-04-21 Ответить
    • Елена Исхакова

      Оксана, контент качественный есть, но его очень и очень мало.

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

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

      Ну и напоследок дам один такой намек. Вчера посмотрела фильм «Одержимость» 2014 года про музыканта. Вот мне кажется, что в нем вся суть современного бизнеса, инфобизнеса, да и вообще жизни.

      21 апреля 2015-04-21 Ответить
  • Лидия

    Спасибо. Попала к вам из поисковика, искала исполнителя, нужно нарисовать шапку кулинарного сайта. Попробую обратится к предлагаемой Вами девушке Анне.

    16 февраля 2016-02-16 Ответить
    • Елена

      Вы останетесь довольны.

      16 февраля 2016-02-16 Ответить
    • Елена

      Положила ваш сайт в закладки, очень вкусно все выглядит)

      16 февраля 2016-02-16 Ответить

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: