Saturday, February 15, 2014

Making Code look Pretty with CSS

Image courtesy of http://wisepreneur.com/wp-content/uploads/2010/03/pencil.jpg
At one point in my college career, I decided to take a Basic Drawing class. When I started the class, I drew pictures with lines and strokes that were very purposeful and practical. A straight line put to paper was final. There was no correcting it. At least, that's how I viewed my effort.

However, I spent the next 16 weeks of that semester learning that making a drawing look pretty is not about the straightest line or the most perfect pencil stroke. No, drawing is about placing many different lines lightly onto a page until you get the right one down. Then, you go back and erase the rest.

I'm finding out that creating a web page with HTML (Hyper Text Markup Language) code is just like drawing.

When HTML is first typed into the canvas of a text editor (like notepad), it is not pretty. A browser such as Firefox or Internet Explorer will take that code and render it to a simple white background with basic text and images. Much like my first attempts to draw "perfection", HTML is the skeleton of a website that tells the browser what information should be rendered.

Once CSS is introduced, the entire game changes.

CSS stands for "Cascading Style Sheets". This new form of code represents the finesse of the light pencil stroke many professional artists use to craft an image into something beautiful. No longer will your website look like a plain canvas with lines. It is now chock full of color, stylized fonts, and beautifully arranged layouts. Of course, CSS is a bit more complicated than placing a pencil on a piece of paper. But, this new code added to any HTML-based website will completely change the look and feel of a website. If you are learning to code, CSS is a must!

To learn more about CSS and HTML, go to www.w3schools.com.

No comments:

Post a Comment