HTML — чек-лист

НЕ ОБЯЗАТЕЛЬНОДЛЯ НОВИЧКОВ

Разработчику Аналитику Тестировщику
Архитектору Инженеру

Загрузка вопросов…

---

Чек-лист самопроверки

Проверьте себя на практике: соберите index.html по HTML-страницы целиком (header, main, form, семантика), затем добавьте стили из HTML + CSS — готовые макеты.

1. Понимаю ли я, что HTML — это язык разметки, а не язык программирования?
2. Могу ли я объяснить разницу между блочными и строчными элементами (в том числе <div> и <span>)?
3. Знаю ли я основные семантические элементы HTML5 — <header>, <nav>, <main>, <article>, <section>, <aside>, <footer>?
4. Умею ли я правильно вкладывать элементы друг в друга согласно спецификации?
5. Понимаю ли я, зачем нужен DOCTYPE и как он влияет на режим отображения?
6. Знаю ли я, как правильно указать кодировку документа через <meta charset="UTF-8">?
7. Могу ли я задать язык страницы с помощью атрибута lang?
8. Умею ли я создавать заголовки от <h1> до <h6> и соблюдать их иерархию?
9. Знаю ли я разницу между <ol>, <ul> и <dl> и когда какой использовать?
10. Понимаю ли я, как работают ссылки (<a>) и какие атрибуты у них бывают (href, target, rel)?
11. Могу ли я вставить изображение с помощью <img> и правильно указать src и alt?
12. Знаю ли я, зачем нужен атрибут alt и как его писать для разных типов изображений?
13. Умею ли я создавать таблицы с <table>, <thead>, <tbody>, <tr>, <th>, <td>?
14. Понимаю ли я, когда допустимо использовать таблицы для верстки, а когда — нет?
15. Знаю ли я, как создать форму с помощью <form> и задать метод и адрес отправки?
16. Могу ли я назвать назначение основных type у <input> — text, email, url, tel, password, number, date, time, range, checkbox, radio, file, hidden, кнопки (submit, reset, button)?
17. Понимаю ли я, как работают атрибуты name и value в полях формы?
18. Знаю ли я, как использовать атрибут label и связывать его с полем через for/id?
19. Умею ли я применять встроенную валидацию — required, minlength, maxlength, pattern, min, max?
20. Понимаю ли я, зачем нужен атрибут type="submit" у кнопки?
21. Знаю ли я разницу между <button> и <input type="button">?
22. Могу ли я вставить видео и аудио с помощью <video> и <audio>?
23. Понимаю ли я, как работают источники (<source>) и fallback-контент?
24. Знаю ли я, как использовать <iframe> безопасно (с атрибутами sandbox, allow)?
25. Умею ли я подключать внешние ресурсы: CSS через <link>, JavaScript через <script>?
26. Знаю ли я, что делает <script type="speculationrules"> и когда уместен prerender?
27. Понимаю ли я разницу между defer и async у тега <script>?
28. Знаю ли я, как использовать метатеги для SEO и мобильных устройств (viewport, description, keywords)?
29. Могу ли я создать список навигации с помощью <nav> и <ul>?
30. Понимаю ли я, как работает атрибут role и когда его стоит использовать?
31. Знаю ли я основные правила доступности (a11y) при написании HTML?
32. Умею ли я использовать ARIA-атрибуты, если стандартных элементов недостаточно?
33. Понимаю ли я, зачем нужен уникальный id и многократно используемый class?
34. Знаю ли я, как избежать дублирования id на одной странице?
35. Могу ли я объяснить, что такое "валидный HTML" и как его проверить?
36. Понимаю ли я, как браузер строит DOM из HTML-кода?
37. Знаю ли я, какие элементы являются самозакрывающимися (void elements)?
38. Умею ли я экранировать специальные символы (<, >, &) в тексте?
39. Понимаю ли я, как работает атрибут title и когда его уместно использовать?
40. Знаю ли я, как создать кнопку, которая не отправляет форму по умолчанию?
41. Могу ли я реализовать базовую многоязычность с помощью lang и hreflang?
42. Понимаю ли я, когда использовать dir (ltr/rtl) для направления текста?
43. Знаю ли я, как работает translate="no" для защиты терминов и кода от автоперевода?
44. Понимаю ли я, как работает атрибут loading="lazy" для изображений и iframe?
45. Знаю ли я, как использовать <picture> для адаптивных изображений?
46. Умею ли я структурировать длинный текст с помощью <p>, <br>, <hr>?
47. Понимаю ли я, почему не следует использовать <div> вместо семантических элементов?
48. Знаю ли я, как работают атрибуты data-* и для чего они нужны?
49. Могу ли я объяснить, что такое прогрессивное улучшение и как HTML в него вписывается?
50. Понимаю ли я, как HTML влияет на производительность загрузки страницы?
51. Знаю ли я, как избежать FOUC (Flash of Unstyled Content) при правильной организации HTML и CSS?
52. Умею ли я писать HTML, который корректно отображается даже при отключённом JavaScript?
53. Могу ли я обосновать выбор семантического элемента для любого блока контента на странице?
54. Знаю ли я назначение <template>, <output> и <datalist>?
55. Могу ли я управлять <video> из JavaScript (play, currentTime, события)?

---