Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
  1. Главная >
  2. Блог >
  3. Туториалы LPgenerator >
  4. Словарь терминов по фронтенду

Словарь терминов по фронтенду

Терминология

Когда дело доходит до разговора о веб-дизайне, многие люди начинают перлы вроде “броузер” или того хуже. Ниже приведен список самых популярных терминов и выражений по фронтэнду, для всеобщего образования. Читаем, учим, говорим правильно!

A

adaptive design

адаптивный дизайн, подход к дизайну сайтов, учитывающий их адаптацию под различные устройства и условия, противопоставляется распространённому «фиксированному» дизайну только для компьютеров.

anchor

ссылка, гиперссылка между двумя документами.

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

animation

анимация, плавное изменение визуальных параметров объекта.

asset

ресурс, обычно вспомогательный, как стили и картинки для страницы, напр. ресурсы сайта — site assets.

assert

проверка, условие, которое проверяется, употр. в тестировании, напр. проверка поля не прошла — field assert has failed.

B

browser

бра́узер

back-end

бэке́нд

область веб-технологий, работающих на сервере.
внутренняя часть серверной системы, занимается обработкой данных.
background

фон, напр. фоновое изображение — background image.

baseline

базовая линия, воображаемая линия в основании букв в строке.

blockquote

блочная цитата, HTML-элемент для выделения цитируемой нестрочной области документа. Может содержать атрибут cite со ссылкой на первоисточник.

border

рамка, внешняя видимая часть блока, напр. рамка слева — border-left.

border-radius

скругление рамки, напр., скругление рамки на 3 пикселя — border-radius:3px, скругление верхнего левого угла — border-top-left-radius, см. также скруглённые углы.

box model

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

box-shadow

тень (блока), напр. тень блока красная — box-shadow is red.

breadcrumbs

хлебные кро́шки, вспомогательная навигация на сайте, последовательно отражающая структуру или пройденные шаги.

button

кнопка

элемент интерфейса, при нажатии отправляющий форму или производящий иное действие
элемент формы button или input type="button" (также submit и image).

C

callback

обратный вызов, исполнение кода по завершению работы функции, напр. передай значение в обратном вызове — pass value in a callback.

cell

ячейка

структурная единица таблицы.
элемент таблицы td или th
cellpadding

отступ в ячейках таблицы.

cellspacing

расстояние между ячейками таблицы.

checkbox

чекбо́кс

элемент интерфейса для выбора одного или нескольких вариантов, напр. чекбокс неактивен — checkbox is disabled.
элемент формы input type="checkbox"
clear

очистка (потока)

clear:left — очистка слева
clear:right — очистка справа
clear:both — полная очистка
client-side

клиентсайд, область технологий, работающих в браузере, часто синоним фронтенда.

closure

замыкание, функция, содержащая в теле ссылки на переменные, объявленные в окружающем коде.

code

сущ. код, неисчисл. (как сахар), напр. ошибка в коде — error in code но не ошибка в кодах (неправильно).
гл. писать код, верстать, программировать, напр. верстать сайт — to code a site.
colspan

объединение столбцов, HTML-атрибут для объединения нескольких ячеек таблицы в одной строке.

column

столбец, колонка, вертикальная область в таблице, раскладке или тексте.

content

содержимое

cross-browser

кроссбра́узерный, работающий во всех браузерах, слитно.

cross-platform

кроссплатфо́рменный, работающий во на всех платформах, слитно.

CSS Working Group (CSSWG)

Рабочая группа CSS

D

design

сущ. дизайн, визуальный облик сайта, может включать принципы взаимодействия и архитектурные решения, напр. новый дизайн для сайта — new design for site.
гл. разрабатывать, создавать или проектировать внешний вид и функциональность.
disabled

неактивный, состояние элемента формы, в котором его изменение запрещено, напр. неактивная кнопка — disabled button.

display

вид

display:none — скрытый вид
display:block — блочный вид
display:inline — строчный вид
display:inline-block — вид строчного блока

DOM

объектная модель документа, дом

doctype

докта́йп, конструкция вида DOCTYPE html в начале документа, которая обозначает используемую версию HTML.

dropdown

