Оглавление ВВЕДЕНИЕ .......................................................................................................................... 3 Глава 1. Понятие всемирной паутины (WWW) и Web-дизайна ..................................... 5 Глава 2. Виды компьютерной графики ............................................................................. 9 Глава 3. Программы для создания Web – дизайна ......................................................... 12 Заключение......................................................................................................................... 22 Список использованной литературы и источников ....................................................... 24 2 ВВЕДЕНИЕ Задумывались ли вы когда-нибудь, сколько времени мы проводим в сети Интернет? В зависимости от интереса люди проводят часы, листая страницы глобальной паутины. Чем же нас так привлекает Интернет? Прежде всего, это возможность общения, обучения, покупок, путешествий и много другого, не выходя из дома, работы или учёбы. Обратить свое внимание к той или иной информации нам помогает графическое оформление сайта с целью привлечения аудитории. Иными словами, важное место в развитии глобальной сети имеет веб-дизайн. Из истории нам известно, что первый в мире сайт info.cern.ch появился в 1990 году, далее сайты развивались, и появилась необходимость оформления сайтов, с целью приятного визуального восприятия его пользователем. Вследствие стремительного роста сети WWW (World Wide Web - Всемирная паутина) появилась новая область информационных технологий - web-дизайн, один из перспективных видов деятельности, дающий новые возможности для воплощения творческих идей художников, дизайнеров и специалистов в области информационных технологий. В результате обучение web-дизайну является в настоящее время важнейшим компонентом образования. Под термином web-дизайн понимают именно проектирование структуры webресурса, обеспечение удобства пользования ресурсом для пользователей. Немаловажной частью проектирования ресурса в последнее время стало приведение ресурса в соответствие стандартам, что обеспечивает доступность содержания для людей с ограниченными физическими возможностями и пользователей портативных устройств, а также кроссплатформенность вёрстки ресурса. Также непосредственно с дизайном сайтов смежны маркетинг в Интернете (интернет-маркетинг), то есть, продвижение и реклама созданного ресурса, поисковая оптимизация. Таким образом, визуальными средствами решаются самые разнообразные задачи, такие как, повышение продаж, укрепление доверия, создание определённого имиджа и другие. 3 Web-дизайнеры проектируют логическую структуру web-страниц, продумывают наиболее удобные решения подачи информации, а также занимаются художественным оформлением webпроекта. В результате пересечения двух отраслей человеческой деятельности грамотный web-дизайнер должен быть знаком с последними web-технологиями и обладать соответствующими художественными качествами1. Объектом исследования является современный web-дизайн и новейшие программы. Предмет исследования представляет собой особенности компьютерную графику в редактировании Интернет сайтов. Цель исследования - изучения всемирной паутины Для достижения поставленной цели необходимо выделить следующие задачи исследования: 1. Произвести теоретический анализ современных интернет технологий; 2. Рассмотреть WWW (Всемирную паутину); 3. Проанализировать программы по созданию веб - дизайна. Методы исследования: - теоретический анализ литературы по проблеме исследования; - системный (комплексный) анализ проблемы; - наблюдение. Практическая значимость исследования. Материалы данной работы могут быть исследованы в практической деятельности специалистов в области прикладной информатики. 1 См.: Немцова Т. И., Назарова Ю. В.Компьютерная графика и web-дизайн. С 324-326 4 Глава 1. Понятие всемирной паутины (WWW) и Web-дизайна Всемирная паутина (англ. World Wide Web) - распределённая система, предоставляющая доступ к связанным между собой документам, расположенным на различных компьютерах, подключенных к Интернету. Для обозначения Всемирной паутины также используют слово веб (англ. web «паутина») и аббревиатуру WWW. Всемирную паутину образуют миллионы веб-серверов сети Интернет, расположенных по всему миру. Веб-сервер является программой, запускаемой на подключённом к сети компьютере и использующей протокол HTTP для передачи данных. В простейшем виде такая программа получает по сети HTTP-запрос на определённый ресурс, находит соответствующий файл на локальном жёстком диске и отправляет его по сети запросившему компьютеру. Более сложные веб-серверы способны в ответ на HTTP-запрос динамически генерировать документы с помощью шаблонов и сценариев. Для загрузки и просмотра веб-страниц используются специальные программы - браузеры. Веб-дизайн (от англ. Web design) - отрасль веб-разработки и разновидность дизайна, в задачи которой входит проектирование пользовательских вебинтерфейсов для сайтов или веб-приложений. Веб-дизайнеры проектируют логическую структуру веб-страниц, продумывают наиболее удобные решения подачи информации, а также занимаются художественным оформлением вебпроекта. В результате пересечения двух отраслей человеческой деятельности грамотный веб-дизайнер должен быть знаком с последними веб-технологиями и обладать соответствующими художественными качествами. Большую часть специалистов, работающих в области дизайна, обычно концентрирует в себе такое творческое образование как студия дизайна. Подобная трактовка отделяет веб-дизайн от веб-программирования, подчеркивает специфику предметной деятельности веб-дизайнера, позиционирует веб-дизайн как вид графического дизайна. Поиск в интернете слова web-design (webdesign, web design) дает нам ссылки на инструкции и книги по руководствам к различным программам. Та же картина 5 наблюдается в разделах "Web Design" таких сайтов-монстров, как WebDeveloper и C-Net Builder.com. Путаница связана с тем, что в русском языке слово "дизайн" приобрело другой смыл, нежели оно имеет в английском. В строгом смысле слова дизайн (design) - это разработка, конструирование. Сочетание "machine design" переводится как "конструирование станков", а не как их эстетическое внешнее оформление. Web-дизайнер в зарубежном понимании - это не кто иной как webразработчик - верстальщик (web-master/web-coder), специалист по информационной архитектуре (web-developer), программист (web-programmer), администратор (system administrator) в одном лице. В русском языке дизайн ближе к эстетике, изобразительному или оформительскому искусству - в таком понимании webдизайнер это в первую очередь художник. То есть, то, что в английском языке соответствует слову web-artist, web graphical designer. Из-за этого зарубежная литература по web-дизайну - это в большей части техническая информация о том, как верстать таблицы, как создавать навигацию, как оптимизировать изображения. Из-за этого отечественные книги по web-дизайну (в том числе единственная на этот день книга, посвященная главным образом визуальному дизайну - это книга Дмитрия Кирсанова “Веб-дизайн”) во многом рассказывают о визуальном дизайне. Сравнение содержания книг Дмитрия Кирсанова и Якоба Нильсена, посвященных Web-дизайну показывает, что каждый из авторов пишет в своих книгах совершенно о разных вещах (о сочетаемости цветов, о балансе композиции, контрасте, использовании шрифтов, создании коллажей, придумывании метафор и прочее)2. Поэтому, если, скажем, проводится конкурс на лучший дизайн сайта, или идет обсуждения дизайна сайта, то оцениваться должна не навороченность графики и оригинальность рюшечек и менюшек, а то, насколько дизайнеру удалось создать удобный, работающий сайт. В настоящее время услуги веб-дизайна предоставляют как специальные компании, так и частные лица (веб-дизайнеры или веб-мастера, являющиеся фрилансерами). 2 См.: Кирсанов Д. Веб-дизайн: книга Дмитрия Кирсанова С. 116-118. 6 Фактически, собственно графика, внешний вид и оформление сайта не являются главным моментом и отправной точкой в проектировании Интернетстраницы. Веб-дизайн сегодня превратился в самостоятельное явление просто потому, что для занятия дизайном в Интернет недостаточно одного знания программ, предназначенных для работы с графикой и художественных способностей. Конечно, собственно программированием, особенно решением сложных задач, занимаются профессиональные программисты. Но и работа дизайнера невозможна без чёткого представления технологий Интернет. Дизайнер должен чётко представлять, какими путями можно решить поставленную задачу или воплотить в действующую модель свои идеи, что влечёт за собой необходимость разбираться и в языках программирования, и в некоторых тонкостях серверных технологий. Он должен представлять себе, каким образом осуществляется передача данных в сети, как и в каком виде его разработки достигнут своего конечного пользователя - посетителя разрабатываемого сайта. В конечном итоге, простая с первого взгляда задача «рисования» обрастает огромным количеством дополнительных требований, в основном - технического характера, имеющими с художественной стороной мало общего. В итоге можно сказать, что веб-дизайн - это именно и есть создание сайта. Сочетание художественных способностей и широких знаний современных компьютерных технологий позволяют создавать сайты, которые запоминаются и заставляют посетителя возвращаться на них вновь. Целью большинства веб- дизайнеров является создание привлекательных, легкодоступных и функциональных сайтов, которые могут воздействовать на посетителя с целью выполнения какого-то действия. Подобный веб-проект требует хорошего графического дизайна сайта, простой и интуитивно понятной навигации по сайту, логически выверенную структуру сайта и надежное копирование. Хороший веб-дизайн сайта должен представлять собой, сочетание здравого смысла и хорошего планирования. Сайт должен быть привлекательным и простым в 7 использовании, и самое главное предоставлять пользователю информацию или услуги, которые его интересуют. Однако не стоит забывать, что чрезвычайное увлечение только визуальным дизайном может привести к плачевным результатам - делая сайт уже не для себя, а на заказ, web-художник (называющий себя web-дизайнером) может настолько сильно увлечься эстетическими наворотами, что совершенно забудет о другой стороне web-дизайна - навигации, аккуратности ссылок, совместимости с разными броузерами, легкости кода и изображений, удобстве администрирования сайта и еще о сотне всяческих мелочей. С приходом Flash увеличился шанс появления на свет плохих сайтов. Вместо того, чтобы думать об удобстве пользователя - webхудожник думает о том, чтобы такое сотворить с использованием анимации или со шрифтами, кнопочками и чтобы все летало и свистело и приводило пользователя в состояние транса. Получится так, что с эстетической точки зрения все будет прекрасно, но с практической - с сайтом просто невозможно будет работать. Эта грань - между красивостью и удобством - очень тонка. Это давний спор между эстетами и прагматиками. Между разработчиками web-узлов в эти дни идет настоящая необъявленная война. Война идет не между коммерческими и экспериментаторскими сайтами. Идет война между специалистами по удобству интерфейсов (usability experts) и дизайнерами-графиками (graphics designers). Одни считают, что современный Web это улучшенный, но плохо используемый интерфейс к базам данных. Другие - Web это еще неразвившаяся, но уже плохо используемая платформа для мультимедиа. И каждая из сторон просто убеждена, что их точка зрения в конце концов восторжествует. 8 Глава 2. Виды компьютерной графики Обычно компьютерную графику разделяют на растровую и векторную. Отдельно стоят фрактальный тип представления изображений трехмерная графика. Растровое изображение - это прямоугольная (растровая) сетка пикселей на компьютерном мониторе, бумаге и других отображающих устройствах и материалах. При использовании растровой графики важным элементом является размер полотна, тип цветопередачи (например, RGB) и количество используемых цветов. Pixel(пиксель) - это мельчайшая единица цифрового изображения в растровой графике. Он представляет собой неделимый объект прямоугольной (обычно квадратной) формы, обладающий определенным цветом. Любое растровое компьютерное изображение состоит из пикселов, расположенных по строкам и столбцам. При увеличении изображения видны ряды пикселов. Максимальная детализация растрового изображения задается при его создании и не может быть увеличена. Если увеличивается масштаб изображения, пикселы превращаются в крупные зерна. От количества пикселов зависит детальность изображения: Пикселы, сливаясь на расстоянии, создают ощущение цветовых переходов. Достоинства растровой графики: 1. Можно воспроизвести любой рисунок - и условный, схематичный, и фотографического качества; 2. Растровая графика используется сейчас практически везде - от маленьких иконок до плакатов. Недостатки растровой графики: 1. Большой размер, занимаемый файлами; 2. Потеря качества изображения при операциях трансформирования. Векторное изображение представляет собой набор объектов - линий или примитивных геометрических фигур (окружности, прямоугольники). Этим объектам присваиваются атрибуты - толщина линий и цвет заполнения. Векторный рисунок хранится в файле как набор координат, векторов и других чисел, характеризующих объекты рисунка. Все современные компьютерные видеодисплеи способны 9 отображать информацию только в растровом формате. Для отображения векторного формата на растровом используются преобразователи, программные или аппаратные, встроенные в видеокарту. Также существует узкий класс устройств, ориентированных исключительно на отображение векторах данных. К ним относятся графопостроители, а также некоторые типы лазерных проекторов. Векторные изображения используются при компьютерном черчении, создании технической иллюстрации, деловой графики, шрифтов, векторной анимации. Достоинства векторной графики: 1. Небольшой размер файла; 2. Нет потери качества при операциях трансформирования объектов; 3. Векторные изображения на растровых устройствах выводятся с максимальным качеством, доступным на этом устройстве. Недостатки векторной графики: 1. Не каждый объект может быть изображен в векторном виде, например фотографии; 2. Чем больше число объектов, тем больше памяти и времени требуется на отображение и обработку векторного рисунка. Трехмерная графика (3D) представляет собой раздел компьютерной графики, предназначенный для отображения объемных объектов. По сути, трехмерное изображение является геометрической проекцией объемной модели на плоскость. Для его получения сначала происходит моделирование - создание математической 3D-модели сцены и объектов в ней, а затем визуализация (рендеринг) - построение проекции на основе выбранной физической модели. Одним из основных призваний трехмерной графики является создание движения 3D-модели в пространстве, называемое анимацией, которая в наше время является неотъемлемой частью не только для современных компьютерных игр, но и телевидения, кинематографа, а так же научного и промышленного моделирования. Так же трехмерная графика широко применяется в архитектурной визуализации и печатной продукции. 10 Самыми популярными программами, используемыми для создания 3D графики и анимации, являются пакеты компании Autodesk: 3DS Max (собственный формат MAX) и Maya (собственный формат MA). Стоит отметить и универсальное комплексное приложение MaxonCinema 4D (собственный формат C4D) с более простым интерфейсом, чем у продуктов Autodesk и поддержкой русского языка, что делает его особенно привлекательным для русскоязычной аудитории. Процесс трехмерного моделирования, визуализации и анимации является очень ресурсоемкой задачей, так что если вы решите попробовать свои силы на этом поприще, придется раскошелиться на высокопроизводительный компьютер. Более того, и само программное обеспечение стоит очень недешево. Фрактальная график. Фрактал - объект, отдельные элементы которого наследуют свойства родительских структур. Поскольку более детальное описание элементов меньшего масштаба происходит по простому алгоритму, описать такой объект можно всего лишь несколькими математическими уравнениями. Фракталы позволяют описывать целые классы изображений, для детального описания которых требуется относительно мало памяти. С другой стороны, фракталы слабо применимы к изображениям вне этих классов нетерпеливы, исследования показывают, что большинство пользователей уйдут по следующей ссылке, если загрузка страница по времени занимает, более чем на 10 секунд. Всегда оптимизируйте ваши фотографии, а также другие графические файлы, чтобы они имели как можно меньший размер, насколько это возможно без ущерба для качества отображения и общего вида сайта. 11 Глава 3. Программы для создания Web – дизайна Веб-редактор (web-редактор) программа, - использующаяся для редактирования HTML документов. С развитием компьютерных языков программирования в качественном и количественном смысле, стала возникать необходимость систематизации визуальных данных кода на устройствах вывода информации, для повышения производительности и эффективности труда разработчиков. История развития средств разработки программ, насчитывает не один десяток лет. Человечество прошло путь от представления информации на бумажных носителях и перфорационных лентах, до представления с помощью современных средств разработчиков, представляющих на мониторе код и графическое представления работы кода, с возможностью манипуляции им. Современные редакторы программного кода, позаимствовали свой функционал у визуальных текстовых редакторов, а так же у специализированных средств текстовой разработки, прилагаемых к различным компиляторам. От текстовых редакторов и офисных пакетов современные средства разработки страниц интернет, впитали всё самое лучшее в области представления текстовой и графической информации на экране компьютера. От специализированных редакторов, прилагаемых к компиляторам программ, как то на языке Pascal или C, редакторы кода страниц интернет впитали возможность подсветки синтаксиса и подстановки элементов кода. Позаимствовав черты обоих предков, редакторы Web страниц стали развиваться, вместе со своими родителями. Часть редакторов впитала в себя больше возможностей относительно графического отображения информации на экране и манипуляции с уже исполненным кодом. Другая же часть впитала в себя большое количество возможностей по подсветке синтаксиса, и подстановки программного кода на разных языках в виде сырого текста. В некоторых приложениях гармонично сочетаются функции обоих предшественников. 12 Текстовыми редакторами для Web разработки принято называть те программы, которые впитали в себя лучшие качества работы с кодом и подсветкой синтаксиса на различных языках. Для программирования приложений в интернет применяются специальные средства разработчиков, которые умеют работать с данными HTML, CSS, PHP, JavaScript. WYSIWYG (What You See Is What You Get) -вид программ, имеющий дело с представлениями результатов работы программного кода на экране в графическом виде, который применяется разработчиками интернет-приложений. Эти редакторы позволяют отображать результаты работы кода на экране в удобном для пользователей виде. Оба вида редакторов обладают своими преимуществами и недостатками. Текстовые редакторы хороши только в том случае, если вы с точностью знаете, как должен выглядеть код, или хотите научиться искусству программирования. Второй вид редакторов, хорош, только когда нужно внести быстрые изменения в уже имеющийся код, и для непрофессионалов. Оба вида этих программ гармонично дополняют функционал друг друга, и поступают в продажу, или в свободном доступе так же в комбинированном варианте. Текстовые редакторы. Первыми по праву заслуживают внимания текстовые редакторы для разработки Web приложений. Они предлагают более гибкие возможности и аккуратные результаты по сравнению с визуальными редакторами и появились несколько раньше, чем вторые, как инструмент Web разработчика. Notepad++ (Windows, Linux, Mac) Эта программа - одна из недооценённых программ с точки зрения отзывов о ней. ++ - это продукт созданный программистами для программистов. Функционал практически неограничен, но производители скромно заявляют лишь о части самых необходимых для общего числа пользователей функциях программы: 1. Подсветка и сегментация синтаксиса; 2. Пользовательские настройки подсветки и сегментации программного кода; 3. Совместимые с языком Perl регулярные выражения для поиска и замены кода; 13 4. Опциональный интерфейс программы: свёртывание, наличие вкладок с кнопкой закрыть, панель вкладок, вертикальные вкладки и вертикальный список документов; 5. Карта документов; 6. Автозаполнение и выпадающий список параметров функций; 7. Много опциальных возможностей выделения фрагментов кода; 8. Многооконный интерфейс с вкладками; 9. Функция открытия нескольких вкладок в одном окне одновременно; 10.WYSIWYG; 11.Приближение и удаление; 12.Многоязыковой интерфейс; 13.Закладки; 14.Запись и воспроизведение макросов; 15.Запуск программы с аргументами; 16.Поддержка проверки правописания на множестве языков с помощью Aspel; 17.Проверка html кода tidy; 18.Поиск и замена сразу в группе файлов. Это далеко не весь список функций, которые предлагает разработчикам notepad++. В то же время, в интернете, этот редактор позиционируется просто как замена стандартному блокноту, что в корне не верно. Несмотря на схожесть названий, это продукт совершенно иного уровня. PsPad (Windows) - приятно порадовала универсальность данного редактора. Он поддерживает множество языков, и проверку орфографии. Он может быть использован в качестве замены стандартному блокноту, с некоторыми дополнительными функциями. Есть версии для самых старинных версий windows, что говорит о том, что редактор существует уже давно и развивается вместе с пользователями. Что касается использования этого редактора для редактирования кода программ интернет, он оборудован примерто тем же арсеналом, что и Komodo, но отличается не столь удобным интерфейсом, на мой взгляд, от notepad++. 14 Выглядит довольно громоздко. Весь функционал, выведенный на различных панелях, вводит в ступор при первом ознакомлении с программой: 1. Программа работает с синтаксисом популярных языков программирования; 2. Программа имеет возможность автозаполнения; 3. В арсенале есть множество готовых шаблонов для множества различных языков; 4. Есть функции автозамены; 5. Есть запись макросов; 6. Окно проектов, закладок в интернете и встроенный FTP клиент; 7. Многооконный интерфейс с возможностью удобной группировки окон; 8. Пользовательская подсветка синтаксиса; 9. Проверка правописания с помощью встроенной программы и словарей с сайта. И множество других функций. Порадовало наличие множества шаблонов и многооконный интерфейс, правда, реализация несколько громоздка на мой взгляд. PHPeditor Простенький продукт, для работы с HTML и PHP. Главными достоинствами данной программы является: 1. Мощная функция поиска и замены сразу по нескольким файлам, которая работает очень быстро; 2. Программа имеет возможность подсветки синтаксиса HTML, PHP; 3. ·Есть инспектор кода HTML и PHP; 4. Включён встроенный сервер, для проверки серверных приложений; 5. Многовкладочный интерфейс; 6. Функции вставки; 7. Поддержка макросов; 8. Запись шаблонов кода с небольшим первоначальным набором. В сущности этого достаточно для решения простых задач вёрстки в больших объёмах. Особенно по душе придётся эта программа с её мощной функцией автозамены строителям статических сайтов. Практически, это CMS для такого рода 15 сайтов, которая, быстро позволит добавить и изменить код, сразу, на множестве страниц3. Vim (Windows, Mac, Linux) В сущности - это весьма удобная программа для консоли linux, которая просто незаменима у системных администраторов. Основам владения Vim учат на специальных курсах. Так что тема обсуждения этого редактора просто бесконечная. Это тема скорее разработки самого приложения для разработки, чем его функционала. Всего многообразия функционала Vim с применением плагинов не перечислить. Gedit (Windows, Mac, Linux) - более совершенный редактор, по сравнению с Vim, созданный специально для оконного менеджера Gnome в Linux, после перекочевавший на другие ОС. Из коробки присутствуют возможности для Web разработчиков: 1. Подсветка синтаксиса; 2. Браузер; 3. Красная строка. Дополнительные плагины, которые можно найти в интернете: 1. Закрытие тегов автоматически; 2. Инспектор кода HTML; 3. Генератор основного текста; 4. Регулярные выражения для поиска и автозамены; 5. Интеграция передачи кода в браузер. Для пользователей windows - несколько непривычное решение, но для любителей ОС linux, это привычный инструмент. Fraise (Mac) 3 См.: Яцюк О. Основы графического дизайна на базе компьютерных Технологий С. 235-236 16 Простой в использовании и не перегруженный функционалом редактор для Mac Fraise, содержит необходимые инструменты для простой разработки приложений для Web без дополнительных плагинов: 1. Подсветка синтаксиса; 2. Удобная работа с блоками; 3. Поиск и замена; 4. Блоки для быстрого ввода тегов HTML и CSS; 5. Встроенный браузер с функцией автоматического обновления при замене стилей; 6. Закрытие тэгов нажатием одной кнопки; 7. Инспектор HTML. Этот редактор создан специально для Mac и является хорошей заменой стандартному текстовому редактору. Он является приложением Smultron, по этой причине он работает только в поздних версиях ОС Mac, либо, при установленном Smultron. TextWrangler (Mac) Текстовый редактор TextWrangler, для Mac, наподобие gedit для linux. Функций в данном редакторе не много, но он отлично подходит для выполнения основных задач: 1. Подсветка CSS, JavaScript, HTML синтаксиса; 2. Поиск и замена по регулярным выражениям; 3. Удобная навигация в коде; 4. Встроенные функции работы по FTP; 5. AppleScript. Komodo Edit (Windows, Linux, Mac) Функционал этой программы позаимствован в параллельном коммерческом проекте и расширяется с помощью дополнительных плагинов, что делает его практически неограниченным. Но что нужно нам от идеального редактора для разработки приложений Web? Здесь есть всё необходимое для комфортной работы с любым программным кодом. Производители не предусмотрели возможность 17 просматривать код сразу в двух окнах. Это делает работу с кодом не столь комфортным Возможности Komodo Edit ограничиваются в свободной версии, достаточно скромным функционалом по сравнению с Komodo IDE, но что конкретного может предложить нам Komodo Edit: 1. Поддержка подсветки синтаксиса на большинстве языков программирования для интернета; 2. Автозаполнение и закрытие тегов; 3. Файловый менеджер и менеджер проектов; 4. FTP - клиент, работающий по разным протоколам; 5. Встроенный браузер для просмотра результатов работы; 6. Функции поиска и замены с регулярными выражениями; 7. Многооконный интерфейс с вкладками; 8. Проверка html кода tidy. Функционал этим далеко не ограничивается, так что он удовлетворяет любым нуждам. Хотя, сама программа может показаться слегка громоздкой для пользователей Linux. Дело в том, что встроенный браузер и клиент ftp - это не совсем то, что требуется от текстового редактора. Есть программы, которые справляются с этими задачами гораздо лучше интегрированных решений. Bluefish Editor (Windows, Linux) - возможно так же существует аналог для Mac. Пожалуй единственное решение для Linux в плане разработки, которое годится для решения любых задач. В целом функционал программы аналогичен, функциям Aptana Studio. Эта программа для профессионалов. Весь её функционал не перечислить. Поэтому настройка её требует определённых навыков. Главным недостатком этого редактора, является, на мой взгляд, медлительность и неповоротливость. Aptana Studie (Windows, Linux, Mac)- эта программа обеспечивает полный спектр сервисов для разработки в целом. Комплексная реализация, по мнению некоторых пользователей непрофессионалов и делает несколько эту программу медлительной. 18 отпугивающей Дополнительным для плюсом использования этого продукта является наличие встроенного Web сервера, который позволяет просматривать динамические страница, с кодом выполняющимся на стороне сервера. Это придётся по вкусу программистам на PHP и других подобных языках, выполняемых на сервере. Есть возможность управления интерфейсом, что значительно облегчает задачу поиска нужных элементов управления, т.к. неиспользуемые элементы можно спрятать. Позже доступ к ним будет иметься через меню. Macromedia Dreamweaver MXDreamweaver MX - полный функционал этой программы не известен, наверное, даже самим разработчикам. Недаром так много сказано об этом в книгах, которые вы можете найти на прилавках книжных магазинов об этой программе. Она работает практически с любыми данными мультимедиа. Microsoft Front Page Это удобная, простая в использовании, визуальная среда разработки. Не отличается чистотой кода на выходе. Но в то же время она позволяет работать с различными мультимедийными данными и не требует знания особых навыков, помимо знания Ms Word. Может загружать готовые страницы по ftp, На данный момент Front Page в пакетах Microsoft Office заменен на Microsoft Expression Web и Microsoft Office SharePoint Designer. Существует (1997 бесплатная версия FrontPage Express, которая делает достаточно чистый код, который, впрочем, уже не соответствует стандартам HTML. Но если вам на скорую руку надо сверстать сложную таблицу - это именно то, что вам надо. Дистрибутива у FrontPage Express нет, работает без установки. COFFECUP HTML Editor Достаточно неплохой визуальный редактор, снабжённый самыми простыми функциями работы с визуальной информацией. Помимо простенького визуального представления, Coffecup Html Editor способен работать с сырым кодом. В программе присутствует множество готовых блоков с html кодом, который можно использовать на своё усмотрение, а так же несколько шаблонов кода для 19 CSS, в которые можно подставлять свои параметры. Помимо этого достоинствами программы являются: 1. Шаблонов довольно много; 2. Из коробки присутствует менеджер проектов; 3. Можно работать с сайтами по ftp; 4. Полный функционал обычных текстовых редакторов для интернетразработки; 5. Возможность просмотра фрагментов кода параллельно с отображением результата работы данного отрезка/ В целом реализация неплохая, присутствует встроенный браузер. Что не понравилось в этой программе, Coffecup работает не очень стабильно. COFFECUP Visual Site Designer Аналогичное приложение только без возможностей редактирования кода. Чисто визуальный редактор, обладающий очень скромным функционалом, который не годиться для полноценного программирования. Nvu - тут не будет звучать лишних слов, по поводу особого функционала программы. Работает стабильнее и быстрее. Фрагментов кода в Nvu немножечко поменьше, поэтому каких-то особенных эффектов или CSS скриптов в нём не найдётся. Существует возможность редактирования файлов на ftp, что тоже весьма полезно при работе со статиками. Как визуальный редактор для создания Вебстраниц Nvu весьма ограничен. WYSIWYG WEB Builder- условно бесплатная программа, которая предоставляет пользователям весь спектр возможностей для построения сайтов, без знания специальных языков и кодов. Можно набросать готовый сайт в считанные минуты, просто кликая мышкой на понравившихся элементах и перетаскивая их на страницу сайта. Тем не менее в программе присутствуют так же инструменты для создания сложных форм, стилей и внедрения различных объектов из интернета и проекта сайта. В свет вышла программа для разработки сайтов по WYSIWYG технологии WYSIWYG WEB Builder 8.5.1 Программа поставляется в режиме shareware. В этой 20 версии, по сравнению с предыдущим релизом представлено 50 дополнений и 150 новых функций, заявленных производителем. Всего в этом релизе присутствует порядка 250 готовых решений, множество готовых шаблонов и даже собственная CMS, которая работает из сети. Для тестирования сайта же, не понадобиться ничего кроме самого редактора, всё необходимое встроено в этот продукт фирмы Pablo Software Solutions. Adobe Photoshop - многофункциональный графический редактор, разработанный и распространяемый фирмой AdobeSystem. В основном работает с растровыми изображениями, однако имеет некоторые векторные инструменты. Продукт является лидером рынка в области коммерческих средств редактирования растровых изображений, и наиболее известным продуктом фирмы Adobe. Часто эту программу называют просто Photoshop. В настоящее время Photoshop доступен на платформах MacиWindows. Здесь сразу можно найти два применения, в зависимости от того, какие именно сайты вы делаете: В случае сайта на движке Photoshop применяется в качестве инструмента, позволяющего создать то или иное графическое наполнение. В движковом сайте общая канва дизайна берется из готового шаблонного движка. В случае самописного сайта в Photoshop рисуется макет страниц сайта полностью. Далее HTML-верстальщик вырезает из макета нужные графические элементы и соответствующим кодом HTML реализует то, что нарисовал дизайнер. При создании макета сайта в Photoshop необходимо учитывать будет ли сайт "резиновым" или фиксированного размера. Кстати говоря, резиновость сайта - это далеко не сама цель и в огромном количестве случаев резиновый макет хуже фиксированного по размерам. Если макет резиновый, то необходимо понимать, где именно он будет тянуться. Важным фактором при подготовке макета является то, что сайт должен без горизонтальной прокрутки уместиться в разрешение монитора 1024*768 - это минимальное, на данный момент, разрешение 17-дюймового монитора. 21 Заключение Подводя итоги, можно сказать, что графический дизайн сайтов играет немаловажную роль в развитии информационных систем. В последнее время webдизайн приобретает всё большую популярность. Дизайн веб-страниц - это информационный дизайн. А не графический. Поэтому люди, которые являются просто дизайнерами (полиграфистами) и осваивают также смежную для себя область как веб-дизайн, могут создавать красивые, но бесполезные сайты. Веб-дизайн - это образ жизни, как и любая настоящая профессия. Веб-дизайнер "живет" в Интернете, для него это основное место обитание, где он проводит большую часть своего времени, - общается с друзьями, находит новых друзей, узнает новости внешнего мира... Веб-дизайн - это образ мысли... Способность видеть и делать красиво. Программисты, например, обладают противоположным стилем мышления - "программистским". Поэтому попытки сделать дизайн у них, как правило, заканчиваются неудачей. Однако для достижения необходимого результат существуют программы. Универсальные громоздкие программы для разработчиков работают слишком медленно и неповоротливо, в них множество ошибок. Поэтому, пользователи отдают предпочтение маленьким программам, которые хорошо выполняют свои функции. Ни одна программа не способна создать качественное новое приложение для интернета самостоятельно, без доработки. Идеальная вёрстка возможно только тогда, когда программист использует свои знания, а не доверяет программам. Профессиональные программисты, с помощью нехитрых средств доступных каждому, смогут создать полноценное интернет-приложение, без применения проприетарного программного обеспечения. Ускорить процесс наполнения сайтов статичного типа, информацией можно, используя простенькие визуальные редакторы, наподобие Nvu, имеющиеся в свободном доступе. 22 Для профессиональных дизайнеров подойдёт решение от Adobe в комплексе с другими программами этого производителя. 23 Список использованной литературы и источников 1. Берд Джейсон «Веб-дизайн: Руководство разработчика»/ Ред.; Питер, 2012 - 224 с. 2. Леонтьев В., «Новейший самоучитель. Компьютер + Интернет 2011»/ Ред.: ОлмаМедиаГрупп, 2011. 3. Томал Рафал «Основы Web-дизайна. Руководство» / Ред. Млсква, 2015 – 4. http://www.perfect-design.ru/stati17.html. 5. http://256.ru/pages/adobe_ps_color_modes1.php. 6. http://www.i2r.ru/static/255/out_17358.html. 211 с. 24
