Sorry, your browser is not supported
To have the best experience using Skillshare, we recommend that you use one of these supported browsers.

Essentials of Coding a Responsive Design Layout with HTML & CSS for Beginners

JP Adams, Frontend Engineer, Mentor & Shipper of Projects

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
7 Videos (38m)
    • Introduction

    • Project Demo

    • Key Concepts: Responsiveness In Real Life

    • Media Queries, Viewports, Element Width

    • Element Positioning, Content, Design, and Recap

    • Looking at Code and Reference Sites

    • Conclusion


About This Class


Learn the fundamentals of coding responsive web pages and sites by building your own. 

In this class, we will go through the process of planning out, mocking up, and coding an about page that works on desktops, tablets, and phones.

I designed this class for beginners, so with a basic understanding of HTML and CSS, you should be able to code your very own responsive about page when you follow along with the class project.

You will learn concepts and terms like:

- What is responsive design?

- Mobile first design

- CSS Media Queries

- Viewports

- Meta tags

- And more

The goal is to make something that is quick, fun, and useful. Enjoy!






Reviews (0)

JP Adams

Frontend Engineer, Mentor & Shipper of Projects

Hi, I'm JP Adams.

I'm a Software Engineering with a passion for Coding, personal development, and shipping projects.

I've been coding for close to 20 years, and in that time I've had my work used by companies like IBM, BP, AOL and more. I currently work as a lead engineer building a hybrid mobile application that runs both on the web and as an iPad application.

Before that, I was on a team developing a product that is being used by the State of California and the State of...

See full profile