Sample Video Frame
10: Simple Layouts with Blockstart
Your studies so far have covered a very linear and boring style of HTML. Your documents start at the top and go to the bottom. There's no 2-dimensional layout, no color, no font differences, just straight line HTML. When you look around the internet you don't see too many websites like this. Maybe a few blogs here and there--but for the most part--every site has complex 2d layouts that have multiple rows with columns.
To create one of these "fancy" layouts you need to use CSS, but going from plain HTML to HTML+CSS is a major jump. After working with many students who struggled with this jump I came up with something called blockstart.css. The
blockstart.css is a simple CSS file you can add to your HTML which gives you some basic layout blocks entirely in HTML. I actually use it to get started with my designs so I don't have to deal with CSS until I'm ready to make my pages "perty." For you, it will let you practice creating layouts before you've fully learned about CSS.
By practicing 2d layout with
blockstart.css you'll be able to transition to CSS more easily. You'll already have studied the HTML needed to position elements where you want on the page and only need to learn how to do that with CSS later. This exercise will teach you how to use
blockstart.css quickly, and then the next module will explain it more fully toward the end.
Register today for the course and get the all currently available videos and lessons, plus all future modules for no extra charge.