Урок 12. Проектування та верстка веб-сторінок.

Верстання веб-сторінки — це процес створення веб-сторінки із попередньо створеного макету дизайну сайту, заздалегідь намальованого за допомогою графічних редакторів.

Верстка веб-сторінки — це структура вже створеної сторінки.

Етапи створення сайту

•Постановка мети
•Технічне завдання
•Проектування
•Верстка
•Наповнення
•Вебмастерінг
•Розміщення
•Тестування
•Просування
•Підтримка

Основні підходи до верстки сайту 

Фіксована верстка. При зміні розміру вікна браузера блоки не поміняють свою ширину, з’явиться смуга прокрутки.

Гумова верстка. Залежно від розміру вікна браузера, блоки змінять свою ширину.

Адаптивна верстка. Втілюється в життя завдяки різним скриптам.

Чуйна верстка. Являє собою злиття адаптивної і гумовою верстки.

Версія сайту для мобільних пристроїв. Фактично є створенням іншого сайту з іншим дизайном, версткою і URL адресою

Способи верстки сайту

HTML-верстка сайту – це верстка сайту на основі мови гіпертекстової розмітки HTML. Залежно від основних елементів html, що використовуються при верстці сайту, виділяють табличну html-верстку й блокову html-верстку.
•Таблична верстка сайту – це верстка, при якій структура сторінки сайту представлена у вигляді таблиці. Кожний елемент сторінки – це одна або кілька комірок таблиці. Таблична верстка сайту зручна й широко застосовується верстальниками, однак вона не завжди може задовольнити потреби сайту зі швидкості завантаження.
•CSS-верстка сайту іноді виділяють в окремий вид верстки сайту, хоча в сучасному веб-дизайні каскадні таблиці стилів (css) використовуються практично при будь-якій верстці. Каскадні таблиці стилів описують зовнішній вигляд сторінок сайту, написаних мовою розмітки: HTML, XHTML, XML.
•Блокова верстка сайту, або як її ще називають верстка div’ами, – це верстка сайту на основі елементів <div>. Така верстка сайту має ряд переваг: стислість коду, висока швидкість завантаження коду та інше.

 

 

 

Використані джерела інформації:

Вікіпедія

На Урок

Вибіркові курси. Веб-технології