Від автора: Цікавишся версткою сайту під мобільні пристрої? Скачай безкоштовний відеокурс з основ адаптивної верстки сайту. Вже сьогодні ти створиш свій перший сайт, який буде красиво відображатися на БУДЬ-якому пристрої. Дізнайся основні секрети самого перспективного напряму сайтобудування. Покрокові уроки в наочному форматі відео. Виконуй адаптивну верстку під замовлення і заробити пристойні гроші.
Урок 1. Введення
Тема: адаптивна верстка
Час ролика: 00:11:02
Складність: легка
Автор: Андрій Бернацький
Сьогодні виходити в інтернет і веб-сторінки можна переглядати не тільки з комп’ютера, але і з планшета, електронної книги, смартфона і навіть з допомогою екрану, розташованого на двері холодильника.
Наскільки важливо сьогодні адаптувати свої сайти під різні пристрої? Про це поговоримо в даному уроці.
Розглянемо список найбільш популярних дозволів, під які слід адаптувати сайт.
Урок 2. Медіа-запити
Тема: адаптивна верстка
Час ролика: 00:33:22
Складність: легка
Автор: Андрій Бернацький
В уроці ми детально розглянемо роботу з медиазапросами. Медиазапросы надають можливість вибору різних стилів залежно від можливостей інтерфейсу дисплея або пристрої, таких як ширина області перегляду, дозвіл екрана.
Медиазапросы — це відмінний инструментдля створення веб сайтів, оптимізованих для перегляду на мобільних пристроях.
Урок 3. Адаптивні зображення
Тема: адаптивна верстка
Час ролика: 00:17:41
Складність: легка
Автор: Андрій Бернацький
Сьогодні практично на кожній веб-сторінці присутні зображення. Але в умовах адаптивної верстки нам необхідно на великих екранах показувати зображення в їх реальні розміри, а для маленьких екранів зменшувати розміри зображень. В уроці ми розглянемо методи роботи з зображеннями в адаптивному дизайні.
Урок 4. Практичний приклад. Частина 1
Тема: адаптивна верстка
Час ролика: 00:13:55
Складність: легка
Автор: Андрій Бернацький
У даному уроці ми виконаємо практичний приклад верстки навчального макета нескладної структури. Створимо розмітку оптимальну для подальшої адаптації під мобільні пристрої.
Урок 5. Практичний приклад. Частина 2
Тема: адаптивна верстка
Час ролика: 00:22:14
Складність: легка
Автор: Андрій Бернацький
У другому уроці по верстці навчального макета, ми доб’ємося красивого відображення макета на всіх мобільних пристроях. Використовуючи медиазапросы, ми адаптуємо нашу верстку до планшетів та смартфонів. Покращимо верстку, щоб вона не залежала від «контрольних точок» у медиазапросах. Це буде гарантувати нам гарне відображення верстки в різних пристроях, не залежно від їх дозволів.
Ваші побажання, відгуки та рекомендації залишайте в коментарях!
