HTML/Введение

Материал из Викиверситета
Перейти к навигации Перейти к поиску
Applications-internet.svg
Logo HTML.png

§ 1. Введение[править]

HTML (от англ. HyperText Markup Language — «язык разметки гипертекста») — общепринятый стандартный язык разметки веб-страниц.

HTML указывает веб-браузеру на то, как веб-страницы должны быть показаны пользователю.

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

  • То, что мы видим на экране монитора при просмотре веб-страницы, называется графическим представлением веб-страницы.
  • Графическое представление веб-страницы формирует веб-браузер путём преобразования исходного кода веб-страницы.
  • Веб-браузер получает исходный код веб-страницы от веб-сервера в виде текста.
  • Исходный код веб-страницы представляет собой текст, который можно просматривать и редактировать в любом текстовом редакторе.
  • Исходный код веб-страницы состоит из списка элементов, с возможным вложением друг в друга.
  • Элемент состоит из начального тега, содержимого элемента и конечного тега.

Элемент <html>[править]

  • Базовым элементом веб-страницы является элемент <html>.
  • Начальный тег — <html>, конечный тег — </html>.
  • Внутри этого элемента располагаются все остальные элементы.
  • Теги элемента <html> указывают веб-браузеру на начало и конец обрабатываемого исходного кода веб-страницы.

Элемент <head>[править]

  • Элемент <head> содержит различную техническую информацию о веб-странице, например название, ключевые слова, метаданные.
  • Начальный тег — <head>, конечный тег — </head>.

Элемент <title>[править]

  • Элемент <title> содержит название веб-страницы, для идентификации её содержимого.
  • Начальный тег — <title>, конечный тег — </title>.
  • Элемент<title> должен находится в контейнере <head>.

Элемент <body>[править]

  • Элемент <body> содержит все основные элементы отображаемой веб-страницы: текст, изображения, цвета, графика.
  • Начальный тег — <body>, конечный тег — </body>.

Пример №1[править]

Пример простейшей веб-страницы:

<html>
   <head>
      <title>
         Моя первая веб-страница
      </title>
   </head>
   <body>
      Привет Мир!
   </body>
</html>

Использование примера[править]

Для использования примера №1 на практике создайте в любом текстовом редакторе[1] файл с расширением .html или .htm, например «index.html». Затем скопируйте текст примера в этот файл и сохраните изменения. После этого откройте созданный файл любым веб-браузером.

Задание №1[править]

Задания предназначены для проверки усвоенного материала и для практики. Как было написано в аннотации к курсу, Вы будете разрабатывать собственный сайт.

  1. На своём компьютере создайте файл index.htm. Создайте в нём HTML-разметку, включив все обязательные теги.
  2. Cоздайте аккаунт на одном из бесплатных хостингов или можете приобрести какой-нибудь дешёвый платный хостинг (также возможно установить набор Денвер, разворачивающий на вашем компьютере локальный сервер, но тогда другие люди не смогут зайти на ваш сайт) [2].
  3. Получите бесплатное доменное имя для будущего сайта. Доменное имя должно включать в себя Ваш ник в Викиверситете[3].
  4. Обычно вместе с именем сайта создаётся и шаблонное содержимое или устанавливается CMS. Нам нужно начинать с чистого листа. Удалите шаблонное содержимое или CMS. Загрузите свой созданный файл index.htm на свой сайт и проверьте доступность.
  5. Придумайте интересную тему для своего сайта. [4] В теле HTML-файла напишите вступительный текст для главной страницы сайта. Пока что в браузере текст отобразится без форматирования. Этим мы займёмся позже.
  6. Разместите ссылку на Ваш сайт и тему будущего сайта на странице Основы создания сайтов в разделе Студенты. Размещайте в таблице «Ведомость успеваемости» информацию, задания каких уроков вы считаете выполненными.

Задания должны присутствовать внутри каждого урока по HTML. Пока что это не так, — спрашивайте задания на страницах обсуждения уроков.

Дополнительные задания[править]

  • Разместите информацию о текущем курсе HTML в личном блоге или на тематическом форуме, касающемуся веб-технологий. Курсу нужны и редакторы, и студенты, и преподаватели.
  • Добавьте краткое описание ещё одного сервиса бесплатного хостинга на страницу Бесплатный хостинг (не менее 10 слов).


Курс HTML
Основы создания сайтовСледующий урок: HTML/Структура веб-страницы

Примечания[править]

  1. рекомендую использовать Notepad++ (для Windows).
  2. Сейчас бывают хостинги от 30 рублей в месяц. Как правило, проблем с платным хостингом гораздо меньше. Убедитесь, что хостинг предоставляет доменные имена третьего уровня бесплатно.
  3. например, vwbolo1910.far.ru [1]
  4. Постарайтесь придумать что-нибудь оригинальное. Это может быть сайт о Вашем хобби или о любимом городе, о звёздах или насекомых, о музыке или о театре. Хотя зачем вам подсказывать? Это ваш сайт и тему для него должны придумать только вы!

Смотри также[править]

Ссылки[править]


При создании этой страницы использовались материалы страницы en:HTML согласно лицензии Creative Commons Attribution/Share-Alike 3.0