выпадающее меню, элемент интерфейса, раскрывающий дополнительную информациию при активации.

E

easing

плавность, функция плавности, описывает изменение скорости анимации с помощью ключевых слов или кривых Безье, напр. плавность перехода линейная — transition easing is linear.

em

ем, единица измерения в CSS, которая зависит от размера шрифта родителя, напр. размер шрифта 3 ема — font-size:3em.

enabled

активный, состояние элемента формы, в котором его изменение разрешено, напр. активная кнопка — enabled button.

engine

движок, напр. Сафари работает на движке Вебкит — Safari is based on WebKit engine.

F

fallback

TODO

favicon

фавикон, значок сайта, обычно 16×16 пикселей в формате ICO.

fieldset

группа полей, элемент, объединяющий несколько полей формы, напр. зелёная рамка на группе полей — green border on a fieldset.

figure

фигура, элемент из HTML5, содержащий изображение, видео, таблицу, график или фрагмент кода.

figcaption

заголовок фигуры, заглавие или подпись к фигуре.

float

прил. плавающий, свойство блока, заставляющее последующие блоки обтекать его, напр. раскладка на плавающих блоках — float layout.
гл. обтекать, следовать вплотную к плавающему блоку, напр. текст обтекает справа — text is floating to the right.
гл. прижимать, упираться вправо или влево, обычно из-за плавающих свойств, напр. прижмите блок влево — float block to the left.

font

шрифт

font-weight — насыщенность
font-weight:normal — нормальная
font-weight:bold — полужирная, (не «жирный»)
font-weight:bolder — жирнее
font-weight:lighter — светлее
font-style — стиль шрифта
font-style:normal — прямой
font-style:italic — курси́в
font-style:oblique — наклонный
font-size — размер шрифта, кегль
font-family — семейство шрифта, гарнитура
font-family:serif — с засечками
font-family:sans-serif — без засечек
font-family:monospace — моноширинный

footer

подвал

характерная визуальная область в конце страницы.
элемент footer — смысловая часть с метаинформацией.

framework

фреймво́рк, набор готовых решений для упрощения разработки.

front-end

фронте́нд

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

full screen

полноэкранный режим, поведение программы или её части, в котором она занимает весь экран целиком.

G

graceful degradation

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

gradient

градие́нт, плавный переход от одного цвета к другому.

linear gradient — линейный градиент
radial gradient — радиальный градиент
conical gradient — конический градиент
grid

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

H

header

шапка

характерная визуальная область в начале страницы.
элемент header — смысловая озаглавливающая часть.
height

высота

I

implement

внедрять, реализовывать напр. Firefox внедрил поддержку всего — Firefox has implemented support of everything.

inline

строчный

inline block — строчный блок
inline box — элемент строки в строчном форматировани: часть наполнения контейнера строки, к которой непосредственно применяются CSS-правила, напр. анонимный элемент строки — anonymous inline box.
inline element — строчный элемент
inline styles — локальные стили
input

поле (ввода), элемент формы. TODO.

K

kerning

кернинг, расстояние между парами букв, учитывающее их форму для более равномерного набора.

keyframe

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

keyframe animation

покадровая анимация, способ задания анимации в CSS с помощью ключевых кадров.

L

layout

раскладка, расположение основных блоков на странице, напр. раскладка в 3 столбца — 3 columns layout.

letter-spacing

межбуквенное расстояние, тре́кинг, общее расстояние между буквами в тексте, отличается от кернинга.

line-box

контейнер строки в строчном форматировании: виртуальный контейнер, содержащий в себе все элементы одной строки.

line-height

высота строки, интерлинья́ж, расстояние между базовыми линиями текста.

list

список, последовательное перечисление группы элементов.

ordered list — упорядоченный список, отсортированный по какому-либо принципу.
unordered list — неупорядоченный список, в котором порядок следования не имеет значения.

list-style

стиль списка

M

margin

внешний отступ, напр. нижний отрицательный отступ 10 пикселей — margin-bottom:-10px.

matrix

ма́трица (трансформации), описание трансформации объекта с помощью матрицы.

media queries

медиавыраже́ния, слитно.

mixin

