ЯЗЫКИ РАЗМЕТКИ ГИПЕРТЕКСТА

HTML

ВЫПОЛНИЛА:ЗАХАРОВА ДАРЬЯ
D-023
 ЯЗЫКИ РАЗМЕТКИ ГИПЕРТЕКСТА
• И универсальные, и
специализированные
приложения, предназначенные
для разработки веб-документов,
которые вы изучали в
предыдущих курсах, работают в
WYSIWYG (What You See Is
What You Get ― англ., то, что вы
види- те, это именно то, что вы
получаете). В этом режиме веб-
разработчик работает напрямую
только с объектами веб-страниц,
не прибегая к возможностям,
предлагаемым языком HTML
• Напомним, что язык HTML (Hyper Text Markup Language) был
специально разработан для форматирования текстов веб-
страниц, вставки в них элемен- тов управления и ссылок на
различные объекты (другие веб-страницы, изо- бражения, аудио-,
видеофрагменты и т. д.), находящиеся как на локальном
компьютере, так и в любом месте в Интернете.Хотя работа в
режиме WYSIWYG намного удобнее для разработчиков веб-
страниц, чем разметка текста с помощью HTML, во многих
случаях прямое «написание» веб-страниц на языке HTML
обеспечивает значительную эконо- мию памяти и дает дизайнеру
больше возможностей размещения объектов на странице и их
форматирования.
РЕКОМЕНДУЕТСЯ ПРОВОДИТЬ ИЗУЧЕНИЕ
ЯЗЫКА HTML ПОЭТАПНО, А ИМЕННО:
1. РАЗРАБОТКА ПРОСТЫХ ВЕБ-
ДОКУМЕНТОВ.

• На этом этапе особое внимание следует уделить пониманию концепции

языка HTML, роли маркеров (тегов), способов их вставки в простые
неформатированные тексты, отображают про- граммы навигации как
веб-страницы. Необходимо просмотреть список мар- керов и уточнить
их назначение.
САМО СОЗДАНИЕ ВЕБ-СТРАНИЦ
НАЧИНАЕТСЯ С РАЗРАБОТКИ ИХ
ОБЩЕЙ
СТРУКТУРЫ,221УСТАНОВЛЕНИ
Я ОБЪЕКТОВ, КОТОРЫЕ БУДУТ
В НИХ ВСТАВЛЕНЫ. НА ЭТОМ
ЭТАПЕ БУДУТ ПОДРОБНО
ИЗУЧЕНЫ ТОЛЬКО
ИНСТРУМЕНТЫ HTML ДЛЯ
ФОРМАТИРОВАНИЯ ТЕКСТА:−
ЗАГОЛОВКИ;− АБЗАЦЫ;−
КОММЕНТАРИИ;− ФИЗИЧЕСКИЕ
СТИЛИ;− ЛОГИЧЕСКИЕ СТИЛИ;−
РАЗДЕЛИТЕЛИ;−
УПОРЯДОЧЕННЫЕ СПИСКИ;−
НЕУПОРЯДОЧЕННЫЕ СПИСКИ;−
СПИСКИ ОПРЕДЕЛЕНИЙ.
• Рекомендуемые практические упражнения для
этого этапа включают создание веб-страниц,
которые для начала содержат только текст,
отформа- тированный так, чтобы выделить суть
информации:− Мой дом/Моя школа/Мой
город/Родное село.− Мой класс/Мой школьный
кружок/Моя спортивная секция.− Студенческий
совет / Молодежный совет.− Волонтерство в моей
школе, моем селе/городе.− Книжный
магазин/Библиотека/Дом культуры/Музыкальный
салон.− Музей села/Городской музей.− История
моего села/города.− Знаменитости из моего
села/города.− Искусство в моей жизни (в сферах:
музыка, пластика, декоративное ис-кусство).−
Спорт в моей жизни.− Здорово быть здоровым.−
Тренажерные залы / фитнес-залы.− Салоны
красоты / Салоны моды.− Швейные / ремонтные
мастерские (автомобили, компьютеры,
бытоваятехника, аудио, видео).− Крестьянское
хозяйство.− Магазины (детские товары, школьные
товары, хозтовары, одежда).
 2. СОЗДАНИЕ ССЫЛОК.

