|
How to
Understand HTML
23 MUST-HAVE HTML TOOLS
There is far, far more to understand about HTML (HyperText
Markup Language) than I could possibly share here. Dozens, if not hundreds, of
thick heavy books have been written on the subject and more are coming out all
the time as HTML evolves and changes.
However, below you will find an assortment of (hopefully!)
easy-to-use tools gathered from around the world and gathered together here for
your convenience. I have tried some of them and have added my own comments - pro
and con - as to how much they really help.
As you will soon see, many of the free online tools can often
be more trouble than they're worth if you don't understand why something goes
wrong when it does. You need to be able to look at raw code, know what
you're looking at, and know what might be missing or incorrect. That
means you really need to either learn HTML ... or pay a professional web
designer to design a professional website for you.
At Phoenix Technologies we don't charge an arm and a leg, but
you'll soon see that we're worth every cent!
Web Page & Editing Tools
Javascript Encrypter - Encrypt and protect your javascript codes.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Tables Generator - Build dynamic html tables
"easily" (so they claim), to add to your website with several options.
Tables can be one of the most confusing aspects of web design, especially if a
table contains multiple cells. You often don't know just where one stops and the
next one starts. This tool has potential but the default background and border
colors are all the same shade of gray (in my Firefox browser) and I was unable
to change them. Still, the end result turned out OK (at least on their website
but not in the example below), and there was no gray
background at all. The resulting code is then copied and pasted into your own
HTML page. The problems start (for beginners) at that point, in trying to decide
how to put something into the table.
| This is the resulting code
for a table 3 columns across and 4 rows down:
<table border="1" cellspacing="1" cellpadding="1"
width="80%">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
|
... and this is the resulting table - pretty disappointing! On their
website it looked fine:
Here's what it should look like:
... and the code to create it:
<div align="center">
<center>
<table border="1" cellpadding="4"
cellspacing="0" width="80%">
<tr>
<td width="33%"> </td>
<td width="33%"> </td>
<td width="34%"> </td>
</tr>
<tr>
<td width="33%"> </td>
<td width="33%"> </td>
<td width="34%"> </td>
</tr>
<tr>
<td width="33%"> </td>
<td width="33%"> </td>
<td width="34%"> </td>
</tr>
<tr>
<td width="33%"> </td>
<td width="33%"> </td>
<td width="34%"> </td>
</tr>
</table>
</center>
</div> |
So what's different? Note the " "
(space) following the "<td width="33%">".
And also note the <div align="center">
and tag and the
<center> tag at the beginning, with the
closing tags
</center> and
</div> at the end.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
HTML Pages - Design web pages fast & easily with many options.
Easy, perhaps - fast, NOT! For those of you without a WYSIWYG web program, this
may be of minimal help. You simply pick from drop-down menus for each aspect of
your web page, from tables to forms, text, links ... even drop-down menus. Still
- you have to be very careful when you "add" an element to make sure
you're adding things in the order you want. It takes a long time to create the
HTML page ... longer than I could accept ... but then you're doing it all online
and so download time is a major factor. In my case, the delay seemed to be in
waiting for their LinkExchange banner ads to download. The progress bar crawls
about 90% across, then seems to just stop. After about 12 minutes' waiting, I
just gave up. I think you would get very frustrated with this tool, but try it
on something simple and see how you like it.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
You may want to try downloading a free HTML program such as EasyHTML
(2.2 Mb) or one of the others below: EasyHTML
Here's an easy-to-use, feature-packed free Web page editor from Finland. Offers many helpful options such as the ability to edit multiple pages simultaneously. Also features such goodies as floating toolbars, a built-in browser and JavaScripts that you can easily add to your page. It's also one of the few HTML editors compatible with Microsoft's IntelliMouse. (For Windows). Available in English and Finnish versions. Stone's WebWriter
A classic freeware HTML editor, WebWriter is easy for beginners to use and is packed with features that even many commercial programs don't offer. With WebWriter, you can easily edit HTML tags by right-clicking and you can format text, just as you would in your word processor. There's also a helpful built-in image viewer. (Free for private, noncommercial use only). For Windows. HTML Compress
Here's a handy freeware Webmaster's tool that lets you easily shrink the size of your Web pages, by optimizing your HTML code. HTML Compress eliminates unneeded characters. As a result, your pages load faster (and it also makes it more difficult for would-be pirates to make use of your code). (For Windows). AAAHTML.com
Are you trying to learn HTML? This is the place to go. Here, you'll find loads of free tutorials on every aspect of Webmastering, from frames to tables to graphics. It's a handy resource, whether you're a newbie or a seasoned veteran. WindowHTML
(Note: this site is occasionally inaccessible). Here's an excellent free Web authoring tool that lets you create eye-catching Windows-like HTML pages. Easy to use. (For Windows). Arachnophilia
Don't spend $50 on a commercial Web authoring program until you've tried this cool free program. Arachnophilia is an outstanding Web editor, bursting with features. It'll import fully formatted text, tables, and outlines from any Windows-compliant application and automatically convert it to HTML. It also has built-in FTP capabilities that can automatically upload files (although it can't delete files, like a true FTP client can). Powerful keyboard macros can include system commands---even other macros, for maximum flexibility. (For Windows).
HTML Frames - Generate html framed pages
"quickly & easily". I generally avoid frames because of the
difficulty some search engines have with them. Also, my FrontPage 2000 often
just crashes and vanishes without explanation when I try to design in frames.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
HTML Scrambler - Scramble your HTML source codes & protect your web pages from prying eyes.
Start scrambling and testing HTML web pages instantly using this webmaster tool. Scramble your HTML to protect your source code from would-be thieves.
It's a good tool for small segments of code; I would NOT try to do this to an
entire web page. I think it would be useful for protecting things like affiliate
ID numbers, e-mail, etc.
NOTE: Be SURE to make a backup copy of the code
you are about to scramble FIRST - because if you don't, it's lost forever!
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Here is a sample of code
that I inserted from the page you are reading:
<p><b><a href="http://www.searchbliss.com/webmaster_tools/formvalidation.htm">
Website
Forms w/ Validation</a>
- Make forms that stop blank submissions.<br>
</b>
<font size="1"
face="Arial">
All
webmaster tools on the site were created and copyrighted by SearchBliss.
All Rights Reserved.</font> |
Here are the scrambled
results (it was all one long line so I put some returns to make it fit
this page:
<script>var
U7=window,W8=document;
var a1="%3Cp%3E%3Cb%3E%3Ca%20href%3D%22
http%3A//www.searchbliss.com/webmaster_tools/formvalidation.htm
%22%3EWebsite%20Forms%20w/%20Validation%3C/a%3E%20-%20
Make%20forms%20that%20stop%20blank%20submissions.%3Cbr%3E%0A%3C/b%3E%0A%3C
font%20size%3D%221%22%20face%3D%22Arial%22%3E
All%20webmaster%20tools%20on%20the%20site%20were%20created%20
and%20copyrighted%20by%20SearchBliss.%20All%20Rights%20Reserved.%3C
/font%3E%0A";function V0(){var V0;V0=unescape(a1);W8.write(V0);}V0();</script> |
The result still works just fine; however, it does seem to make for a larger
file size.
CSS - Create Cascading Style Sheets at the click of a button.
It works well, but unfortunately, they don't explain to the novice how to
actually use it! If you are already familiar with how to use CSS's, it's
no problem.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Website Forms w/ Validation - Make forms that stop blank submissions.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Miscellaneous Tools
Free SEO Tools -
Monitor your web site on the major search engines and directories using our free search engine optimization tools.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.  
Banner Maker v1.6
- Build images and banners for your website online for free using this online Banner
Maker from SearchBliss. The end result is OK, but nothing to write home about.
The text looks fuzzy and there is no way to center the words or to make the
second line smaller than the top. You have a choice among 150x60, 240x60 and
468x60 pixels. But it IS very quick and simple!
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Add Bookmark & Set Homepage Link Generator - Create a
Javascript add to Favorites and set Hompage link for Internet Explorer.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Pop-Up Ads Generator - Easily create pop-up ads that are pop-up blocker proof.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Robots.txt Generator - Create robot.txt files instantly & easily online.
The robots.txt file is the first thing search engine "spiders" look for when indexing a website. The robots.txt file tells search engine spiders (robots) which files and/or directories they are NOT allowed to index. This helps to prevent incomplete site indexing as well as prevent exposing the files and directories that you don't want "all over the world wide web". You may disallow, for example, "Google Images" from indexing certain directories and pages on your site, but not block "Google" itself from indexing those same files.
INSTRUCTIONS (please read carefully):
1. Select a user agent (robot) in the left column. The default is "ALL User Agents", then click on the "ADD AGENT" button.
2. Type in directories and/or web pages that you do not want indexed, then click on the "ADD" button. Make sure there is a forward "slash" in-between directories and pages, and at the end of directories (indicated in red below). Repeat this step until you have added all of the files you want under the "User Agent". If you don't want a user agent to index ANY of your site, LEAVE THE TEXTFIELD BLANK and click on the "ADD" button. A "/" will appear after "Disallow:" in the code below.
3. Once step 2 is complete, you may repeat steps 1 & 2 again until you have added all of the "User Agents" you want, and files under each that you want to "Disallow".
4. When complete, click on "COPY CODE" to save the robots.txt code.
User-agent: * # This is ALL robots
Disallow: /cgi-bin/ # This means NO robot can index my "cgi-bin"
Disallow: /myDirectory/secretPage.html # Or my "secretPage.html" inside "myDirectory".
User-agent: Scooter # This is AltaVista's robot
Disallow: /somePage.asp # This means AltaVista is not allowed to index "somePage.asp", but the rest can.
User-agent: Googlebot-Images # This is Google's image search robot.
Disallow: /myImages/ # This means Google images is not allowed to index my directory "myImages".
Disallow: /myPage-Full-Of-Images.html # Or "myPage-Full-Of-Images.html"
User-agent: WebCrawler # This is WebCrawler's robot
Disallow: / # This means WebCrawler is not allowed to index ANY of my site.
The above example is heavily commented to help you.
Your generated code will not be, however, if you want to add comments,
make sure you use a # sign in front of each comment. The robots will ignore
these comments. Make sure there is 1 empty space in front of and after the # sign.
Personally, I would leave out any comments. You don't want to make a mistake that could anger any "spiders" and keep them
from indexing your site altogether.
Your code will look more like this:
User-agent: *
Disallow: /cgi-bin/
Disallow: /myDirectory/secretPage.html
User-agent: Scooter
Disallow: /somePage.asp
User-agent: Googlebot-Images
Disallow: /myImages/
Disallow: /myPage-Full-Of-Images.html
User-agent: WebCrawler
Disallow: / |
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Colorful Scroll Bar Maker - Design colorful scroll bars instantly using this webmaster tool.
Create colorful scroll bars instantly and with ease using this tool. You select the exact colors you want and where you want them on the scroll bars. Our reference chart makes it easy for you to see what colors will appear where on the scrolls. Additional features include a preview of the generated code.
Directions: Follow the comments and be sure to click on the letters A - E in order when
directed (AFTER you've selected the color). Use the scroll bar reference chart to help you with your color selections.
Cut and paste the resulting code in between your HEAD tags
NOTE: This does not
work on many browsers. I tried it in Firefox 1.03 and IE 5.5, with no effects.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Preload Web Site Images - Speed up download time by pre-loading images.
Webmasters and web designers generate javascript for preloading images.
Speed up your sites download time and performance using this generator.
Use their generator for free or purchase your own.
All webmaster tools on the site were created and copyrighted by SearchBliss. All Rights Reserved.
Javascript Password - Password protect pages. Not for "top secret" information.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Meta Tags - Generate complete meta tags & please those hungry "spiders".
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
Status Bar Messages - Make scrolling status bar messages.
All webmaster tools on the site were created and copyrighted by
SearchBliss. All Rights Reserved.
TIP: How to open your URLs without manually opening your browser
1. Select "Start | Run"
2. Type your URL (http://www.ChamisPlace.com for example) and press ENTER.
| 
