Other Related

Other Link

Cari Disini Selengkapnya

Custom Search

15 Mei 2009

Updating the Annandale Bands website

a quick tutorial of HTML code.

By: Bony W Rakhman, SST

What is HTML and XHTML?
HTML and XHTML are markup languages used to display websites. XHTML is the newer version of HTML but both languages are similar. To avoid confusion in this document, both languages will simply be called HTML and no distinction will be made between the two.
To see HTML at work on the web, open a website and select "source" from one of your browser's pull-down menus. On Internet Explorer, this can be found under the "View" menu. The code for some webpages is a jumbled mess, but the code of the Annandale High School Bands webpage is made to be as comprehensible as possible for easy editing. The front page of the site is an exception because it is edited using blogger.com and not by editing the HTML manually. Editing the webpage will be clarified in the following chapters and the mysterious code that makes up the Internet will be revealed.
The website structure.
A website can be thought of as accessing a hard drive on a home computer. One can see the directory structure of a website by looking at a web address. For example:
http://www.annandalebands.org/awards/index.html
http:// Stands for Hypertext Transfer Protocol. Basically, it tells the computer the general place to look for the website.
www Stands for World Wide Web, and is another indicator for the computer to help it find the webpage on the Internet.
Bonysst.blogspot.com The website address. This can be thought of as the
harddrive or computer being accessed. The "org" means
that the site is a not for profit organization.
/awards/ This is a folder (also called a directory) on the site. Each new name after a slash mark signifies that the new folder is inside whatever name precedes it.
index.html The name of the file being accessed. A web browser will automatically display the index.html if no other filename is given.
There are eleven folders for the Annandale Bands website. These folders correspond to each of the links on the right-hand navigation of the webpage.
A single page on a website.
When a webpage is displayed, your web browser is interpreting and displaying a file that contains HTML. Use find "source" or "view source" in your browser's menu bar to see this code. In Internet Explorer this is under the "View" menu. Below is an example of the code on the Annandale High School Bands website with annotations. Remember: only the small amount of bold text should be edited.
Document type. Lets the web browser know what kind of code the site uses.

Page title, styling, and search engine information.

Annandale High School Bands









Annandale High School Bands header graphic






This is the main content section; it is the only part of the page that should be changed when an update is made. Only edit within the "Begin Content" and "End Content" comment tags that are shown in bold.

Fundraising



Baked ham and turkey sale coming soon!




Right-hand navigation, footer section, and end of HTML








General rules to follow when writing code.
Lowercase tags: all markup code, names of linked files, and folder names should be lowercase. This simplifies pages and is technically correct.
Backup files: keep a backup of the file you are editing. Edit a copy of the website on your computer before uploading to the web.
End all Tags: always end tags with their corresponding end tag equivalent. This lets the browser know when to end the formatting given by a tag. Example:

Sample

. In this example the

tag is the ending tag and is signifying the end of a paragraph.

Common Code in the Annandale Bands Website
 
Signifies a non-breaking space.

Tidak ada komentar: