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

Существует два способа верстки страниц:

  1. Табличная (В качестве структурной основы для расположения графических и текстовых элементов документа используют таблицы.)
  2. Блочная (слоями, дивами). (Является более распространенной, так как этот способ обладает рядом преимуществ перед табличной и комбинированной html версткой. Основное преимущество – это простой и компактный код сайта.)

Ниже представлены примеры верстки сайта под разные движки и без оных

Верстка лендинга F1 Studio

Чистя папку проектов, наткнулся сегодня на вот такой сайтик. Судя по всему там был рип сайта и небольшая доверстка. Были разнообразные скрипты, например галерейка или подключение карты сайта. В целом типичный заказ, оставляю здесь ради сохранения для истории;)

Детали проекта

Верстка посадочной страницы “антикомарин”

Очередной макет от старого заказчика. Макет красивый, но как по мне немного перегруженный. В целом посадочная страница получилась хорошая, я отлично оптимизировал скрипты, стили. Гуглу понравилось тоже ;) Оптимизация сайта под загрузку вышла на ура. Не трудно догадатсья что из... Посмотреть запись

Детали проекта

Верстка страницы гостиницы rock-hotel.org

Ещё один проект, который я сделал на хотелсах – страница гостиницы в Батуми. Простенький, но информативный дизайн. Главная страница по типу посадочной. Специальные типы записей для разных номеров, кастомные поля дял цен и дат бронирования. В дальнейшем планировалось организовать свою систему заказа номеров.

Детали проекта

Верстка новостного блога для сервиса поиска гостиниц Hotels24

Верстка новостного блога для сервиса поиска гостиниц Hotels24 Работая на hotels24.ua я занимался многими интересными и не очень вещами. В общем планировалось что я буду заниматься адаптивной версткой нового сайта, но что-то все к нему не могли подготовить дизайн. Поэтому... Посмотреть запись

Детали проекта

Рип, редизайн, верстка и интеграция на WordPress сайта дизайн-студии designandproduction.ru

Один из самых крутых проектов, которые мне пришлось делать – сложность заключалась в довольно обьемном техзадании: Нужно было сделать рип дизайна сайта По макету заказчика доверстать ещё несколько элементов: что-то убрать, что-то добавить Оптимизировать верстку, убрать лишний мусор в стилях, ускорить загрузку сайта... Посмотреть запись

Детали проекта

Верстка и интеграция на WordPress проекта мультфильмов “Мои маленькие понни”

С заказчиком Дмитрием мы сотрудничаем с самого начала моей карьеры в вебразработке. Профессиональной карьеры, я имею ввиду. Было сделано уже десятки совместных проектов, под сотенку сайтов я сверстал для него. Второй Дмитрий в этом проекте – мой старый друг, дизайнер.... Посмотреть запись

Детали проекта

Разработка сайта для масажного/спа салона

Довольно специфический заказ. В первую очередь специфический из-за непродуманого дизайна. Второй момент – нужно было создать взаимосвязанные страницы услуг, персонала. На разных страницах выводить разные связи. Особенно тяжело это получалось на странице с двумя скриптовыми склайдерами – навигационным вертикальным и горизонтальным... Посмотреть запись

Детали проекта