[Вопросы для собеседования](README.md) # Основы HTML + [Что такое _«HTML»_?](#Что-такое-html) + [Что такое _«XHTML»_?](#Что-такое-xhtml) + [Что такое `DOCTYPE` и зачем он нужен?](#Что-такое-doctype-и-зачем-он-нужен) + [Для чего предназначен тег ``?](#Для-чего-предназначен-тег-head) + [Чем отличается `
` от ``?](#Чем-отличается-div-от-span) + [Как обозначаются комментарии в HTML?](#Как-обозначаются-комментарии-в-html) + [Каким образом задаётся адрес документа, на который следует перейти?](#Каким-образом-задаётся-адрес-документа-на-который-следует-перейти) + [Как сделать ссылку на адрес электронной почты?](#Как-сделать-ссылку-на-адрес-электронной-почты) + [Для чего предназначен тег ``?](#Для-чего-предназначен-тег-em) + [Для чего предназначены теги `
    `, `
      `, `
    • `?](#Для-чего-предназначены-теги-ol-ul-li) + [Для чего предназначены теги `
      `, `
      `, `
      `?](#Для-чего-предназначены-теги-dl-dt-dd) + [Для чего предназначены теги ``, ``, ``?](#Для-чего-предназначены-теги-tr-th-td) + [Обязательно ли писать атрибут `alt` в теге ``?](#Обязательно-ли-писать-атрибут-alt-в-теге-img) + [В каком регистре лучше писать HTML-код?](#В-каком-регистре-лучше-писать-html-код) + [Что такое «мнемоника (entity)»?](#Что-такое-мнемоника-entity) ## Что такое _«HTML»_? __HTML__, HyperText Markup Language («язык гипертекстовой разметки») — стандартизированный язык разметки документов в WWW. На данный момент актуальна 5 версия этого языка - HTML5. [к оглавлению](#Основы-html) ## Что такое _«XHTML»_? __XHTML__, eXtensible HyperText Markup Language («расширяемый язык гипертекстовой разметки») - более строгий вариант HTML, следующий всем ограничениям XML и, фактически являющийся приложением языка XML к области разметки гипертекста. [к оглавлению](#Основы-html) ## Что такое `DOCTYPE` и зачем он нужен? Элемент `` предназначен для указания типа текущего документа. Это необходимо, чтобы браузер понимал, согласно какому стандарту, необходимо интерпретировать данную web-страницу. Существует несколько видов ``, различающихся версией языка, на который они ориентированы: __HTML 4.01__ + ``: строгий синтаксис HTML; + ``: переходный синтаксис HTML; + ``: HTML с фреймами. __HTML 5__ + ``: для всех документов. __XHTML 1.0__ + ``: строгий синтаксис XHTML; + ``: переходный синтаксис XHTML; + ``: XHTML с фреймами. __XHTML 1.1__ + ``: для всех документов. [к оглавлению](#Основы-html) ## Для чего предназначен тег ``? Тег `` предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными. Также внутри этого контейнера находятся _метатеги_, которые используются для хранения информации предназначенной для браузеров и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам для получения описания сайта, ключевых слов и других данных. Содержимое тега `` не отображается напрямую на web-странице, за исключением тега `` устанавливающего заголовок окна. Внутри контейнера `<head>` допускается размещать следующие элементы: `<base>`, `<basefont>`, `<bgsound>`, `<link>`, `<meta>`, `<script>`, `<style>`, `<title>`. Синтаксис: ```html <head> ... </head> ``` Специфические атрибуты: + `profile`: указывает адрес профиля метаданных. [к оглавлению](#Основы-html) ## Чем отличается `<div>` от `<span>`? `<div>` - блочный, а `<span>` - строчный элементы. Поэтому `<div>` формирует блок из того, что в нем располагается с новой строки, а `<span>` не переносит элементы, размещая их в строку. Так же стоит отметь, что согласно рекомендациям w3c линейный тег не может включать в себя блочные теги, поэтому `<div>` обычно используется для разметки блоков, а `<span>` - отрывков текста. [к оглавлению](#Основы-html) ## Как обозначаются комментарии в HTML? Комментарий в HTML-коде задаётся так: `<!-- комментарий -->` Комментарии можно использовать в любом месте страницы, кроме тега `<title>` — внутри него они не работают. Внутри тега `<style>` HTML-комментарии тоже не работают, так как в CSS код комментируется другим способом. [к оглавлению](#Основы-html) ## Каким образом задаётся адрес документа, на который следует перейти? Для создания ссылок на другие документы используется тег `<a>`. В зависимости от присутствия атрибутов `name` или `href` тег `<a>` устанавливает ссылку или якорь. Якорем называется закладка внутри страницы, которую можно указать в качестве цели ссылки. При использовании ссылки, которая указывает на якорь, происходит переход к закладке внутри web-страницы. Синтаксис: + `<a href="URL">...</a>` + `<a name="идентификатор">...</a>` Специфические атрибуты: + `accesskey`: активация ссылки с помощью комбинации клавиш; + `coords`: устанавливает координаты активной области; + `download`: предлагает скачать указанный по ссылке файл; + `href`: задает адрес документа, на который следует перейти. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Относительные ссылки, как следует из их названия, построены относительно текущего документа или корня сайта; + `hreflang`: идентифицирует язык текста по ссылке; + `name`: устанавливает имя якоря внутри документа; + `rel`: отношения между ссылаемым и текущим документами; + `rev`: отношения между текущим и ссылаемым документами; + `shape`: задает форму активной области ссылки для изображений; + `tabindex`: определяет последовательность перехода между ссылками при нажатии на кнопку <kbd>Tab</kbd>; + `target`: имя окна или фрейма, куда браузер будет загружать документ; + `title`: добавляет всплывающую подсказку к тексту ссылки; + `type`: указывает MIME-тип документа, на который ведёт ссылка. [к оглавлению](#Основы-html) ## Как сделать ссылку на адрес электронной почты? Создание ссылки на адрес электронной почты делается почти также, как и ссылка на web-страницу. Только вместо URL указывается `mailto:"адрес электронной почты"` ```html <a href="mailto:user@address.net">Напиши мне!</a> ``` [к оглавлению](#Основы-html) ## Для чего предназначен тег `<em>`? Тег `<em>` предназначен для акцентирования текста. Браузеры отображают такой текст курсивным начертанием. ```html <em>Текст</em> ``` [к оглавлению](#Основы-html) ## Для чего предназначены теги `<ol>`, `<ul>`, `<li>`? Теги `<ol>`, `<ul>` и `<li>` предназначены для оформления списков. + `<ol>`: нумерованный список, т.е. каждый элемент списка начинается с числа или буквы и увеличивается по нарастающей. + `<ul>`: маркированный список, каждый элемент которого начинается с небольшого символа — маркера. + `<li>`: отдельный элемент списка. Внешний тег `<ul>` или `<ol>` устанавливает тип списка — маркированный или нумерованный. ```html <ol>Нумерованый список <li>первый</li> <li>второй</li> <li>третий</li> </ol> <ul>Маркированный список <li>первый</li> <li>второй</li> <li>третий</li> </ul> ``` [к оглавлению](#Основы-html) ## Для чего предназначены теги `<dl>`, `<dt>`, `<dd>`? Теги `<dl>`, `<dt>`, `<dd>` предназначены для создания списка определений. Каждый такой список начинается с контейнера `<dl>`, куда входит тег `<dt>` создающий термин и тег `<dd>` задающий определение этого термина. Закрывающий тег `</dd>` не обязателен, поскольку следующий тег сообщает о завершении предыдущего элемента. Тем не менее, хорошим стилем является закрывать все теги. ```html <dl>Список определений <dt>Термин</dt> <dd>Определение</dd> </dl> ``` [к оглавлению](#Основы-html) ## Для чего предназначены теги `<tr>`, `<th>`, `<td>`? `<tr>`: служит контейнером для создания строки таблицы. Каждая ячейка в пределах такой строки может задаваться с помощью тега `<th>` или `<td>`. `<th>`: предназначен для создания одной ячейки заголовка таблицы. `<td>`: предназначен для создания одной ячейки таблицы. ```html <table> <tr> <th>Заголовок</td> </tr> <tr> <td>Строка</td> </tr> </table> ``` [к оглавлению](#Основы-html) ## Обязательно ли писать атрибут `alt` в теге `<img>`? Да, писать его обязательно. Атрибут `alt` устанавливает альтернативный текст для изображений. Такой текст позволяет получить текстовую информацию о рисунке при отключенной в браузере загрузке изображений. Поскольку загрузка изображений происходит после получения браузером информации о нем, то замещающий рисунок текст появляется раньше. А уже по мере загрузки текст будет сменяться изображением. ```html <img src="forest.jpg" alt="Лес"> ``` [к оглавлению](#Основы-html) ## В каком регистре лучше писать HTML-код? Весь HTML-код рекомендуется писать в нижнем регистре: это относится к названиям элементов, названиям атрибутов, значениям атрибутов (кроме текста/`CDATA`), селекторам, свойствам и их значениям (кроме текста). Не рекомендуется ```html <A HREF="/">Домой</A> ``` Рекомендуется ```html <img src="forest.jpg" alt="Лес"> ``` [к оглавлению](#Основы-html) ## Что такое «мнемоника (entity)»? __Мнемоника (entity)__ - это конструкция из символа `&` и буквенного (или цифрового кода) после нее, предназначенная для замещения символов, которые запрещены для использования в HTML в «явном виде». ># имеет мнемонику `#` [к оглавлению](#Основы-html) # Источники + [htmlbook](http://htmlbook.ru/html/) + [Хабрахабр](https://habrahabr.ru/post/143452/) [Вопросы для собеседования](README.md)