
- •Лабораторная работа №1 Создание html-документа.
- •Лабораторная работа №2 Создание html-документа.
- •Лабораторная работа №3 Создание html-документа. Вставка музыки и видео.
- •Лабораторная работа №4 Использование фреймов при создании Web-страниц.
- •Лабораторная работа №5 Дизайн web-сайта.
- •Цветовые схемы
- •Модульные сетки в веб-дизайне
- •«Дополнительная цветовая схема и логотип» Лабораторная работа №6 Создание html-документа. Формы.
- •Лабораторная работа №7 Размещение страницы в Интернете.
- •Лабораторная работа №8 Основы работы с JavaScript.
- •Лабораторная работа №9 Управление объектами формы и создание скриптов
- •Лабораторная работа №10 Использование JavaScript совместно с фреймами.
- •Лабораторная работа №11 Окна и динамически создаваемые документы
- •Лабораторная работа №12 Объекты, методы и события в концепции языка JavaScript
- •Лабораторная работа №13 Скрипты для проверки информации
Модульные сетки в веб-дизайне
Невидимые направляющие, по которым располагаются элементы страничек веб-сайта, составляют модульную сетку. Откинув контент, фото, кнопки, мы можем представить на их месте набор прямоугольных блоков, выстроенных в определенном порядке. Использование модульной сетки в веб-дизайне облегчает процесс размещения содержимого, структурирует отдельные блоки страницы. Внимательно посмотрев на любую страницу веб-ресурса, можно заметить, что каждый блок отделен от другого достаточным количеством пустого пространства, с помощью специального разделителя или рамки, а некоторые блоки выделены цветом.
Модульная сетка представляет собой такой способ организации пространства, при котором существует и горизонтальное и вертикальное членение. Элементы, возникающие при таком делении, являются модулями. Размещение блоков, не поддающееся какой-либо закономерности, называют иерархической сеткой. В отличие от модульных сеток в других отраслях (полиграфии, печати и т.д.) модульные сетки в вебе могут иметь динамичные размеры (ширина может растягиваться, высота - меняться).
Есть несколько неоспоримых плюсов в использовании модульной сетки при разработке дизайна сайта.
Во-первых, модульная сетка позволяет определенным образом ускорить процесс разработки, снизить временные затраты на поиск подходящего места в макете.
Во-вторых, блоки модульной сетки помогают сохранять пропорциональность и сбалансированность элементов макета.
В-третьих, разработанные модульные сетки могут стать основой при реализации следующих дизайн проектов сайта.
Модульные сетки могут быть реализованы как одно- , так и двух- и трехколонные. Одноколонный макет чаще всего используют для публикации большого текста. На такой странице можно встретить основные блоки – заголовок страницы, строка навигации, непосредственно текст, контактная информация (внизу страницы). Более широко распространена двухколонная модульная сетка, в которой один блок отводится под основной текст, а второй служит для целей навигации или др. важной информации.
Трехколонная сетка – такую часто можно встретить на главной странице сайта, где наглядно представлены все возможности ресурса. Внутри сайта также используется трехколонный макет, самая широкая из колонок заполнена текстом, а две другие используются для навигации, рекламы, ссылок и т.д. Трехколонные сетки также дают больше возможностей по организации странички, фрагменты можно объединять, разбивать и т.п. Модульная сетка в таком случае будет иметь более сложную структуру, адаптированную под цели сайта.
При создании модульной сетки могут использоваться и многоколонные макеты, что встречается гораздо реже. Ограниченные размеры окна браузера плюс удобное для пользователя структурирование и отображение информации обычно мотивирует разработчиков использовать трехколонный макет и меньше.
Решение о создании той или иной модульной сетки принимается исходя из того, какая информация будет расположена на странице (логотипы баннеры, система навигации, текстовые разделы).
Применение модульной сетки в дизайне веб сайта позволяет структурировать, упорядочивать информацию, достигать сбалансированности элементов странички, упрощает верстку.