Модульная сетка представляет собой такой способ организации пространства, при котором существует и горизонтальное и вертикальное членение. Элементы, возникающие при таком делении, являются модулями. Размещение блоков, не поддающееся какой-либо закономерности, называют иерархической сеткой. В отличие от модульных сеток в других отраслях (полиграфии, печати итд) модульные сетки в вебе могут иметь динамичные размеры (ширина может растягиваться, высота - меняться).
Есть несколько неоспоримых плюсов в использовании модульной сетки при разработке дизайна сайта.
Во-первых, модульная сетка позволяет определенным образом ускорить процесс разработки, снизить временные затраты на поиск подходящего места в макете.
Во-вторых, блоки модульной сетки помогают сохранять пропорциональность и сбалансированность элементов макета.
В-третьих, разработанные модульные сетки могут стать основой при реализации следующих дизайн проектов сайта.
Модульные сетки могут быть реализованы как одно- , так и двух- и трехколонные. Одноколонный макет чаще всего используют для публикации большого текста. На такой странице можно встретить основные блоки – заголовок страницы, строка навигации, непосредственно текст, контактная информация (внизу страницы). Более широко распространена двухколонная модульная сетка, в которой один блок отводится под основной текст, а второй служит для целей навигации или др. важной информации.
Трехколонная сетка – такую часто можно встретить на главной странице сайта, где наглядно представлены все возможности ресурса. Внутри сайта также используется трехколонный макет, самая широкая из колонок заполнена текстом, а две другие используются для навигации, рекламы, ссылок и т.д.
Треколонные сетки также дают больше возможностей по организации странички, фрагменты можно объединять, разбивать и т.п. Модульная сетка в таком случае будет иметь более сложную структуру, адаптированную под цели сайта.
При создании модульной сетки могут использоваться и многоколонные макеты, что встречается гораздо реже. Ограниченные размеры окна браузера плюс удобное для пользователя структурирование и отображение информации обычно мотивирует разработчиков использовать трехколонный макет и меньше.
Решение о создании той или иной модульной сетки принимается исходя из того, какая информация будет расположена на странице (логотипы баннеры, система навигации, текстовые разделы).
Применение модульной сетки в дизайне веб сайта позволяет структурировать,упорядочивать информацию, достигать сбалансированности элементов странички, упрощает верстку.
Если вы уже пытались создавать HTML-страницы, то вам понадобиться:
· Adobe Photoshop
Мощное средство создания графики для Интернет и не только. Веб-дизайнера он интересует в особенности, т. к. оснащён развитыми средствами оптимизации графики, т. е. уменьшения размеров графических файлов без проигрыша в качестве или с мининальным проигрышем. Имейте в виду, что в Интернет используются два основных графических формата: GIF (для изображений с небольшим количеством цветов) и JPEG (для полноцветных фотографических изображений), с каждым из которых Photoshop справляется очень неплохо.
· Notepad
Без этого весёлого редактора тоже не обойтись: по крайней мере вы всегда будете знать, что код сохранён именно в том варианте, в котором вы его создавали.
· Apache Web-server
Этот сервер вы можете использовать для тестирования веб-страниц и скриптов, написанных на языке Perl, PHP и т.д.
Каждый выбирает свой инструмент для создания Web-страниц. Этоможетбыть MS FrontPage или Macromedia DreamWeaver или Allaire HomeSite. А кто-то пользуется простым текстовым редактором, например Блокнотом (Notepad).
· MS FrontPage
Основным недостатком MS FrontPage является то, что он генерирует очень большой HTML-код, поэтому страницы получаются большими, что сказывается на скорости загрузки. Более того, при создании Web-страниц в этом редакторе видишь одно, а в окне браузера - совсем другое. Странички получаются какими-то кривыми, поэтому для создания качественных Web-страниц рекомендуется использовать пакеты, которые будут рассмотрены ниже.
· Macromedia DreamWeaver.
Начнем мы с популярного Macromedia DreamWeaver. Компания Macromedia считается лидером по производсту программ для создания веб-сайтов, а также законодателем моды в этой области. Последния версия HTML-редактора этой компании - DreamWeaver 3, который относится к категории WYSIWYG-редакторов, и этот пакет имеет очень много достоинств: удобный интерфейс, настройка функций, поддержка больших проектов и ShockWave технологий, возможность закачки файлов через FTP, поддержка SSI и многое другое. Для работы в этой программе не нужно досконально знать HTML (в этом и заключается преимущество технологии WYSIWYG - что вижу, то и получаю).
Но DreamWeaver на несколько шагов опережает другие редакторы, использующие технологию WYSIWYG, в первую очередь тем, что генерирует очень чистый HTML-код. DreamWeaver позволяет вам избавиться от однотипной работы при создании страниц (например, верстка текста) при помощи использования опции "запись последовательности команд" вы записываете последовательность производимых вами команд, потом нажимаете, например, CTRL+P, и DreamWeaver воспроизводит все в той же последовательности.
· HomeSite 4
Следующий редактор - HomeSite 4 - для создания страниц вручную, т. е. для знатоков HTML. Вы получаете полный контроль над HTML-кодом, причем существует возможность оптимизировать свою страничку под один из трех популярных браузеров (MSIE, NN, Opera).
HomeSite содержит два основных режима: Edit и Design. Режим Design - это подобие WYSIWYG-редактора, выдающее HTML-код, причем, если вы загрузите чужой HTML-код, то HomeSite все перепишет по-своему. Режим Edit позволяет получить полный контроль над страничкой. Здесь вы можете настроить практически все, сможете прописать функции каждого тега (тогда ваша страничка в любом браузере будет смотреться одинаково).
Еще одна отличительная особенность HomeSite - это его «склейка» с Dreamweaver. HomeSite обладает кнопкой «Dreamweaver», а также входит в его стандартный пакет поставки. Впрочем, и DreamWeaver имеет возможность подключения HomeSite, как редактора для коректировки HTML-кода.
Поняв принцип построения Web-страницы, изучив возможности соединения в ней различных видов информации, мы можем смело сказать, что Web-страницы, с их потенциалом могут применятся для различных целей.
Web-страница – это лицо той фирмы, того учреждения, человека, который разместил ее в WWW. Именно поэтому сегодня Web-дизайну уделяется такое огромное внимание, ибо от него на прямую зависит популярность того или иного информационного ресурса Сети. Недаром сейчас профессия Web-дизайнера является одной из самых высокооплачиваемых.
Человек, создающий Web-страницу, соединяет свои знания и навыки со своим творческим потенциалом. Умение творить – вот что отличает настоящего Web-дизайнера. Для того чтобы создать Web-страницу, которая бы радовала глаз, нужно сочетать в себе качества художника и программиста.
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
1. Консорциум Всемирной паутины - Википедия / [Электрон. ресурс]. – 2010. – Режим доступа: http://ru.wikipedia.org/wiki/W3 – Дата доступа: 04.10.2010.
2. Теория компьютерной графики / [Электрон. ресурс]. – 2010. – Режим доступа: http://www.sgrafika.narod.ru/modul1/Teoriyagrafiki.htm – Дата доступа: 05.10.2010.
3. Web-интерфейс - Википедия / [Электрон. ресурс]. – 2010. – Режим доступаhttp://ru.wikipedia.org/wiki/Web-интерфейс – Дата доступа: 06.10.2010.
4. Владимир Дронов. ‑ Разработка интерактивных Web-сайтов, 2008.—512 с.
5. Максим Кузнецов, Игорь Симдянов: Самоучитель HTML, 2009.—460 с.
1) Что такое Web-страница?
Web-страница — документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью web-браузера.
2) Какие бывают страницы?
Статические и динамические
3) Какие бывают документы?
Статические и динамические
4) Какие основные виды дизайна страниц?
1-полосный дизайн, 2-полосный дизайн, 3-полосный дизайн
5) Каков стандартный размер баннеров, публикуемых под заголовком документа?
468x60 точек
6) Что такое модульная сетка?
Невидимые направляющие, по которым располагаются элементы страничек веб-сайта
7) Что из себя представляет модульная сетка?
Модульная сетка представляет собой такой способ организации пространства, при котором существует и горизонтальное и вертикальное членение.
8) Что такое иерархическая сетка?
Размещение блоков, не поддающееся какой-либо закономерности
9) Как могут быть реализованы модульные сетки?
Модульные сетки могут быть реализованы как одно- , так и двух- и трехколонные.
10) Какой наиболее распространенный табличный дизайн?
Наиболее распространенным во Всемирной паутине, пожалуй, является 2-полосный табличный дизайн.
Web-страница — документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью web-браузера.
Страницы делятся на статические и динамические по поведению документа в браузере.
Документы также делятся на статические и динамические по способу создания документа.