возврат

## Структура HTML-кода

### Ответы на вопросы

1. Какой тег должен открывать HTML-программу, а какой закрывать её?

   Ответ. Тег `<HTML>` должен открывать программу, а тег `</HTML>` — закрывать её.

2. Из каких двух частей состоит HTML-программа? Запишите общий вид HTML-программы.

   Ответ. Между двумя основными тегами `<HTML>` и `</HTML>` располагается головная часть программы и ее тело:

3. Какими тегами задаётся элемент, содержащий головную часть программы? Запишите общий вид головной части HTML-программы.

   Ответ. Головная часть HTML-программы записывается между открывающим тегом `<HEAD>` и закрывающим `</HEAD>`:

4. Какими тегами задаётся элемент, содержащий тело программы? Запишите общий вид тела HTML-программы.

   Ответ. Тело HTML-программы записывается между открывающим тегом `<BODY>` и закрывающим `</BODY>`:

5. Какие указания записываются в головной части программы?

   Ответ. В элементе `<HEAD>...</HEAD>` описываются общие правила интерпретации HTML-кода в целом, и содержится вспомогательная информация о документе и авторе документа (теги `<META>`). Кроме того, головная часть содержит элемент `TITLE` — в нём задаётся название окна показа документа.

6. Для чего нужно указывать кодировку, в которой написана гипертекстовая страница?

   Ответ. Указание кодировки браузер использует для выбора кодовой таблицы, задающей соответствие между кодами символов и их образами на экране.

7. Что произойдёт, когда браузер будет интерпретировать HTML-код с неверно указанной кодировкой?

   Ответ. Текст на экране будет в нечитаемом виде.

8. Как указать кодировку, в которой написана гипертекстовая страница?

   Ответ. Нужно в головную часть (`<HEAD>...</HEAD>`) поместить тег `МЕТА` c указанием кодировки в виде:

   В примере задана кодировка windows-1251.

9. В каких случаях нельзя указывать кодировку гипертекстовой страницы?

   Ответ. Если сервер, на котором расположен сайт, поддерживают автоматическую перекодировку страниц, то указание кодировки может привести к путанице: сервер сообщит браузеру, что перешлёт ему страницу в той кодировке, которая указана в теге `МЕТА`, а сам перекодирует страницу в другую. Пользователь увидит на экране “кракобяки”.

   Разработчик должен поинтересоваться у провайдера сервера, на котором он собирается держать свой сайт, будет ли сервер перекодировать страницы перед передачей браузеру клиента, нужно ли на страницах указывать кодировку.

10. Как в HTML-коде задаётся название окна, в котором будет отображаться документ?

    Ответ. Название окна задаётся в головной части при помощи элемента `TITLE`:

11. Почему название окна должно совпадать с заголовком страницы?

    Ответ. Это удобно по трём причинам:

    1. Когда окно с сайтом свёрнуто в кнопку на Панели Задач, пользователь видит на этой кнопке заголовок текущей страницы.
    2. Название окна заносится в набор избранных сайтов (меню Избранное), если пользователь решит запомнить ссылку на текущую страницу.

    3. Название окна — дополнительная подсказка пользователю о его текущем положении на сайте.

12. Для чего используются теги `METА` c атрибутами `description` и `keywords`?

    Ответ. Эти элементы задают описание документа и ключевые слова для поисковых систем, что способствует продвижению (“раскрутке”) сайта в Интернете.

13. Какую роль играют заголовки документа?

    Ответ. Заголовки — важный структурный элемент разметки документа. Они разделяют информацию на отдельные логические части и поэтому существенно улучшают её восприятие.

14. Каким элементом задаются заголовки?

    Ответ. В HTML-документе поддерживаются заголовки шести уровней при помощи конструкции:

    `<Hn>`текст заголовка`</Hn>`

    В качестве `n` следует использовать одну из цифр 1–6, обозначающую уровень заголовка.

15. Сколько уровней заголовков поддерживает HTML?

    Ответ. Шесть уровней: `H1` (первый уровень), `H2`, `H3`, `H4`, `H5`, `H6` (последний уровень).

16. Как выделяются заголовки в окне документа?

    Ответ. При отображении HTML-документа браузер выделяет заголовки размером шрифта и жирностью.

17. Почему не следует использовать элементы `Hn` для выделения обычного текста?

    Ответ. Элементы `Hn` предназначены для структурной разметки. Применять их для обычных выделений текста неразумно по двум причинам.

    Во-первых, нарушение логики разметки будет мешать самому разработчику.

    Во-вторых, существуют специальные программы, которые автоматически составляют оглавление гипертекстового документа, используя элементы `Hn`. Если заголовочные теги обрамляют обычные тексты или не отражают иерархическую структуру документа, оглавление будет построено неверно.

18. Каким элементом задаётся горизонтальная линия?

    Ответ. Горизонтальная линия задаётся тегом `<HR>`, и этот тег не имеет парного закрывающего.

19. Зачем текст разделяется на абзацы?

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

