Adding Color to Your Webpage
We have learned many ways to spice up our websites. Perhaps none is more eye-catching than using color both for text and background. This simple step can take a boring black/white website, and transform it into an exciting website users will enjoy using. There are at least a couple of ways to code color for your website, namely CSS and HTML. In this tutorial we will learn how to code in HTML. This can be useful for occasional changes in the code, but in general I would recommend styling in CSS because it allows for greater flexibility and ease.
The first step in changing the color or background-color in HTML is to identify the element we wish to color. In this example we will use the heading h1. We must first open our h1 tags, and then include the property it’s value. Example 1) below shows us this step.
Ex. 1) <h1 style=”color: blue;”>
Our next step is to type the text we wish to color, and close the tag. We can see this in example 2)
Ex. 2) <h1 style=”color: blue;”>Adding Color to Your Webpage</h1>
The same steps can be copied in order to change the background color, we just need to change the property. In that case the code would read,
<h1 style=”background-color: blue;”>Adding Color to Your Webpage</h1>
These three examples can be seen below in both code and how it would look on your webpage.
I hope this tutorial will help you spice up your website like it did mine. A little color goes a long way when it comes to a user-friendly experience!
New Media Research Studio