HTML з нуля: основи для початківців. Урок №1


Вітаю всіх на блозі overcod.net! Якщо ви задумалися про створення сайтів або веб-сторінок, то вивчення основ HTML — це чудовий старт. Правильне рішення — почати з розуміння HTML для початківців, адже це фундамент для подальшого розвитку в веб-розробці.

Чому саме мої уроки підійдуть вам? По-перше, вони зрозумілі й доступні навіть новачкам. По-друге, я приділяю увагу практичним завданням, адже практика — це ключ до засвоєння матеріалу.

Отже, перейдемо до уроку №1, де я розповім про те, що таке HTML і поясню, як виглядає скелет HTML-документа.

Що таке HTML?
HTML (HyperText Markup Language) — це мова гіпертекстової розмітки, створена Тімом Бернерс-Лі на початку 90-х років. Простішими словами, HTML — це набір тегів, за допомогою яких ми можемо структурувати текст, зображення, посилання та інші елементи на веб-сторінці.





Гіпертекст — це сукупність тексту, зображень, таблиць і посилань, що взаємопов’язані між собою. По суті, веб-сторінка — це і є гіпертекст.

Розмітка — це процес, під час якого за допомогою тегів визначається розташування різних елементів на сторінці: тексту, зображень, таблиць тощо.

Тепер перейдемо до скелету HTML-документа, тобто його основної структури.

Скелет HTML-документа

  1. <HTML> і </HTML> — це початок і завершення HTML-документа.
  2. <HEAD> і </HEAD> — “головна частина” документа, де розміщуються службові теги, такі як мета-інформація. Про них детальніше поговоримо в наступних уроках.
  3. <TITLE> і </TITLE> — заголовок документа, що відображається в браузері і в результатах пошуку.
  4. <BODY> і </BODY> — “тіло” документа, де розміщуються всі елементи, видимі на сторінці: текст, зображення, таблиці та інше.

Тепер розберемося, що таке тег. Тег — це елемент, що записується в кутові дужки < >, і саме з їх допомогою створюється структура HTML-документа. Приклади тегів: <html></html>, <head></head>, <title></title>, <br>, <p></p> та інші.

Деякі теги закриваються, наприклад, <html></html>, а деякі — одиночні та не потребують закриття, як <br>.

Якщо щось залишилося незрозумілим, не переймайтеся. У наступному уроці ми на практиці створимо просту веб-сторінку, і ви побачите, як працює ця теорія. На практиці стає зрозуміло, що вивчити HTML легко, особливо якщо використовувати наочні приклади та крок за кроком рухатися вперед. HTML для студентів та школярів — це дійсно доступний спосіб розпочати вивчення веб-технологій.