1. НА ОДНОМ ЯЗЫКЕ: 21 ТЕРМИН ИЗ HTML-
ВЕРСТКИ, ЧТОБЫ ЛУЧШЕ ПОНИМАТЬ
РАЗРАБОТЧИКОВ
ПОДГОТОВЛЕНО:

2. Преподаватель программы обучения «HTML-верстка»,
технический директор digital-агентства PLUS8 Дмитрий
Демидовский составил для «Нетологии» словарь из 21
термина, с помощью которых вы сможете лучше
понимать разработчиков.
На одном языке: 21 термин из html-версткиНетология
ОТ СОСТАВИТЕЛЕЙ

3. Означают практически одно и то же: код, работающий
в браузере.
Для сравнения, в отличие от фронтэнда, бэкэнд
(backend) исполняется на сервере.
ВЕРСТКА, FRONTEND

4. Контент сайта (тексты, изображения, видео, аудио),
сгруппированный по смыслу в иерархические блоки,
обозначенные тегами.
HTML-РАЗМЕТКА

5. Главное и единственное средство разметки контента.
Обозначается треугольными скобками.
Некоторые теги имеют начало и конец: <тег>…</тег>.
Некоторые могут быть сами по себе.
HTML-ТЕГ

6. «Кирпичик» сайта, его структурная единица. То, что
образовано тегом.
HTML-ЭЛЕМЕНТ

7. Дополнительный параметр тега, который определяет его вид или
поведение. Пример атрибута:
<тег имя_атрибута="значение_атрибута">.
Один тег может иметь много атрибутов.
АТРИБУТ

8. СТИЛИ, CSS
Cascading Style Sheets (CSS) — каскадные таблицы
стилей. Набор правил для оформления элементов.

9. CSS-СВОЙСТВО
Параметр элемента, отвечающий за какой-либо один
аспект его отображения. Например, размер или цвет.

10. CSS-ПРАВИЛО
Определяет применение свойств к элементу или
группе элементов. Правило может состоять из
множества свойств.

11. СКРИПТЫ, JAVASCRIPT, JS
Скрипты — «народное название» Javascript. JS — сокращение от
Javascript.
Код, отвечающий за взаимодействие с пользователем и за
динамические элементы на сайте — слайдеры, меню, некоторые
формы.
Иногда его путают с Java. Это неправильно — это два разных
языка с разными задачами.

12. Библиотека, написанная на JS. Очень популярна,
выступает стандартом на множестве сайтов.
JQUERY

13. Специальные теги, которые не отображаются
непосредственно на веб-странице, но хранят
дополнительную информацию о документе:
кодировка, ключевые слова, данные для поисковых
роботов и социальных сетей.
МЕТАТЕГИ, МЕТАДАННЫЕ

14. Cпособ применять различные CSS-правила в зависимости от
используемого устройства.
Пример медиазапроса:
@media screen and (max-width: 480px) { этот код будет работать
только на мобильных устройствах с экраном меньше 480 пикс. }
МЕДИАЗАПРОСЫ, MEDIAQUERIES

15. Фиксированная верстка имеет постоянную ширину,
обычно около 1000px. На больших экранах центрируется,
на маленьких обрезается.
Пример фиксированной верстки — социальная сеть
«ВКонтакте».
ФИКСИРОВАННАЯ ВЕРСТКА (ФИКС)

16. Резиновая верстка подстраивается под экран в
определенных заданных пределах. Например, от 1024px
до 1920px.
Пример — «Яндекс.Почта».
РЕЗИНОВАЯ ВЕРСТКА (РЕЗИНА)

17. АДАПТИВНАЯ ВЕРСТКА (АДАПТИВ)
Верстка, которая подстраивается под любой
экран. Блоки могут перемещаться, скрываться и
показываться, а также менять свое поведение.
Пример — Smashing Magazine.

18. ФРЕЙМВОРК
Набор компонентов, с помощью которых можно
применять готовые решения для типовых задач
(адаптивные элементы, способы навигации, элементы
форм), а не писать их с нуля.

19. КРОССБРАУЗЕРНОСТЬ
Способность сайта одинаково отображаться как в
современных, так и в старых браузерах.

20. ВАЛИДНОСТЬ
Соответствие вёрстки официальным утвержденным
стандартам.

21. Подход, позволяющий ускорить загрузку и отрисовку
верстки. Реализуется не верстальщиком, а
разработчиками браузеров.
КЭШ БРАУЗЕРА

22. НTML5-технология, заменившая Flash в плане
отображения графики в браузере. Использует
аппаратное ускорение, программируется на Javascript,
позволяет делать сложную графику, в том числе
трехмерную.
КАНВАС, CANVAS

23. Дополнительные инструменты для обработки кода. Существуют
и для HTML, и для CSS, и для JS. Призваны ускорить и упростить
работу верстальщика за счет автоматизации и дополнительных
возможностей, которых нет в языках изначально.
Препроцессоры: для HTML — HAML, для CSS — SASS, для JS —
CoffeeScript.
Постпроцессоры: для CSS — Autoprefixer, для JS — yui compressor
ПРЕПРОЦЕССОРЫ И
ПОСТПРОЦЕССОРЫ

24. Переходим от теории к практике!
Хотите получить профессию HTML-
верстальщика и сделать свой первый макет
за 1,5 месяца практических занятий?
Жмите на кнопку.
ЗАПИСАТЬСЯ

25. Занятия от ведущих
специалистов Рунета
Обучение с
любого устройства
Открытые занятия
c экспертами Рунета.
3 раза в неделю.
Онлайн университет
для обучения наиболее
перспективным
профессиям Рунета. 1,5–
2,5 месяца.
Интерактивные курсы
по маркетингу и интернет-
бизнесу, 100+ курсов. Доступ
24/7!
FREE

26. ПРИСОЕДИНЯЙТЕСЬ К «НЕТОЛОГИИ»
В СОЦИАЛЬНЫХ СЕТЯХ
• Полезные статьи и видео по
маркетингу и менеджменту
• Материалы из курсов и
учебных программ
«Нетологии»
• Скидки и конкурсы на
бесплатное обучение