• Самый распространенный сервис Интернета ― WWW (World Wide Web ― Всемирная

сеть [паука]) основан на документах HTML, связанных между собой, и внешних по
отношению к ним файлах. Переход от222одного документа HTML к другому и
отображение внешних файлов в програм- ме навигации осуществляются с помощью
специальных ссылок, называемых в последнее время линками (от англ. link).В документе
HTML ссылки создаются путем связывания URL-адресов с активными областями
страницы. Активные области могут быть фрагмента- ми текста или изображений, а
щелчок по такой области требует, чтобы про- грамма навигации нашла связанный ресурс
на локальном компьютере или в виртуальном пространстве, в зависимости от случая, и
отобразила его на локальном компьютере.
• Рекомендуется, чтобы процесс изучения того, как создавать ссылки, вы- полнялся
следующим образом:− ознакомление с используемой терминологией: привязка, URL,
внутрен- няя ссылка, внешняя ссылка, путь, комментарий к ссылке;− развитие
возможностей создания / выбора активных областей HTML- документов, состоящих как из
текстовых фрагментов, так и из изображений; − доработка с использованием форматов
маркеров, предназначенных длясоздания ссылок;−
созданиессылокнавнешнийдокумент,надокумент,находящийсявтомже или другом каталоге
на локальном компьютере;− создание ссылок на сайт;− создание ссылок на фрагмент того
же или другого HTML-документа;− создание средств для запуска приложения для обмена
сообщениями;− создание средств копирования файлов.
• На начальном этапе в качестве HTML-документов, в которых будут
созда-ваться ссылки, используются файлы, предложенные
преподавателем, а после развития необходимых навыков, путем
создания ссылок в документах HTML, разработанных учениками в
проектах, предложенных для практической де- ятельности на
предыдущем этапе (Мой дом, Мой класс, Студенческий совет,
Волонтерство в моей школе и т. д.).
 3. ВСТАВКА МУЛЬТИМЕДИЙНЫХ
ОБЪЕКТОВ.
• Первоначально HTML-страницы,
отображаемые на экране, содержали
только текст. Позже, с развитием инфор-
мационных и коммуникационных
технологий, в них начали появляться
ссылки на различные мультимедийные
объекты: статические рисунки,
анимирован- ные изображения,
фотографии, аудио-, видеофрагменты и т.
д.
• Процесс изучения того, как вставлять ссылки на мультимедийные объекты в HTML-
документы, будет состоять из следующих шагов:− знакомство с форматами графических,
аудио- и видеофайлов;−
организацияфайлов,содержащихмультимедийныеобъекты,вкаталогах, связанных с
разрабатываемыми HTML-документами;− ознакомление со свойствами мультимедийных
объектов, актуальными для их вставки в HTML-документы: размеры, границы, комментарии,
элемен- ты управления, ссылки;− изучение специфики интегрируемых мультимедийных
объектов: управ- ляющих элементов, интеграционных атрибутов;− вставка в HTML-
документы изображений, звуковых фрагментов, видео- фрагментов;− настройка свойств
мультимедийных объектов, вставляемых в HTML- документы.
• На начальном этапе отработка практических навыков вставки мультиме- дийных объектов в
HTML-документы будет осуществляться с использованием HTML-файлов и
мультимедийных объектов, предложенных преподавателем. В дальнейшем развитие этих
навыков будет достигаться в рамках проектов, разработанных учениками, ориентировочная
тема которых указана ранее, в соответствующем списке первого этапа. С этой целью ученики
самостоятель- но, индивидуально или в группах/командах подготовят те мультимедийные
объекты (изображения, фотографии, звуковые фрагменты, видеофрагменты), которые
значительно помогут развить предложенную тему.В процессе создания и/или выбора
мультимедийных объектов, используемых для включения в состав HTML-документов, будут
строго соблюдаться правила цифровой этики и авторские права. Плагиат исключён!
 ОРГАНИЗАЦИЯ КОНТЕНТА.

• Современные версии языка HTML предлага- ют несколько возможностей для организации

контента. В рамках лицейской программы будем изучать только организацию контента с
помощью таблиц. С этой целью мы рекомендуем ученикам:− освежить свои знания о
таблицах: заголовок, строка, столбец, ячейка, заголовок строки, заголовок столбца, свойства
ячейки, свойства содержимого ячейки;− ознакомиться с маркерами, используемыми для
создания и форматиро- вания таблиц и их атрибутами;−
организоватьсодержимоеразрабатываемыхвеб-страниц,используямакет страницы с помощью
таблиц;− придать веб-страницам дизайн, который будет выделять информацию,
необходимую передать путем редактирования соответствующих таблиц: объ- единение и
разделение ячеек, применение цветовых и градиентных эффектов, установка свойств границ.
• Как и на предыдущих этапах,
первоначально маркеры таблиц и
их атрибуты будут изучаться с
использованием очень простых
документов HTML, пред-
ложенных учителем или созданных
учениками самостоятельно, а затем
― в проектах, разработанных
учениками индивидуально или в
группах/командах.
 ТЕСТИРОВАНИЕ ДОКУМЕНТОВ HTML.

• Для начала документ HTML будет

протестирован локально с помощью
программы навигации. В процессе те-
стирования будет проверена доступность всех
объектов в HTML-документах, правильность
ссылок, работа инструментов навигации,
правильность отобра- жения рисунков,
правильность воспроизведения аудио- и
видеофрагментов.В случае ошибок
необходимо вернуться к этапу создания веб-
страниц и объектов, из которых они состоят.
СПАСИБО ЗА ВНИМАНИЕ 🫶