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 и является одним этапом в разработке любого веб-сайта.

Нужна верстка?

Ищите фрилансера для верстки вашего проекта? Я могу в этом помочь. Воспользуйтесь формой ниже, чтобы связаться со мной и описать ваши требования к верстке. Если прикрепите изображение для предварительного просмотра, смогу оценить стоимость верстки.