Any element to be presented on web-pages be it text, images, vector graphics, or media components (videos, audio, animation etc.) are placed on webpages using HTML/XHTML tags. This implies that mastering HTML is the key to successful web-development.
However, today we find that some famous CMS have set people free from the tedious job of learning HTML /XHTML. Now, with the aid of a CMS people can beautify their website overnight without HTML coding at all. But it must be noted that HTML coding skills gained by experience and hard work are difficult to beat by automated techniques. CMS are a good solution for most people, but HTML coding knowledge can serve as a tool to avoid designing pitfalls. This is analogous to using a ready-made application i.e. CMS and learning language to make such ready-made applications i.e.HTML.
Some Famous HTML editors
Here are a few renowned HTML editors. You can view a detailed post about HTML editors here. (link)
HTML Editors for Mac
Adobe Dreamweaver
SeaMonkey
BBEdit
Nvu
GoodPage
Freeway Pro
HTML Editors for Windows
Microsoft Expression Web
Microsoft Expression Studio
CoffeeCup
Alleycode
Amaya
Online HTML editors
FCKEditor
TinyMCE
Quick Overview of HTML Tags
HTML files are written in ACSII text. HTML can be written in any simple text editor and does not require any complex editor. Tags are pieces of code that allows the browser to understand how the content will be presented on the web page. Here, we mention some very commonly used tags.
1) HTML can be thought of as a simple language that instructs the web-browser in how the content will be shown in the web browser. HTML/XHTML tags along with CSS are used to rightly position content on the webpage. Html uses TAGS to tell the computer how to display the content. Here is a list of HTML tags and their functions. http://www.quackit.com/html_5/tags/
2) A very importance note: Previous versions of HTML were case-insensitive, however HTML4/XHTML are now case-sensitive and require all the tags to be in lower case.
3) DOCTYPE Tag: Doctype tag is a required tag. This tag is used to tell the browser which version of HTML is being used in the document
4) Html files have .html extension. You can code on any simple text editor and save it as ‘filename.html’. Now you can view it in your web-browser. You can also edit the code in the text editor and consequently press the refresh button of the browser to see the effect of editing.
5) Adding comments makes the code comprehensive. The comments do not show up in the webpage, but are intended for personal learning.
6) Cascading Style Sheets (CSS) in HTML help the code to be neat and more explicable. The purpose of CSS is to separate the style from the content. This makes webpages more interactive, accessible and usable for everyone around the web.
7) The a tag and href attribute are used to link to a media file, or link to other pages or files.
8) Lists in HTML are used to highlight certain information on a webpage. It is essentially the same as using lists in Word. HTML supports ordered and unordered lists.
9) Tables are also used to organize your data into rows and columns. Tables are created using the tag <table> & </table>. Related tags are <tr>, and </tr>, this tag creates a table row. While <td></td> are used to create individual cells. Note that td stands for table data. Most of the webmasters also lay invisible tables for page layout. This technique is discouraged by W3C. An alternative is using Style sheets for Page layout. A table with invisible borders can be used as a guide for arranging graphics and columns of text any way you please. You can place an entire table within a cell of a different table, and the inner table will possess the qualities of the “parent” table. This is called nesting a table.
10) Embedding forms in HTML pages .The importance of user feedback cannot be denied. Forms are used to collect information or user feed-back. A form is created by form tags <form> and </form>. You can explore the potential of HMTL by investigating radio buttons, check boxes, text field, menus, and buttons etc.
Publishing a Website
Publishing a website is a 3-Step Process.
1) Register a domain
2) Purchase webhosting space
3) Upload your website!
In order to publish a site you require space on the internet, where you can upload your website. You can acquire space by purchasing it from any webhost. Webhosting prices depend on space of course; the more the space, the more the cost. The prices are becoming affordable with the increase in competition in the market. There are free webhosting services such as Geocities, Tripod and Angelfire to name a few. A good commercial webhosting service would be SiteSell.
Next you need to register the name of your website. Usually hosting agencies also provide domain name registration. Popular domain services are www.godaddy.com & www.Register.com . Before you can register your domain, you will be provided with a search to find out if the name you want to use is already registered.
Important Note: You can register a domain before you upload your site or even before you buy space. This is because you can secure your domain name and prevent it from being taken away from you while you develop the website.
Last but not the least, is uploading the website. Today there are many types of software to offer this facility besides the traditional ‘CPanel’. Dreamweaver is aided with an FTP upload feature that allows you to upload your webpages and keep them organized on the server. FileZilla is another handy software that I frequently use.
Today there are many books on HTML that can guide you step by step in developing a website and publishing it. However I will suggest making a personal website on your computer and experimenting with it, to thoroughly grasp the concepts of HTML. Once you are done with the basics of HTML you will be required to enhance your website with inspiring graphics. Creating inspiring graphics is an indulging experience particularly with software like Photoshop, CorelDraw, Fireworks, and Illustrator, etc. So get your hands on these programs besides exploring the potentials of HTML.
