WebDEV

Адаптивная верстка сайта CSS, HTML 2025. Макет Bodyshape. Подробный урок CSS Grid

Адаптивная HTML CSS верстка сайта из Figma лендинга спорт фитнес клуба BodyShape.

📺 YouTube

WebDEV #видео

YouTube

Адаптивная верстка сайта CSS HTML 2025. Макет BodyShape. Подробный урок. CSS Grid

Адаптивная HTML CSS верстка сайта из Figma лендинга спорт фитнес клуба BodyShape.

Макет, материалы и готовый код: https://xn--r1a.website/+9XtDDNBdHAk4Yjhi (пост за 13.01.2025)

Верстка по пакету из Figma, CSS, переменные, fexbox и css grid. Медиазапросы и адаптивная…

934 views08:07

WebDEV

WebDEV #test #Frontend

Выберите правильный вариант 👇🏼

846 views11:07

WebDEV

🗒️ Ответ

Anonymous Quiz

10%

Использование WebP для изображений

15%

Уменьшение количества HTTP-запросов

53%

Использование CDN и серверного кеширования

22%

Сжатие CSS и JavaScript

175 voters865 views11:07

WebDEV

WebDEV #test #Frontend

Выберите правильный вариант 👇🏼

867 views11:37

WebDEV

🗒️ Ответ

Anonymous Quiz

70%

Обеспечивает синхронизацию анимации с частотой обновления экрана

Уменьшает объем используемой памяти

12%

Позволяет анимации запускаться только в фоновом режиме

Полностью исключает необходимость JavaScript

129 voters856 views11:37

WebDEV

WebDEV #test #Frontend

Выберите правильный вариант 👇🏼

878 views11:07

WebDEV

🗒️ Ответ

Anonymous Quiz

Использование только локальных шрифтов

40%

Применение свойства font-display: swap;

46%

Предварительная загрузка шрифтов через <link rel="prefetch">

Сжатие шрифтов до формата WOFF2

157 voters883 views11:07

WebDEV

WebDEV #test #Frontend

Выберите правильный вариант 👇🏼

791 views11:07

WebDEV

🗒️ Ответ

Anonymous Quiz

Использование большого количества JavaScript на странице

79%

Отсутствие размеров для изображений и встроенных объектов

Применение анимаций с использованием transform

Использование Web Fonts без предзагрузки

139 voters764 views11:07

WebDEV

💡Добавляйте прогресс-бары на сложных страницах

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

WebDEV #советы

776 views16:07

WebDEV

WebDEV #test #Frontend

Выберите правильный вариант 👇🏼

771 views11:07

WebDEV

🗒️ Ответ

Anonymous Quiz

25%

Это может вызвать проблемы с доступностью (Accessibility)

69%

Элементы могут некорректно позиционироваться в случае адаптивной верстки

Это увеличивает нагрузку на рендеринг страницы