Семантика в html, уроки, webreference

Метою тегів HTML є передача сенсу документу. Не турбуйтеся про те, як ваша веб-сторінка виглядає. Зосередьтеся на значенні кожного тега, який ви будете використовувати.

Залежно від написаного вами вмісту, ви можете вибрати відповідний елемент, відповідний змістом тексту.

Діапазон елементів досить широкий, щоб він підходив і для матеріалів загального призначення (наприклад, абзаци або списки) і для більш конкретного вмісту, на кшталт (Для відображення результату обчислення) або (Для відображення ходу виконання завдання).

Структурні елементи: організація сторінки

Структурні елементи дозволяють організувати основні частини вашої сторінки. Вони зазвичай містять інші елементи HTML.

Ось що типова веб-сторінка може в себе включати:

  • в якості першого елемента сторінки, який може включати в себе логотип і слоган;
  • в якості заголовка сторінки;

  • в якості основного вмісту сторінки, на зразок статті блогу;
  • в якості останнього елемента сторінки, розташованого внизу.

Текстові елементи: визначення контенту

Усередині структурних елементів ви зазвичай знаходите текстові елементи, покликані визначити мету вашого вмісту.

Ви, в основному, будете використовувати:

  • для абзаців;

    • для (невпорядкованих) списків;
      1. для (впорядкованих) списків;
      2. для окремих пунктів списку;
      3. для цитат.

    Рядкові елементи: різний текст

    Є багато малих елементів, але ви зазвичай зіткнетеся з наступними:

    Просто читаючи цей код HTML, ви можете легко зрозуміти, що означає кожен елемент HTML.

    загальні елементи

    Коли жоден семантичний елемент не підходить для вашого вмісту, але ви все ще хочете вставити елемент HTML (з метою групування або стилізації), то можете зупинитися на одному з двох загальних елементів:

    • для блокових елементів;
    • для малих елементів.

    Хоча ці елементи HTML насправді не несуть будь-якого сенсу. вони стануть в нагоді коли ми почнемо використовувати CSS.

    Чи не морочитися на семантиці

    Існує близько 100 семантичних елементів HTML на вибір. Це багато. Може виявитися непереборним пройтися за цим списком і вибрати відповідний елемент для вашого контенту.

    Але не витрачайте занадто багато часу, турбуючись про це. Якщо ви будете дотримуватися наступного списку на даний момент, цього буде достатньо.

    Схожі статті