Як створити шаблон сайту?

Як створити шаблон сайту?
Урок-1.

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

Давайте розберемо по кроках створення не складного шаблону, але досить пристойного, який у деяких випадках ще й згодиться. Освоївши ці уроки, Ви зможете робити цілком пристойні шаблони. Головне зрозуміти основи роботи над створенням шаблону. Що потрібно для створення шаблону?

Знадобляться дві програми фотошоп і редактор Adobe Dreamweaver. Я користуюся Fhotoshop CS5 і Adobe Dreamweaver 8. На прикладі цих програм я і буду все пояснювати. Dreamweaver зручний тим, що там відразу можна працювати з двома вікнами. Редагуючи код html можна відразу візуально спостерігати як змінюється шаблон сайт.

У першому уроці ми зробимо структуру сайту, тобто Зробимо розмітку шаблону сайту, визначимося з розмірами шапки сайту, меню і тіла для контенту. Створимо сайт на тему про способи заробітку в інтернеті. Починаємо з запуску програми Фотошоп. Заходимо в меню файл створити створюємо новий документ і виставляємо розміри майбутнього шаблону сайт. Ширину сайту задаємо залежно від Ваших потреб.

Для прикладу я встановив ширину в 1000пікселей, висоту теж 1000 пікселів. Висота ніякої ролі не грає. Якщо контент перевищить ці 1000 пікселів, то сторінка буде автоматично подовжуватися. Натиснувши ОК, з’явиться робоча область, в якій необхідно включити ЛІНІЙКИ (CTRL + R). Зверху і зліва мають з’явитися лінійки.

З верхньої лінійки тягнемо направляючу на робочу область, щоб утворилася шапка сайту. Потім друга направляючу, щоб утворився футер (підвал).

Тепер з лівої лінійки тягнемо направляючу, щоб отримати область меню. Меню можна робити як справа, так і зліва. У моєму прикладі буде ліворуч. Після всіх маніпуляцій робоча область буде виглядати так: Я для прикладу задав висоту шапки 250 пікселів, ширину області для меню сайту теж 250 пікселів і висота підвалу 50 пікселів. Ви за своїми бажаннями або вимогам можете всі розміри встановлювати на свій розсуд.

Це був перший урок. У наступному уроці ми розглянемо вибір кольору для шаблону і втілимо це в реальність.

Як створити шаблон сайту?

Сподобалася стаття? Поділися нею з друзями!




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