Веб и изображения — кадр, CSS, файл и бумага
Семь учебных связей. Родитель — практика. Мосты: отношение a/b, площадь прямоугольника, длительность после секунд канала, скорость как тройка в других единицах.
Кадр, мегапиксели и печать
Одинаковое отношение сторон масштабирует прямоугольник. Мегапиксели считают точки. Печать переводит пиксели в дюймы бумаги: 3000 px / 300 DPI = 10 дюймов.
px, rem и HEX
rem = px / base — доли корневого кегля, часто 16. #RRGGBB — три байта 0…255, короткая тройка удваивается. Не em-цепочка и не hsl().
Загрузка и трафик
t = S / v — ждать известный файл. S = v · t — сколько байт за окно. МБ = 10⁶ байт, Мбит/с через 8. Не километры из физики.
Чего здесь нет
Нет графического редактора, нет конвертера КиБ как отдельной страницы, нет альфы и именованных цветов CSS, нет Photoshop, нет ICC-профиля лаборатории, нет живых тарифов провайдера.
Как пользоваться
Подогнать превью — пропорции. Сколько точек — мегапиксели. Лист бумаги — DPI. Макет в CSS — px/rem. Заливка — HEX. Файл уже есть — время загрузки. Знаете окно и канал — объём передачи, затем при желании ч:м:с. Не кладите Мп в мегабайты и не делите пиксели кадра на 16 как будто это rem.
Вернуться к разделу Практика.
Частые вопросы
- Как подогнать картинку без растяжения?
- Пропорции кадра: w₂ = w₁ h₂ / h₁. 1920×1080 в высоту 720 → ширина 1280.
- 32 px — это сколько rem?
- rem = px / base. При корне 16 получается 2 rem. Это не em родителя.
- Сколько качать файл или какой трафик за час?
- Время — когда известен размер файла. Объём — сколько байт за окно времени. 1 МБ при 8 Мбит/с → 1 с или 1 МБ за секунду.
- Как разобрать #FF0000?
- HEX и RGB: R = 255, G = 0, B = 0. Короткая запись F00 тоже красный. Без альфы.
- Мегапиксели и печать — одно?
- MP = w · h / 10⁶: Full HD → 2,0736. Дюймы = пиксели / DPI: 3000 px при 300 DPI → 10 дюймов.
- Родитель раздела?
- Практика. Рядом даты и время. Мост к отношение и ч:м:с.