Веб-дизайн — одно из наиболее разносторонних человеческих занятий. С одной стороны, правила языка разметки гипертекста — HTML — крайне просты, и за пару дней любой способен выучить их основы. С другой стороны, существует масса технических тонкостей, хитростей и подводных камней, достаточных для превращения хорошей работы в бесполезный набор текста. Одновременно стоит задача удобно и наглядно разместить данные на странице — а это уже доступно далеко не всем. Наконец, сайт должен быть просто красивым, то есть программист обязан стать и художником...

Создать простую веб-страничку можно и за пять минут — а совершенствоваться необходимо годы. Кроме того, опубликованная работа открыта для всех желающих — и, в отличие от других областей программирования, в этой почти нет «секретов цеха». В таких условиях важны инструменты для дизайна — их вы и найдете на нашем DVD.

Средства веб-дизайна

Среди некоторых дизайнеров распространено мнение: «настоящие» веб-дизайнеры работают в «Блокноте». Честно признаюсь — не понимаю, как умение создавать себе дополнительные трудности связано с профессионализмом! Верю, где-то есть поклонники завинчивания гвоздей отвертками, любительницы ездить на велосипеде в туфлях на шпильке и специалисты по поеданию супа китайскими палочками, но этот текст определенно не для них.

Так из чего же состоит арсенал веб-мастера? Во-первых, это редактор с подсветкой синтаксиса и удобным вводом тегов. Подобные редакторы бывают двух типов: графических (принцип WYSIWYG — what you see is what you get) и для прямого ввода кода HTML. С помощью первых можно быстро создать веб-страницу и легко ее изменить, вторые позволяют писать правильный и компактный код, не ограничены в средствах создания. Как правило, подобные программы способны самостоятельно запускать написанную страницу в браузере и загружать ее в сеть, автоматически создавать таблицы и другие стандартные структуры тегов.

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

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

Выбор редакции

HateML Pro Версия: 1.105 Лицензия: свободно распространяемая Сайт: www.migajek.com Язык: английский Прекрасный редактор для веб-программиста, поддерживающий HTML, CSS, JavaScript, PHP, VB Script, XML и даже SQL. Программа предлагает сделать работу с исходным кодом страницы или скрипта удобной и для этого предлагает целый арсенал разнообразных средств. Особенно хорош «Инспектор тегов», позволяющий легко менять и настраивать атрибуты тегов. Отлично реализована работа со стилями, позволяющая как создавать отдельные файлы с CSS, так и встраивать стили в страницу. В программу включено несколько вариантов внешнего вида, можно также лично подстраивать программу под свои нужды. Кроме того, есть ряд полезных мелочей: управление цветами, специальные символы, удаление избыточных знаков. К сожалению, дополнительные функции программы не всегда работают стабильно, но это не создает больших проблем. Интерфейс: 8 Гибкость: 9 Рейтинг ЛКИ: 90% NVU Версия: 1.0 Лицензия: свободно распространяемая      Сайт: nvu.mozilla-russia.org Язык: русский Отличная программа для создания веб-сайтов, позволяющая параллельно создавать страницу в графическом режиме и менять ее исходный код. Как и Firefox, эта программа выросла из проекта Mozilla, а затем получила самостоятельное развитие. В программе есть все элементы, необходимые для веб-дизайна: таблицы, формы и даже стили. Программа следит за правильностью оформления кода, одновременно оставляя свободу для творчества. В NVU интегрированы инструменты для проверки корректности страницы (требует соединения с сетью) и очистки страниц от избыточных символов. Кроме них есть множество разнообразных мелочей, упрощающих жизнь при написании веб-страниц. К сожалению, развитие программы остановилось, так что ожидать новых функций не приходится. Интерфейс: 9 Гибкость: 8 Рейтинг ЛКИ: 90%

Actual Drawing

Версия: 6.0

Лицензия: ознакомительная

Цена: $59

Сайт: www.pysoft.com

Язык: английский

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

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

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

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

Не последний вклад в популярность программы принадлежит системе справки, в которой пошагово описаны многие процедуры, необходимые при создании сайта. Стандартная справка дополнена небольшими «рецептами», которые описывают полезные мелочи.

Интерфейс: 8

Гибкость: 9

Рейтинг ЛКИ: 80%

Alleycode HTML Editor

Версия: 2.2.0

Лицензия: свободно распространяемая

Сайт: www.alleycode.com

Язык: английский

Alleycode HTML Editor — пример HTML-редактора, ставящего во главу угла исходный код страницы. Нам предлагают работать исключительно с html, а для автоматизации ввода тегов есть целый набор кнопок для автоматического ввода тегов. Разработчики учли необходимость работы не только с основными тегами, но и с формами, и с фреймами, и с таблицами. Поддерживается и PHP.

