CSS and CARP design!!

OVERVIEW

     This was actually our second web design project in e9, but this one was still very different. Our first web project was more starting from scratch, and this one we had an original site to add CSS designs to. For this project, we started with a poem created in a format that completely disregarded all the rule of CARP. I preferred this project because I could see the difference between the original and our modified version. This project definitely helped me to understand the importance of CARP in a web design project. To change the CSS styles of this poem, we had to individually alter the all the different sections of the poem.

CONTRAST

     When we created the poem format with CSS styles, we created contrast between many things. One major contrast that was required was contrast between the background and the poem text color. This is important so that you can read the text clearly. We also added  contrast between the text background and the color behind that. 

ALIGNMENT

     We greatly improved the alignment of the poem. One example of how e did this would be that we moved the picture of the dog to the right side of the page, to improve the feeling the reader gets so that they are not wondering what the dog is looking at off the screen. We also fixed the alignment of the text, making sure that it is all left-aligned.

REPITITION

     To improve the repetition of the picture, we repeated a lot of the colors from the dog to use throughout the page. We also made sure that the spacing between paragraphs of the poem and used the same color for the text with the exception of the title.

PROXIMITY

     There were many issues with the proximity of the original page. One that stood out to me the most was one line of the poem that was not grouped together with the rest of the text. We also improved the proximity of the author name to the rest of the poem. We also fixed how close the dog was to the rest of the text, instead of having it right on top of the poem like the original.

CONCLUSION

     I learned how to create two sections with different background colors. For example, we separated the body and container sections, them colored them differently, also creating contrast. This was our second web design project, but it was very different. We had to be very specific with all of our codes and colors. I definitely preferred this project, because we had more instructions, and I think it was just more simple overall.