À propos de ce cours
4.8
3,229 notes
675 avis
100 % en ligne

100 % en ligne

Commencez dès maintenant et apprenez aux horaires qui vous conviennent.
Dates limites flexibles

Dates limites flexibles

Réinitialisez les dates limites selon votre disponibilité.
Heures pour terminer

Approx. 18 heures pour terminer

Recommandé : 6 hours/week...
Langues disponibles

Anglais

Sous-titres : Anglais

Compétences que vous acquerrez

Web DesignStyle SheetsCascading Style Sheets (CCS)Web Development
100 % en ligne

100 % en ligne

Commencez dès maintenant et apprenez aux horaires qui vous conviennent.
Dates limites flexibles

Dates limites flexibles

Réinitialisez les dates limites selon votre disponibilité.
Heures pour terminer

Approx. 18 heures pour terminer

Recommandé : 6 hours/week...
Langues disponibles

Anglais

Sous-titres : Anglais

Programme du cours : ce que vous apprendrez dans ce cours

Semaine
1
Heures pour terminer
5 heures pour terminer

Week One: Getting Started with Simple Styling

Welcome to Introduction to CSS3! In this course you will learn how to style your pages by taking advantage of the power of CSS3. We will focus on both proper syntax (how to write your styling rules) and the importance of accessibility design (making sure that your style enhances your site, not make it harder to navigate). It is so important that you jump in ready to make mistakes and typos in this course. The only way you will really understand the material is to practice typing it in on your own as often as possible....
Reading
8 vidéos (Total 80 min), 8 lectures, 2 quiz
Video8 vidéos
01-02 Cascading Style Sheets16 min
01-03 Colors9 min
01-04 Styling Your Text12 min
01-05 Code Together9 min
01-06a Display and Visibility - Part 111 min
01-06b Display and Visibility - Part 27 min
01-07 Optional -- Homework Description4 min
Reading8 lectures
Syllabus10 min
Resources10 min
Help us learn more about you!10 min
Building Your First Web Page10 min
Early coding3 min
Code Placement5 min
Homework One Description10 min
Peer Review1 min
Quiz1 exercice pour s'entraîner
Styling Syntax and Theory26 min
Semaine
2
Heures pour terminer
5 heures pour terminer

Week Two: Advanced Styling

Colors and fonts are just the start to styling your page. The nice thing about starting with these properties is that they are usually very straightforward to implement. You pick a color and boom - instant, expected results. This week we move on to new properties that tend to require a little bit of tweaking to get the desired results. In particular we will talk about the Box Model, background images, opacity, float, columns, visibility, and designing for different browsers....
Reading
8 vidéos (Total 79 min), 9 lectures, 3 quiz
Video8 vidéos
02-02 Code Together8 min
02-03 Styling Links and Lists11 min
02-04 Advanced Selectors12 min
02-05 Browser Capabilites11 min
02-06 Code Together7 min
02-07 Designing For Accessibility6 min
02-08 Optional - Homework Description6 min
Reading9 lectures
Resources1 min
Coding Together1 min
Supplemental reading on complex selectors20 min
Shorthand rules5 min
Browsers6 min
Code Together2 min
Background Images and Opacity6 min
Optional - The importance of headings10 min
Homework Two Description8 min
Quiz2 exercices pour s'entraîner
Optional Practice Quiz: Review26 min
Advanced Selectors Quiz32 min
Semaine
3
Heures pour terminer
1 heure pour terminer

Week Three: Psuedo-classes, Pseudo-elements, Transitions, and Positioning

Have you ever noticed on a web page that some links are blue and others are purple, depending upon if you have clicked on the links? How is it possible to style some anchor tags and not others? This week you will learn how to style pseudo-classes (e.g. a link that has been visiting, an element that has the mouse hovering over it) and pseudo-elements (e.g. the first-letter of a heading, the first line of a paragraph). These elements are not difficult to style, but do require careful coding. It is also the first step to adding simple animation to your site. We end this week with the subject of positioning -- how to get elements to stick to a certain part of your page. Think about annoying pop-up ads. How do the programmers get them to stay RIGHT IN THE MIDDLE OF THE SCREEN despite the fact that you keep trying to scroll them away....
Reading
5 vidéos (Total 29 min), 5 lectures, 1 quiz
Video5 vidéos
03-02 Transitions5 min
03-03 Transforms5 min
03-04 Code together - Transitions4 min
03-05 Positioning10 min
Reading5 lectures
Resources1 min
OPTIONAL READINGS - Transitions, Transforms, and Animation2 min
Positioning2 min
Why not a Peer Assignment this week?1 min
Some Fun Links1 min
Quiz1 exercice pour s'entraîner
Final Quiz18 min
Semaine
4
Heures pour terminer
3 heures pour terminer

