HTML – язык разметки гипертекстовых страниц

 

 

Методические указания к выполнению практических работ

 

 

 

Санкт-Петербург

2016

ВВЕДЕНИЕ

HTML (HyperText Markup Language — «язык гипертекстовой разметки») – стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.

Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в стенах Европейского Центра ядерных исследований в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов. Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.

Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE> предназначен для создания в документах таблиц, но часто используется и для оформления размещения элементов на странице. С течением времени основная идея платформонезависимости языка HTML была принесена в жертву современным потребностям в мультимедийном и графическом оформлении.

Практическая работа 1. Создание простой Web - страницы<HR>

 

Цель работы: Изучение элементов HTML, использование тегов при создании Web-страницы

 

Методические указания

В литературе по HTML постоянно встречается слово "тег". Тег - это основной элемент кодирования, принятый в стандарте HTML. HTML практически все зависит от тегов. Они служат для привлечения внимания к определенным словам в документе, тем самым давая браузеру понять, что нужно выделить, где отобразить графику и где находятся гиперссылки.

Существуют следующие типы HTML-тегов: теги-контейнеры и пустые теги.

Контейнер - это пара тегов, состоящий из начального (или открывающего) и конечного (или закрывающего) тегов.

Начальный тег имеет вид:

<TAG>,

где TAG - имя реального HTML-тега.

Конечный тег имеет вид:

</TAG>.

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

Также существует возможность вложения одного контейнера в: <U><H1> подчеркнутый заголовок первого уровня </H1></U>,

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

<HR> - создает горизонтальную линию и не выполняет при этом никаких действий над текстом.

<P> - приводит к вставке интервала между разделами.

 

Рассмотрим некоторые теги:

< COMMENT > </ COMMENT >

Текст комментария. Текст, помещенный внутри COMMENT, игнорируется браузером. COMMENT может располагаться в любом месте кода Web-страницы. Существует ещё один способ обозначения комментария:

<!--Строка комментария-->.

 

< HTML > </ HTML >

Теги элемента HTML являются самыми " внешними ", т.е. заключают в себе весь остальной текст и другие теги. Допускает вложение элементов HEAD, BODY и PLAINTEXT, определяющих общую структуру Web-страницы.

 

< HEAD ></ HEAD >

Область заголовка Web-страницы. Этот текст представляет собой общую информацию о файле и не отображается в самом документе. В теге <HEAD> может находиться ряд других элементов, включая следующие:

· TITLE (определяет название документа).

· META (сообщает браузеру дополнительную информацию о документе).

· BASE (задает базовый адрес документа).

· SCRIPT (определяет операторы интерпретируемых языков программирования, таких как JavaScript и VBScript)

 

< TITLE > </ TITLE >

Строка текста, расположенная внутри, отображается не в документе, а в заголовке окна браузера. Эта особенность часто используется для организации поиска в WWW.

< META >

Этот элемент содержит служебную информацию, которая не отображается при просмотре Web-страницы. Каждый элемент META содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Например, адрес электронной почты:

name =" Reply - to " content =" Имя @ Адрес "

Имя автора Web-страницы:

name =" Author " content=" Имя автора ".

 

< BODY > </ BODY >

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

Для задания цвета текста: text="#RRGGBB".

Цвет текста гиперссылок: link="#RRGGBB".

Точно также можно задать цвет для использованных гиперссылок: vlink="#RRGGBB" Можно указать изменение цвета для последней выбранной пользователем гиперссылки:   alink="RRGGBB".

Элемент заголовка <H1> </H1>

Существует шесть уровней заголовков, которые обозначаются H1...H6. Заголовок уровня 1 - самый крупный, а уровень 6 обеспечивает самый маленький заголовок.