Що таке вебсторінки та HTML?
Last updated
Last updated
Автори: Вільям Туркел та Адам Краймбл Переклали на українську: Мар’яна Юрків, Анастасія Юрків Оригінал уроку:
Цей урок познайомить вас з мовою HTML та вебсторінками, які вона структурує.
Коли ви працюєте з онлайн-джерелами, більшу частину часу ви будете використовувати файли, які були розмічені за допомогою HTML (англ. HyperText Markup Language — мова розмітки гіпертексту). Ваш браузер вже знає, як інтерпретувати HTML, що, безумовно, зручно для читачів. Також, більшість браузерів дозволяють переглядати вихідний код HTML для будь-якої сторінки, яку ви відвідуєте. Два зображення нижче показують типову вебсторінку () і джерело HTML, використане для створення цієї сторінки. Щоб переглянути джерело HTML, використайте комбінацію клавіш Ctrl + U (Command + Option + U на MacOS) або натисніть правою кнопкою мишки по сторінці і оберіть "Переглянути джерело сторінки".
Користуючись браузером, вам зазвичай не потрібен доступ до джерела вебсторінки. Проте, якщо ви створюєте власну сторінку, вам може бути дуже корисно побачити, як на інших вебсторінках досягнуто того чи іншого ефекту. Доступ до джерела HTML вам також може знадобиться під час написання програм для взаємодії з іншими вебсторінками чи автоматичного вилучення інформації з них.
Як відомо, HTML це мова розмітки. Іншими словами, HTML — це текст, "розмічений" тегами, які надають інформацію для інтерпретатора (яким часто є веббраузер). Припустимо, ви форматуєте бібліографічний запис і хочете вказати назву твору курсивом. У HTML ви використаєте теги em ("em" скорочення від emphasis, означає виділення). Отже, частина вашого HTML-файлу може виглядати так:
Найпростіший файл HTML складається з тегів, які вказують на початок і кінець усього документа ( та ), а також тегів, які ідентифікують head (заголовок) і body (тіло) в цьому документі. Інформація про файл зазвичай потрапляє в заголовок, тоді як інформація, яка буде відображатися на екрані, зазвичай потрапляє в тіло.
Ви можете спробувати самі створити HTML-код. У текстовому редакторі (наприклад Notepad++) створіть новий файл. Скопіюйте наведений нижче код у редактор. Перший рядок повідомляє браузеру, який це файл. Тег html містить dir (напрямок тексту), встановлений на ltr (зліва направо), а lang (мову) — на американську англійську. Тег title у заголовку документа HTML містить матеріал, який зазвичай відображається у верхній панелі вікна під час перегляду сторінки та на вкладках браузерів.
Змініть обидва
<!-- Insert your title here -->
і
<!-- Insert your title here -->
на
Hello World!
Далі збережіть ваш файл у будь-яку папку на вашому комп'ютері, назвавши його, наприклад, hello_world.html, але обов'язково з розширенням .html. Щоб відкрити цей файл у браузері, натисніть правою кнопкою миші по файлу і виберіть пункт "Відкрити за допомогою". У підменю оберіть бажаний браузер. Варто зазначити, що описаний підхід передбачений для ОС Windows.
Після того, як ви відкриєте файл, ваше повідомлення Hello World! має з’явитися в обраному браузері. Зверніть увагу на різницю між відкриттям файлу HTML за допомогою браузера на зразок Microsoft Edge чи Google Chrome (які інтерпретують його), та відкриттям того ж файлу за допомогою текстового редактора (який цього не робить). Нижче наведені зображення, які демонструють цей факт.
Вільям Туркел, професор історії в Університеті Західного Онтаріо. Адам Краймбл, Університетський коледж Лондона.
Переклад рецензували: Володимир Нікулішин, доцент кафедри Картографії та геопросторового моделювання Національного Університету "Львівська Політехніка", к.т.н, ГІС розробник, Python розробник. Євген Рачков, доцент кафедри історіографії, джерелознавства та археології Харківського національного університету ім. Василя Каразіна, к.і.н.
(Для кращого ознайомлення з HTML, вам може бути корисно попрацювати з навчальним посібником . Детальне знання HTML не обов’язкове для продовження цього уроку, але будь-який час, що ви витратите на вивчення HTML, буде добре винагороджений у вашій подальшій роботі в галузі цифрової історії чи цифрової гуманітаристики).
Переклад українською: Юрків Мар’яна, доцент кафедри картографії та геопросторового моделювання Національного університету “Львівська політехніка”, . Юрків Анастасія, студентка Львівського національного університету імені Івана Франка
Рекомендоване цитування: Туркел, Вільям та Краймбл, Адам, "Що таке вебсторінки та HTML?" Programming Historian, переклали Мар’яна Юрків та Анастасія Юрків, Посібник з цифрової історії, 2024. DOI:
