Home arrow HTML arrow HTML Methods to Remember and Use Effectively

HTML Methods to Remember and Use Effectively

In the years since the first development of HTML, many other computer languages have been developed to enhance the pages displayed on the Internet. These languages include JavaScript, VBS, Perl, ASP, and .Net. However, I will show you that you can enhance your web page just using HTML. This is especially important if you are new to web page development and have not had the time to learn another language.

Author Info:
By: Stephen Davies
Rating: 3 stars3 stars3 stars3 stars3 stars / 21
December 05, 2007
  1. · HTML Methods to Remember and Use Effectively
  2. · Page Layout
  3. · Text Enhancing
  4. · Use of Classes

print this article

HTML Methods to Remember and Use Effectively
(Page 1 of 4 )

In 1990, Tim Berners-Lee and Robert Crillian developed HTML (Hypertext Markup Language) for CERN's (European Organization for Nuclear Research) World Wide Web (W3) project. The original purpose of the project was to better enable CERN's researchers to communicate over the Internet. In late 1991, Berners-Lee released the HTML specification on the Internet, and the World Wide Web (www) was born. The rest is history. The last official version of HTML (version 4.01) was released by the W3C (World Wide Web Consortium) in 1999. HTML 5.0 is still in the drafting stage.

The first item I will discuss is web page backgrounds. Any web page you create is easily enhanced by either coloring the background or by adding a background image. You can further enhance your page by using a gradient (moves from lighter to darker or vice versa) colored background or by making the image static (text scrolls, but background does not). A great HTML color chart that is easy to read can be found at this website. We will need this to input the correct color codes in our HTML tags. Notice that each color has a name and a hexadecimal code (hex code) to identify it. We can use either the name or the hex code.

To add a colored background just add the bgcolor attribute to the page's body tag:

<body bgcolor="######">, where ###### is the color code from our color chart. For a light blue background, we would enter skyblue or the hex code 87CEEB like so:

<body bgcolor="skyblue"> or <body bgcolor="#87CEEB">.

To place an image, or to wallpaper our background, use the background attribute in the body tag: <body background="myimage.gif"> (we can also use jpeg). The lighter the image is, the better. The web browser will tile any image you use, so it will be repeated many times (wallpaper). The key to picking background colors and images is to pick one that will not obscure the text on our page. There are some pretty awful looking websites out there that are impossible to read. In the heydays of dialup connections, a cool effect was to add a colored background before the imaged background appeared, like so: <body bgcolor="skyblue" background="myimage.gif">. 

To make a colored background gradually change hues, use the following body tag with the style attribute: <body
(endColorstr='#87CEFA', startColorstr='#00BFFF', gradientType='0');">
(make sure you place the whole tag on the same line, with no space between Microsoft.Gradient). Again, we can choose any color from the color chart, but for the best effect, we will use a light color shading and gradually shift into a lighter shade of the same color.

To make the background image static use the following code:

<body background ="myimage.gif" bgproperties="fixed">. Notice we used a new attribute in the body tag - bgproperties.

blog comments powered by Disqus

- Does HTML5 Need a Main Element?
- Revisiting the HTML5 vs. Native Debate
- HTML5: Not for Phone Apps?
- HTML5 or Native?
- Job Hunting? Freelancer.com Lists This Quart...
- HTML5 in the News
- Report: HTML5 Mobile Performance Lags
- The Top HTML5 Audio Players
- Top HTML5 Video Tutorials
- HTML5: Reasons to Learn and Use It
- More of the Top Tutorials for HTML5 Forms
- MobileAppWizard Releases HTML5 App Builder
- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials