About this course: Этот курс продолжает обучение тех, кто уже познакомился с основами HTML и CSS. На очереди всякие изыски: отображение сложных элементов, изучение различий между браузерами и графика. В конечном итоге вы сможете сами сверстать страницу любой сложности. Авторы курса — разработчики из Яндекса.
Who is this class for: В первую очередь курс рассчитан на тех, кто закончил предыдущий — «Основы HTML и CSS». Но если вы изучили программу «Основ» и не нашли там ничего нового, смело приступайте к «Тонкостям».
Created by: Moscow Institute of Physics and Technology, Yandex
Taught by: Олег Семичев, разработчик интерфейсов, Яндекс
Taught by: Артем Кувалдин, разработчик интерфейсов, Яндекс
Taught by: Мохов Олег, разработчик интерфейсов, Яндекс
| Basic Info | Course 3 of 5 in the Разработка интерфейсов: вёрстка и JavaScript Specialization |
| Level | Intermediate |
| Language | Russian |
| How To Pass | Pass all graded assignments to complete the course. |
| User Ratings |
Syllabus
WEEK 1
Модель отображения, часть 1
На первой неделе курса вы увидите, что всё есть прямоугольники. И разберётесь с ключевыми понятиями отображения элементов на странице: боксы, отступы, границы. В конце недели вам предстоит сверстать макет необычного интернет-магазина.
5 videos, 6 readings
- Video: Создание боксов
- Video: Нюансы работы с margin, padding и border
- Video: Немного о математике блочных элементов
- Reading: Задание для тренировки в работе с боксовой моделью
- Video: Боксы инлайн-уровня
- Reading: Мяндекс.Муррркет: решение
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
- Reading: Telegram специализации
- Reading: Анкета для слушателя
Graded: Мяндекс.Муррркет
WEEK 2
Модель отображения, часть 2
Позиционированием называется положение элемента в системе координат. Различают четыре типа позиционирования: нормальное, абсолютное, фиксированное и относительное — от них зависит и система координат. На этой неделе вы познакомитесь со всеми типами и научитесь выбирать подходящий для ваших задач.
7 videos, 5 readings
- Video: Абсолютная система позиционирования
- Video: Позиционирование fixed и sticky
- Reading: Задание для тренировки в работе с различными видами позиционирования
- Video: Контекст наложения
- Video: Плавающие элементы
- Video: Блочный контекст форматирования
- Video: Практические примеры
- Reading: Задание для тренировки
- Reading: Бабуленькин урожай. Решение
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
Graded: Бабуленькин урожай
WEEK 3
Модель отображения. Часть 3
Flexbox и Grid — современные инструменты для вёрстки макетов, о них и поговорим. Оба инструмента хороши по своему и должны использоваться совместно, а не как альтернатива друг другу. В конце недели ещё одно практическое задание: добавление к магазину красивой витрины.
3 videos, 3 readings
- Video: Спецификация flexbox
- Video: Спецификация grid
- Reading: Бабуленькины котятки. Решение
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
Graded: Бабуленькины котятки
WEEK 4
Браузеры
Четвёртая неделя посвящена браузерам: вы узнаете об их базовой архитектуре, познакомитесь с устройством движка рендеринга браузера, разберётесь, как браузеры применяют CSS и HTML.
5 videos, 1 reading, 1 practice quiz
- Video: Как браузер читает HTML и CSS?
- Video: Как применяется CSS?
- Video: Компоновка
- Video: Отрисовка и <script>
- Practice Quiz: Проверьте себя
- Reading: Ссылки из видео
Graded: Браузер
WEEK 5
Фотошоп и графика
Вы научитесь работать с изображениями и графикой. Узнаете о цветовых моделях, форматах изображений в вебе и как их оптимихировать. Итоговая практическая работа — сверстать с нуля макет.
8 videos, 4 readings
- Video: Цветовые модели
- Video: Форматы графических файлов
- Video: Архивация и компрессия
- Video: Графический редактор
- Video: Графика в HTML
- Video: Градиенты
- Video: Спрайты и base64
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
- Reading: Ваши впечатления о курсе
- Reading: Стань ментором специализации "Разработка интерфейсов: вёрстка и JavaScript"
Graded: Вёрстка макета
FAQs
How It Works
Coursework
Each course is like an interactive textbook, featuring pre-recorded videos, quizzes and projects.
Help from Your Peers
Connect with thousands of other learners and debate ideas, discuss course material, and get help mastering concepts.
Certificates
Earn official recognition for your work, and share your success with friends, colleagues, and employers.
Creators
Moscow Institute of Physics and Technology
Московский физико-технический институт (неофициально известный как МФТИ или Физтех) является одним из самых престижных в мире учебных и научно-исследовательских институтов. Он готовит высококвалифицированных специалистов в области теоретической и прикладной физики, прикладной математики, информатики, биотехнологии и смежных дисциплин. Физтех был основан в 1951 году Нобелевской премии лауреатами Петром Капицей, Николаем Семеновым, Львом Ландау и Сергеем Христиановичем. Основой образования в МФТИ является уникальная «система Физтеха»: кропотливое воспитание и отбор самых талантливых абитуриентов, фундаментальное образование высшего класса и раннее вовлечение студентов в реальную научно-исследовательскую работу. Среди выпускников МФТИ есть Нобелевские лауреаты, основатели всемирно известных компаний, известные космонавты, изобретатели, инженеры.
Yandex
Yandex is a technology company that builds intelligent products and services powered by machine learning. Our goal is to help consumers and businesses better navigate the online and offline world.
Pricing
| Purchase Course | |
|---|---|
| Access to course materials | Available |
| Access to graded materials | Available |
| Receive a final grade | Available |
| Earn a shareable Course Certificate | Available |
Ratings and Reviews
Coursera provides universal access to the world’s best education,
partnering with top universities and organizations to offer courses online.
© 2018 Coursera Inc. All rights reserved.
