Search billions of records on Ancestry.com
   

Web Pages are NOT Created Equal

Example of a simple web page
HTML editors are great for creating web pages quickly and easily. They are a convenience for beginners and experienced web masters alike. But all HTML editors do not write identical code. While some straight HTML editors do a very good job (I'm partial to Arachnophilia), many WYSIWYG editors write what we call bloated code, using much more code than is necessary and increasing your download times exponetially. Most experienced web authors avoid using a word processor such as Microsoft® Word/Publisher to create their web pages.

The Mini Web Page illustrated on the right is about as simple as a web page can be. Below are two versions of code for this Mini Web Page. In your browser, the pages appear to be virtually identical, but the file size for the MS Word2000 generated web page is 3-1/2 times the size of the basic HTML page. You probably won't notice much difference when visiting this Mini Page. But an average web page containing about 25Kb of HTML requires about 7 seconds to download with a 28.8 modem. The MS Word version of the HTML for the same page will require at least 28 seconds to download.

Other things to consider when using a word processor or WYSIWYG editor to generate your HTML:

  1. The complexity of the generated code which can make it difficult to find errors, or edit and insert code manually; for example, inserting the snippet of code for a RootsWeb counter; and

  2. Proprietary code which may not work in other browsers.

You can view and compare both versions of the Mini Web Page using the actual page links below.

Basic HTML Code
File size=1,015 bytes *
See the actual page created by this code
XHTML Code written by MSWord2000
File size=3,436 bytes *
See the actual page created by this code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> <html> <head> <title> Web Page Code - HTML </title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta name="author" content="Copyright2000 Patricia J. Asher"> <meta name="keywords" content="HTML,XHTML,tutorial"> <meta name="description" content="HTML vs XHTML, part of a brief tutorial on the basics of writing HTML."> </head> <body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000"> <h1 align="center"> This is a Mini Web Page </h1> <p align="center"> It includes all the basic components of any web page: <br> META tags and some links: <br> See the <a href=
"http://homepages.rootsweb.ancestry.com
/~pasher/wpcode/xhtmlvers.htm"> XHTML Version </a> <br> Back to <a href=
"http://freepages.computers.
rootsweb.ancestry.com
/~pasher/wpcode.htm"> <i> Web Pages are NOT Created Equal </i> </a> </p> <p align="center"> And a graphic: <img src="rweb1.gif" width="170" height="60" alt="RootsWeb"> </p> <br> <br> </body> </html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html xmlns:v="urn:schemas-
microsoft-com:vml" xmlns:o="urn:schemas-
microsoft-com:office:office" xmlns:w="urn:schemas-
microsoft-com:office:word" xmlns="http://www.w3.org/TR/REC-html40"> <head> <meta http-equiv=Content-Type content="text/html; charset=iso-8859-1"> <meta name=ProgId content=Word.Document>
<meta name=Generator content="Microsoft Word 9"> <meta name=Originator content="Microsoft Word 9"> <link rel=File-List href="./xhtmlvers_files/filelist.xml">
<link rel=Edit-Time-Data href="./xhtmlvers_files/editdata.mso">
<!--[if !mso]> <style> v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} </style>
<![endif]--> <title> Web Page Code - XHTML </title>
<!--[if gte mso 9]> <xml>
<o:DocumentProperties> <o:Author>Patricia Asher</o:Author> <o:LastAuthor>Patricia Asher</o:LastAuthor> <o:Revision>2</o:Revision> <o:TotalTime>4</o:TotalTime> <o:Created>2002-07-12T20:20:00Z</o:Created> <o:LastSaved>2002-07-12T20:20:00Z</o:LastSaved> <o:Pages>1</o:Pages> <o:Words>63</o:Words> <o:Characters>362</o:Characters> <o:Lines>3</o:Lines> <o:Paragraphs> 1 </o:Paragraphs> <o:CharactersWithSpaces> 444 </o:CharactersWithSpaces>
<o:Version>9.3821</o:Version> </o:DocumentProperties> </xml><![endif]--> <style>
<!-- /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal
{mso-style-parent:""; margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:"Times New Roman"; color:black;} h1 {color:black;} a:link, span.MsoHyperlink {color:blue; text-decoration:underline; text-underline:single;} a:visited, span.MsoHyperlinkFollowed {color:purple; text-decoration:underline; text-underline:single;} p {font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:"Times New Roman"; color:black;} @page Section1 {size:8.5in 11.0in; margin:1.0in 1.25in 1.0in 1.25in; mso-header-margin:.5in; mso-footer-margin:.5in; mso-paper-source:0;} div.Section1 {page:Section1;} --> </style> <!--[if gte mso 9]><xml> <o:shapedefaults v:ext="edit" spidmax="1027"/> </xml><![endif]--><!--[if gte mso 9]><xml> <o:shapelayout v:ext="edit"> <o:idmap v:ext="edit" data="1"/> </o:shapelayout></xml><![endif]--> <meta name=author content="Copyright2000 Patricia J. Asher"> <meta name=keywords content="HTML,XHTML,tutorial"> <meta name=description content="HTML vs XHTML,
part of a brief tutorial on the basics
of writing HTML."> </head> <body bgcolor=white lang=EN-US link=blue vlink=purple style='tab-interval:.5in' alink="#ff0000"> <div class=Section1> <h1 align=center style='text-align:center'>This is a Mini Web Page </h1> <p align=center style='text-align:center'>It includes all the basic components of any web page: <br> META tags and some links: <br> See the <a href=
"http://homepages.rootsweb.ancestry.com
/~pasher/wpcode/htmlvers.htm"> HTML Version </a> <br> Back to <a href=
"http://freepages.computers.rootsweb.com
/~pasher/wpcode.htm"> <i> Web Pages are NOT Created Equal </i> </a> </p> <p align=center style='text-align:center'>And a graphic: <img border=0 width=170 height=60 id="_x0000_i1025" src=rweb1.gif alt=RootsWeb></p> <p class=MsoNormal style='margin-bottom:12.0pt'> <![if !supportEmptyParas]>  <![endif]><o:p></o:p></p> </div> </body> </html>

* Note: File size refers to the HTML only and does not include the graphic displayed on the Mini Web Page.


Pat's Web Page Tutorials
Copyright ©2000-2017 Pat Asher
http://freepages.computers.rootsweb.ancestry.com/~pasher/wpcode.htm