Верстка страницы на примере реального макета. ЧАСТЬ 1 | Верстка макета FIGMA с объяснением

В этом видео вы узнаете как делать разметку страницы. Какие теги должны быть в разметке обязательно. И мы создадим разметку реального макета страницы мобильного приложения.

Макет взят на просторах интернета и находится в свободном доступе.
Ссылка на макет:

Ссылка на файлы проекта:

----------------------------------------------------------------------------------------------------------------
Поддержи канал:

PayPal

Patreon

Donatello

Crypto
USDT: 0xb205047a3f2ceb5198d547e3de011d1a85412fac

[evgeniikiryshkin]

Как долго я искал такое толковое, поэтапное объяснение. 10 из 10!!!

[topfelx]

Очень понравился материал, именно семантика, грамотное объяснение. Большое спасибо автору!)

[userkakashkoed]

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

[weeellbeing]

спасибо!! очень полезное и ёмкое видео, всё очень понятно~

[irinakurbanova]

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

[kornejYarij]

Урок огонь! Смотрел на скорости 1.25 =))

[uzqshru]

Теперь я поняла что такое семантика. Очень хорошо объясняет

[bnfyzzs]

Есть несколько вопросов касаемо семантики:
1) Нужно ли всё-таки в этом макете оборачивать список ссылок в footer'е в тег <nav>?
2) По mdn тег <article> должен быть идентифицирован, обычно добавлением заголовка h1-h6 в качестве дочернего. В вашей вёрстке в <article> нет дочернего заголовка, тогда как он должен быть идентифицирован?

И на самом деле хотелось бы больше поговорить про семантику в современной вёрстке, обсудить использование конкретных тегов на множестве примеров. Может планируете провести стрим?

[shtumuj]

в последнем section в обеих кнопках будет правильнее вместо "<" и ">" прописать &lt; и &gt;

[iliyabylich]

Можно использовать тег <div> в этом шаблоне?

[james]

Подскажите а где смотреть расстояние между блоками, какой шрифт стоит на странице и т.д

[gsysgsm]

Здравствуйте! Я правильно понимаю, что данная разметка не по методологии Бэм?

[LLuKKen]

Получается тег <section> полностью заменяет <div>?

[duoduoo]

можно ли использовать только один тег? чтоб минимизировать разнообразие используемых тегов, тем самым проблем

[deanwichester]

Голос похож на ведущего канала про еду

[alizhilov]

Здравствуйте, а почему вы, в тегах атрибут class, не используете?

[deperxk]

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

[bikadV]

Автор, пожалуйста увеличивай шрифт в редакторе когда записываешь свои видео! Мы ведь не на весь экран разворачиваем, нам ведь еще и в редактор все надо записывать!