<
  • Главная
Статьи

Картинки для блогу. Як зробити блог

Скоро виповниться рівно рік з моменту відкриття цього авторського блогу. На самому початку шляху були сумніви з приводу дизайну. Особливо було багато роздумів щодо співвідношення сторін картинок до публікацій. Розповім якими цифрами і стилями керуюся для вибору картинок.

Розмір картинок (співвідношення сторін)

Зараз візуальне оформлення сайту влаштовує мене трохи більше, ніж повністю. Але так було не завжди. Раніше підбирав картинки для публікацій із співвідношенням сторін 1: 2. Щоб картинка по ширині була в два рази більше, ніж за висотою.

Скажу чесно, вгадав з цим числом. Зараз публікую картинки з приблизно такими ж пропорціями. Намагаюся тримати співвідношення від 1.8 до 2.2. Іноді доходжу до 2.5, але картинка виходить дуже вузька.

Звідки брати картинки для блогу

Після написання статті починається приємний процес підбору картинки. Найпростіший спосіб підібрати якісну картинку - знайти шпалери для робочого столу. Вони завжди у високій роздільній здатності і за змістом часто підходять в якості зображення до публікації.

Щоб знайти хорошу картинку, відкрийте Google пошуковик, закладку "картинки". Введіть перше слово - wallpapers (шпалери для робочого столу). І додайте потрібну тематику. Наприклад, "wallpapers coffee". Враховуйте, що можна ввести слово російською та англійською. Результати з картинками "coffee" і "кава" будуть відрізнятися.

Потім клацніть по кнопці "інструменти". І виберете розмір "Більше 4 Мп". Такий великий розмір потрібен для обрізки потрібного фрагмента зображення.

І не забудьте виставити бажаний колір зображення. Щоб картинка не вибивалася із загального дизайну сайту

якість картинок

Після завантаження відповідних шпалер для робочого столу, можна вирізати фрагмент з потрібним співвідношенням сторін (1.8-2.2). Для цього використовую Gimp (Безкоштовний аналог Photoshop). Ширина готового зображення не повинна перевищувати 1600 пікселів з дозволом 72 пікселя на дюйм. А збережений файл повинен займати приблизно 200 кілобайт. Про причини обмеження файлу за розміром читайте в статті " Стиснення картинок Jpegoptim, OptiPNG, Mogrify ".

Вибрав розмір в 1600 пікселів "на виріст". На випадок, якщо через кілька років стандарти сайтостроения зміняться, і все картинки стануть ширшими. На щастя, зараз ідеальної шириною контенту визнана колонка ~ 770 пікселів. Тому ширина картинок в 1600 пікселів надлишкова.

Колірна гамма картинок

Не можу нічого порадити у виборі картинок. Тому що на смак і колір всім подобається різний.

Скажу тільки очевидне: цей сайт виконаний в біло-зеленій гамі. Тому на картинках повинно бути багато фарб, які можуть скласти пару білому і зеленому. Якщо колір не робить пару основний гамі сайту, то картинка повинна бути блідою. Адже білий - один з основних кольорів сайту. Бляклість можна зробити тим же Gimp'ом, опцією "яскравість".

Якщо зображення не підходить за кольором, то у нього повинні бути невеликі розміри. Наприклад як у публікації " AJAX завантаження файлів ":

Наприклад як у публікації    AJAX завантаження файлів   :

AJAX завантаження файлів

Якщо кольори зображення бляклі і не утворюють пари з гамою сайту, то картинка може бути і велика. Наприклад, як в публікації " Зберегти сторінку цілком (зі шрифтами) ":

Linux. Зберегти сторінку цілком (зі шрифтами)

Це не суворе правило, а тільки опис власних дій. Чіткого алгоритму і співвідношень дати не можу. Адже люди тисячоліттями намагалися знайти секрет створення ідеальних зображень. Було придумано "золотий перетин" і інші способи зробити предмет красивим. Але до сих пір не сформувалася остаточна і точно викладена ідея кращих пропорцій і кольору.



Новости
  • Виртуальный хостинг

    Виртуальный хостинг. Возможности сервера распределяются в равной мере между всеми... 
    Читать полностью

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

    Редизайн сайта – это полное либо частичное обновление дизайна существующего сайта.... 
    Читать полностью

  • Консалтинг, услуги контент-менеджера

    Сопровождение любых интернет ресурсов;- Знание HTML и CSS- Поиск и обновление контента;-... 
    Читать полностью

  • Трафик из соцсетей

    Сравнительно дешевый способ по сравнению с поисковым и контекстным видами раскрутки... 
    Читать полностью

  • Поисковая оптимизация

    Поисковая оптимизация (англ. search engine optimization, SEO) — поднятие позиций сайта в результатах... 
    Читать полностью