4. Non-Designer’s Web Book Reading (and Twitter)

I learned some interesting design principles from the reading this week:

Consistent Alignment

You want to use a consistent alignment on your webpages. Don’t center some things and left-align others, and right-align still others. Choose one alignment and stick with it. You want strong lines in your design.

I feel like I mostly do this on my webpages, but I’ve never been following a conscious rule. Mixing alignments really does look funny. It’s nice to know my aesthetic sensibilities are (mostly) correct.

Proximity

Group like things together, so that it’s easier to visually discern relationships between page elements. Headings and subheadings should go with the text they relate to. Squint your eyes a bit and see if you can tell what goes with what, without even having to read.

Paragraph vs. Break

Using a <br/> code instead of <p>aragraph</p> can prevent a big gap between elements. The browser will treat lines that are <br/>oken up as a single paragraph, so it’s good for styling, too.

Repetition

Using a unified style across multiple pages make them all look like the belong to the same website. Since I usually use a CMS (Drupal) with specifically styled themes, this is usually a no-brainer, but having to code individual webpages for this class has reminded me of how important (and irritating) it is to keep everything consistent when you do it by hand.

Contrast

In photography, contrast is a difference between light and dark, and it’s those differences that create an image. In web-design, a similar analogy can be made, that using contrasting fonts and colors can draw the reader’s eye to where you want them to go. Contrast defines what’s important, and develops a logical hierarchy. If everything looks like it has the same priority, then nothing has priority.

Leave a Reply