Skip to content

(New) Responsive Web Design In this Responsive Web Design Certification courtesy of (www.freecodecamp.org), you'll learn the languages that developers use to build webpages: HTML (Hypertext Markup Language) for content, and CSS (Cascading Style Sheets) for design.

Notifications You must be signed in to change notification settings

machariamunyi/Responsive-Web-Design

Repository files navigation

https://www.freecodecamp.org/

(New) Responsive Web Design

  • Continuing

In this Responsive Web Design Certification, you'll learn the languages that developers use to build webpages: HTML (Hypertext Markup Language) for content, and CSS (Cascading Style Sheets) for design.

First, you'll build a cat photo app to learn the basics of HTML and CSS. Later, you'll learn modern techniques like CSS variables by building a penguin, and best practices for accessibility by building a quiz site.

Finally, you'll learn how to make webpages that respond to different screen sizes by building a photo gallery with Flexbox, and a magazine article layout with CSS Grid.

Learn HTML by Building a Cat Photo App

  • Completed

HTML tags give a webpage its structure. You can use HTML tags to add photos, buttons, and other elements to your webpage.

In this course, you'll learn the most common HTML tags by building your own cat photo app.

Learn Basic CSS by Building a Cafe Menu

  • Completed

CSS tells the browser how to display your webpage. You can use CSS to set the color, font, size, and other aspects of HTML elements.

In this course, you'll learn CSS by designing a menu page for a cafe webpage.

Learn CSS Colors by Building a Set of Colored Markers

  • Completed

Selecting the correct colors for your webpage can greatly improve the aesthetic appeal to your readers.

In this course, you'll build a set of colored markers. You'll learn different ways to set color values and how to pair colors with each other.

Learn HTML Forms by Building a Registration Form

  • 32% Completed

You can use HTML forms to collect information from people who visit your webpage.

In this course, you'll learn HTML forms by building a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page.

Survey Form

  • Not started

This is one of the required projects to earn your certification.

For this project, you will build a survey form to collect data from your users.

Learn the CSS Box Model by Building a Rothko Painting

  • Not started

Every HTML element is its own box – with its own spacing and a border. This is called the Box Model.

In this course, you'll use CSS and the Box Model to create your own Rothko-style rectangular art pieces.

Learn CSS Flexbox by Building a Photo Gallery

  • Not started

Flexbox helps you design your webpage so that it looks good on any screen size.

In this course, you'll use Flexbox to build a responsive photo gallery webpage.

Learn Typography by Building a Nutrition Label

  • Not started

Typography is the art of styling your text to be easily readable and suit its purpose.

In this course, you'll use typography to build a nutrition label webpage. You'll learn how to style text, adjust line height, and position your text using CSS.

Learn Accessibility by Building a Quiz

  • Not started

Accessibility is making your webpage easy for all people to use – even people with disabilities.

In this course, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices.

Tribute Page

  • Not started

This is one of the required projects to earn your certification.

For this project, you will build a tribute page for a subject of your choosing, fictional or real.

Learn More About CSS Pseudo Selectors By Building A Balance Sheet

  • Not started

You can use CSS pseudo selectors to change specific HTML elements.

In this course, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage.

Learn Intermediate CSS by Building a Picasso Painting

  • Not started

In this course, you'll learn how to use some intermediate CSS techniques by coding your own Picasso painting webpage. You'll learn about SVG icons, CSS positioning, and review other CSS skills you've learned.

Learn Responsive Web Design by Building a Piano

  • Not started

Responsive Design tells your webpage how it should look on different-sized screens.

In this course, you'll use CSS and Responsive Design to code a piano. You'll also learn more about media queries and pseudo selectors.

Technical Documentation Page

  • Not started

This is one of the required projects to earn your certification.

For this project, you will build a technical documentation page to serve as instruction or reference for a topic.

Learn CSS Variables by Building a City Skyline

  • Not started

CSS variables help you organize your styles and reuse them.

In this course, you'll build a city skyline. You'll learn how to configure CSS variables so you can reuse them whenever you want.

Learn CSS Grid by Building a Magazine

  • Not started

CSS Grid gives you control over the rows and columns of your webpage design.

In this course, you'll build a magazine article. You'll learn how to use CSS Grid, including concepts like grid rows and grid columns.

Product Landing Page

  • Not started

This is one of the required projects to earn your certification.

For this project, you will build a product landing page to market a product of your choice.

Learn CSS Animation by Building a Ferris Wheel

  • Not started

You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.

In this course, you'll build a Ferris wheel. You'll learn how to use CSS to animate elements, transform them, and adjust their speed.

Learn CSS Transforms by Building a Penguin

  • Not started

You can transform HTML elements to create appealing designs that draw your reader's eye. You can use transforms to rotate elements, scale them, and more.

In this course, you'll build a penguin. You'll use CSS transforms to position and resize the parts of your penguin, create a background, and animate your work.

Personal Portfolio Webpage

  • Not started

This is one of the required projects to earn your certification.

For this project, you will build your own personal portfolio page.

Authors and acknowledgment

[https://www.freecodecamp.org/learn/2022/responsive-web-design/]

Honesty Policy

I pledge that I did not plagiarize any of my freeCodeCamp work. I understand that freeCodeCamp’s team will audit my projects to confirm this. - Dennis Macharia Munyi

About

(New) Responsive Web Design In this Responsive Web Design Certification courtesy of (www.freecodecamp.org), you'll learn the languages that developers use to build webpages: HTML (Hypertext Markup Language) for content, and CSS (Cascading Style Sheets) for design.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published