Friday, March 2, 2018

CSS and CARP Design

Overview

The project was over how to make a website, and how CSS and CARP can make a website better. The HTML we started with had a poem written about a dog. One HTML file had no CARP or CSS and after we finished the HTML file was packing in cool design and amazing colors. The information is stored in the code in the HTML file.

Contrast

The project had overall good contrast. The black background with the almost white page made the text on the page, pop out. The text color also was good, the tan color works both on white and black backgrounds which made the text easy to read. The brown text in the poem works well on the white, which is fine.

Alignment

The poem text was lined up overall which was pretty good to read and look at. The poem text also lines up with the author text which gives the page an professional feel. The title heading and subheading pretty much end and start at the same point. The only bad alignment was the dog being out of the white page, which looked a bit weird.

Repetition

The colors overall were mostly repeated which looked nice across the paper. The poem text color was consistent but the text font really wasn't. The link text and the author text are the same which gives the page not many colors which makes it more simple and better to look at. The header has a darker tone than the author text but it gives it a more pop than the lighter tan.

Proximity

Not much I can say about grouping, not that it was bad but their isn't much to talk about. The text grouping was nice and easy to read, no random spacing. The header and sub header was also nice and grouped in the center so its the first thing you read when you see the page.

Overall

CSS can make your page look a lot better in many ways. CARP can help make a plain ol' blank page into a colorful, professional, masta' piece. I've learned how to mess with a pages components and how to make them look better. Color is one of the main components, next to font, to make a page a heck of a ton better.

Page with CSS styles


Page without CSS styles