- базовый инструментарий Для того, чтобы разработчик чувствовал себя максимально комфортно при разработке...
- Текстовые HTML-редакторы
- Визуальные HTML-редакторы
- Создание простой страницы
базовый инструментарий
Для того, чтобы разработчик чувствовал себя максимально комфортно при разработке нового проекта, кроме рабочего места и персонального компьютера ему необходимо иметь определенный набор программного обеспечения, базовый инструментарий, без которого разработчику сайта просто не обойтись. Разработчику начинающему трудно сориентироваться во всем многообразии наименований существующих программ, а также в списке минимально необходимых для работы приложений.
Ниже предложено минимальный перечень средств, которые должны иметь разработчики в своем распоряжении перед тем, как браться за разработку Интернет проекта. Данные программы рассчитаны на использование под управлением операционной системы Windows.
Для полноценной работы веб-дизайнеру необходимо:
- HTML-редактор, рекомендуется Adobe DreamWeaver.
- Графические редакторы:
- Редактор растровой графики и GIF-анимации, рекомендуется Adobe Photoshop.
- Редактор для создания анимированной графики, рекомендуется программа Adobe Flash.
Эти редакторы разработаны профессиональными компаниями и за их использование разработчик должен заплатить немалую цену. Но, популярной альтернативой бесплатные редакторы, которые, возможно, и имеют меньшую функциональность, но вполне пригодными для работы над веб проектом.
Десктопные HTML редакторы
Программы для создания сайтов есть двух категорий - текстовые и визуальные HTML-редакторы.
Текстовые HTML-редакторы
Создание сайта в текстовых редакторах целесообразно, если разработчик знаком с языком HTML и владеет ею на должном уровне. Есть достаточно большое количество текстовых HTML-редакторов, используемых разработчиками разного уровня профессионализма, впрочем, написать код можно и в обычном блокноте, который есть на каждом компьютере.
К положительным особенностям текстовых редакторов нужно отнести то, что разработчик самостоятельно пишет код всех страниц будущего сайта. Конечно, во многих текстовых редакторах есть и подсветка синтаксиса, и вставление стандартных фрагментов кода, и много других полезных функций, но редактор не добавит ни строчки без ведома разработчика, в отличие от визуальных редакторов. Поэтому, код сайта будет понятным и лишен избыточности. Разработчик точно будет знать назначение того или иного фрагмента html-кода и при необходимости может легко внести изменения.
Недостатки в текстовых html-редакторов:
- Отсутствие возможности видеть результат непосредственно при написании кода страницы. Тогда, нужно открывать браузер и уже в нем смотреть, как выглядит сайт на данном этапе.
- Обязательное знание языка HTML. Без предварительного изучения HTML работать будет в рай сложно. Поэтому, нужно приобрести учебник языка HTML и только после его прочтения приступать к созданию сайта в текстовом редакторе.
Визуальные HTML-редакторы
Для разработчика начинающего самым лучшим вариантом будет применение визуальных HTML-редакторов . Они лояльно относятся к незнанию языка HTML и способствуют ее изучению, облегчают процесс создания сайта и предоставляют возможность мгновенного просмотра результата действий.
Признанным лидером среди визуальных HTML-редакторов является Adobe Dreamweaver, благодаря дружественному интерфейсу, генерации минимально избыточного кода, автоматической генерации скриптов и многих удобств. Впрочем, в какой программе создавать сайт, решает разработчик можно воспользоваться бесплатными оффлайн и онлайн программами.
Adobe Dreamweaver - мощное программное обеспечение для веб-дизайна и создания визуальных проектов. Программа Adobe Dreamweaver помогает разрабатывать реалистичную среду для интерактивного просмотра, управлять проектами на уровне пикселов или с помощью специально созданного кода. Встроенные подсказки в Adobe Dreamweaver позволяют более точно создавать код в HTML, JavaScript, Ajax, Spry, jQuery и Prototype.
Adobe Dreamweaver предлагает «резиновые» макеты и панель «многоэкранной просмотр» в целях одновременного создания проектов для телефонов, планшетных устройств и компьютеров. Dreamweaver полностью поддерживает HTML5, а это дает новые возможности в использовании онлайн-видео, анимации, что, в свою очередь, придаст уникальность любому сайту. В программу присоединен jQuery, следовательно пользователь с легкостью может использовать Java-скрипты при создании веб-страницы.
Для начинающих Dreamweaver - просто находка! При создании первых сайтов он способен значительно облегчить обучение. Есть сервис подсказок и приличное количество шаблонов, элементов оформления, скриптов - с помощью всего этого легко, как говорится, «набить руку». Очень простые страницы не заберут у пользователя много времени и сил.
Опытные веб-разработчики, используя Dreamweaver, имеют гораздо больше возможностей. Расширенная поддержка jQuery Mobile и Adobe PhoneGap позволяет разрабатывать страницы под различные операционные системы (iOS и Android) и приложения. Есть уникальная панель «многоэкранного просмотра», с помощью которой возможно оптимизировать сайт под различные устройства, независимо от размеров их экранов (до мобильных телефонов) и при этом сайт будет выглядеть так, как нужно.
Dreamweaver поддерживает известные движки, такие как WordPress и Joomla. Изменения можно вносить непосредственно в код сайта, улучшает оптимизацию.
Создание простой страницы
Секрет быстрого обучения состоит в том, что нет необходимости изучать все HTML. Чтобы создать достаточно функциональный сайт, не нужно знать все HTML - там много нюансов, которые осложняют жизнь и их можно опустить. Если знать хотя бы 20% из всего HTML, то можно использовать его, как используют 80% разработчиков сайтов. Остальные 20% можно оставить программистам и профессионалам.
Большинство книг по созданию сайтов своими руками с громкими названиями и объемными томами, где расписано весь курс HTML, больше годятся на роль справочников, а не учебники. В данной работе мы не будем учить весь курс, ограничимся лишь той небольшой частью, которая позволит самостоятельно создавать сайты, которые будут работать. Остальные знаний приобретаются при создании следующих, более сложных проектов.
порядок работы
- Ознакомиться с приведенными редакторами. Выбрать и установить соответствующий HTML-редактор.
- Согласно приведенным видеоуроков создать страницу.
- Разместить тестовую страницу на хостинге. Результат выполнения демонстрировать в Интернете.
содержание отчета
- Название и цель выполнения лабораторной работы.
- Фото последовательности работы с кратким описанием каждого из этапов.
- Отметить Интернет-адрес и зачем созданной тестовой страницы.
- В заключении оценить удобство и возможности редакторов.