Lesson 4. Дизайн блогу. Основні параметри

Питання дизайну блогу - досить складне. Смаки у всіх різні, і треба знайти золоту середину. Так, щоб ваш блог подобався візуально і вам, і тим, хто його читає (чи по крайній мірі не дуже дратував ваших читачів).

Отже, ми розберемо, які можливості дизайну дарує нам обраний сервіс.

Нагадаю, що на даний момент у вашому блозі має бути розміщений перший пробний пост (див. Lesson 3).




На сторінку управління дизайном можна попасти такими способами:
1. Якщо ви знаходитеся безпосередньо в своєму блозі, знайдіть зверху справа слово Design
2. Якщо ви на сторінці адміністратора (http://www.blogger.com/home) - натисніть спочатку на назві блогу, який хочете редагувати (якщо блогів більш, ніж один). В нашому випадку це Blogboard Club).

Зліва буде меню, в якому нас цікавлять дві кнопки, що відповідають за дизайн. Це Layout та Template.

Template відповідає за загальний шаблон блогу, так би мовити, за скелет. Можна сказати, що цей розділ - для "ледачих". Для тих, хто не хоче довго думати над дизайном, а просто вибирає з тих готових шаблонів, які пропонуються.

Ми відразу перейдемо до розділу Layout, тим більш, що в ньому можна змінювати і все те, що є в Template. Отже, натискайте Layout і перед вами - ваш блог у вигляді прямокутників, тобто складових частин.

Дизайн блогу складається з таких параметрів:

1. Головна картинка
2. Фон
3. Колір тексту і ссилок
4. Ширина блогу та бокових колонок

Почнемо з головної картинки. У випадку даного блогу мається на увазі ось це:

Головне питання тут - і де ж цю картинку взяти? Відповіді дві: зробити самому, або знайти в Інтеренеті.

Для того, щоб зробити її самому необхідно мати навички роботи в якомусь графічному редакторі. Краще за все, звичайно, Photoshop. Можливо згодом на нашому сайті з"являться декілька уроків по Photoshop-у, а поки що, всім, кого зацікавило це питання, радимо скористатися пошуком в Інтернеті. Подібних уроків - море.

Якщо ви шукаєте картинку в Інтернеті, ось вам декілька порад:

• Бажано, щоб вона була витягнута в ширину (на ширину всього блогу) і при цьому не дуже висока, щоб не займала багато місця на сторінці.
• Мала досить великий розмір (ширина - не менш 700 пікселей).
• Обережно з кольорами. Краще шукати щось не дуже барвисте (хоча все залежить від того, як будуть виглядати всі елементи дизайну разом).

Ну, а тепер - як же встановити картинку, що ви підібрали/зробили? Знайдіть на сторінці Layout довгий прямокутник, де написано *назва вашого блогу* (Header). Натискайте edit. З"являється віконечко. Вже знайшли, куди треба натиснути, щоб завантажити зображення? Правильно, молодці. Після того, як зображення завантажиться у вас є три варіанти, як його розташувати:

1. Behind title and description - картинка буде розміщена за назвою та описом блогу. Перевірте, щоб при цьому букви назви блогу не опинилися на такому місці картинки, де вони будуть погано читатися (білі букви назви на плямі світлого кольору). Для цього прийдеться зберегти установки та зайти на сторінку блогу - подивитися.
2. Instead of title and description - картинка встане замість назви блогу. Гарний вибір, якщо на самій картинці в графічному редакторі ви написали назву (так, як зроблено в даному блозі). Тоді, якщо клікнути по картинці - ви будете повертатися на головну сторінку блогу (картинка працюватиме, як ссилка).
3. Instead of title and description - назва та опис блогу встануть нижче картинки. В деяких випадках це непоганий варіант, але частіше - не дуже вдалий маневр.

Визначились? (Якщо ні - потім поекспериментуєте). Тисніть Save. А потім не забудьте натиснути Save arrangement.

Перейдемо до інших складових дизайну. На нас чекає дуже цікавий конструктор. Знайдіть на сторінці, де ви зараз, слова Template Designer.

Тепер треба трохи почекати, поки завантажиться конструктор. Зверху ви побачите панель редагування, а нижче - ваш блог, на якому інтерактивно будуть відображатися всі зміни. Якщо вас дуже зацікавило питання дизайну - спробуйте самі покопатися та розібратися з всіма нюансами. Ми ж звернемо вашу увагу лише на таке...

Фон блогу. У випадку нашого сайту - фон просто білий. Але подивіться, які варіанти вам пропонує конструктор. Натискайте зверху зліва на слово Background. Потім - Background image. Потім - на маленьку стрілочку. З"явиться великий вибір картинок для фону блогу, та можливість завантажити свою власну (уважно! така картинка має бути дуже великого розміру). Спробуйте вибрати щось з того, що пропонується (або замість картинки підберіть просто колір, натиснувши на Main color theme)

Для більш детального розгляду теми фону буде зроблений додатковий урок.

Зараз перейдемо до кольору основного шрифту та ссилок. Перший встановлюється так: шукаєте в меню Advanced, а там - Body text. Порада: не міняйте в шрифті нічого окрім кольору. Та і з ним поводьтеся обережно. Якщо у вас поле повідомлення світле, то колір шрифту має бути чорним, або темно-сірим. Якщо у вас темний блог - підберіть такий шрифт світлого кольору, який би добре читався і не втомлював очі.

Колір ссилок встановлюємо так: Advanced, потім - Links. У вас є три значення:

• Link Color - основний колір ссилок (бажано, щоб він хоч трохи відрізнявся від кольору просто тексту)
• Visited Color - колір ссилок, які вже натискалися користувачем (досить часто цей колір вибірають той самий, що і Link Color, або лише трохи відмінний від нього. Щоб блог не виглядав надто "барвисто").
• Hover Color - колір сиилки, коли на неї наводять курсор (тут головне, щоб він відрізнявся від Link Color рівно настільки, щоб людина бачила, що це - ссилка).

Переходимо до встановлення ширини блогу та бокових колонок. Для початку варто завітати в розділ Layout, що в меню зверху, та вибрати макет вашого блогу. Тобто, де і як будуть розташовані бокові колонки. Стандартний вибір - це одна колонка справа, чи зліва від основного поля блогу.

А тепер завітайте в розділ Adjust widths. Верхній повзунок встановлює ширину самого блогу, нижній - ширину бокової колонки. Поради:

• Пам"ятайте, що багато людей заходять в Інтернет з ноутбуків, а значить не варто робити надто широкий блог, бо він не вміститься в їх монітори і треба буде прокручувати. Оптимальний вибір: від 700 до 900 пікселей.
• Не робіть бокову колонку надто вузькою (менш 150 пікселей) - мало що туди вміститься тоді. Або надто широкою (навіщо? тільки з'їсть місце у основного блоку).

Взагалі, ви зможете "погратися" з цими параметрами в будь-який момент, коли вже буде щось розміщено і в самому блозі, і головне - в боковій колонці.

Після того, як внесете всі зміни - натискайте на Apply to Blog, оранжевій кнопці справа зверху.

Це були основні елементи організації дизайну. Більш детальний розгляд буде згодом.
Потрібні поради? Хочете запитати, чи добре виглядає ваш блог? Можете зробити це прямо тут, в коментарях цього уроку.