при́месь, набор свойств, расширяющий поведение другой сущности, встречается в CSS-препроцессорах и подходах к JavaScript, напр. примесь очищает поток — mixin is clearing.

mock-up

макет, внешний вид или дизайн сайта различной степени детализации, напр. дизайнер прислал макет страницы — designer sent a page mock-up.

modal

прил. мода́льный, блокирующий интерфейс для выполнения какого-либо действия, напр. модальный диалог — modal dialog.
сущ. модальное окно (диалог), элемент интерфейса, см. модальный.
multiple

множественный, повторённый два и более раз, напр. множественные фоны — multiple backgrounds.

multiple columns

мультиколо́нки, механизм из CSS, позволяющий выстроить текст в несколько колонок, напр. поддержка мультиколонок в IE — multiple columns support in IE. Предпочтительнее, чем громоздкие «множественные колонки».
многоколо́ночный, состоящий из нескольких колонок, напр. многоколоночная раскладка — multiple columns layout.

N

nested

вложенный, находящийся внутри чего-либо, напр. двойная вложенность — double nesting.

node

узел, элемент структуры, напр. дочерний узел — child node.

O

opacity

прозрачность, степень прозрачности, напр. прозрачность 10% — opacity:0.1.

opaque

непрозрачный, степень непрозрачности, напр. непрозрачен на 75% — opaque by 75%, значит прозрачность 25%.

outline

обводка, внешний равномерный контур элемента, не участвующий в блочной модели.

P

package manager

TODO

padding

внутренний отступ, напр. верхний внутренний отступ 10 пикселей — padding-top:10px.

pagination

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

па́ттерн, формализованный подход к написанию кода, напр. паттерны JavaScript — JavaScript patterns.

performance

быстродействие, характеристика скорости загрузки, отрисовки и т.п., напр. быстродействие CSS.

pixel

пи́ксель, единица измерения для экранного дизайна, в мн.ч. пиксели, сокр. пк.

polyfill

полифи́л, скрипт, воссоздающий недостающую функциональность, напр. новый полифил для IE6 — new polyfill for IE6.

popup

всплывающее окно, попа́п, отдельное окно или элемент интерфейса, появляющийся поверх текущего, напр. назойливый попап — annoying popup.

position

позиционирование

position:static — статичное
position:absolute — абсолютное
position:relative — относительное
position:fixed — фиксированное
position:sticky — закреплённое

preprocessor

препроце́ссор, инструмент, преобразующий код из одного синтаксиса в другой, напр. CSS-препроцессор Sass — Sass CSS preprocessor.

promises

про́мисы, способ асинхронного выполнения скриптов, противопоставляется использованию обратных вызовов.

progress bar

индикатор выполнения, элемент интерфейса, отражающий прогресс выполнения операции.

progressive enhancement

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

R

radio button

радиокно́пка, элемент формы input type="radio" для выбора одного варианта из нескольких, напр. радиокнопка выбрана — radio button is checked.

rem

рем, единица измерения в CSS, которая зависит от размера шрифта корневого элемента html, напр. размер шрифта 3 рема — font-size:3rem.

reset

сброс, обычно сброс стилей по умолчанию в CSS, напр. файл сброса стилей — style reset file.

responsive design

TODO

Responsive Images Community Group (RICG)

Общественная группа по адаптивным изображениям

rounder corners

скруглённые углы, напр. скруглённые углы вышли из моды — rounded corners are out of fasion, см. также скругление рамки.

row

строка, ряд

горизонтальная область в таблице или раскладке.
элемент таблицы tr

rowspan

объединение строк, HTML-атрибут для объединения нескольких ячеек таблицы в одном столбце.

S

scaffolding

скафо́лдинг, автоматическая генерация кода по описанию, метод метапрограммирования.

scale

сущ. масштаб
гл. масштабировать

script

скрипт, инструкции, описывающие поведение страниц, напр. скрипты пока не подгрузились — scripts are not loaded yet.

semantics

семантика, смысловая нагрузка HTML-элементов, напр. семантическая вёрстка — semantic coding.

server-side

серверсайд, область технологий, работающих на сервере, часто синоним бэкенда.

shadow DOM

теневой DOM, теневая модель документа

shim

