Go4Expert

Go4Expert (http://www.go4expert.com/)
-   Web Design, HTML And CSS Tutorials (http://www.go4expert.com/articles/web-design/)
-   -   Creating HTML document (http://www.go4expert.com/articles/creating-html-document-t4206/)

Sanskruti 7May2007 16:28

Creating HTML document
 
Creating an HTML document is easy. To begin coding HTML you need a simple-text editor. Notepad is the most basic of simple-text editors and you will probably code a fair amount of HTML with it. HTML has not been around for many years. November 1990 marks the day of the first web page and back then there were little to no HTML standards to be followed. A group called the World Wide Web Consortium was then formed and have since set the standards that are widely accepted and we will base our teachings around them. Web pages have many uses. Here are some important facts about why web pages are so useful.
  • A cheap and easy way to spread information to a large audience.
  • Another medium to market your business.
Tag - Used to specify ("mark-up") regions of HTML documents for the web browser to interpret. Tags look like this: <tag>
Element - A complete tag, having an opening <tag> and a closing </tag>.
Attribute - Used to modify the value of the HTML element. Elements will often have multiple attributes.

For now just know that a tag is a command the web browser interprets, an element is a complete tag, and an attribute customizes or modifies HTML elements.An element consists of three basic parts: an opening tag, the element's content, and finally, a closing tag.
  1. <p> - opening paragraph tag
  2. Element Content - paragraph words
  3. </p> - closing tag
Every (web)page requires four critical elements: the html, head, title, and body elements.

The <html>...</html> Element



<html> begins and ends each and every web page. Its sole purpose is to encapsulate all the HTML code and describe the HTML document to the web browser. Remember to close your HTML documents with the corresponding </html> tag at the bottom of the document.

If you haven't already, open up Notepad and have a new, blank document ready to go. Copy the following HTML code into your text editor.
HTML Code:

<html>
</html>

Now save your file by Selecting Menu and then Save. Click on the "Save as Type" drop down box and select the option "All Files". When asked to name your file, name it "firstpage.html", without the quotes. Double check that you did everything correctly and then press save. Now open your file in a new web browser so that you have the ability to refresh your page and see your changes.If you opened up your firstpage.html document, you should be starring at your very first blank (white) web page!

The <head> Element



The <head> element is "next" as they say. As long as it falls somewhere between your <html> tag and your web page content (<body>), you're golden. The head functions "behind the scenes." Tags placed within the head element are not directly displayed by web browsers. Other elements used for scripting (Javascript) and formatting (CSS) will eventually be introduced and you will have to place them within your head element. For now, your head element will continue to lay empty except for the title element that will be introduced next.
HTML Code:

<html>
    <head>
    </head>
</html>

As of yet, we still have nothing happening on the web page. All we have so far is a couple of necessary elements that describe our document to the web browser.

The <title> Element



Place the <title> tag within the <head> element to title your page. The words you write between the opening and closing <title></title> tags will be displayed at the top of a viewer's browser. Here's the html code:
HTML Code:

<html>
    <head>
        <title>My First WebPage!</title>
    </head>
</html>

Save the file and open it in your browser. You should see "My First WebPage!" in the upper-left, as the window's title.

The <body> Element



The <body> element is where all content is placed. As the menu on the left suggests, we will be looking at each of these elements in greater detail as the tutorial progresses. For now, it is only important to understand that the body element will encapsulate all of your webpage's viewable content.
HTML Code:

<html>
    <head>
        <title>My First WebPage!</title>
    </head>
    <body>Hello World! All my content goes here!</body>
</html>

A web browser reads an HTML document top to bottom, left to right. Each time the browser finds a tag, it is displayed accordingly (paragraphs look like paragraphs, tables look like tables, etc). Tags have 3 major parts: opening tag(s), content(s), and closing tag(s). Recall that a completed tag is termed an element. By adding tags to an HTML document, you signal to the browser "Hey look, I'm a paragraph tag, now treat me as such."As you will learn, there are probably hundreds of HTML Tags. Tables, images, lists, forms, and everything else being displayed on an web page requires the use of a tag or two.
HTML Code:

<openingtag>Content</closingtag>
<p>A Paragraph Tag</p>

Tags should be lower-case letters if you plan on publishing your work. This is the standard for XHTML and Dynamic HTML. Here's quick look at some HTML tags.

HTML Code:

<body>Body Tag (acts as a content shell)
    <p>Paragraph Tag</p>
    <h2>Heading Tag</h2>
    <b>Bold Tag</b>
    <i>Italic Tag</i>
</body>

Tags Without Closing Tags

There are a few tags that do not follow the mold above. In a way, they still have the 3 parts (opening/closing and content). These tags however do not require a formal </closingtag> but rather a modified version. The reason being that these tags do not really require any content. Rather some of them just need a source URL and this is enough information for the web browser to display the tag properly (image tags)

billharry 23Feb2008 20:18

Re: Creating HTML document
 
good article. This really a helpfull for freasher.

yujiro1982 18Apr2008 07:42

Re: Creating HTML document
 
thanks that was very insightful. I'm trying to create my own forum and i really don't have much of a grasp of where to start hopefully this will help.

haileyjonathan 19Mar2009 13:56

Re: Creating HTML document
 
Your ideas is great .. You have given a html coding briefly explain this thread.. keep it up....thank you...

sv.pradeep 5May2009 11:17

Re: Creating HTML document
 
great article fro a beginner...Thanks buddy..!!

TechnoDemon 5May2009 15:07

Re: Creating HTML document
 
The HTML script itself is easy if you first design the page in a designing application such as CorelDRAW, then type the script in notepad. You know, it's difficult to set the parameter if you don't have the draft.
The only mistake you can make is by forgetting to add a slash " / " before the ending tag.

gkumar 16Jun2009 15:36

Re: Creating HTML document
 
Thanks very much.It is very nice post and very helpful every one.

gkumar 18Jun2009 15:44

Re: Creating HTML document
 
In this way we can create HTML document.
1. Start Microsoft Word.
2. In the New Document task pane, click Blank Web Page under New.
3. On the File menu, click Save.

NOTE: The Save as type box defaults to Web Page (*.htm; *.html).
4. In the File name box, type the file name that you want for your document, and then click Save.


All times are GMT +5.5. The time now is 12:10.