Web Pages

  Home > Tips & Tweaks > Web Pages
 
 

WebPages: A Look underneath the Hood

 

 

  Do you ever ponder how your favorite web browser mystically summons up a web page? Type in an address or click on a bookmark, and your eyes behold a web page, images diligently loading, text in all colors and sizes conveying info, annoying flash ads proclaiming that you're an "Instant winner! Click here!" Let's abstract your web browser down to its most elemental level. Think of your browser as a translator of the web; it essentially pulls HTML code-the language that makes up the stuff of web pages-and translates that code into what you see displayed on your browser window. All the text, hyperlinks and images are described in the HTML code-what text to display, where to retrieve certain images and their positions, hyperlinked locations-and are rendered from HTML (hyper text markup language) into a visual representation you can enjoy.

So, what does HTML code look like? Let's take a look at a web page. What's the name of that little search engine? Oh, yeah, Google. Surf on over to Google's homepage and-on Firefox-go to the main menu and select "View" and then "View Source". Do you see that spaghetti-like soup of HTML code all lumped together? Well, that's HTML, but don't let it scare you off. HTML is surprising easy to code, and, if cleanly formatted, easy to read once you get the hang of it.

 

Here's a little HTML I coded up:

 

<html>

<head>

<title>TEST HTML</title>

</head>

<body>

<center>

<h1>What's this? Oh, it's text!</h1>

<font color="green">

<h1>Kermit!</h1>

</font>

<hr width="50%"/>

<br/>

<img src="http://mahalosoft.com/bionicspider/img/bs.gif" border="1"/>

</center>

<table border="1">

<tr>

<td>

Arrakis

</td>

<td>

Geidi Prime

</td>

</tr>

<tr>

<td>

Caladan

</td>

<td>

Selusa Secundus

</td>

</tr>

</table>

<ul>

<li>The Godfather</li>

<li>The Stand</li>

<li>Dune</li>

<li>Shogun</li>

</ul>

</body>

</html>

 

This squiggly chunk of HTML code makes a complete web page; it contains the necessary structure, plus added content to make it a little more interesting. Copy and paste the above code into a plain text file-fire up an instance of Notepad for this-save it as "test.html", and open it up in your browser. Any text editor that knows how to write vanilla ASCII text will do, Window's notepad being a convenient, low-calorie editor that's readily available.

Back To Tips HomePage


Google
 

Popular Articles:

How To Build A PC | Different Types of Keyboards | Help with Hard Drive Installation | Computer Networking Basics | Introduction of Motherboard Functions | Computer CPU Processor Speed | Upgrade from Windows 95 to Windows 98 | Computer Monitor Troubleshoot | Partition Hard Drive | Installing New CPU Processor | Types of Network Cables

 
Popular Topics
Home
Building A PC
How To Guide
Software
Hardware
Tips & Tweaks
Freeware
   

 

 

1999-2010 All rights reserved © waterwheel.com