К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Advanced Styling with Responsive Design · LearnSpace
Назад в каталог
courseraПрограммирование

Advanced Styling with Responsive Design

Курс от University of Michigan
Начальный≈ 11.4 чАнглийский
О курсеНавыкиПрограммаПреподаватели

О курсе

It used to be the case that everyone viewed web pages on about the same size screen - a desktop computer. But now it is just as likely that someone will be using a smart phone, tablet, or assistive technology to access the Internet. Therefore, people viewing your site will now expect that it will perform regardless of the device (smartphone, tablet, laptop, desktop computer, or screen reader) AND take into account some common personal settings such as color schemes. This ability to respond to any platform and user preferences is called Responsive Design. This course will expand upon the basic knowledge of CSS3 to include topics such as wireframes, fluid design, media queries, and the use of existing styling paradigms. After the course, learners will be able to: ** Explain the mobile-first paradigm and the importance of wireframes in the design phase ** Create sites that behave across a range of platforms ** Recognize existing design frameworks such as Bootstrap A basic understanding of HTML and CSS is expected when you enroll in this class, so it can be taken third or fourth in the Web Design for Everybody specialization. Additional courses focus on adding interactivity with the JavaScript Programming Language and completing a capstone project.

Навыки, которые вы освоите

Responsive Web DesignCascading Style Sheets (CSS)Bootstrap (Front-End Framework)Hypertext Markup Language (HTML)JavascriptWeb FrameworksUsabilityFront-End Web DevelopmentWireframingWeb Design and DevelopmentWeb DesignHTML and CSSApplication Frameworks

Программа курса

4 модулей · 66 учебных материалов

01Week One: Style with Responsive Design24 материалов

Lesson 0: Welcome

Course SyllabusЧтениеIntroduction to Responsive DesignВидеоPre-Course SurveyЧтениеCourse ResourcesЧтение

Учитесь у экспертов

Colleen van Lent, Ph.D.

Teaching Professor and Lecturer IV in Information

Charles Russell Severance

Clinical Professor of Information

Advanced Styling with Responsive Design
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 11.4 ч

4 модулей

Язык: Английский

Субтитры: Арабский, Французский, Бенгальский, Украинский, Китайский (Китай), Греческий, Итальянский, Бразильский португальский, Вьетнамский, Нидерландский, Корейский, Немецкий, Пушту, Урду, Русский, Тайский, Индонезийский, Шведский, Турецкий, Азербайджанский, Испанский, Дари, Хинди, Японский, Казахский, Венгерский, Польский

Часть программы вашего университета
Frequently Asked Questions (FAQ)Чтение

OPTIONAL: Editors and Hosting

Getting Started with GithubВидеоDownloading and Uploading Code with VSCode and GithubВидеоCopying Code with GitHub CodespacesВидеоUploading to GitHub PagesВидеоReview: Publishing Your SiteВидео

Lesson 1: What is Responsive Design?

Week 1 ResourcesЧтениеWhat is Responsive Design?ВидеоExamples of Poor Responsive DesignЧтениеTesting SitesВидеоWhat To Do When Your Tool is DeprecatedЧтениеBenefits of Responsive DesignВидеоSite ReviewsОбсуждениеFluid Measurements Background ReadingsЧтениеFluid MeasurementsВидеоCode With Me: Fluid MeasurementsВидеоCan a file use fluid and absolute measurements together?Обсуждение

Lesson 2: Assessment

Basic Concepts in Responsive Design ApproachesЗаданиеYour Personal Responsive Design StoryОбсуждениеAdditional Tools and ResourcesЧтение
02Week Two: Basic Concepts15 материалов

Lesson 1: Different Looks at Different Screen Sizes

Week 2 ResourcesЧтениеMedia QueriesВидеоCode With Me: Fluid Measurements and Media QueriesВидеоPractice Quiz -- Challenge ProblemЗаданиеWire FramesВидеоBreakpointsВидеоMedia Queries Part TwoВидеоCode With Me: Responsive NavigationВидео

Lesson 2: Assessment

Week Two Review: Media Queries and BreakpointsЗаданиеHomework DescriptionЧтениеHomework Review: Basic Media QueriesВидеоCreate a Responsive Stylesheet Взаимная проверкаIntroduction to the Gamut GalleryЧтениеHomework: Optional Gallery SubmissionВнешний инструмент
03Week Three: Media Queries for Layout and Accessibility10 материалов

Lesson 1: Using Media Queries

Week 3 ResourcesЧтениеPreview of Week 3ВидеоCode With Me: Using Media Queries with Grid ВидеоCode With Me: Using Media Queries with Flex ВидеоMedia Queries for AccessibilityВидеоPrefers Reduced MotionЧтениеColor Schemes and Color ContrastЧтениеAccessibility TestingВидеоAccessilibity Testing OptionsЧтениеAdditional ResourcesЧтение
04Week Four: Frameworks17 материалов

Lesson 1: Introduction to Bootstrap

Week 4 ResourcesЧтениеUsing FrameworksВидеоIntroduction to BootstrapВидеоGetting Started With BootstrapЧтениеBootstrap Grid SystemВидеоBootstrap Resources and ExamplesЧтение

Lesson 2: Optional Resources

Optional: Interview with M WВидеоOptional: Interview with H WВидеоOptional: Interview with H NВидеоAdditional Resources Чтение

Lesson 3: Assessment

Responsive Design Final QuizЗаданиеFinal Project DescriptionЧтениеHomework Review: Final ProjectВидеоFinal Project: Photo GalleryВзаимная проверкаFinal Project: Optional Gallery SubmissionВнешний инструмент

Lesson 4: Closing

ConclusionВидеоPost-course SurveyЧтение
Additional ResourcesЧтение