6 Aug 2026, 12:15 UTC64 views13 reactionsread 8 August 2026 Photo
🦢 SVH или DVH: что юзать в мобильных адаптивах?
⠀
На десктопе собрать полноэкранный блок проще простого. Ставим 100vh — и готово, секция занимает весь монитор. На мобилках эта магия ломается: в игру вступают адресная строка, нижняя навигация и другие панели браузера.
⠀
👨💻 Как работает 100svh?
Единица считается от минимальной высоты экрана, когда все панели открыты. Блок аккуратно встаёт в видимую зону, а контент не …
🔥6❤4👍3
20 Jul 2026, 16:12 UTC142 views10 reactionsread 8 August 2026 Photo
🦢 Почему Header, Nav, Main и Section — не просто красивые названия?
В визуальном конструкторе легко собрать всю страницу из обычных div’ов. Пользователь разницы почти не заметит: блоки стоят на месте, ссылки работают, дизайн совпадает на 100%. Но вот для браузера и поисковых систем такая структура — это темный лес.
Семантические теги как раз объясняют роли элементов:
• Header — верхняя часть страницы;
• Nav — основ…
👍5❤3👌2
6 Jul 2026, 08:43 UTC177 views14 reactionsread 8 August 2026 Photo
Салют! 🤘
Добрались до финала. Девятый урок бесплатного курса по Taptop уже в боте.
⠀
Закрываем лендинг ГКВ. Мы прошли путь от пустого экрана и UI-kit до полностью сверстанных блоков и адаптивов. Осталось вдохнуть в проект жизнь.
⠀
В новом уроке работаем с анимациями и шлифуем верстку:
• Подключаем Lenis для плавного скролла.
• Анимируем заголовки через маску и выезд букв ГКВ.
• Работаем с настройками easing и delay.
…
🔥7❤5🤩2
1 Jul 2026, 09:09 UTC185 views9 reactionsread 8 August 2026 Photo
🪗 Что такое vh и зачем он нужен?
Если vw работает с шириной, то vh зависит от высоты экрана. Тут всё просто: 1vh равен 1% от высоты окна браузера.
Звучит банально, но в вёрстке без этой единицы никуда. Например, когда нужно растянуть секцию строго на весь экран. Обложки, стартовые заставки, полноэкранные меню или декоративные фоны. Ставим высоту 100vh, и блок уверенно занимает всю видимую область.
Но есть серьезны…
❤3🔥3👍2🤔1
26 Jun 2026, 07:53 UTC173 views11 reactionsread 8 August 2026 Photo
Салют, друзья! 🤘
⠀
Открываем восьмой урок бесплатного курса по Taptop.
⠀
На этот раз добираемся до финала лендинга и собираем footer.
⠀
Казалось бы, что там делать: логотип, пара ссылок и всё. Но нет, footer тоже умеет подкинуть задачек.
⠀
Внутри соберём графический знак ГКВ из двух частей, настроим нижнюю сетку со ссылками и меню, добавим hover-состояния и сделаем popup для юридических документов.
⠀
Popup, кстати, б…
🔥6❤3👍2
25 Jun 2026, 11:55 UTC166 views11 reactionsread 8 August 2026 Photo
🧩 Что такое vw и как мы делаем флюид
Для флюидной вёрстки vw это база. Единица жестко привязана к ширине окна браузера. Экран шире, значит блок больше. Экран уже, блок меньше. Дубовые пиксели так не умеют: задали 40px, и они застрянут в одном размере на всех мониторах.
Благодаря vw всё масштабируется плавно, без резких скачков между брейкпоинтами. Это идеально для флюида.
Но верстать всё напрямую в vw это настояща…
🔥9👌1🤔1
17 Jun 2026, 13:51 UTC193 views17 reactionsread 8 August 2026 Photo
Салют, друзья! 🤘
⠀
Открываем седьмой урок бесплатного курса по Taptop.
⠀
На этот раз собираем блок FAQ. Урок получился объёмный, поэтому разбили его на 6 частей.
⠀
Внутри будет две зоны: аккордеон с вопросами и ответами, а ниже карточка UI-kit, которая появляется при скролле.
⠀
Сначала собираем основу раздела: сетку, декоративные линии, боковые колонки с буквами ГКВ и центральную часть под контент.
⠀
Дальше разбираем…
🔥8👍6❤2👏1
15 Jun 2026, 06:54 UTC144 views16 reactionsread 8 August 2026 Forwarded from @IZUMDIGITALPhoto
🔥 Начинаем большую перезагрузку IZUM.STUDY 🔥
Мы выросли из старого формата. Проект трансформируется в масштабную экосистему для разработчиков с глубокой базой знаний, библиотекой скриптов и профильным комьюнити. Под такие амбиции нам был нужен соответствующий стиль: смелый и узнаваемый.
За брендинг отвечал Саша Лагута. Представлять его долго не нужно: сооснователь Dprofile, автор дизайн-клуба «Плюс к уровню» и абсо…
🔥8❤5🤩3
9 Jun 2026, 13:42 UTC209 views9 reactionsread 8 August 2026 Photo
👀 Когда дополнительные breakpoint’ы реально нужны?
Есть ощущение, что чем больше разрешений в макете, тем лучше будет сайт.
1280, 1366, 1440, 1600, 1920, планшет, мобилка, маленькая мобилка — звучит так, будто «мы предусмотрели всё».
На практике это не всегда так.
Дополнительный breakpoint нужен не тогда, когда «давайте ещё одно состояние на всякий случай».
Он нужен, когда на этом разрешении реально меняется повед…
🔥6👍3
3 Jun 2026, 08:18 UTC203 views11 reactionsread 8 August 2026 Photo
⚠️ Почему em может быть неудобен в отступах ⚠️
em — рабочая единица измерения. Но в отступах она часто ведёт себя неочевидно.
em всегда зависит от размера шрифта конкретного элемента. Звучит безобидно, пока не начинаешь ставить отступы.
Например, задаём margin 3em.
У текста с font-size 16px получаем одно расстояние.
У заголовка с font-size 56px те же 3em превращаются уже в совсем другой отступ.
Технически всё вер…
👍5🔥5🤔1
1 Jun 2026, 06:47 UTC174 views13 reactionsread 8 August 2026 Photo
Салют, друзья! 🤘
⠀
Открываем шестой урок бесплатного курса по Taptop.
⠀
На этот раз собираем большой блок «Чеклист». Урок получился объёмный, поэтому разбили его на 5 частей.
⠀
Внутри будет 4 раздела, у каждого свой цвет фона, своя структура контента, а заголовки фиксируются, пока правая часть движется при скролле.
⠀
Первые два раздела собираем в более спокойной логике: заголовок фиксируется, а контент движется при с…
❤5👍5🔥3
28 May 2026, 08:34 UTC208 views22 reactionsread 8 August 2026 Photo
👀 Perfect pixel или флюид?
Perfect pixel звучит красиво. Взяли макет, перенесли всё пиксель в пиксель. Получили идеальное совпадение.
Но есть нюанс. Сайт живёт не в одном размере экрана. У пользователей мониторы на 1280, 1366, 1440, 1600, 1920. Плюс куча промежуточных вариантов, планшеты, мобилки, разные браузеры и высоты окон.
Если держать всё строго в пикселях, быстро вылезает проблема. На одном разрешении всё р…
❤10👍6🔥6
Showing the 12 most recent of 20 posts we hold for @izum_study. View and reaction counts are the latest single reading for each post, not a live figure, and a recent post is still accumulating both. A view count marked ≈ was rounded by Telegram before we ever saw it — t.me prints views in full below 1,000 and to three significant figures above, so ≈1,200,000 means somewhere between 1,150,000 and 1,249,999. Unmarked counts are exact. Text is reproduced from the public post preview and truncated for length.