From the course: Learning Responsive Web Design in the Browser
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Create a baseline document with HTML5 - WordPress Tutorial
From the course: Learning Responsive Web Design in the Browser
Create a baseline document with HTML5
- [Voiceover] At the core of every website and every web document is the content itself. To design a great website, you have to have the content structure in place, and that's where the design in the browser process starts. It's important to point out here that you don't need the final content for this, just some representative content that looks and behaves like the final content. With the layout drafts, the container and module maps, and some representative content, we can start marking up index.html. How exactly you go about doing this is about personal preference and habit, but my experience is it's best to start at the top and work your way down. Personally, I like to mark up the containers along with the content as I move my way down. This makes it easier to remember to add comments at every closing tag, and it also makes it easier to preserve proper indentation in the document, so that visual hierarchy and structure is maintained. For this project, I've already written a bunch…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
Tools and setup2m 55s
-
(Locked)
Start with a core setup3m 5s
-
(Locked)
Create a baseline document with HTML51m 53s
-
(Locked)
Sidebar: A simple RWD principle1m 1s
-
(Locked)
Apply fonts and responsive typography8m 8s
-
(Locked)
Work on one module at a time8m 30s
-
(Locked)
A practical approach to responsive web design6m 39s
-
(Locked)
Use modern technologies to simplify the design process9m 18s
-
(Locked)
Create responsive layouts with Flexbox9m 44s
-
(Locked)
Color tools in the browser4m 33s
-
(Locked)
Color experimentation and the value of HSLA5m 21s
-
(Locked)
✓ Challenge: Design the article page in the browser1m 24s
-
(Locked)
✓ Solution: Design the article page in the browser8m 21s
-
-
-
-