|
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:
- 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
- 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.com
/~pasher/wpcode/xhtmlvers.htm">
XHTML 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">
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.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.
|
|
| COPYRIGHT & PRIVACY ISSUES |
|