001.Адаптивная вёрстка (обновленная версия) - Дмитрий Душкин

Презентация: yadi.sk/i/WF4V...
С появлением и широким распространением стандартов Flexbox Layout и CSS Grid Layout адаптивный дизайн перестаёт быть трудоёмким. Теперь реализовать его можно быстро, просто и без привлечения сторонних библиотек. Мы рассмотрим практические примеры адаптивной вёрстки с использованием базовых и продвинутых инструментов (относительные величины измерений, нефиксированные размеры, media queries, srcset, тег picture и другие).

[@MrMenma26]

Очень подробно, понятно, лектор хорошо говорит - побольше бы таких видео на просторах рунета. Спасибо

[@TheFryOS]

Хороший Лектор. Молодцом!

[@TheReverOcelot]

За его шутки про "гугление" в Яндексе отдельный плюс :)

[@v8xci]

37:00 - ссылки по CSS GRID 43:20 - что дальше: курсы 43:52 - что дальше: видео 44:23 - что дальше: статьи

[@stephaninabox]

Хорошая лекция, спасибо. Ждём остальные!

[@grandlagging0zero175]

Единственный лектор, который догадался принести стул на лекцию, а не стоять :)

[@lifetimess]

отличная лекция. спасибо огромное!

[@serdtsev]

Очень крутой лектор, спасибо

[@alextopsite]

Уж очень мне понравилась тема CSS Grid и flexbox. Много идей появилось

[@quterma]

Отлично!

[@thrnd_]

Задаюсь вопросом: "Зачем рассказывать такие простые вещи для людей, которые прошли в ШРИ? (когда тестовое задание подразумевает владение всеми этими вещами)"

[@РоманМосолов-ы1ш]

Спасибо за знания.

[@artemchepelevich4694]

В 1.25 идеально заходит.

[@Nagibator45]

Спасибо !

[@gerasim_vol]

круто. узнал про

[@Bykoffdn]

Лекция, в целом, отличная. Но как-то совсем позабыли про дизайнера, который по идее готовит вам макеты на все разрешения, а не вы сами решаете как и что делать. И как бы посмотрел дизайнер на решение плавно изменяь размер шрифта в зависимости от вьюпорта?

[@legatodi3000]

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

[@clickabelno]

Лайк

[@demimurych1]

Лектор оговорился сказав, что picture более новый. Picture и srcset появились в одно время в середине 14 года. рекомендованный путь это srcset а не picture. По причине того что используя picture вы вынужденно создаете лишние узлы в дом дереве, что прямо отражается на производительности. sizes содержит не какое то подобие медиа запросов. sizes может содержать медиа запросы любой сложности. Про более широкие возможности picture. Нет ничего что умеет picture чего нельзя повторить через srcset. Кроме двух вещей, верстка picture выглядит эстетичнее. И возможности задачи правил для форматов файлов. Эстетика к цинизму не имеет отношение, а правила для форматов на стороне клиента это абсурд, по причине того, что этот вопрос нужно решать на стороне сервера, а не клиента. Что успешно и делается

[@legatodi3000]

А разве с помощью scrset можно задать опциональное скачивание webp версии картинки, если браузер это поддерживает?

[@demimurych1]

@@legatodi3000 при помощи srcset нет. но он и не должен этого делать. Это серверная задача которая очень просто решается, при этом для верстальщика все остается так "как и было". какой формат отдавать решает веб сервер.

[@MrDONshinigami]

Крутой лектор) Только начались лекции ШРИ?

[@legatodi3000]

Спасибо!) ШРИ 2018 закончилась неделю назад, в ближайший месяц постепенно выложим все лекции.

[@MrDONshinigami]

Дмитрий Душкин круто) как прошло ?)

[@legatodi3000]

Хорошо.) Думаю все участники, в т.ч. организаторы, многому научились.

[@belligalaton9091]

,,но это не точно").

[@Всякаядичь-е2и]

где на смышнгмагазин он дизайн увидел?

[@Mamikonars]

Спалился ) 19:43

[@АнтонВебсайтовский]

Ни когда не было проблем читать в вк текст ! первый раз такое слышу, 14px, стандарт, 13px, тож норма, но если все заглавные, как и 12px.

[@webartem]

Антон Вебсайтовский речь шла про широкоформатные мониторы с высоким разрешением. У меня такой - все сайты по умолчанию зумятся 110-120%

[@closedcosmos2226]

Где домашнее задание взять? :)