Верстка сайта HTML/CSS с использованием переменных и clamp()

Рет қаралды 16,814

Күн бұрын

8 апреля стартуют курсы по вёрстке. До 31 марта включительно скидка 30% на покупку курса:
- Базовый frontendblok.com/courses/html...
- Продвинутый frontendblok.com/courses/adva...
При покупке 2х курсов сразу действует скидка 50%. Оставить заявку: forms.gle/VSU4U85ck2X7nPiV7
Таблица с изменениями базового курса (по продвинутому информация появится позже): docs.google.com/spreadsheets/...
-------
⚡️ Макеты, демо и видео про адаптив можно получить через донат:
1) по подписке (доступ ко всем макетам) boosty.to/annblok
2) по подписке (доступ ко всем макетам) donut/tpverstak
3) разовая оплата через крипту с получением одного макета new.donatepay.ru/@958090 (в комментариях напишите email)
-------
Таймкоды:
00:00:00 Вступление
00:32:00 Что будем использовать?
00:55:00 Макет
00:01:23 Подготовка проекта
00:03:46 Подключение шрифтов (ч1)
00:03:56 Скидка на обучение
00:04:38 Подключение шрифтов (ч2)
00:06:45 Переменные
00:11:02 Шапка сайта
00:22:47 Основной контент
00:51:23 Адаптив для ПК
🔵 Telegram - t.me/frontendblok
🔵 Чат Telegram - t.me/frontendblokchat
🔵 Instagram - / annblok
🔵 TikTok - / annblok_webdev
🔵 Дзен - zen.yandex.ru/annblok
🔵 ВК - tpverstak
🔴 Обучение - frontendblok.com

Пікірлер: 43

@tolasnisar2494 2 ай бұрын

Спасибо вам, с каждым вашим видео я лично узнаю кое-что новое.

@KidsPlanetOfficialChannel 2 ай бұрын

Очень кстати! Я хоть и не новичк, но для себя много полезного вынес с Вашего видео, спасибо, Анна:)

@tetyana5295 2 ай бұрын

вы очень понятно и доступно объясняете такие сложные технические моменты

@user-olena_shatun 2 ай бұрын

Анна, спасибо большое за то что делитесь своим опытом и знаниями

@Svetlana7777ok 2 ай бұрын

спасибо что помогаете нам разобраться в этих сложных технических моментах и новшествах

@romanpukalyak3112 2 ай бұрын

очень полезно получилось .Анечка. благодаря вам немного обучаюсь этой сфере)

@user-ct2dv3vr1n 2 ай бұрын

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

@user-en3cz6fp7k 2 ай бұрын

Мне очень понравилось Ваше видео! Продолжайте в том же духе!

@yuliya2790 2 ай бұрын

Спасибо большое за видео и информацию, которую вы предоставили. Очень интересно и полезно. Много для себя взяла

@user-zr6el7rt9z 2 ай бұрын

Круто, использование переменных и clamp() поможет сделать верстку более гибкой и адаптивной!

@user-cb7ht1yp5j 2 ай бұрын

Интересно было просмотреть и прослушать данное видео.

@FootballHistory-11 2 ай бұрын

Дуже дякую вам за пояснення, все цікаво і зрозуміло

@user-bz8wg2lw1c 2 ай бұрын

Очень интересно было послушать, спасибо вам большое

@user-hb4xk8yv2c 2 ай бұрын

Спасибо за интересное и информативное видео!😊

@millerivan3606 2 ай бұрын

Привет, спасибо что рассказали как верстать сайты, было интересно

@user-iw9ct2kk6s 2 ай бұрын

Лого в background-image, а линии и барби в img. с точки зрения семантики, гениально!

@neveren2011 Ай бұрын

Из опыта: лучше не давать переменным названия согласно их значением. В частности - шрифты. Было несколько заказов, где я так же называл переменные для шрифтов в качестве названия шрифта. Но потом шрифт решали поменять, и помимо значения шрифта в одном месте пришлось еще и сами переменные менять везде.

@user-hs7im8su7g 2 ай бұрын

Это интересно. я так Вас посмотрю и програмистом стану.

@Ukrainka8456 2 ай бұрын

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

@user-FedorVorobyev 2 ай бұрын

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

@sashabest1479 2 ай бұрын

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

@user-ek1sz6ie4k 2 ай бұрын

Дуже вчасно опублікував відео. Я шукав інформацію на цю тему.

@LiazzSmirnoF 2 ай бұрын

если в этом разобраться то это довольно выгодно !

@samiribadov6914 2 ай бұрын

Анна здравствуйте. Подскажите пожалуйста, вот я сверстал сайт, куда его потом размещать, что и как дальше делать как на хостинге размещать. Я новичок, направьте пожалуйста.

@annblok_webdev 2 ай бұрын

Здравствуйте. Можно разместить на GitHub pages.

@danya7347 2 ай бұрын

Самое простое купить хостинг (например рег ру) и доменное имя, далее загрузить туда свой сайт (по ftp или панель хостинга)

@samiribadov6914 2 ай бұрын

Благодарю вас

@MQadeer024 2 ай бұрын

очень хорошее видео очень интересное видео

@lovedota2857 2 ай бұрын

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

@mdsojon4440 2 ай бұрын

It is a amazing video

@via754 2 ай бұрын

Ну не так я себе представляю профессиональную верстку - чуть текста изменил и все поехало? 1) размер СВГ можно увидеть открыв файл в текстовом редакторе 2) линии на макете явно привязаны к главному фото, в верстке это тоже нужно было сделать, что бы при изменении размера фото изменялось и положение и размер линий, а размер фото легко могут захотеть поменять «по месту» уже на стадии разработки бэкэнда 3) максимальную ширину текста лучше указывать в em, опять же что бы при изменении размера шрифта текст оставался похожим на макет 4) скорее всего чего то не знаю, но зачем логотип прописывать фоном в стилях? 5) отступ от заголовка тоже лучше указывать в em, и в целом нужно всегда предполагать, что дизайн не конечный и закладывать в верстке минимальные его изменения без того что бы верстка поломалась или стала непропорциональной

@moumoumoumou8199 10 күн бұрын

А вот я себе задаюсь вопросом при каждой презентации курсов: никогда не видела обратной связи учеников которые после окончания нашли работу; можно ли найти реально найти эту работу; нужно ли еще столько людей? Кто знает ответ, поделитесь информацией или опытом.

@user-xc2yu7ib3r 2 ай бұрын

Сколько стоит верстка одной страницы сайта?

@robereds245 2 ай бұрын

тоже хочу начать программировать только время часто не хватает начать)

@via754 2 ай бұрын

Дело не во времени, а в желании. Время найти можно всегда. Просто желание и/иди мотивация сейчас недостаточна

@user-bj2hg7kt4q 2 ай бұрын

Цікаво. Не бачив такого, перше відео в такому роді.

@progweb3036 2 ай бұрын

Анна Блок как вы не устаёте верстать сайты на протяжении столького времени? Не становится скучно?

@via754 2 ай бұрын

Как верстальщик с 15 летним стажем отвечу свой вариант - во-первых, каждый новый проект это как свежее дыхание после только что законченного - новый макет, новые «извращения» дизайнера, новый чистый лист. Во-вторых - каждый день можно узнавать и пробовать что то новое в своей работе, это очень интересно, если сама сфера тебе нравится. 3. Деньги. Они не на первом месте. Но имеют свой вес в воздействии на мотивацию