Перший варіант - проста шапка, яка встановлена на моєму блозі. До речі, мене вона цілком влаштовує, так як не видно цих величезних написів назви і опису блога.
Другий варіант виконаний з використанням двох зображень, поєднаних на одному тлі. В принципі, цю шапку теж легко зробити. Більш складні ми розглянемо пізніше.
Програми та сервіси для роботи над шапкою
Перш ніж приступити до роботи, я перерахую програми, які вам знадобляться:
- Photoshop - будь-яка версія (російська або англомовна);
- Програма Paint - є практично на кожному комп'ютері;
- Розширення для браузера Page Ruler і Colorzilla;
- Шрифти - скачайте на сайті Фонтов.нет.
Крім того, потрібно трохи фантазії і терпіння (в залежності від того, наскільки складну шапку ви хочете зробити).
Проста шапка для блогу
Тепер потрібно дізнатися HTML-код кольору зовнішнього фону вашого блогу. Для цього скористайтеся розширенням Colorzilla. Цифри, коду (дивись скріншот нижче), перенесіть в Paint (Зміна кольорів - нижня колонка справа). Візьміть інструмент «Заливка кольором» і скористайтеся ним.
Збережіть файл у форматі JPEG і відкрийте його в Фотошопі. Виберіть інструмент «Градієнт» і встановіть варіант «Від основного до прозорого». Тепер встановіть курсор вище шапки і, затиснувши ліву кнопку миші, ведіть його вниз. Виходить, що нижня частина шапки стає світліше, а верхня зберігає свій колір.
Отже, останній крок - додавання назви блогу і його опису. Використовуйте різні шрифти і різні ефекти. Збережіть файл у форматі PNG.
Отже, шапка готова, тому можна встановлювати її на блог. Перейдіть в Blogger і зверніться до розділу «Дизайн». У блоці «Header» натисніть посилання «Змінити». У вікні відзначте пункт «З жорсткого диска» і збережений файл. Встановіть галочку в чекбоксі біля опції «Замість заголовка і опису». Натисніть кнопку «Зберегти», а потім «Зберегти розташування». От і все!
Другий варіант шапки блогу
Розміри буду використовувати інші: довжина - 980 пікселів, висота - 250 пікселів. Подивіться на скріншоті нижче, як вона може виглядати.
Створюємо в Photoshop файл і задаємо йому розміри в пікселях. Потім потрібно знайти скачати якісь зображення для шапки, які підходять до тематики вашого блогу. Після цього додайте їх в Фотошоп.
Тепер їх потрібно перенести на основний фон. Робиться це в такий спосіб: виділяєте картинку (CTRL + A), копіюєте (CTRL + C) і вставляєте (CTRL + V).
Для того щоб підігнати розмір, візьміть інструмент «Прямокутна область» і правою кнопкою мишки клацніть по зображенню. У контекстному меню виберіть опцію «Вільне трансформування», а на верхній панелі відзначте «Зберігати пропорції». Теж саме робите з другої картинкою.
Як видно на скріншоті вище, фон у нас вийшов різний, тому будемо виправляти ситуацію. Вибираємо інструмент «Пензель», встановлюємо для неї розмір і регулюємо параметри «Непрозорість» і «Натискання».
Підведіть курсор кисті до фону і, затиснувши кнопку «ALT», клікніть ЛКМ. В результаті ви оберете потрібний колір для всього фону. Тепер постарайтеся зробити фон однаковим. Подивіться, що вийшло у мене:
Залишилося тільки змінити назву або вилучити блогу (шрифти ми вже завантажили і додали в Фотошоп), а потім зберегти шапку на свій комп'ютер.
Останній крок - встановіть шапку на блог і підтвердіть зміни.
Ось так, досить просто, ми ще трохи поліпшили дизайн свого блогу. Надалі я, можливо, покажу вам ще кілька варіантів. Цю статтю буду закінчувати, до зустрічі в наступному уроці. який, до речі, треба було зробити набагато раніше.