How to Use HTML & CCS
HTML (or Hyper Text Markup Language) is an Internet language used in creating web pages. A web designer must be well versed in HTML in order to create the web page layout that he or she wants to appear on the screen for viewers. HTML can be created in a plain text file, but there are many programs such as Microsoft FrontPage that will organize the code for you. Another popular internet language is CSS, or Cascading Style Sheets. If you have a web page with several elements, Cascading Style Sheets help to maintain the continuity of the HTML on your website, as well as make it easier for you to create new web pages in the future.
Instructions
-
-
1
Open a text document in Microsoft Word, Notepad or any other text editing program. Name the file "index.html" if it is your first website.
-
2
Type <HTML> at the top of your document. This will begin your HTML code.
-
-
3
Type <TITLE> and </TITLE> next, after the <HTML> tag. If you would like your website to show a title in the blue bar on the very top of your browser, write something between the title tags, for example: <TITLE>This is My First Website.</TITLE>
-
4
Decide what color you want the background of your website to be. In HTML, each color is associated with a six-digit number. For example, in HTML, the color black is known as "#000000." See the Resources section below to learn about HTML background codes and how you can use them to create the background you'd like. For example, place the following code <body bgcolor="#000000"> after your </TITLE> code, and your website will have a black background.
-
5
Determine which text color you would like to use on your website. Check the Resources section below to cut and paste text codes into your text file and customize them. Be sure to place your overall text selections in the head of your HTML document, directly after your background color code. For example, <body bgcolor="#000000" text="#FFFFFF"> will give you white text on a black background.
-
6
Use separate codes to make temporary text changes in the body (after your last tag) of your HTML document by using codes like <b> for bold and <i> for italics. Always close the code by writing </b> or </i> after the text you would like to alter.
-
7
Choose where you would like images and links in the body of your HTML website. For an image, use <img src="http://www.your-website-name.com/name-of-picture.jpg"> to add the picture to your website. You can use codes like <center> to place your pictures or text in the center. To link the image, use <a href="http://www.your-link.com"> before the image code and </a> after the image code. Be sure to close the placement code by typing </center> after the selected text or image.
-
8
Use CSS if you would like your background and text to remain constant for each page of the website you make. Instead of placing HTML codes in the head (top) of the page, use CSS codes instead. CSS codes are challenging to write and synchronize to your website, but the style sheet recommendations that have been set by the World Wide Web Consortium (or W3C) are a good starting place. The W3C has created a Core Style Sampler where you can customize your CSS choices online; the website will give you the code, and you can copy it into the body of your website. For a beginner, this is the best way to utilize CSS. The W3C's Core Style Sampler can be found in the Resources section.
-
9
End your web page by using the </HTML> tag. This signifies that you have finished using HTML and CSS.
-
10
Save your file and upload it to your web server. If you are in need of a server, Google and Yahoo both provide free web space to which you can upload your web page.
-
1
Tips & Warnings
HTML and CSS can be complicated—this article is simply a tutorial on how to get your first website started.
For more advanced HTML and CSS commands, refer to the tutorial websites below or get a book on HTML and CSS.
Resources
- Photo Credit http://www.sxc.hu/profile/OmirOnia
