HTML

 

Tools/Diagnostics

Coding

Characters/Symbols/etc.

HTML Validator  official w3c
NetMechanics anylize site
 
Basics
Basic HTML
W3C coding Index
HTML Template 
 Colors 

Special Characters

Clean Up
HTML Tidy:
TidyGUI

Editors
   HTML-Kit   Edit Plus  
  Textpad 
  Eversoft    Lemmy 
 

Hints
 
Margins
  PopUp Window 
  Resize Window  
  echoform  
  Cookies 
Symbols 
  Alt-Codes
  Math&Greek 
  Intl  Html char set 
  Url escape codes  Urls 
  hex  mime meta
  domains environment var |   
Systems
Webgenz
Dreamweaver
Frontpage
   
Link with username and password  username:password@www.sitename.com
Basic HTML 
Basic Tags  | Body Attributes Text TagsLinksFormatting Graphical ElementsTables Table AttributesFramesFrames Attributes | Forms | Other | Template
Basic Tags 
<html>
Creates an HTML document
<head>
Sets off the title and other information that isn't displayed on the Web page itself
<title>
Sets the title of the document
<body>
All that need to be displayed goes within body tag
Body Attributes 
<body bgcolor="#FFFFFF">
This Sets the background color, using name or hex value
<body text="black">
This Sets the text color, using name or hex value
<body link="red">
This Sets the color of links, using name or hex value
<body vlink="#FFF0000">
This Sets the color of followed links, using name or hex value
<body alink="grey">
This Sets the color of links on click
<body background="moon.gif">
This Sets the background images to the specified file
Text Tags 
<h6>
Smallest headline
<h1>
Largest headline
<b>
Bold text
<i>
Italic text
<tt>
Typewriter-style text
<big>
shorthand for
<small>
shorthand for
<dfn>
definition
<em>
italic emphasis
<cite>
book titles
<code>
program listings
<kbd>
keystrokes
<pre>
preformatted
<samp>
computer status messages
<strong>
bold emphasis
<var>
to be replaced by specific when used.
<u>
underline
<address>
email address, possibly street address.
<blockquote> 
long quotation
<font size=2>
Sets size of font ( from 1 to 7)
<font color="#FF0000">
Sets font color, using name or hex value
<font face="arial">
Specify the font
Links 
<a href="www.wondersky.com">
Creates a hyperlink
<a href="mailto:ravi@wondersky.com">
Creates a mailto link
<a name="WonderSky">
Creates a target location within a document
<a href="#WonderSky">
Links to that target location from another place in the document
Formatting 
<p>  </p>
Creates a new paragraph
<p align=left>
Aligns a paragraph to the left, right, or center
<br>
Inserts a line break
<blockquote> 
Indents text from both sides
<dl> 
Creates a definition list
<dt>
Precedes each definition term
<dd>
Precedes each definition
<ol> 
Creates a numbered list
<li>
Precedes each list item, and adds a number
<ul>  
Creates a bulleted list
<div align=center>
A generic tag used to format large blocks of HTML, also used for stylesheets
<hr>
Inserts a horizontal rule
<hr size=200>
Sets size (height) of rule
<hr width=1>
Sets width of rule, in percentage or absolute value
<hr noshade>
Creates a rule without a shadow
Graphical Elements 
<img src="wondersky.gif">
Adds an image
<img src="wondersky.gif" align=center>
Aligns an image: left, right, center; bottom, top, middle
<img src="wondersky.gif" border=1>
Sets size of border around an image
Tables 
<table> </table>
Creates a table
<tr>
Sets off each row in a table
<td>
Sets off each cell in a row
<th>
Sets off the table header (a normal cell with bold, centered text)
Table Attributes 
<table border=1>
Sets width of border around table cells
<table cellspacing=1>
Sets amount of space between table cells
<table cellpadding=1>
Sets amount of space between a cell's border and its contents
<table width=300 or 50%>
Sets width of table - in pixels or as a percentage of document width
<tr align=left> or
Sets alignment for cell(s) (left, center, or right)
<tr valign=top> or
Sets vertical alignment for cell(s) (top, middle, or bottom)
<td colspan=1>
Sets number of columns a cell should span
<td rowspan=2>
Sets number of rows a cell should span (default=1)
<td nowrap>
Prevents the lines within a cell from being broken to fit
Frames 
<frameset>
tag in a frames document; can also be nested in other framesets
<frameset rows="2,3">
Defines the rows within a frameset, using number in pixels, or percentage of w idth
<frameset cols="2,3">
Defines the columns within a frameset, using number in pixels, or percentage of width
<frame>
Defines a single frame - or region - within a frameset
<noframes>
Defines what will appear on browsers that don't support frames
Frames Attributes 
<frame src="menu.htm">
Specifies which HTML document should be displayed
<frame name="myframe">
Names the frame, or region, so it may be targeted by other frames
<frame marginwidth=2>
Defines the left and right margins for the frame; must be equal to or greater than 1
<frame marginheight=1>
Defines the top and bottom margins for the frame; must be equal to or greater than 1
<frame scrolling="yes">
Sets whether the frame has a scrollbar; value may equal "yes," "no," or "auto. " The default is auto.
<frame noresize>
Prevents the user from resizing a frame
Forms 
<form>
Creates all forms
<select multiple name="NAME" size=1>
Creates a scrolling menu. Size sets the number of menu items visible before yo u need to scroll.
<option>
Sets off each menu item
<select name="NAME">
Creates a pulldown menu
<option>
Sets off each menu item
<textarea name="info" cols=40 rows=8>
Creates a text box area. Columns set the width; rows set the height.
<input type="checkbox" name="name">
Creates a checkbox. Text follows tag.
<input type="hidden" name="fieldname" value="fieldvalue">
Will send hidden information
<input type="radio" name="userage" value="Male">
Creates a radio button. Text follows tag
<input type=text name="username" size=20>
Creates a one-line text area. Size sets length, in characters.
<input type="submit" value="Submit">
Creates a Submit button
<input type="image" border=0 name="ws" src="ws.gif">
Creates a Submit button using an image
<input type="reset">
Creates a Reset button

