Курс по веб-дизайну · Урок 3 из 24
Адаптивный сайт на Тильде: SVG, анимация и формы
Автор курса — Данил Фимушкин.
Выпуск запланирован · 23.11.2026 · 19:00 МСК
Видео будет добавлено после подготовки выпуска. Ниже — программа и задания для самостоятельной работы.
Программа урока
Теория
- Как компьютер «запоминает» цвета?
- Отличие растровой от векторной графики
- Преимущества и недостатки разных видов графики
- Примеры векторной и растровой графики
- Характеристики и типы файлов растровой и векторной графики
- Сравнение SVG и PNG в размере файла
- В чем измеряется «вес» файлов?
- RGB и шестнадцатеричное представление цвета
- Что такое капча в сайтах?
- Что такое домен?
Делаем вместе (по видео)
- Как активировать пробный период на Тильде?
- Скачиваем SVG файлы для сайта
- Как задать шестнадцатеричный цвет в Zero Block?
- Как создать шэйп: квадрат, круг в Тильде?
- Создаем переход «Облака» между блоками сайта
- Как создать адаптивную версию шапки сайта?
- Используем «Просмотр» для настройки мобильной версии сайта
- Создаем блок «Фраза» и «Текст» для одностраничника
- Инструменты расстановки объектов в Zero Block
- Отзывчивый дизайн, настройки контейнера сетки и окна
- SVG файл «Волна» для перехода между блоками
- Используем размер в процентах для масштабирования картинок
- Настройка пошаговой анимации с помощью easing
- Создаем эффект «Печатной машинки» для текста
- Настройка формы обратной связи на лэндинге
- Как редактировать домен в Тильде?
- Как зарегистрировать домен?
- Настраиваем DNS зоны для домена на Тильде
Практика после урока
1. Повторите сайт с монстрами, проверьте его на разных размерах экрана и опубликуйте учебную страницу.
2. Для дополнительной практики сделайте сайт взрослой стоматологии: используйте соответствующий текст и фотографии вместо детских иллюстраций.
3. По желанию подключите собственный домен к учебному сайту. Это отдельное задание; пошаговая регистрация домена вынесена в дополнительное видео исходного курса.
Тильда для практики курса · партнёрская ссылка
Материалы курса в Telegram