шим, код, помогающий унифицировать работу с браузерами, обычно реализует недостающую или нормализует существующую поддержку, напр. HTML5-шим для IE8 — HTML5 shim for IE8.

sidebar

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

skew

сущ. наклон
гл. наклонять
source maps

карты кода, специальная разметка, позволяющая привести в соответствие исходные файлы и скомпилированный код для отладки.

style

сущ. стили, напр. применить стили к элементу — apply styles to an element, мн.ч. предпочтительнее: стили элемента, а не стиль элемента (неправильно).
гл. оформлять, напр. как оформить селекты — how to style selects. Предпочтительнее, чем двусмысленное «стилизовать».

T

tab

вкладка, один из слоёв интерфейса сайта или программы, который активируется выбором его заголовка, напр. открыть в новой вкладке — open in new tab.
таб, клавиша табуляции, вставляет символ табуляции, переключает фокус на следующий элемент интерфейса, либо дополняет частично набранное слово, напр. нажмите контрол-таб — press Ctrl Tab.
таб, символ табуляции, имеет настраиваемую ширину и используется для отступов в коде, напр. табы лучше пробелов — tabs are better than spaces.

textarea

текстовая область, элемент формы для ввода многострочного текста.

text-align

выравнивание, вы́ключка, ориентация строк текста в определённом направлении, либо равномерно по ширине блока.

text-align:left — влево
text-align:right — вправо
text-align:justify — по ширине

text-shadow

тень (текста), напр. тень текста красная — text-shadow is red.

thumbnail

миниатюра, уменьшенная копия изображения.

title

заголовок, если речь идёт об элементе title, либо о заглавии элемента.
подсказка, если речь идёт об атрибуте title="".

toggle

переключать, переводить из одного состояния в другое, переключить классы — toggle classes.

tooltip

всплывающая подсказка, вспомогательная информация, появляющаяся при наведении на элемент или при его активации, в частности title="".

touch

TODO

transform

трансформация, напр. трансформация масштабированием в 2 раза — transform:scale(2).

transition

переход, напр. линейный переход длительностью 2 секунды — transition:all 2s linear.

translate

перемещать, перемещение объекта с помощью CSS-трансформации, напр. перемещение на X и Y — translate(x, y).

typography

типографика, оформление текста с помощью выбора гарнитуры, параметров строки и других.

U

unit

единица изменения, напр. единица измерения «рем» — rem unit.

utility

утили́та, программа с узким назначением.

V

valid

TODO

validator

TODO

vendor prefix

бра́узерный пре́фикс, приставка к CSS-свойству -webkit- или -moz-, напр. добавьте браузерные префиксы — add vendor prefixes.

vertical-align

вертикальное выравнивание, расположение элементов по вертикали в пределах строки текста или таблицы.

viewport

вьюпо́рт

видимая область документа в рамках экрана.
элемент meta name="viewport", управляющий адаптацией страниц на мобильных устройствах.

W

website, web site

сайт, объединённые под одним адресом страницы, перевод «веб-сайт» избыточен.

World Wide Web Consortium (W3C)

Консорциум всемирной сети, организация, разрабатывающая веб-стандарты. Переводить «web» как «паутину» в XXI веке уже смешно.

web standards

веб-стандарты

width

ширина

word-spacing

межсловный пробел

workaround

обходное решение (приём), способ решения задачи в ограниченных условиях, напр. придумать обходной приём — to figure out workaround.

blog comments powered by Disqus
Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
copyright © 2011–2024 Все права защищены
Запрещено любое копирование материалов ресурса без письменного согласия владельца — ООО "Феникс-Маркетинг". ИНН:7725812838, КПП:772501001, ОГРН: 513774619323915280, Москва, ул. Ленинская слобода, д. 19, стр. 1, этаж/пом 3/25

ООО «Феникс-Маркетинг» — IT-компания с многолетним опытом работы, разрабатывающая инновационные решения для управления процессом лидогенерации (пост-клик маркетинг). Разработанное нами технологическое программное решение LPGENERATOR позволяет создавать целевые страницы в визуальном редакторе и управлять заявками (лидами) в CRM-системе в целях проведения эффективных, высококонверсионных рекламных кампаний