Other

<P>  </P>  defines the boundaries of a paragraph.
                 To allign the paragraph use:
                 <P  ALLIGN=LEFT>
                  <P  ALLIGN=RIGHT>
                 <P  ALLIGN=CENTER>
                 <P  ALLIGN=JUSTIFY>

&nbsb   inserts a space in the text.

<BR>  forces a break, with the text going down one line to continue

<NOBR>    </NOBR>  putting text between here forces the text to stay on one line.

<WBR>  </WBR>  allows a break, but not in the middle of a word.

<DIV> defines the boundaries of a section of text </DIV> 
         To allign the division use:  <P  ALLIGN=LEFT>  etc.

<CENTER> is another way to center text, image, table, etc. </CENTER>

<SUB> 1 </SUB> lowers a character (like 1) slightly and reduces font size 1 degree
<SUP> 1 </SUP> raises the character (like 1) slightly and reduces font size 1 degree
<PRE> preformats a block of text like 1 one two three four 2 onea twoa threea foura  </PRE>  But it only does it in monospaced Courier.

<BLOCKQUOTE> sets blocks of text apart from the main body of text </BLOCKQUOTE>  puts a line space before, after, and indents it.

<FONT FACE="ARIAL" SIZE=1 COLOR="BLACK" >  changes the font of some text </FONT>
1=8pt,2=10pt,3=12pt,4=14pt,5=18pt,6=24pt, 7=36pt  COLOR="000000" is also black. For color codes see Browser Safe Colors 

 

Template

<HTML>
<HEAD>
<meta http-equiv="Content Language"  content="  ">
<meta http-equiv="Content Type" content="  ">
<meta name="description"  content "This tells you about this page">
<meta name="keywords"  content "onekeyword, anotherkeyword, thirdkeyword">
<TITLE> My Title  </TITLE>
</HEAD>
<BODY>
<p> defines the boundaries of a paragraph within the body </p>
</BODY>
</HTML>

** Note:  Front Page will not put the meta description and keywords into a document.  You need to do that by going to the html view and inserting it by hand, or using the Front page format for entering meta tags.