Отдельно стоит сказать о работе со стилями. В Alleycode HTML Editor в отличие от многих других средств есть мастера работы с CSS, заготовки для создания стилей: разработчики явно рассчитывают, что дизайнеры будут основывать свою работу именно на стилях.

К сожалению, бросается в глаза недостаток разнообразных полезных мелочей и возможности проверять код на простейшие ошибки.

Интерфейс: 7

Гибкость: 9

Рейтинг ЛКИ: 75%

Amaya

Версия: 9.55

Лицензия: свободно распространяемая

Сайт: www.w3.org/Amaya/

Язык: английский

Масштабная программа для графической разработки веб-страниц, уделяющая особое внимание соблюдению разнообразных стандартов. Дизайнерам пригодится большой набор разнообразных тегов и их атрибутов. Хорошо налажена работа со стилями и с XML. К сожалению, интерфейс программы не слишком удачен, не всегда продуманы мелочи, так важные при ежедневной работе с программой.

Интересно и второе предназначение программы: Amaya позволяет легко записывать математические выражения, а затем использовать их в других программах и выкладывать в сеть.

Интерфейс: 7

Гибкость: 7

Рейтинг ЛКИ: 70%

Arachnophilia

Версия: 5.3

Лицензия: свободно распространяемая

Сайт: www.arachnoid.com/arachnophilia

Язык: английский

Простой редактор без принципиальных отличий от многих других средств, характеризующийся стабильной и надежной работой, а также полным набором базовых функций: подсветки кода, удобным вводом цветов (по правой кнопке мыши), набором готовых тегов, мастером создания таблиц, автоматическим поиском и удобным вызовом разных браузеров. Кроме того, программа позволяет проверять HTML на корректность, а также автоматически структурировать код для его лучшего понимания.

К сожалению, последние версии программы пока уделяют мало внимания стилям, что не позволяет назвать «Арахнофилию» универсальной программой для веб-дизайнеров.

Интерфейс: 9

Гибкость: 7

Рейтинг ЛКИ: 75%

Matrix Y2K Website Studio 2005

Версия: 1.7.7

Лицензия: свободно распространяемая

Сайт: www.htmlbeauty.com

Язык: английский

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

Matrix Y2K будет полезна в первую очередь программистам на PHP и, судя по всему, для них предназначена. Если программа вам по душе, есть смысл зайти на сайт: в ближайшее время ожидается новая версия «студии».

Интерфейс: 7

Гибкость: 8

Рейтинг ЛКИ: 70%

MAX’s HTML Beauty++

Версия: 2.0.0.2004

Лицензия: свободно распространяемая

Сайт: www.htmlbeauty.com

Язык: английский

Разработка этой программы была заморожена еще в 2003 году, и именно это обуславливает важнейшие недостатки программы, например, недостаточную поддержку стилей. Тем не менее нельзя не отметить отличный интерфейс Beauty++: с виду она похожа на обычный редактор, но позволяет легко и наглядно изменять теги, добавлять атрибуты и в целом менять веб-страницу. Кроме того, программа помогает проверить правильность написания кода.

Интерфейс: 9

Гибкость: 5

Рейтинг ЛКИ: 70%

Enersoft SiteGenWiz Platinum

Версия: 1.6

Лицензия: свободно распространяемая

Сайт: www.enersoft.ch

Язык: английский

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

SiteGenWiz нельзя рассматривать как универсальный инструмент создания сайтов, а для начинающих пользователей он может быть даже вреден: если пользоваться исключительно им, то творческое начало может попросту исчезнуть. Тем не менее опытный веб-дизайнер сможет значительно упростить свою работу, а дополнительные настройки помогут создать неповторимый сайт.

Интерфейс: 8

Гибкость: 5

Рейтинг ЛКИ: 80%

Virtual Mechanics Site Spinner

Версия: 2.7

Лицензия: ознакомительная

Цена: $49

Сайт: www.virtualmechanics.com

Язык: английский

Программа для создания веб-страниц в визуальном режиме, позволяющая уделять особое внимание графическим объектам. Site Spinner — средство, предназначенное для людей, которые слабо знакомы с веб-дизайном, однако способны хорошо рисовать и готовы создать сложный сайт.

На диске — 15-дневная ознакомительная версия.

Интерфейс: 7

Гибкость: 9

Рейтинг ЛКИ: 70%

Web Design Toy

Версия: 1.6

Лицензия: свободно распространяемая

Сайт: acme-web-design.info

Язык: английский

Цель этой программы — помочь людям, которые только изучают HTML: программа позволяет вводить фрагменты HTML-кода и сразу же просматривать результат.

Интерфейс: 7

Гибкость: 5

Рейтинг ЛКИ: 60%

EasyNeatly

