This course is part of the Web Design for Everybody: Basics of Web Development & Coding Specialization

4.7
stars
4,318 ratings

Colleen van Lent, Ph.D. +1 more instructor

105,555 already enrolled

Offered By

Web Design for Everybody: Basics of Web Development & Coding SpecializationUniversity of Michigan

About this Course

86,132 recent views

It used to be the case that everyone viewed webpages on about the same size screen.  But with the explosion of the use of smartphones to access the Internet, the landscape of design has completely changed.  People viewing your site will now expect that it will perform regardless of the platform (smartphone, tablet, laptop, or desktop computer).  This ability to respond to any platform 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 such as Bootstrap.  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
** Utilize existing design frameworks such as Bootstrap

This is the fourth course in the Web Design For Everybody specialization.  A basic understanding of HTML and CSS is expected when you enroll in this class. Additional courses focus on adding interactivity with the JavaScript Programming Language and completing a capstone project.

Flexible deadlines

Reset deadlines in accordance to your schedule.

Shareable Certificate

Earn a Certificate upon completion

100% online

Start instantly and learn at your own schedule.

Coursera Labs

Includes hands on learning projects.

Learn more about Coursera Labs

Course 4 of 5 in the

Web Design for Everybody: Basics of Web Development & Coding Specialization

Approx. 12 hours to complete

English

Could your company benefit from training employees on in-demand skills?

Try Coursera for Business

Skills you will gain

Bootstrap (Front-End Framework)
Responsive Web Design
JavaScript
Cascading Style Sheets (CSS)

Flexible deadlines

Reset deadlines in accordance to your schedule.

Shareable Certificate

Earn a Certificate upon completion

100% online

Start instantly and learn at your own schedule.

Coursera Labs

Includes hands on learning projects.

Learn more about Coursera Labs

Course 4 of 5 in the

Web Design for Everybody: Basics of Web Development & Coding Specialization

Approx. 12 hours to complete

English

Could your company benefit from training employees on in-demand skills?

Try Coursera for Business

Instructors

Instructor rating

4.82/5 (354 Ratings)

Colleen van Lent, Ph.D.

Lecturer

School of Information

607,985 Learners

11 Courses

Charles Russell Severance

Clinical Professor

School of Information

3,759,054 Learners

56 Courses

Offered by

University of Michigan

See how employees at top companies are mastering in-demand skills

Learn more about Coursera for Business

Syllabus - What you will learn from this course

Content Rating98%(12,481 ratings)

Week1

Week 1

3 hours to complete

Week One: Style with Responsive Design

3 hours to complete

6 videos (Total 37 min), 9 readings, 1 quiz

6 videos

Introduction to Responsive Design7mWhat is Responsive Design?5mTesting Existing Sites6mBenefits of Responsive Design4mFluid Measurements7mCode With Me: Fluid Measurements5m

9 readings

Syllabus10mResources10mFrequently Asked Questions (FAQ)5mHelp us learn more about you!10mFluid Measurements background readings5mNotice for Auditing Learners: Assignment Submission10mPixel to Em conversion tool2mDynamically change the size of font with sliders3mOptional: CSS definitions of relative and absolute2m

1 practice exercise

Basic Concepts in Responsive Design approaches30m

Week2

Week 2

3 hours to complete

Week Two: Basic Concepts

3 hours to complete

6 videos (Total 43 min), 1 reading, 3 quizzes

Week3

Week 3

3 hours to complete

Week Three: Use Existing Frameworks

After every good programmer has put in time creating sites from scratch, it is common to utilize existing tools out there. After all, why recreate the wheel? The work you have done up to this point will give you the knowledge needed to craft your own unique sites from these frameworks. This week we will work with Bootstrap, a framework that uses HTML5, CSS, and JavaScript (but don't worry if you have never used JavaScript yourself).

3 hours to complete

7 videos (Total 55 min), 1 reading, 3 quizzes

Week4

Week 4

4 hours to complete

Week Four: Experiment!

4 hours to complete

9 videos (Total 60 min), 5 readings, 2 quizzes

9 videos

Responsive Images9mBootstrap Tables8mCode With Me: Advanced Navigation5mWhat Are Templates?6mOptional Interview: M W7mOptional Interview: H W6mOptional: Interview with H N9mBootstrap 43mConclusion1m

5 readings

Optional: The Evolution of the Airbnb front-end deveopment3mOPTIONAL - Debugging your style2mOPTIONAL - More resources for learning to debug/develop2mPost-course Survey10mKeep Learning with Michigan Online10m

1 practice exercise

Responsive Design Final Assessment30m

Reviews

4.7

788 reviews

5 stars
77.91%
4 stars
17.59%
3 stars
3.54%
2 stars
0.74%
1 star
0.20%

TOP REVIEWS FROM ADVANCED STYLING WITH RESPONSIVE DESIGN

by VSAug 9, 2020

This course was very helpful for me to develop an understanding and importance of responsive design. I also learnt the basics of Bootstrap 3 like making navigation-bar, responsive tables etc.

by VRSep 14, 2017

It is a good course, great for those who are goingo to work mainly with Bootstrap. I missed more responsive design techniques for those who wants to code by themselves.

by BPJul 27, 2019

Good concept, example, and assignment to make me more understand about Styling with Responsive Design. It will perfect if I can learn more about bootstrap 4 that is the newer.

by KGFeb 4, 2023

A very clear and engaging introduction to responsive design. Lots of advice on best practice. Despite the course referring to older versions of Bootstrap framework, still a useful course.

View all reviews

About the Web Design for Everybody: Basics of Web Development & Coding Specialization

This Specialization covers how to write syntactically correct HTML5 and CSS3, and how to create interactive web experiences with JavaScript. Mastering this range of technologies will allow you to develop high quality web sites that, work seamlessly on mobile, tablet, and large screen browsers accessible. During the capstone you will develop a professional-quality web portfolio demonstrating your growth as a web developer and your knowledge of accessible web design. This will include your ability to design and implement a responsive site that utilizes tools to create a site that is accessible to a wide audience, including those with visual, audial, physical, and cognitive impairments.

Frequently Asked Questions

When will I have access to the lectures and assignments?
Access to lectures and assignments depends on your type of enrollment. If you take a course in audit mode, you will be able to see most course materials for free. To access graded assignments and to earn a Certificate, you will need to purchase the Certificate experience, during or after your audit. If you don't see the audit option:
The course may not offer an audit option. You can try a Free Trial instead, or apply for Financial Aid.
The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
What will I get if I subscribe to this Specialization?
When you enroll in the course, you get access to all of the courses in the Specialization, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile. If you only want to read and view the course content, you can audit the course for free.
Is financial aid available?
Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.

More questions? Visit the Learner Help Center.

Build employee skills, drive business results

Discover Coursera for Business

Advanced Styling with Responsive Design

About this Course

Skills you will gain