Введите хотя бы 2 символа для поиска по всем отраслям.
Английские термины веб-разработки — перевод и примеры
HTML, CSS, JavaScript, сообщения браузера и документация веб-фреймворков постоянно знакомят разработчика с английскими словами. Русские определения и разобранные примеры помогут понять запросы, интерфейсы, развёртывание и другие задачи веб-разработки.
- 100 терминов
- 11 тем
- 58 базовых терминов
- 201 примеров
Основы веба
Часть сайта или веб-приложения, которую пользователь видит и с которой взаимодействует в браузере; обычно она создаётся с помощью HTML, CSS и JavaScript.
Скрытая от пользователя серверная часть сайта или приложения: она хранит данные, выполняет бизнес-логику и передаёт клиентской части нужную информацию.
Охватывающий и клиентскую, и серверную части веб-приложения: от пользовательского интерфейса до сервера и базы данных.
Программа, например Chrome, Firefox, Safari или Edge, которая загружает веб-страницы и преобразует их код в отображаемый и интерактивный интерфейс.
Uniform Resource Locator — полный адрес страницы или файла в интернете, например https://example.com/blog?page=2.
Компьютер или программа, ожидающая запросы от браузеров и других клиентов и возвращающая страницы, файлы или данные.
Сторона соединения, запрашивающая данные, обычно браузер или мобильное приложение, в отличие от отвечающего сервера.
Приложение, работающее в веб-браузере, а не установленное на устройстве, например веб-почта, карты или инструмент управления проектами.
Встроенные в браузеры инструменты, позволяющие проверять HTML и CSS, отлаживать JavaScript, следить за сетевыми запросами и измерять производительность.
Работающий одинаково в разных браузерах, например Chrome, Firefox, Safari и Edge, их версиях и на разных устройствах.
HTML и разметка
HyperText Markup Language — стандартный язык описания структуры и содержимого веб-страницы, например заголовков, абзацев, ссылок и изображений.
Отдельная составная часть HTML-страницы, например абзац, изображение или кнопка; обычно записывается как открывающий тег, содержимое и закрывающий тег.
Фрагмент HTML-кода в угловых скобках, например <h1> или </p>, который отмечает начало или конец элемента.
Дополнительные сведения в виде имени и значения внутри открывающего HTML-тега, например href у ссылки или alt у изображения.
Атрибут HTML с одним или несколькими именами элемента, по которым CSS и JavaScript находят и оформляют группы элементов.
Название страницы или раздела, размеченное элементами h1–h6: h1 обозначает главный заголовок, остальные — уровни ниже.
Текст или изображение, по нажатию на которое пользователь переходит на другую страницу или место; в HTML создаётся элементом a с атрибутом href.
Часть страницы, где пользователь вводит сведения, например в форме входа, поиска или обратной связи, после чего они отправляются на сервер.
Поле или элемент управления в форме, куда пользователь вводит или выбирает значение, например имя, адрес электронной почты, пароль или дату.
HTML, в котором элементы используют в соответствии с их смыслом — например nav, main, article и button, — вместо универсальных div и span для всего подряд.
CSS и компоновка
Cascading Style Sheets — язык, который задаёт внешний вид HTML, включая цвета, шрифты, отступы, расположение элементов и анимацию.
Часть правила CSS, указывающая, к каким элементам применяются стили, например p, .button или #header.
Подход к созданию страниц, при котором одна и та же компоновка подстраивается под экраны любого размера — от телефонов и планшетов до больших мониторов.
В CSS — название настраиваемой характеристики стиля, например color, margin или display, которой всегда соответствует значение.
Файл или блок правил CSS, описывающих внешний вид страницы; большинство сайтов подключают один или несколько внешних файлов .css.
Способ размещения элементов на странице: где находятся колонки, меню, изображения и текст и как они перемещаются при изменении размера экрана.
Метод компоновки CSS для размещения элементов в одной строке или колонке и управления их ростом, сжатием, выравниванием и распределением пространства.
Система компоновки CSS для одновременного размещения элементов в строках и колонках; подходит для макетов целых страниц и галерей карточек.
Правило CSS, применяющее стили только при выполнении условия, например минимальной ширины экрана, включённого тёмного режима или печати.
Представление CSS о каждом элементе как о прямоугольном блоке из содержимого, внутренних отступов, границы и внешних отступов, вместе определяющих его размер и расстояние до соседей.
Пространство за границей элемента, отодвигающее от него другие элементы.
Пространство внутри элемента между содержимым и границей, не позволяющее содержимому вплотную подходить к краям.
Ширина экрана, при которой адаптивная компоновка меняется, например с одной колонки на телефоне на три на компьютере.
Видимая область веб-страницы внутри окна браузера или экрана телефона; её размер меняется при изменении окна или повороте телефона.
Правило CSS, определяющее, какой стиль победит, когда несколько правил подходят одному элементу: селекторы по ID важнее селекторов по классу, а те — селекторов по элементу.
JavaScript, фреймворки и инструменты
Язык программирования, который выполняется во всех веб-браузерах и делает страницы интерактивными; с Node.js он также работает на серверах.
Document Object Model — дерево объектов, которое браузер строит на основе HTML-страницы и которое JavaScript может читать и менять, пока страница открыта.
Готовый набор кода, инструментов и правил для создания приложений, задающий структуру проекта; например Angular, Vue, Next.js или Laravel.
Набор готового кода, добавляемого в проект и вызываемого при необходимости, например для дат, графиков или анимаций.
Повторно используемая самостоятельная часть пользовательского интерфейса, например кнопка, модальное окно или карточка товара, со своей разметкой, стилями и логикой.
Происходящее в браузере действие, на которое может реагировать код: например, щелчок, нажатие клавиши, отправка формы или завершение загрузки страницы.
Функция, ожидающая определённое событие на элементе, например щелчок или нажатие клавиши, и запускающаяся при его наступлении.
Так описывают код, который запускает задачу, например загрузку данных, и продолжает выполнять другой код, не дожидаясь её завершения.
Объект JavaScript, представляющий ещё не готовый результат, например данные с сервера, который позднее может быть успешно получен или завершиться ошибкой.
Преобразовать код и данные в отображаемый пользователю результат: браузер рисует страницу, сервер формирует HTML.
Данные, хранящиеся в приложении или компоненте в данный момент, например признак открытого меню или введённый пользователем текст; они определяют, что отображается.
Веб-приложение, которое загружает одну HTML-страницу, а затем меняет содержимое с помощью JavaScript при переходах пользователя, не загружая каждый раз новую страницу.
Стандартный менеджер пакетов JavaScript и онлайн-реестр, из которого он устанавливает пакеты; используется, например, командой npm install.
Внешний пакет или библиотека, необходимая проекту для работы и перечисленная, например, в package.json.
Язык программирования на основе JavaScript, добавляющий типы, благодаря которым многие ошибки обнаруживаются во время написания кода, а не при его выполнении.
Инструмент, объединяющий множество файлов JavaScript, CSS и других ресурсов вместе с их зависимостями в несколько оптимизированных файлов для быстрой загрузки браузером.
HTTP и API
Hypertext Transfer Protocol — набор правил, по которым браузеры и серверы обмениваются запросами и ответами в интернете.
Определённый способ, которым одна программа запрашивает данные или действия у другой, например веб-API, возвращающий JSON.
Сообщение, которое клиент отправляет серверу за страницей, изображением или данными либо для сохранения изменения.
Сообщение сервера в ответ на запрос; содержит код состояния, заголовки и обычно тело, например HTML или JSON.
JavaScript Object Notation — простой текстовый формат данных с ключами и значениями в фигурных скобках, используемый большинством веб-API.
Конкретный URL API, принимающий запросы одного типа данных или действия, например /api/users или /api/orders/42.
Трёхзначное число в HTTP-ответе, показывающее результат: например, 200 — успех, 404 — не найдено, 500 — ошибка сервера.
Запрашивать и получать данные с сервера или из API, например новые сообщения или список товаров, часто уже после открытия страницы.
API в стиле REST, где у каждого ресурса свой URL, а стандартные HTTP-методы GET, POST и DELETE выполняют над ним действия.
Слово в начале HTTP-запроса, указывающее, что клиент хочет сделать: например, GET — прочитать, POST — создать, DELETE — удалить.
Пара «имя — значение», передаваемая в HTTP-запросе или ответе и содержащая дополнительные сведения, например Content-Type, Authorization или Cache-Control.
Серверная часть и данные
Упорядоченное хранилище данных, например о пользователях, заказах или публикациях, куда серверная часть сохраняет данные, откуда быстро выполняет поиск и где обновляет их.
Период, в течение которого сервер помнит вошедшего пользователя, обычно по идентификатору в cookie, до выхода пользователя или истечения сеанса.
Происходящий на сервере, а не в браузере пользователя, например выполнение кода, проверка данных или рендеринг на сервере.
Именованная настройка, например URL базы данных или ключ API, передаваемая приложению извне кода, чтобы её значение могло различаться в разных средах.
Хостинг, домены и развёртывание
Понятный человеку адрес сайта, например example.com, который вводят вместо числового IP-адреса.
Услуга, которая хранит файлы и код сайта на подключённых к интернету серверах, чтобы сайт был доступен посетителям.
Разместить новую версию сайта или приложения на сервере, чтобы она стала доступна пользователям, обычно автоматически.
Цифровой файл, установленный на сервере, который подтверждает подлинность сайта и позволяет браузеру установить зашифрованное HTTPS-соединение.
Domain Name System — справочник интернета, который преобразует доменные имена, например example.com, в IP-адреса серверов.
Автоматический этап преобразования исходного кода в файлы для production, например компиляцией, объединением и минификацией; также результат этого этапа.
Программа, например Nginx или Apache, принимающая HTTP-запросы и отдающая веб-страницы и файлы; так также называют компьютер, на котором она работает.
Копия работающего сайта, максимально приближённая к production, где проверяют новые версии до показа реальным пользователям.
Производительность сайтов
Время, за которое страница загружается и появляется на экране в пригодном для использования состоянии; обычно измеряется в секундах или миллисекундах.
Место временного хранения копий файлов или данных, чтобы быстрее выдавать их повторно, например в браузере, CDN или на сервере.
Content Delivery Network — сеть серверов по всему миру, хранящих копии файлов сайта и доставляющих их с узла, ближайшего к каждому пользователю.
Приём, при котором изображения, видео или код загружаются только тогда, когда действительно нужны, например когда пользователь прокручивает страницу к ним.
Уменьшать размер файлов кода, удаляя пробелы, комментарии и переносы строк и сокращая имена, не меняя поведения кода.
Уменьшение размера файлов изображений без заметного ухудшения их вида, например с помощью сжатия, изменения размеров и современных форматов.
Три метрики Google, измеряющие реальный пользовательский опыт на странице: загрузку (LCP), отзывчивость (INP) и визуальную стабильность (CLS).
Доступность
Практика создания сайтов, которыми могут пользоваться все люди, в том числе незрячие и глухие, люди с ограниченной подвижностью и пользователи вспомогательных технологий.
Краткое текстовое описание изображения, добавленное атрибутом alt: программы чтения с экрана произносят его, а браузеры показывают, если изображение не загрузилось.
Программа, которая озвучивает содержимое экрана или передаёт его на брайлевский дисплей; в основном используется незрячими людьми и людьми с нарушениями зрения.
Accessible Rich Internet Applications — набор HTML-атрибутов, например role и aria-label, предоставляющих вспомогательным технологиям дополнительные сведения об элементах.
Числовое соотношение яркости текста и его фона: высокий коэффициент, например 7:1, легче читать, чем низкий, например 2:1.
SEO для разработчиков
Search Engine Optimization — работа над тем, чтобы страницы сайта находили, правильно понимали и показывали выше в поисковых системах, например Google.
HTML-тег в элементе head, сообщающий браузерам и поисковым системам сведения о странице, например её описание или настройки области просмотра.
Файл, обычно sitemap.xml, содержащий список страниц сайта, чтобы поисковые системы могли легче находить и обходить их.
Автоматически посещать страницы сайта, переходить по ссылкам и загружать их содержимое, чтобы поисковая система могла добавить его в индекс.
Сохранить и упорядочить просканированную страницу в поисковой системе, чтобы она могла появиться в результатах поиска.
Веб-безопасность
Процесс проверки личности пользователя, например по паролю, одноразовому коду или входу через Google либо Apple.
Защищённая версия HTTP: она шифрует соединение браузера с сервером с помощью TLS, чтобы посторонние не могли прочитать или изменить данные.
Атака, при которой злоумышленник внедряет вредоносный JavaScript в страницу, которую открывают другие пользователи, например через комментарий; скрипт запускается в их браузерах.
Атака, при которой пользователь вводит SQL-код в форму или URL, заставляя базу данных выполнить его; это может привести к раскрытию или удалению данных.
Cross-Origin Resource Sharing: правила браузера, позволяющие серверу указать, каким другим сайтам (источникам) JavaScript может читать его ответы.
Атака, которая заставляет браузер вошедшего в систему пользователя отправить нежелательный запрос доверенному сайту, например изменить адрес электронной почты.
Преобразовать данные, например пароль, односторонней функцией в строку фиксированной длины, из которой нельзя прочитать исходное значение.
Короткий тест: знаете ли вы эти термины?
Десять вопросов из словаря. Выберите правильное значение каждого термина и проверьте результат.
Как изучать лексику: Веб-разработка
- Читайте сообщения консоли и ищите незнакомые термины в документации браузера или фреймворка.
- Запоминайте слова в сочетаниях: clear the cache, deploy to staging, send a request.
- Различайте бытовое и техническое значение слов: padding в CSS обозначает внутренний отступ.
- Используйте новые выражения в коротких описаниях изменений и комментариях к задачам.
Частые вопросы
Какие английские слова нужны начинающему веб-разработчику?
Начните с browser, server, element, selector, request, response и API. Затем добавьте термины компоновки, фреймворков, производительности, доступности и безопасности.
Как лучше учить английский для веб-разработки?
Читайте документацию, сообщения об ошибках и обсуждения задач. Выписывайте короткие сочетания и используйте их в собственных комментариях: например, clear the cache или deploy to staging.
Как правильно писать: front end, front-end или frontend?
Встречаются все три формы. В традиционном оформлении front end — существительное, а front-end ставится перед другим существительным: a front-end developer. В технических текстах также распространено frontend; внутри одного текста придерживайтесь выбранного стиля.
Зачем знать русские и английские варианты?
Русский перевод проясняет смысл, а английский нужен для документации и поиска ошибок. Например, browser — браузер, server — сервер, accessibility — доступность; конкретное значение уточняется по контексту.
В русскоязычной команде использовать русские или английские термины веб-разработки?
Обычно используют оба варианта: «браузер», «сервер», «доступность» соседствуют с frontend, deploy, cache и component. Важно понимать английские термины, чтобы читать документацию и искать решения; в разговоре выбирайте привычные команде слова и придерживайтесь их.
Смежные отрасли
Закрепляйте лексику чтением
Тексты подходящего уровня помогают запоминать новые слова. Выберите бесплатные книги на английском:
