HTML/CSS верстка
Що таке HTML/CSS верстка
Розробка веб-сайту включає невід’ємний етап, який називається версткою і слід відразу після створення дизайну. Перед версткою майбутні сторінки знаходяться у растровому форматі, тобто у вигляді простих зображень. Зазвичай вони у форматі PSD, якщо для розробки дизайну використовувалася програма Adobe Photoshop. Це найпопулярніша програма для таких цілей. Іноді можна зустріти формат sketch, якщо використовувалася однойменна програма (використовується під операційною системою iOS).
Верстка це процес трансформації статичного растрового зображення на текстовий документ, який може відображатися браузерами. Після завершення верстки сторінки веб-сайту вже не у вигляді громіздких растрових зображень, а у вигляді компактних текстових документів. Формат сторінок тепер не PSD, а HTML, тому про верстку часто говорять верстка з PSD до HTML.
Однією лише версткою структури не обійтися, у браузері така сторінка буде виглядати дуже просто і нудно: чорний текст на білому тлі і, можливо, з будь-якими зображеннями, браузер сам вирішуватиме, як показувати сторінку, які кольори, розміри чи тип шрифту використовувати . Для зміни зовнішнього вигляду сторінок використовують CSS (Cascading Style Sheets – каскадні аркуші стилів).
HTML/CSS верстка – це створення структури веб-сторінок за допомогою HTML та стилізація елементів на ній за допомогою CSS. Цей тандем технологій дозволяють веб-сайтам виглядати у браузері, тому що ви їх бачите і як задумав дизайнер/розробник.
Різниця між HTML та CSS
Дуже часто верстку називають HTML версткою, або CSS версткою, або HTML/CSS версткою, але мають на увазі те саме – структурування і стилізація документа для створення гіпертекстових сторінок. Але HTML і CSS це далеко не одне й те саме. Хоча для створення веб-сайтів вони завжди використовуються разом, відмінності між ними кардинальні. Це дві різні технології та використовуються вони для різних цілей.
Головна відмінність полягає в тому, що HTML використовується для створення структури веб-сторінки, CSS для зміни її зовнішнього вигляду.
Зв’язок HTML та CSS
HTML та CSS дуже тісно пов’язані між собою і без них неможливо створити сучасний веб-сайт. Неважливо як працює сайт, які технології використовуються PHP, Ruby on Rails або щось ще, зрештою, у браузері ми завжди отримуємо HTML/CSS. Навіть у часи, коли технологія flash була на піку популярності, і будь-який фріланс розробник сайтів вважав своїм обов’язком використовувати її, все одно був потрібний HTML для завантаження flash файлу.
Незважаючи на свою нерозривність, все ж таки, існують ситуації, коли ці технології використовують порізно. Наприклад, якщо потрібно створити структурований гіпертекстовий документ, але неважливо як він має виглядати, то можна обійтися без листів стилів. З іншого боку, CSS може використовуватися для стилізації інших структурованих документів, наприклад, SVG.
Резюмуючи все сказане вище: HTML/CSS верстка це процес створення веб-сторінок з PSD і є одним етапом у розробці будь-якого веб-сайту.
Потрібна верстка?
Шукайте фрілансер для верстки вашого проекту? Я можу у цьому допомогти. Скористайтеся формою нижче, щоб зв’язатися зі мною та описати ваші вимоги до верстки. Якщо прикріпити зображення для попереднього перегляду, можна оцінити вартість верстки.