|
1. Цель работы: освоение приемов создания web-страниц и web-сайтов c помощью редактора сайтов.
2. Оборудование, приборы, аппаратура, материалы: персональный компьютер, редактор сайтов DreamWeaver, интернет-браузер.
3. Краткие теоретические сведения.
DreamWeaver - профессиональный редактор HTML для визуального создания и управления сайтами различной сложности и страницами сети Internet. Нравится ли вам вручную писать код HTML или вы предпочитаете работать в визуальной среде, Dreamweaver облегчает эту работу и обеспечивает полезными инструментами и средствами, чтобы сделать свои собственные проекты непревзойденными.
DreamWeaver относится к категории WYSIWYG-редакторов (т.е.What You See Is What You Get), и этот пакет имеет очень много достоинств: удобный интерфейс, настройка функций, поддержка больших проектов и многое другое. Для работы в этой программе не нужно досконально знать HTML (в этом и заключается преимущество технологии WYSIWYG - что вижу, то и получаю).
Dreamweaver включает в себя много инструментов и средств для редактирования и создания профессионального сайта: HTML, CSS, JavaScript, редакторы кода (просмотр кода и инспектор кода), что позволяет вам, редактировать различные текстовые документы, которые поддерживаются в Dreamweaver. Также вы можете настроить Dreamweaver, чтобы он наводил порядок и переформатировал HTML, как вы этого хотите.
Возможность визуального редактирования в Dreamweaver также позволяет быстро создавать или менять дизайн проекта без написания кода. Dreamweaver относится к так называемым "визуальным" редакторам, т.е. вы сразу можете видеть на экране (хотя бы приблизительно) результат своей работы. При этом он предоставляет полный доступ к источнику кода и не вставляет в него ничего лишнего, как это делает, например, FrontPage.
Таким образом, можно создавать свою страничку и параллельно изучать HTML, заглядывая в источник. Можно на живом примере убедиться, что HTML - это просто. Простота обращения с редактором DreamWeaver заключается в том, что возможно рассмотреть все централизованные элементы и перетащить их с удобной панели непосредственно в документ.
Рабочая область Dream Weaver настраивается под различные стили работы и уровни знаний. Вот некоторые наиболее используемые компоненты:
- окно документа отображает текущий документ, который вы создаете и редактируете.
- навигатор панелей внизу окна Document содержит кнопки для открытия и закрытия наиболее часто используемых инспекторов и панелей. Можно установить, какие значки появляются в навигаторе панелей в настройке панелей
- панель инструментов (toolbar) содержит кнопки и всплывающие меню, которые позволяют просматривать окно Document различными способами, устанавливать опции вида, и обращаться к некоторым операциям, например, просмотр в браузере.
- контекстное меню позволяет быстро обращаться к полезным командам, имеющим отношение к текущему выбору или области. Чтобы отобразить контекстное меню, необходимо щелкнуть правой кнопкой мыши на элементе в окне.
- панель объектов содержит кнопки для создания и вставки различных типов объектов, изображений, таблиц, слоев, фреймов. Можно также переключать между стандартным различными видами представления документов.
- инспектор свойств отображает свойства для выбранного объекта или текста, и позволяет изменять эти свойства. (Некоторые свойства появляются в инспекторе, в зависимости от объекта или выбранного текста.)
DreamWeaver обеспечивает использование многих других инспекторов, панелей и окон.
При этом в DreamWeaver различают два вида окон: окно сайта и окно документа.
Окно сайта предназначено для работы с сайтом в целом. Оно вызывается клавишей F8 и позволяет переключаться между сайтами, создавать новые папки и файлы, публиковать сайт в cети и управлять им на сервере.
Окно документа предназначено для непосредственного редактирования страницы. Оно имеет три режима работы: код, код и дизайн, дизайн, причем второй - очень удобен для изучения HTML.
Основные объекты, которые можно вставить на собственную Web-страницу представлены на Панели объектов.
4. Задание
Задание 1. Создайте сайт с помощью конструктора сайтов на тему (по выбору студента):
- «Жизнь без сигарет»;
- «Подросток и алкоголь»;
- «Мой колледж»;
- «Мой город (деревня)»;
- «Моя будущая профессия».
Перед созданием сайта найти соответствующие вашей теме фотографии (скачать с Интернета, отсканировать или сфотографировать).
Первая страница должна содержать заголовок и графические миниатюры ваших изображений (их уменьшенные копии). Размеры графических файлов на должны превышать 100 Кбайт и иметь формат .jpeg. Каждая графическая миниатюра должна являться гиперссылкой на соответствующую страницу сайта (обязательно наличие всплывающих подсказок).
Требования к сайту:
- Сайт должен состоять не менее чем из 10 страниц;
- обязательно использовать текстуру (фоновый рисунок) на каждой странице;
- обязателен текст (минимум 7 абзацев из трех полных строк) на каждой странице;
- обязательны заголовки на всех страницах;
- обязательны заголовки окон;
- для заголовков и основного текста использовать различные шрифты.
Задание 2. Протестируйте работоспособность сайта в браузере (по возможность в двух различных). Протестируйте работоспособность сайта при выключенной графике.
Задание 3. Измените в настройках браузера шрифт по умолчанию на Courier New, размер 14 и убедиться, что это не повлияло на внешний вид страниц сайта.
Задание 4. Разместите созданный сайт на любом бесплатном хостинге. Проверьте работоспособность.
5. Содержание отчета
Отчет должен содержать:
- Название работы.
- Цель работы.
- Порядок создания сайта с помощью конструктора сайтов.
- Вывод по работе.
6. Контрольные вопросы
- Укажите назначение программы DreamWeaver.
- Что такое html?
- Виды окон в DreamWeaver.
- Для чего нужна Панель объектов в DreamWeaver?
- Укажите этапы создания web-сайта в DreamWeaver?
7. Литература
- Информатика и ИКТ: учебник для начального и среднего профессионального образования. Цветкова Н.С., Великович Л.С. – Академия, 2011 г.
- Информатика и ИКТ. Практикум для профессий и специальностей технического и социально-экономического профилей. Н. Е. Астафьева, С. А. Гаврилова, под ред. М.С. Цветковой, Академия, 2012г.
- Информатика и ИКТ. Базовый уровень: учебник для 10-11 кл. / И.Г.Семакин, Е.К.Хеннер. – 4 изд., испр. – М. – Бином. Лаборатория знаний, 2008г. – 246 с.: ил.
- Информатика и ИКТ. Базовый уровень: практикум для 10-11 кл. / И.Г.Семакин, Е.К.Хеннер. – 4 изд., испр. – М. – Бином. Лаборатория знаний, 2008г.
- Информатика и ИКТ. 10 кл. Базовый уровень под ред. Н.В.Макаровой – Спб – Лидер, 2010г.
- Информатика и ИКТ. 11 кл. Базовый уровень под ред. Н.В.Макаровой – Спб – Лидер, 2010г.
- Энциклопедия школьной информатики / под ред. И.Г.Семакина. – М.: Бином. Лаборатория знаний, 2011г.
- http//www.informatika.ru;
- http//www.student.informatika.ru;
- http://mirgeo.ucoz.ru/.
|
|