Week Four: Putting It All Together

This week I am going to do some code review. I will show you how I used pseudo-classes and pseudo-elements to style a table. Then I give you a demonstration of three different navigation bars that utilize different styling options. We will want to step back and talk about how these different options may affect the accessibility of our site. The final step to completing this course is the completion of the peer-graded project. You will have the chance to demonstrate the ability to follow styling guidelines while still putting your own personal touch on the project. Just remember, you need to validate your work for proper syntax and accessibility....
Reading
7 vidéos (Total 34 min), 3 lectures, 1 quiz
Video7 vidéos
04-02 Creating Navigation Menus3 min
04-03 Accessible Navigation7 min
04-04 Creating Navigation Menus 23 min
04-05 Creating Navigation Menus 35 min
04-06 Optional - Homework Description6 min
04-07 Conclusion2 min
Reading3 lectures
Resources1 min
OPTIONAL: A Change to the Accessibility of Headings2 min
Final Project Description7 min
Heures pour terminer
15 minutes pour terminer

Where To Go From Here?

If you would like to do more now that you have finished this course, I have a few recommendations. The most important thing is that you continue to practice your skills and always have "something" that you are working on....
Reading
4 lectures
Reading4 lectures
Coursera Options1 min
CodeAcademy - other badge tutorials2 min
Meetups2 min
Post-course Survey10 min
4.8
675 avisChevron Right
Orientation de carrière

45%

a commencé une nouvelle carrière après avoir terminé ces cours
Avantage de carrière

41%

a bénéficié d'un avantage concret dans sa carrière grâce à ce cours
Promotion de carrière

17%

a obtenu une augmentation de salaire ou une promotion

Meilleurs avis

par AFDec 26th 2015

Excellent course! Well paced and the course really builds skills in using CSS3! Highly recommend this course to anyone looking to get a good grounding in CSS or who wants to go over the basics again.

par MSApr 12th 2018

I have learned SO much in this class. I am making web sites, writing code, making mistakes, and solving problems.\n\nThis is the most practical class I have taken on Coursera. I HIGHLY recommend it!

Enseignants

Avatar

Colleen van Lent, Ph.D.

Lecturer
School of Information
Avatar

Charles Severance

Associate Professor
School of Information

À propos de University of Michigan

The mission of the University of Michigan is to serve the people of Michigan and the world through preeminence in creating, communicating, preserving and applying knowledge, art, and academic values, and in developing leaders and citizens who will challenge the present and enrich the future....

À propos de la Spécialisation Web Design for Everybody (Basics of Web Development and Coding)

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....
Web Design for Everybody (Basics of Web Development and Coding)

Foire Aux Questions

  • Une fois que vous êtes inscrit(e) pour un Certificat, vous pouvez accéder à toutes les vidéos de cours, et à tous les quiz et exercices de programmation (le cas échéant). Vous pouvez soumettre des devoirs à examiner par vos pairs et en examiner vous-même uniquement après le début de votre session. Si vous préférez explorer le cours sans l'acheter, vous ne serez peut-être pas en mesure d'accéder à certains devoirs.

  • Lorsque vous vous inscrivez au cours, vous bénéficiez d'un accès à tous les cours de la Spécialisation, et vous obtenez un Certificat lorsque vous avez réussi. Votre Certificat électronique est alors ajouté à votre page Accomplissements. À partir de cette page, vous pouvez imprimer votre Certificat ou l'ajouter à votre profil LinkedIn. Si vous souhaitez seulement lire et visualiser le contenu du cours, vous pouvez accéder gratuitement au cours en tant qu'auditeur libre.

D'autres questions ? Visitez le Centre d'Aide pour les Etudiants.