Версия: 1.0

Лицензия: свободно распространяемая

Сайт: www.siarion.net

Функции этой программы крайне узки: она позволяет структурировать и очищать файлы стилей — CSS. Собственно, официальное название программы — «Аккуратные таблицы каскадных стилей CSS». У EasyNeatly нет даже графического интерфейса, ее приходится запускать либо при помощи контекстного меню explorer, либо из командной строки! Тем не менее программа выполняет полезную и редко встречающуюся функцию: она либо сжимает файл стилей для дальнейшего перемещения в сеть, либо структурирует его для удобного редактирования.

Интерфейс: 1

Гибкость: 1

Рейтинг ЛКИ: 80%

Total Validator

Версия: 4.1.0

Лицензия: shareware

Сайт: totalvalidator.com

Язык: английский

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

Интерфейс: 8

Гибкость: 6

Рейтинг ЛКИ: 85%

Absolute HTML Compressor

Версия: 1.14

Лицензия: свободно распространяемая

Сайт: www.siarion.net

Язык: английский

Цель программы проста — максимально сжать HTML страницы перед загрузкой в сеть. Лишние пробелы, другие ненужные символы, избыточная информация — все это программа стирает, сокращая размер кода на 5-20%. В программе реализованы простые, но нужные мелочи: создается запасная копия изменяемых страниц, возможно сжатие и отдельных файлов, и целых папок.

Интерфейс: 8

Гибкость: 5

Рейтинг ЛКИ: 80%

Просмотр веб-страниц

Firefox

Версия: 2.0.0.5

Лицензия: свободно распространяемая

Сайт: mozilla.com

Язык: русский

Mozilla Firefox — ближайший преследователь Internet Explorer в списке веб-браузеров. Программа стала популярной благодаря многочисленным новациям, большому количеству дополнений, позволяющих менять браузер и добавлять в него необходимые для определенного пользователя функции.

Интерфейс: 8

Гибкость: 10

Рейтинг ЛКИ: 90%

Avant Browser

Версия: 11.5

Лицензия: свободно распространяемая

Сайт: www.avantbrowser.com

Язык: английский

Известный браузер, не получивший широкого распространения в странах СНГ, но достаточно популярный за океаном. 11 версия обладает широким набором функций: блокировкой рекламы, автоматическим заполнением форм, сохранением профиля в сети, чтением RSS и тому подобное. Широкий набор функций позволяет разработчикам браузера надеяться на рост популярности Avant Browser, так что для полноценного сайта необходим тест и в этой программе.

Интерфейс: 7

Гибкость: 8

Рейтинг ЛКИ: 80%

Netscape Navigator

Версия: 9.0 beta

Лицензия: свободно распространяемая

Сайт: netscape.com

Язык: английский

Живая легенда мира интернет-просмотрщиков, проигравшая когда-то «великую битву браузеров» Internet Explorer. Не так давно разработчики заявили о возвращении знаменитой программы, но прежней популярности добиться уже не удалось. Новая версия обладает стандартным набором функций, характерных для современных браузеров.

Разработчики планируют вернуть популярность программе благодаря новой социальной сети: по их задумке пользователи смогут советовать друг другу сайты прямо через браузер, и с помощью такого «народного голосования» можно будет определить лучший сайт в сети. Впрочем, эта идея — дело будущего.

Интерфейс: 7

Гибкость: 8

Рейтинг ЛКИ: 70%

Opera

Версия: 9.22

Лицензия: свободно распространяемая

Сайт: opera.com

Язык: русский

Популярный веб-браузер, долгое время бывший абсолютным лидером среди платных интернет-просмотрщиков. Конкуренция со стороны Mozilla превратила Opera в бесплатную программу, которая сразу же завоевала симпатии.

В отличие от Firefox, требующего установки многих дополнений, «Опера» уже в поставке включает множество разнообразных функций: почтовый клиент, torrent-клиент, загрузку графики по желанию, настройку внешнего вида, менеджер загрузок и многое другое.

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

Интерфейс: 9

Гибкость: 9

Рейтинг ЛКИ: 90%

Maxthon

Версия: 2.0.2

Лицензия: свободно распространяемая

Сайт: maxthon.com

Язык: английский

Популярная надстройка над Internet Explorer, добавляющая в этот браузер множество новых функций и улучшающая его интерфейс. Maxthon по функциональности практически не уступает Opera и Firefox: в нем есть вкладки, управление загрузкой графики, настройка внешнего вида, защита от потери данных при зависании, улучшенная работа с формами, группы ссылок и многое другое. Одновременно с этим сохраняются преимущества Internet Explorer: тесная интеграция с операционной системой и нетребовательность к ресурсам.

Интерфейс: 9

Гибкость: 7

Рейтинг ЛКИ: 90%