Инструменты Web-дизайна

Выбор визуальных редакторов HTML-кода очень велик, однако самые распространенные - Microsoft FrontPage 98/2000/XP и Macromedia DreamWeaver 6.0 MMX. Второй из них более профессиональный и сложный. Microsoft FrontPage своим интерфейсом похож на Word, поэтому принципы работы с ним одинаковы. Точно так же набирается текст, вставляются картинки и элементы оформления, меняется цвет и шрифты, выполняется форматирование. Но также есть возможность вставления кнопок, выпадающих меню, бегущих строк и анимации.

Для создания графических объектов лучше всего подходят программу от Adobe (PhotoShop), для анимации пакеты программ от Xara и Ulead.

Текст. Текст можно вводить в той же самой программе, в которой будет происходить верстка страницы - Microsoft FrontPage. Но созданный текст можно перенести через буфер обмена из любого текстового редактора.

Также в Microsoft FrontPage существует возможность создания анимированного текста. Модификация HTML - язык DHTML - позволяет добавить различные эффекты к тексту: текст может “осыпаться” с верха окна, ползти змейкой, закручиваться и т.д. Так же можно задать одноцветный фон, который будет украшать страницы.

Графика. Кроме оформленного текста можно вставить картинки. Они бывают разного размера и выполняют различные функции, например в виде кнопок, с помощью которых можно переходить от одной к страницы к другой, элементы фона и др. Однако графика занимает очень много места, а скорость загрузки данных из сети на наших линиях не очень высокая, следовательно нужно следить за тем, чтобы загрузка страницы не была очень долгой. Для этого поможет следующий прием: чтобы создать фон для страницы достаточно маленькой картинки малого размера и объема, которая в процессе загрузки будет размножена броузером заполнив всю страницу.

В сети используются картинки только трех форматов - GIF, PNG и JPG(JPEG). Первые два формата идеальны для создания небольших оформительных элементов размером в несколько килобайт - кнопок, заголовков, “шапок”, третий для более крупных изображений (фотографий). Еще у GIF-а есть возможность содержать в себе несколько картинок которые сменяются по очереди, образуя анимированное изображение.

Еще одна тонкость - разрешение картинок. Для корректного отображения картинки на экране вполне достаточно разрешения в 70-80 dpi.

Помимо кнопок, меню и фона на странице могут быть баннеры. Это картинки с различной рекламой, часто анимированные. Среди анимации используется стандарт Flash, созданный корпорацией Macromedia. По своему устройству “флэш-файлы” похожи на “анимированный” GIF. Вот только реализованы они не на основе растровых изображений, а с использованием векторной графики. Самое главное, что flash-анифация занимает значительно меньше места чем обыкновенная графика.

Музыка. Есть возможность вставить для проигрывания MIDI, WAV-файлы которые будут проигрываться при просмотре страницы. Для них с помощью JAVA-апплетов можно сделать кнопки управления мелодией.

JAVA-апплеты. Язык программирования JAVA был специально создан специально для Интернет. С помощью него можно создать довольно эффектные элементы страницы - например выезжающее меню или анимированные кнопки.

CGI-скрипты. Формы. Другая дизайнерская полезность, созданная программистами. CGI-скрипты - это “мини-программы”, ссылки на которые можно вставить в тело самой страницы. Эти программы помогают автоматизировать многие сложные операции вводимыми посетителями, данными и т.д. С помощью них можно создать гостевую книгу, анкету, поисковик и другие вещи.

Счетчики. Одна из самых распространенных форм скриптов, которая служит для подсчета посетителей страницы.

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

Навигационная панель присутствует на экране постоянно, упрощая перемещение по сайту. При щелчке по любой кнопке-ссылке новая страница открывается во втором, большом окне.