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: Создание боксов
- Video: Нюансы работы с margin, padding и border
- Video: Немного о математике блочных элементов
- Reading: Задание для тренировки в работе с боксовой моделью
- Video: Боксы инлайн-уровня
- Reading: Мяндекс.Муррркет: решение
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
- Reading: Telegram специализации
- Reading: Анкета для слушателя
Graded: Мяндекс.Муррркет
WEEK 2
Модель отображения, часть 2
Позиционированием называется положение элемента в системе координат. Различают четыре типа позиционирования: нормальное, абсолютное, фиксированное и относительное — от них зависит и система координат. На этой неделе вы познакомитесь со всеми типами и научитесь выбирать подходящий для ваших задач.
7 videos, 5 readings
- Video: Относительная система позиционирования
- 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: Разметка
- Video: Спецификация flexbox
- Video: Спецификация grid
- Reading: Бабуленькины котятки. Решение
- Reading: FAQ по заданиям на взаимную оценку
- Reading: Ссылки из видео
Graded: Бабуленькины котятки
WEEK 4
Браузеры
Четвёртая неделя посвящена браузерам: вы узнаете об их базовой архитектуре, познакомитесь с устройством движка рендеринга браузера, разберётесь, как браузеры применяют CSS и HTML.
5 videos, 1 reading, 1 practice quiz
- Video: Основные группы браузеров
- Video: Как браузер читает HTML и CSS?
- Video: Как применяется CSS?
- Video: Компоновка
- Video: Отрисовка и <script>
- Practice Quiz: Проверьте себя
- Reading: Ссылки из видео
Graded: Браузер
WEEK 5
Фотошоп и графика
Вы научитесь работать с изображениями и графикой. Узнаете о цветовых моделях, форматах изображений в вебе и как их оптимихировать. Итоговая практическая работа — сверстать с нуля макет.
8 videos, 4 readings
- Video: Графические форматы
- 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.
БА
Хороший курс. Сплошные плюсы. Существенных минусов два. Критерии оценки становятся понятны только при оценке задания и из постановки задачи нифига не выводятся. Ты аплоадишь работу, при проверке узнаешь, что на полный балл цвет фона надо было менять с transition, чертыхаешься, правишь свою работу, аплоадишь заново - и надеешься, что она успеет набрать положенные три голоса. Не то чтобы это было ужасно, но слегка подбешивает. Ну и система оценки. Понимаю, что HTML проверить без человеческого участия трудно. Но кажную божию неделю кросс-проверка при не слишком большом количестве народа - IMHO не самая хорошая идея. Это вынуждает ставить баллы по максимуму закрывая глаза на недочеты - потому что ты щас поставишь 2 из 20, соратник работу переделает, зааплоадит, а проверять ее уже будет некому. И будет он ждать следующей волны. Вобщем грусть. Но сам по себе курс отличный. Рекомендую.