Тема 10: Создание Web-страниц и Web-сайтов

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

План урока:

1. Понятие о языке разметки гипертекста

2. Программы для создания HTML-файлов

3. Теги и структура HTML-документа

4. Элементы HTML

5. Атрибуты тегов

1. Понятие о языке разметки гипертекста

Основой всемирной «паутины» World Wide Web является язык гипертексто­вой разметки HTML. (HyperText Markup Language). Этот язык был создан учеными Европейского Центра Ядерных Исследований (CERN, г. Женева). В конце 80-х годов в CERN занялись проблемой хранения и отображения данных, получаемых коллегами-физиками. Сложность заключалась в том, что каждый специалист, приезжавший в Центр, применял собственные методы представления информации, и срочно требовалось создание универсальной си­стемы, которая не зависела бы от используемой компьютерной платформы и в то же время была бы достаточно простой.

Идея решения проблемы обмена документами между различными компьютерами состояла в том, что документы должны быть размечены с помощью определенного кода - HTML. Такие документы могли бы читаться на любом компьютере, на ко­тором установлена всего лишь одна программа просмотра - браузер.

Впоследствии HTML стал основным языком при создании документов, раз­мещаемых в World Wide Web. Благодаря языку разметки пользователь Web мо­жет у себя на экране просмотреть документ в том виде, в каком его задумал разработчик: с определенными размерами шрифта и разбивкой на абзацы, с заданными размерами и расположением рисунков и проч.

HTML - набор соглашений для разметки документов, которые определяют внешний вид документов на экране компьютера при доступе к ним с использованием программы браузера.

Документы, подготовленные на языке HTML, называются HTML- документами. Получить представление о том, как выглядит код HTML, вы сможете, если загрузите HTML-документ в браузер и выполните команду Вид - В виде HTML.

HTML-документ (или Web-страница) - это обычный текстовый файл с расширением htm или html, составленный на языке HTML и содержа­щий информацию, которая предназначена для публикации в WWW.

Код HTML является весьма компактным, и HTML-документы имеют размер значительно меньший, чем документы, подготовленные в текстовых процессорах типа Word. Это одна из основных причин широкого применения языка HTML для кодирования информации, распространяемой по Интернету.

HTML-документы размещаются в WWW не поодиночке, а в виде так называемых сайтов.

Web-сайт - это совокупность Web-страниц (нескольких десятков, сотен или даже тысяч), объединенных одной общей темой и помещенных, как правило, на одном узловом компьютере.

2. Программы для создания html-файлов

Итак, документ, составленный с помощью языка разметки HTML, пред­ставляет собой текстовый файл. Такой файл можно набрать и отредактировать в обычном текстовом редакторе, например, в приложениях Блокноте или WordPad, которые входят в состав ОС Windows. Однако в настоящее время существуют более удобные и совершенные программы подготовки HTML-документов. Их условно можно разделить на визуальные редакторы HTML и редак­торы HTML-текстов.

При работе в визуальном HTML-редакторе пользователь имеет дело с гра­фическими образами элементов HTML, а не с кодом документа. Он может путем перетаскивания мышью и простых операций в интерфейсе размещать на стра­нице необходимые элементы. Благодаря этому даже начинающему пользова­телю, не знающему языка HTML, под силу создавать простые Web-страницы. К визуальным редакторам HTML относятся программа FrontPage фирмы Microsoft, Macromedia Dreamveawer, Netscape Navigator Gold и др.

Редакторы собственно HTML-текстов, среди которых наиболее известны HomeSite и HotDog, обладают основными возможностями текстовых редакторов (использование буфера обмена, средства поиска слов и др.). Но, в отличие от обычных редакторов текста, эти приложения предоставляют в распоряжение разработчика визуальную среду программирования (типа Visual Basic или Delphi) и позволяют автоматизировать создание HTML-кода. Редакторы HTML-текстов дают возможность пользователю быстро и легко вставлять в документ элементы HTML, проверять синтаксис команд, выполнять запуск и отладку страницы, не покидая окна редактора.

При создании сайта пользователь обычно сам определяет, работать ли ему в визуальном HTML-редакторе или вручную составлять HTML-код. Но при этом нужно учесть, что эффективно управлять HTML-документами и решать вопросы Web-дизайна можно только при использовании языка разметки HTML. Основы HTML-кодирования мы и будем изучать набирая код в редакторе Блокнот и просматривая созданные документы с помощью про­граммы браузера.