Для людей, работающих в сфере информационных технологий, концепция дизайна кажется очевидной. Еще сложнее объяснить человеку, который находит сайты только как пользователь.
При создании макета сайта verstka.top, когда все функциональные модули и компоненты готовы, необходимо объединить все элементы в одно целое, то есть спроектировать сайт. Дизайн веб-сайта — это завершающий этап разработки дизайна веб-сайта, создание структуры веб-сайта, которая будет определять отображение текста и графики на веб-сайте в различных браузерах.
Различают «жесткий» (фиксированный) и «эластичный» (переменный) дизайн сайта. При «жестком» дизайне все элементы на веб-странице всегда имеют фиксированный размер, независимо от размера монитора и установленного разрешения экрана. «Резиновый» дизайн сайта позволяет изменять размеры элементов на странице, подстраиваясь под разные размеры и разрешения мониторов.
Сегодня дизайн сайта можно делать разными способами. Рассмотрим самые распространенные.
HTML макет сайта
Макет сайта HTML — это макет сайта, основанный на языке разметки гипертекста HTML. В зависимости от основных элементов html, которые используются в дизайне сайта, существует табличный макет html и блочный макет html.
Табличный макет сайта — это макет, в котором структура страницы сайта представлена в виде таблицы. Каждый элемент страницы — это одна или несколько ячеек таблицы. Табличное оформление сайта удобно и широко используется дизайнерами, но оно не всегда может соответствовать потребностям сайта, например, с точки зрения скорости загрузки.
Блочный макет сайта или, как его еще называют, макет с div, — это макет сайта, основанный на элементах <div>. Такой дизайн сайта имеет ряд преимуществ: короткий код, высокая скорость загрузки кода и т. Д.
CSS дизайн сайта
Макет CSS иногда выделяется как отдельный тип дизайна сайта, хотя в современном веб-дизайне каскадные таблицы стилей (CSS) используются практически в любом макете. Каскадные таблицы стилей описывают внешний вид страниц сайта, написанных на языке разметки: HTML, XHTML, XML.
Макет, использующий CSS, может использовать связанные стили, глобальные стили, внутренние стили. Связанные стили (связанные таблицы стилей) позволяют «отделить» код от внешнего вида — все параметры форматирования для тегов помещаются в отдельный файл css. Вам просто нужно подключить этот файл в нужное место на веб-странице. Один файл css можно использовать для множества различных веб-страниц.
Глобальные стили описаны в теге <style>, который находится в <head> веб-страницы. Описанные стили применимы только к одной странице. Внутренние стили, в свою очередь, назначаются каждому конкретному тегу и применяются только к нему.
В современном веб-дизайне все чаще используется комбинированная верстка сайта, позволяющая значительно расширить возможности дизайна, создать более сложный и привлекательный сайт.
Дизайн должен соответствовать определенным стандартам, чтобы сайт правильно отображался в любом браузере, поддерживающем эти стандарты. Способность сайта корректно «работать» независимо от браузера называется кроссбраузерностью. Кроссбраузерный дизайн сайта — важное требование к качеству современных сайтов.
Наряду с концепцией кроссбраузерного дизайна всегда существует концепция его обоснованности. Действительность — это соответствие кода всем стандартам качества, установленным для языка разметки, используемого на сайте (HTML, XHTML, XML). Сегодня многие специалисты по дизайну сайтов руководствуются стандартами w3c.