Тема: Создание Web-страницы, внесение изменений и дополнений в Web-страницу

Цель:изучение информационной технологии разработки Web-сайтов, внесения изменений и дополнений в них.

Оборудование и материалы: компьютер, программа Блокнот, браузер Internet Explorer, практическое задание.

Ход работы

Web–страница— это электронный документ, в котором кроме текста содержатся специальные команды форматирования, а также встроенные объекты (рисунки, аудио- и видеоклипы и др.).

Web-сайт (или просто сайтом) — совокупность web-документов, объединенных по какому-либо признаку (адресом сервера, темой, оформлением).

Создание Web–страниц и Web-сайта осуществляется с использованием языка разметки гипертекстовых документов HTML.

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

Для создания Web-страниц используются простейшие текстовые редакторы, которые не включают в создаваемый документ управляющие символы форматирования текста. В качестве такого редактора в Windows можно использовать стандартное приложение Блокнот.

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

HTML-код страницы помещается внутрь контейнера <HTML></HTML>. Без этих тэгов браузер не в состоянии определить формат документа и правильно его интерпретировать. Web-страница разделяется на две логические части: заголовок и содержание.

Заголовок Web-страницы заключается в контейнер <HEAD></HEAD> и содержит название документа и справочную информацию о странице (например, тип кодировки), которая используется браузером для ее правильного отображения.

Название Web-страницы содержится в контейнере <ТIТLE></TITLE> и отображается в строке заголовка браузера при просмотре страницы.

Основное содержание страницы помещается в контейнер <BODY></BODY> и может включать текст, таблицы, бегущие строки, ссылки на графические изображения и звуковые файлы и так далее.

Созданную Web-страницу необходимо сохранить в виде файла. Принято сохранять титульный файл сайта, то есть тот, который первый загружается в браузер, под именем index.htm. В качестве расширения файла Web-страницы можно также использовать html.

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

Контрольные вопросы

• Что такое Web–страница, Web-сайт?

• Как осуществляется создание Web–страниц и Web-сайта?

• С помощью чего задается вид Web-страниц?

• Без чего браузер не в состоянии правильно отобразить Web–страницу и Web-сайт?

• На какие логические части разделяется Web-страница и как они задаются?

•

Практическое задание № 13

Тема: Цветовая схема Web-страницы, вставка изображений

Цель:изучение информационной технологии задания цвета Web-странице и вставки изображений.

Оборудование и материалы: компьютер, программа Блокнот, браузер Internet Explorer, практическое задание.

Ход работы

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

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

Цвет на Web-странице задают либо его названием, либо числовым шести разрядным шестнадцатеричным кодом #RRGGBB (первые два разряда задают интенсивность красного цвета, вторые – зеленого и третьи – синего).

Значение яркости цвета может меняться от минимальной 00 до максимальной FF. В таблице приведены примеры некоторых цветов:

Цвет	Код	Название			Цвет	Код	Название
черный	#000000	black	ч	фиолетовый	#FF00FF	magenta	ф
белый	#FFFFFF	white	б	бирюзовый	#00FFFF	cyan	б
красный	#FF0000	red	к	желтый	#FFFF00	yellow	ж
зеленый	#00FF00	lime	з	золотой	#FFD800	gold	з
синий	#0000FF	blue	с	оранжевый	#FFA500	orange	о
серый	#808080	gray	с	коричневый	#A82828	brown	к

Основную цветовую схему Web-страницы можно задать в тэге <BODY> с помощью атрибутов:

Цвет фона	BGCOLOR="#RRGGBB"
Текстура фона	BACKGROUND="file_name"
Цвет текста	TEXT="#RRGGBB"
Цвет текста ссылки	LINK="#RRGGBB"
Цвет текста активной ссылки	ALINK="#RRGGBB"
Цвет текста просмотренной ссылки	VLINK="#RRGGBB"

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

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

Для размещения на Web-страницах используются графические файлы форматов GIF, JPEG и PNG.

Изображения помещаются на Web-страницу тэгом IMG с атрибутом SRC, сообщающим браузеру имя и местоположение графического файла.

Если рядом с изображением не должно быть текста, его размещают внутри отдельного абзаца. Выравнивание рисунка по горизонтали в этом случае задают в тэге <P>. Размеры изображения (в пикселах) можно задать с помощью атрибутов WIDTH и HEIGHT.К изображению атрибутом ALT можно добавить название, которое появляется на экран или вместо иллюстрации (если по какой - либо причине графика не выводится в окне браузера), или в качестве всплывающий строки, при указании на рисунок мышью.

Атрибут ALIGN выравнивает текст по верхнему краю, середине или нижнему краю изображения, справа или слева от него с помощью значений: top, bottom, middle, left или right.

Контрольные вопросы

• Как задают цвет на Web – странице?

• Как может меняться значение яркости цвета?

• Почему для фона Web – страницы указывают цвет, совпадающий с основным тоном фонового рисунка.

• Графические файлы, каких форматов используют для размещения на Web – страницах?

• Каким тегом, и с каким атрибутом помещаются изображения на Web – страницу?

•

Практическое задание № 14