20. Назовите два приёма, позволяющих зрительно отделить абзацы друг от друга в тексте.

    Ответ. Абзацы отделяются друг от друга “красными” или пустыми строками. Красная строка — это первая строка абзаца с текстом, сдвинутым вправо.

21. Какой приём использует браузер для отделения абзацев друг от друга?

    Ответ. По умолчанию браузер отделяет абзацы друг от друга пустыми строками.

22. Как на HTML задаётся абзац?

    Ответ. Абзац задаётся тегами `<P>` и `</P>`, между которыми помещается текст.

23. Расскажите алгоритм построения браузером абзаца на экране.

    Ответ. Браузер строит абзац следующим образом:

    1. Абзац выводится с новой строки и перед ним формируется отступ (пустая строка).
    2. Абзац выравнивается по левому краю.
    3. Между словами помещается ровно по одному пробелу независимо от того, сколько пробелов проставлено в HTML-коде.
    4. Перенос текста на новую строку выполняется, если очередное слово не помещается в экранной строке, а не тогда, когда в HTML-коде начинается новая строка.
    5. Завершая абзац, браузер выполняет переход на новую строку и формирует после абзаца отступ (пустую строку).
24. Опишите поведение объекта, соответствующего блочному элементу.

    Ответ. Блочные элементы выводятся на экран прямоугольниками, последовательно сверху вниз. Ширина прямоугольника совпадает с шириной родительского элемента, а высота определяется по содержимому.

25. Опишите поведение объекта, соответствующего строчному элементу.

    Ответ. Строчные элементы содержатся внутри блочных и занимают место в строке, переходя на следующие строки, если в текущей не хватило места.

    К строчным относятся элементы, позволяющие выделять текст (например, курсивом или жирностью), а также обычный неразмеченный текст — он автоматически собирается браузером в безымянные строчные элементы.

26. Приведите примеры блочных элементов.

    Ответ. Самый главный блочный элемент — `HTML`. Он содержит блочный элемент `BODY`, в котором располагаются все другие элементы страницы.

    Примеры блочных элементов: `ADDRESS`, `BLOCKQUOTE`, `BODY`, `DD`, `DIV`, `DL`, `DT`, `Hn`, `HR`, `HTML`, `LI`, `OL`, `P`, `PRE`, `TABLE`, `TBODY`, `TD`, `TFOOT`, `TH`, `THEAD`, `TR`, `UL`.

27. Приведите примеры строчных элементов.

    Ответ. Примеры блочных элементов: `A`, `ABBR`, `ACRONYM`, `B`, `BIG`, `BR`, `CITE`, `CODE`, `DFN`, `EM`, `FONT`, `I`, `IMG`, `KBD`, `Q`, `SAMP`, `SMALL`, `SPAN`, `STRONG`, `SUB`, `SUP`, `TT`, `U`, `VAR`.

28. Может ли блочный элемент содержать блочные элементы? А строчные? А смесь из строчных и блочных?

    Ответ. Блочный элемемент может содержать блочные элементы, строчные, а также смесь из блочных и строчных.

29. Может ли строчный элемент содержать блочные элементы? А строчные? А смесь из строчных и блочных?

    Ответ. Строчный элемент может содержать только строчные элементы.

30. Может ли элемент `P` содержать блочные элементы?

    Ответ. Нет. Это исключение из общего правила.

31. Что происходит с элементами на экране, когда пользователь меняет ширину окна документа?

    Ответ. При изменении ширины окна меняется ширина `HTML` и вложенного в него `BODY` таким образом, чтобы занять по ширине всё окно.

    Соответственно, меняется ширина всех вложенных в `BODY` элементов таким образом, чтобы они занимали всю ширину `BODY`. И так происходит на каждом иерархическом уровне при вложении элементов друг в друга.

    Строчные элементы при этом также стараются занять всю ширину своих блочных предков.

32. Что делает браузер, когда ширина окна уменьшается настолько, что в окне не может целиком уместиться даже одно слово?

    Ответ. В этом случае браузер вынужден включать горизонтальную прокрутку, чтобы дать пользователю возможность просмотреть целиком содержимое страницы.

33. Как записывать код лесенкой и для чего это нужно?

    Ответ. Код, записанный лесенкой, гораздо легче читать и понимать. Структурная лесенка должна повторять иерархическую структуру блочных элементов: каждый потомок смещается вправо по отношению к телу своего родителя.

34. Почему рекомендуется записывать код строчками не длиннее 80 символов?

    Ответ. Если записывать строчки более длинными, то для их просмотра придётся использовать горизонтальную прокрутку окна текстового редактора, а это не удобно.

35. В каком регистре рекомендуется записывать имена тегов, названия атрибутов и их значения? Чем обосновывается эта рекомендация?

    Ответ. Имена тегов рекомендуется записывать прописными буквами для выделения в коде тегового каркаса. Названия атрибутов и их значения рекомендуется записывать строчными буквами, чтобы не переборщить с выделениями.

вверх | возврат