Вёрстка на Тильде — Grid x 2, Autoscale, Window: обзор подходов и нюансов различных видов вёрстки🔥
Всем привет😘👋
Не забываем ставить 👍 и подписываемся на канал 🛎 — впереди много интересного🔥🥳
С вами — Наталья Чистякова, UX/UI Веб-дизайнер, в этом видео — Обзор имеющихся в нашем распоряжении видов или подходов к вёрстке на Тильде — традиционный Grid 1200 , не так давно ставший доступным Grid 1920 , Автоскейл и, разумеется, Window Container🔥
💪Тема объёмная, но постаралась сжато и ёмко пройтись по всем ключевым моментам:
✔️назначение того или иного типа=принцип работы;
✔️ в чём особенности и какие нюансы учитывать, чтобы верстать технично и аккуратно;
✔️ принципиальные отличия между всеми четырьмя способами;
✔️ как верстать мобильную версию;
✔️ как подходить к расчёту сетки;
✔️ как сократить число адаптивов🚀 (об этом смотрите в самом конце — вначале попрощалась, а потом дополнила по брейкпоинтам))
🔔Если у вас остались вопросы или появились замечания/дополнения — пишите о них в комментариях, и говорю об этом не с тем, чтобы раскачать активность под видео, а для того, чтобы устранить те моменты, которые можно упустить из виду🙌
🦊Желающим задонатить — к боту-помощнику 👉
⏱Тайминг — для вашего удобства❤️:
00:00 — вступление
01:33 — обоснование выбора и актуальности темы
03:47 — план обзора — будет 2 этапа: на первом разносим по 4-м зеро-блокам одинаковый текст и заголовок с одинаковым позиционированием, публикуем и сравниваем результаты, комментирую; во второй части идём в презентацию по четырем типам вёрстки и обсуждаем всё подробно
04:38 — о первой части обзора
04:52 — идём в зеро, Grid Container 1200
05:27 — переходим в Grid Container 1920
06:36 — идём в блок с Автоскейлом
07:44 — наконец, идём в блок с позиционированием по Window
08:21 — сравниваем результаты позиционирования на опубл странице
15:12 — переходим ко второй части обзора
16:06 — комментирую вёрстку в Грид 1200
18:06 — особенности вёрстки в Гриде на разрешении 1920
21:49 — особенности вёрстки с Автоскейлом
35:09 — особенности вёрстки по Window
47:28 — добавлю коммент по сокращению количества брейкпоинтов в адаптивах и, как следствие [есть такое мнение], облегчению вёрстки😉🔥
📹Хочешь предложить свою тему для видео или давай соберём эфир вместе — пиши в ТГ (никнейм: @chistyakova_website) или в комментах к этому видео🔥
Ещё раз напоминаю о том, что это и другие полезные видео выкладываю, в том числе, в рамках нашего дизайнерского душевного чата, в котором являюсь Админом — чат Pro.дизайн 👉
Вливайтесь для человеческого и профессионального общения, а также на случай, если
давно хотели закинуть какую-нибудь интересную тему, но не решались😁 — мы периодически проводим эфиры, так что у вас есть реальный шанс стать приглашённым спикером-экспертом и поделиться своими знаниями, инсайтами и компетенциями с грамотной интеллигентной и просто клёвой аудиторией🔥✨☺️, а потом взять и выложить запись своего бенефиса в соцсетях😉 — отличный инфоповод💪
Если есть вопросы ко мне:
► дизайн;
► типографика и композиция на сайте;
► анимация любого сценария и уровня сложности;
► подбор креативных идей;
► оформление документов для сайта (Политика конфиденциальности, Публичная оферта, РКН, согласие субъекта ПД);
► оформление отношений с заказчиками, разрешение спорных ситуаций, составление актов и претензий);
► любой вопрос за рамками поименованных — мои компетенции гораздо шире заявленных😉,
— пишите в ЛС, разберёмся в любой ситуации🤝
Чат Pro.дизайн 👉
Сообщество в ВК🥰👉
Мой ТГ —
ВК —
Инст (продукт Meta, в РФ признана экстремистской организацией) — /
DProfile —
#вёрстка #tilda #тильда #автоскейл #responsive #windowrelative #layout #виндоу
Приятного просмотра👀🔥
1 view
919
237
5 months ago 00:41:46 1
Робокоп против Терминатора Фрэнка Миллера [ОБЪЕКТ] RoboCop versus The Terminator
5 months ago 00:04:46 1
💩Россияне, ВСТРЕЧАЙТЕ “героев“! СВОшники УБИЛИ БОЛЕЕ 100 ЧЕЛОВЕК, после возвращения с фронта
5 months ago 00:02:06 1
Quest for Glory III Трейлер Перевода
5 months ago 00:09:19 1
Визит Царской Семьи в Евпаторию 16 мая 1916 года. Правильная верстка!
5 months ago 00:34:10 1
✅ Пишем простое приложение на Vue за 30 минут
5 months ago 00:01:02 1
❤ПОСЛЕДНЯЯ ЛЮБОВЬ❤ (ClientMod Android)
5 months ago 00:09:37 1
Как вести несколько проектов одновременно на фрилансе, веб-дизайне, верстке и т.д.
5 months ago 00:10:16 1
#3 Плагин Perfect Pixel, Верстаем по макету из Figma
5 months ago 00:59:36 1
Эвакуация в Киеве из-за угрозы из Беларуси. РФ продвигается на фронте. Дело Бишимбаева | ВЕЧЕР
5 months ago 00:03:34 1
«ВЕРА ВЕЧНА» – МУЖСКОЙ ХОР «РУССКИЙ ФОРМАТ» & АРХИДИАКОН КОНСТАНТИН БАРГАН & АРТЕМ ВАСИЛЕВИЧ
5 months ago 04:47:52 1
Натяжка сайта на WordPress | Полный курс + БОНУС (2023)
5 months ago 00:00:29 1
Обзор книжки “Синий трактор. Сутки. День и ночь“ #Shorts
5 months ago 00:09:46 1
3. Создаем логин форму используя HTML,CSS #webdevelopment #web #login #HTML #CSS
5 months ago 00:37:29 1
Урок верстки обложки журнала в InDesign CC 2015
5 months ago 00:13:31 1
МАЙКЛ НАКИ: Лучше сядьте! От этих историй ВОЛОСЫ ДЫБОМ. Что творят РОССИЯНЕ после приезда с фронта
5 months ago 00:31:07 1
СМЕРТЬ ВОЗВРАЩАЕТСЯ В РОССИЮ. Российские солдаты, попадая домой — продолжают убивать и насиловать
5 months ago 00:00:38 1
ЧВК «Вагнер» начала первую после смерти Пригожина вербовку наемников для отправки в Африку
5 months ago 00:02:41 1
О ВСЕПЕТАЯ - МУЖСКОЙ ХОР “РУССКИЙ ФОРМАТ“ | ХРАМ ХРИСТА СПАСИТЕЛЯ
5 months ago 00:01:08 1
Медиадизайн и анимация
5 months ago 00:07:56 1
Что такое Front-end и Back-end? Кто такой FULL STACK разработчик? Чем занимается веб разработчик?
5 months ago 00:26:16 2
#6: Доделываем форму добавления редактирования объявления в #битрикс
5 months ago 00:14:08 1
Как сделать презентацию? Пошаговая инструкция для PowerPoint, Keynote и Google Slides