Re: What is the Difference between HTML and DHTML Answer HTML - (Hypertext Markup Language) is # 1 the set

of markup
symbols or codes inserted in a file intended for display on a World Wide Web browser page The markup tells the Web browser how to display a Web page!s words and images for the user

Mahi

"HTML - "ynamic HTML is a collecti#e term for a combination of Hypertext Markup Language (HTML) tags and options that can make Web pages more animated and interacti#e than pre#ious #ersions of HTML

Is This Answer Correct ?

89 Yes

5 No

Re: What is the Difference between HTML and DHTML Answer HTML$ it is the static part of the and it is %ust # 2 document used to display the contents statically
is called as the html "HTML$ &t is the dynamic part of the html where the mater is dynamically displayed so it is called as the dhtml html ' dhtml are both the markup languages both are used to de#elop a web pages
[Improve]

DHTML vs. HTML

it is a dynamic HTML. .The pages of the site do not require any special processing from the server side before they go to the browser.means the pages are always the same for

all visitors - static. .HTML sites going solely upon client-side technologies. .HTML sites are dynamic in nature. DHTML.it is a dynamic HTML. .When we use style sheets and ava!cript in HTML file called DHTML. .DHTML uses client side scripting to change variables in the presentation which affects the loo" and function of an otherwise static page. .DHTML sites going fast upon client-side technologies. .DHTML sites are dynamic in nature.

HTML #ntroduction
$ %revious
*'ample
+html, +body, +h-,My .irst Heading+/h-, +p,My first paragraph.+/p, +/body, +/html,
Try it yourself

&e't (hapter )

What is HTML0
HTML is a language for describing web pages.

HTML stands for Hyper Te't Mar"up Language

HTML is not a programming language1 it is a markup language 2 mar"up language is a set of markup tags HTML uses markup tags to describe web pages

HTML Tags
HTML mar"up tags are usually called HTML tags

HTML tags are "eywords surrounded by angle brackets li"e +html, HTML tags normally come in pairs li"e +b, and +/b, The first tag in a pair is the start tag, the second tag is the end tag !tart and end tags are also called opening tags and closing tags

HTML Documents 3 Web %ages

HTML documents describe web pages HTML documents contain HTML tags and plain te't HTML documents are also called web pages

The purpose of a web browser 4li"e #nternet *'plorer or .irefo'5 is to read HTML documents and display them as web pages. The browser does not display the HTML tags1 but uses the tags to interpret the content of the page6 +html, +body, +h-,My .irst Heading+/h-, +p,My first paragraph.+/p, +/body, +/html,

*'ample *'plained

The The The The te't te't te't te't between between between between +html, and +/html, describes the web page +body, and +/body, is the visible page content +h-, and +/h-, is displayed as a heading +p, and +/p, is displayed as a paragraph

HTML - 7etting !tarted

$ %revious &e't (hapter )

What 8ou &eed

8ou don9t need any tools to learn HTML at W:!chools.

8ou don9t need an HTML editor

8ou don9t need a web server 8ou don9t need a web site

*diting HTML
#n this tutorial we use a plain te't editor 4li"e &otepad5 to edit HTML. We believe this is the best way to learn HTML. However1 professional web developers often prefer HTML editors li"e .ront%age or Dreamweaver1 instead of writing plain te't.

(reate 8our ;wn Test Web

If you just want to learn HTML, skip the rest of this chapter. #f you want to create a test page on your own computer1 <ust copy the : files below to your des"top. 4=ight clic" on each lin"1 and select >save target as> or >save lin" as>5 mainpage.htm page-.htm page?.htm 2fter you have copied the files1 you can double-clic" on the file called >mainpage.htm> and see your first web site in action.

@se 8our Test Web .or Learning

We suggest you e'periment with everything you learn at W:!chools by editing your web files with a te't editor 4li"e &otepad5. ote! #f your test web contains HTML mar"up tags you have not learned1 don9t panic. 8ou will learn all about it in the ne't chapters.

.HTM or .HTML .ile *'tension0

When you save an HTML file1 you can use either the .htm or the .html file e'tension. We use .htm in our e'amples. #t is a habit from the past1 when the software only allowed three letters in file e'tensions. With new software it is perfectly safe to use .html.

$ %revious

&e't (hapter )

HTML Headings
HTML headings are defined with the +h-, to +hA, tags.

*'ample
+h-,This is a heading+/h-, +h?,This is a heading+/h?, +h:,This is a heading+/h:,
Try it yourself

HTML %aragraphs
HTML paragraphs are defined with the +p, tag.

*'ample
+p,This is a paragraph.+/p, +p,This is another paragraph.+/p,
Try it yourself

HTML Lin"s
HTML lin"s are defined with the +a, tag.

*'ample
+a href3>http6//www.w:schools.com>,This is a lin"+/a,
Try it yourself

ote! The lin" address is specified in the href attribute. 48ou will learn about attributes in a later chapter of this tutorial5.

HTML #mages
HTML images are defined with the +img, tag.

*'ample

+img src3>w:schools.<pg> width3>-BC> height3>-C?> /,

Try it yourself

ote! The name and the siDe of the image are provided as attributes.

HTML 2ttributes

HTML elements can have attributes 2ttributes provide additional information about an element 2ttributes are always specified in the start tag 2ttributes come in name/value pairs li"e6 name"#$alue#

2ttribute *'ample
HTML lin"s are defined with the +a, tag. The lin" address is specified in the href attribute6

*'ample
+a href3>http6//www.w:schools.com>,This is a lin"+/a,
Try it yourself

2lways Euote 2ttribute Falues

2ttribute values should always be enclosed in quotes. Double style quotes are the most common1 but single style quotes are also allowed. Tip! #n some rare situations1 when the attribute value itself contains quotes1 it is necessary to use single quotes6 name39 ohn >!hot7un> &elson9

HTML Tip6 @se Lowercase 2ttributes

2ttribute names and attribute values are case-insensitive. However1 the World Wide Web (onsortium 4W:(5 recommends lowercase attributes/attribute values in their HTML C recommendation. &ewer versions of 4G5HTML will demand lowercase attributes.

HTML 2ttributes =eference

2 complete list of legal attributes for each HTML element is listed in our6

(omplete HTML =eference Helow is a list of some attributes that are standard for most HTML elements6 %ttribute class id style title &alue classname id style_definition tooltip_text 'escription !pecifies a classname for an element !pecifies a unique id for an element !pecifies an inline style for an element !pecifies e'tra information about an element 4displayed as a tool tip5

.or more information about standard attributes6 HTML !tandard 2ttributes =eference

HTML %aragraphs
%aragraphs are defined with the +p, tag.

*'ample
+p,This is a paragraph+/p, +p,This is another paragraph+/p,
Try it yourself

ote! Hrowsers automatically add an empty line before and after a paragraph.

Don9t .orget the *nd Tag

Most browsers will display HTML correctly even if you forget the end tag6

*'ample
+p,This is a paragraph +p,This is another paragraph
Try it yourself

The e'ample above will wor" in most browsers1 but don9t rely on it. .orgetting the end tag can produce une'pected results or errors. ote! .uture version of HTML will not allow you to s"ip end tags.

HTML Line Hrea"s

@se the +br /, tag if you want a line brea" 4a new line5 without starting a new paragraph6

*'ample
+p,This is+br /,a para+br /,graph with line brea"s+/p,
Try it yourself

The +br /, element is an empty HTML element. #t has no end tag.

+br, or +br /,
#n GHTML1 GML1 and future versions of HTML1 HTML elements with no end tag 4closing tag5 are not allowed. *ven if +br, wor"s in all browsers1 writing +br /, instead is more future proof.

HTML ;utput - @seful Tips

8ou cannot be sure how HTML will be displayed. Large or small screens1 and resiDed windows will create different results. With HTML1 you cannot change the output by adding e'tra spaces or e'tra lines in your HTML code. The browser will remove e'tra spaces and e'tra lines when the page is displayed. 2ny number of lines count as one line1 and any number of spaces count as one space. Try it yourself 4The e'ample demonstrates some HTML formatting problems5

*'amples .rom This %age

HTML paragraphs How HTML paragraphs are displayed in a browser. Line brea"s The use of line brea"s in an HTML document. %oem problems !ome problems with HTML formatting.

More *'amples

More paragraphs The default behaviors of paragraphs.

HTML Tag =eference

W:!chools9 tag reference contains additional information about HTML elements and their attributes. Tag +p, +br /, 'escription Defines a paragraph #nserts a single line brea"

$ %revious

&e't (hapter )

.ree ;nline Website Huilder - &o Downloading &eeded

(reate a free .lash website with our simple1 online web design editing platform. !tunning templates and user-friendly tools ma"e website building easy and fun. !tart (reating your free website nowI

HTML Te't .ormatting This te(t is bold

This te't is big

This text is italic
This is computer output

This is subscript and

Try it yourself

superscript

HTML .ormatting Tags

HTML uses tags li"e +b, and +i, for formatting output1 li"e bold or italic te't. These HTML tags are called formatting tags 4loo" at the bottom of this page for a complete reference5. )ften *strong+ renders as *b+, and *em+ renders as *i+. However1 there is a difference in the meaning of these tags6

+b, or +i, defines bold or italic te't only. +strong, or +em, means that you want the te't to be rendered in a way that the user understands as >important>. Today1 all ma<or browsers render strong as bold and em as italics. However1 if a browser one day wants to ma"e a te't highlighted with the strong feature1 it might be cursive for e'ample and not boldI

Try it 8ourself - *'amples

Te't formatting How to format te't in an HTML document. %reformatted te't How to control the line brea"s and spaces with the pre tag. >(omputer output> tags How different >computer output> tags will be displayed. 2ddress How to define contact information for the author/owner of an HTML document. 2bbreviations and acronyms How to handle abbreviations and acronyms. Te't direction How to change the te't direction. Euotations How to handle long and short quotations. Deleted and inserted te't How to mar" deleted and inserted te't.

HTML Te't .ormatting Tags

Tag +b, +big, +em, +i, +small, +strong, +sub, +sup, +ins, +del, 'escription Defines bold te't Defines big te't Defines emphasiDed te't Defines italic te't Defines small te't Defines strong te't Defines subscripted te't Defines superscripted te't Defines inserted te't Defines deleted te't

HTML >(omputer ;utput> Tags

Tag +code, +"bd, +samp, +tt, +var, +pre, 'escription Defines computer code te't Defines "eyboard te't Defines sample computer code Defines teletype te't Defines a variable Defines preformatted te't

HTML (itations1 Euotations1 and Definition Tags

Tag +abbr, +acronym, +address, +bdo, +bloc"quote, +q, +cite, +dfn, 'escription Defines an abbreviation Defines an acronym Defines contact information for the author/owner of a document Defines the te't direction Defines a long quotation Defines a short quotation Defines a citation Defines a definition term

$ %revious

&e't (hapter )

The HTML !tyle 2ttribute

The purpose of the style attribute is6 To pro$ide a common way to style all HTML elements. !tyles was introduced with HTML C1 as the new and preferred way to style HTML elements. With HTML styles1 styles can be added to HTML elements directly by using the style attribute1 or indirectly in separate style sheets 4(!! files5. 8ou can learn everything about styles and (!! in our (!! Tutorial. #n our HTML tutorial we will use the style attribute to introduce you to HTML styles.

Deprecated Tags and 2ttributes

#n HTML C1 several tags and attributes are deprecated. Deprecated means that they will not be supported in future versions of HTML and GHTML. The message is clear! 2void using deprecated tags and attributesI

These tags and attributes should be avoided6 Tags +center, +font, and +basefont, +s, and +stri"e, +u, %ttributes align bgcolor color 'escription Defines centered content Defines HTML fonts Defines stri"ethrough te't Defines underlined te't 'escription Defines the alignment of te't Defines the bac"ground color Defines the te't color

,or all of the abo$e! -se styles instead.

HTML !tyle *'ample - Hac"ground (olor

The bac"ground-color property defines the bac"ground color for an element6

*'ample
+html, +body style3>bac"ground-color6yellow>, +h? style3>bac"ground-color6red>,This is a heading+/h?, +p style3>bac"ground-color6green>,This is a paragraph.+/p, +/body, +/html,
Try it yourself

The style attribute ma"es the >old> bgcolor attribute obsolete. Try it yourself6 Hac"ground color the old way

HTML !tyle *'ample - .ont1 (olor and !iDe

The font-family1 color1 and font-siDe properties defines the font1 color1 and siDe of the te't in an element6

*'ample
+html, +body,

+h- style3>font-family6verdana>,2 heading+/h-, +p style3>font-family6arialJcolor6redJfont-siDe6?Bp'J>,2 paragraph.+/p, +/body, +/html,

Try it yourself

The style attribute ma"es the old +font, tag obsolete. Try it yourself6 .onts the old way

HTML !tyle *'ample - Te't 2lignment

The te't-align property specifies the horiDontal alignment of te't in an element6

*'ample
+html, +body, +h- style3>te't-align6center>,This is a heading+/h-, +p,The heading above is aligned to the center of this page.+/p, +/body, +/html,
Try it yourself

The style attribute ma"es the old >align> attribute obsolete. Try it yourself6 (entered heading the old way

$ %revious

&e't (hapter )

HTML Hyperlin"s 4Lin"s5

2 hyperlin" 4or lin"5 is a word1 group of words1 or image that you can clic" on to <ump to a new document or a new section within the current document. When you move the cursor over a lin" in a Web page1 the arrow will turn into a little hand. Lin"s are specified in HTML using the +a, tag. The +a, tag can be used in two ways6 -. ?. To create a lin" to another document1 by using the href attribute To create a boo"mar" inside a document1 by using the name attribute

HTML Lin" !ynta'

The HTML code for a lin" is simple. #t loo"s li"e this6 +a href3>url>,Link text+/a, The href attribute specifies the destination of a lin".

*'ample
+a href3>http6//www.w:schools.com/>,Fisit W:!chools+/a, which will display li"e this6 Fisit W:!chools (lic"ing on this hyperlin" will send the user to W:!chools9 homepage. Tip! The >Lin" te't> doesn9t have to be te't. 8ou can lin" from an image or any other HTML element.

HTML Lin"s - The target 2ttribute

The target attribute specifies where to open the lin"ed document. The e'ample below will open the lin"ed document in a new browser window6

*'ample
+a href3>http6//www.w:schools.com/> target3>Kblan">,Fisit W:!choolsI+/a,
Try it yourself

HTML Lin"s - The name 2ttribute

The name attribute specifies the name of an anchor. The name attribute is used to create a boo"mar" inside an HTML document. Hoo"mar"s are not displayed in any special way. They are invisible to the reader.

*'ample
2 named anchor inside an HTML document6 +a name3>tips>,@seful Tips !ection+/a, (reate a lin" to the >@seful Tips !ection> inside the same document6

+a href3>Ltips>,Fisit the @seful Tips !ection+/a, ;r1 create a lin" to the >@seful Tips !ection> from another page6 +a href3>http6//www.w:schools.com/htmlKlin"s.htmLtips>, Fisit the @seful Tips !ection+/a,

Hasic &otes - @seful Tips

ote! 2lways add a trailing slash to subfolder references. #f you lin" li"e this6 href3>http6//www.w:schools.com/html>1 you will generate two requests to the server1 the server will first add a slash to the address1 and then create a new request li"e this6 href3>http6//www.w:schools.com/html/>. Tip! &amed anchors are often used to create >table of contents> at the beginning of a large document. *ach chapter within the document is given a named anchor1 and lin"s to each of these anchors are put at the top of the document. Tip! #f a browser does not find the named anchor specified1 it goes to the top of the document. &o error occurs.

More *'amples
2n image as a lin" How to use an image as a lin". Lin" to a location on the same page How to lin" to a boo"mar". Hrea" out of a frame How to brea" out of a frame 4if your site is loc"ed in a frame5. (reate a mailto lin" How to lin" to a mail message 4will only wor" if you have mail installed5. (reate a mailto lin" ? 2nother mailto lin".

HTML Lin" Tags

Tag +a, 'escription Defines an anchor

HTML Tables
2pples Hananas CCM ?:M

;ranges ;ther

-:M -BM

Try it 8ourself - *'amples

Tables How to create tables in an HTML document. Table borders How to specify different table borders. 48ou can find more e'amples at the bottom of this page5.

HTML Tables
Tables are defined with the +table, tag. 2 table is divided into rows 4with the +tr, tag51 and each row is divided into data cells 4with the +td, tag5. td stands for >table data1> and holds the content of a data cell. 2 +td, tag can contain te't1 lin"s1 images1 lists1 forms1 other tables1 etc.

Table *'ample
+table border3>->, +tr, +td,row -1 cell -+/td, +td,row -1 cell ?+/td, +/tr, +tr, +td,row ?1 cell -+/td, +td,row ?1 cell ?+/td, +/tr, +/table, How the HTML code above loo"s in a browser6 row -1 cell - row -1 cell ? row ?1 cell - row ?1 cell ?

HTML Tables and the Horder 2ttribute

#f you do not specify a border attribute1 the table will be displayed without borders. !ometimes this can be useful1 but most of the time1 we want the borders to show. To display a table with borders1 specify the border attribute6

+table border3>->, +tr, +td,=ow -1 cell -+/td, +td,=ow -1 cell ?+/td, +/tr, +/table,

HTML Table Headers

Header information in a table are defined with the +th, tag. The te't in a th element will be bold and centered. +table border3>->, +tr, +th,Header -+/th, +th,Header ?+/th, +/tr, +tr, +td,row -1 cell -+/td, +td,row -1 cell ?+/td, +/tr, +tr, +td,row ?1 cell -+/td, +td,row ?1 cell ?+/td, +/tr, +/table, How the HTML code above loo"s in a browser6 Header / Header 0

row -1 cell - row -1 cell ? row ?1 cell - row ?1 cell ?

More *'amples
Tables without borders How to create tables without borders. Table headers How to create table headers. Table with a caption How to add a caption to a table. Table cells that span more than one row/column How to define table cells that span more than one row or one column. Tags inside a table How to display elements inside other elements.

(ell padding How to use cellpadding to create more white space between the cell content and its borders. (ell spacing How to use cellspacing to increase the distance between the cells. The frame attribute How to use the >frame> attribute to control the borders around the table.

HTML Table Tags

Tag +table, +th, +tr, +td, +caption, +colgroup, +col /, +thead, +tbody, +tfoot, 'escription Defines a table Defines a table header Defines a table row Defines a table cell Defines a table caption Defines a group of columns in a table1 for formatting Defines attribute values for one or more columns in a table 7roups the header content in a table 7roups the body content in a table 7roups the footer content in a table

HTML Lists

An ordered list:
-. ?. :. The first list item The second list item The third list item

An unordered list:

List item List item List item

Try-#t-8ourself *'amples
@nordered list How to create an unordered list in an HTML document. ;rdered list How to create an ordered list in an HTML document. 48ou can find more e'amples at the bottom of this page5.

HTML @nordered Lists

2n unordered list starts with the +ul, tag. *ach list item starts with the +li, tag. The list items are mar"ed with bullets 4typically small blac" circles5. +ul, +li,(offee+/li, +li,Mil"+/li, +/ul, How the HTML code above loo"s in a browser6

(offee Mil"

HTML ;rdered Lists

2n ordered list starts with the +ol, tag. *ach list item starts with the +li, tag. The list items are mar"ed with numbers. +ol, +li,(offee+/li, +li,Mil"+/li, +/ol, How the HTML code above loo"s in a browser6 -. ?. (offee Mil"

HTML Definition Lists

2 definition list is a list of items1 with a description of each item. The +dl, tag defines a definition list. The +dl, tag is used in con<unction with +dt, 4defines the item in the list5 and +dd, 4describes the item in the list56 +dl, +dt,(offee+/dt, +dd,- blac" hot drin"+/dd, +dt,Mil"+/dt, +dd,- white cold drin"+/dd, +/dl, How the HTML code above loo"s in a browser6 (offee Mil" - blac" hot drin"

- white cold drin"

Hasic &otes - @seful Tips

Tip! #nside a list item you can put te't1 line brea"s1 images1 lin"s1 other lists1 etc.

More *'amples
Different types of ordered lists Demonstrates different types of ordered lists. Different types of unordered lists Demonstrates different types of unordered lists. &ested list Demonstrates how you can nest lists. &ested list ? Demonstrates a more complicated nested list. Definition list Demonstrates a definition list.

HTML List Tags

Tag +ol, +ul, +li, +dl, +dt, +dd, 'escription Defines an ordered list Defines an unordered list Defines a list item Defines a definition list Defines an item in a definition list Defines a description of an item in a definition list

$ %revious

&e't (hapter )

.ree ;nline Website Huilder - &o Downloading &eeded

(reate a free .lash website with our simple1 online web design editing platform. !tunning templates and user-friendly tools ma"e website building easy and fun. !tart (reating your free website nowI

HTML .orms are used to select different "inds of user input.

Try-#t-8ourself *'amples
(reate te't fields How to create te't fields. The user can write te't in a te't field. (reate password field How to create a password field. 48ou can find more e'amples at the bottom of this page5

HTML .orms
HTML forms are used to pass data to a server. 2 form can contain input elements li"e te't fields1 chec"bo'es1 radio-buttons1 submit buttons and more. 2 form can also contain select lists1 te'tarea1 fieldset1 legend1 and label elements. The +form, tag is used to create an HTML form6 +form, . input elements . +/form,

HTML .orms - The #nput *lement

The most important form element is the input element. The input element is used to select user information. 2n input element can vary in many ways1 depending on the type attribute. 2n input element can be of type te't field1 chec"bo'1 password1 radio button1 submit button1 and more. The most used input types are described below.

Te't .ields
+input type3>te't> /, defines a one-line input field that a user can enter te't into6 +form, .irst name6 +input type3>te't> name3>firstname> /,+br /, Last name6 +input type3>te't> name3>lastname> /, +/form, How the HTML code above loo"s in a browser6

.irst name6 Last name6 ote! The form itself is not visible. 2lso note that the default width of a te't field is ?B characters.

%assword .ield
+input type3>password> /, defines a password field6 +form, %assword6 +input type3>password> name3>pwd> /, +/form, How the HTML code above loo"s in a browser6

%assword6 ote! The characters in a password field are mas"ed 4shown as asteris"s or circles5.

=adio Huttons
+input type3>radio> /, defines a radio button. =adio buttons let a user select ;&L8 ;&* one of a limited number of choices6 +form, +input type3>radio> name3>se'> value3>male> /, Male+br /, +input type3>radio> name3>se'> value3>female> /, .emale +/form, How the HTML code above loo"s in a browser6

Male .emale

(hec"bo'es
+input type3>chec"bo'> /, defines a chec"bo'. (hec"bo'es let a user select ;&* or M;=* options of a limited number of choices. +form, +input type3>chec"bo'> name3>vehicle> value3>Hi"e> /, # have a bi"e+br /, +input type3>chec"bo'> name3>vehicle> value3>(ar> /, # have a car +/form, How the HTML code above loo"s in a browser6

# have a bi"e # have a car

!ubmit Hutton
+input type3>submit> /, defines a submit button. 2 submit button is used to send form data to a server. The data is sent to the page specified in the form9s action attribute. The file defined in the action attribute usually does something with the received input6 +form name3>input> action3>htmlKformKaction.asp> method3>get>, @sername6 +input type3>te't> name3>user> /, +input type3>submit> value3>!ubmit> /, +/form, How the HTML code above loo"s in a browser6
Submit

@sername6

#f you type some characters in the te't field above1 and clic" the >!ubmit> button1 the browser will send your input to a page called >htmlKformKaction.asp>. The page will show you the received input.

More #nput *'amples

=adio buttons How to create radio buttons. (hec"bo'es How to create chec"bo'es. 2 user can select or unselect a chec"bo'. !imple drop-down list How to create a simple drop-down list. Drop-down list with a pre-selected value How to create a drop-down list with a pre-selected value. Te'tarea How to create a multi-line te't input control. #n a te't-area the user can write an unlimited number of characters. (reate a button How to create a button.

.orm *'amples

.ieldset around form-data How to create a border around elements in a form. .orm with te't fields and a submit button How to create a form with two te't fields and a submit button. .orm with chec"bo'es How to create a form with three chec"bo'es and a submit button. .orm with radio buttons How to create a form with two radio buttons1 and a submit button. !end e-mail from a form How to send e-mail from a form.

HTML .orm Tags

Tag +form, +input /, +te'tarea, +label, +fieldset, +legend, +select, +optgroup, +option, +button, 'escription Defines an HTML form for user input Defines an input control Defines a multi-line te't input control Defines a label for an input element Defines a border around elements in a form Defines a caption for a fieldset element Defines a select list 4drop-down list5 Defines a group of related options in a select list Defines an option in a select list Defines a push button

HTML .rames
With frames1 you can display more than one HTML document in the same browser window. *ach HTML document is called a frame1 and each frame is independent of the others. The disadvantages of using frames are6

The web developer must "eep trac" of more HTML documents #t is difficult to print the entire page

The HTML frameset *lement

The frameset element holds two or more frame elements. *ach frame element holds a separate document. The frameset element states only H;W M2&8 columns or rows there will be in the frameset.

The HTML frame *lement

The +frame, tag defines one particular window 4frame5 within a frameset. #n the e'ample below we have a frameset with two columns. The first column is set to ?NM of the width of the browser window. The second column is set to ONM of the width of the browser window. The document >frameKa.htm> is put into the first column1 and the document >frameKb.htm> is put into the second column6 +frameset cols3>?NM1ONM>, +frame src3>frameKa.htm> /, +frame src3>frameKb.htm> /, +/frameset, ote! The frameset column siDe can also be set in pi'els 4cols3>?BB1NBB>51 and one of the columns can be set to use the remaining space1 with an asteris" 4cols3>?NM1P>5.

HTML Headings
HTML headings are defined with the +h-, to +hA, tags.

*'ample
+h-,This is a heading+/h-, +h?,This is a heading+/h?, +h:,This is a heading+/h:,
Try it yourself

HTML %aragraphs
HTML paragraphs are defined with the +p, tag.

*'ample
+p,This is a paragraph.+/p, +p,This is another paragraph.+/p,
Try it yourself

HTML Lin"s
HTML lin"s are defined with the +a, tag.

*'ample
+a href3>http6//www.w:schools.com>,This is a lin"+/a,
Try it yourself

ote! The lin" address is specified in the href attribute. 48ou will learn about attributes in a later chapter of this tutorial5.

HTML #mages
HTML images are defined with the +img, tag.

*'ample
+img src3>w:schools.<pg> width3>-BC> height3>-C?> /,
Try it yourself

ote! The name and the siDe of the image are provided as attributes

Hasic &otes - @seful Tips

Tip! #f a frame has visible borders1 the user can resiDe it by dragging the border. To prevent a user from doing this1 you can add noresiDe3>noresiDe> to the +frame, tag. ote! 2dd the +noframes, tag for browsers that do not support frames. Important! 8ou cannot use the +body,+/body, tags together with the +frameset,+/frameset, tagsI However1 if you add a +noframes, tag containing some te't for browsers that do not support frames1 you will have to enclose the te't in +body,+/body, tagsI !ee how it is done in the first e'ample below.

More *'amples
How to use the +noframes, tag How to use the +noframes, tag 4for browsers that do not support frames5. &ested framesets How to create a frameset with three documents1 and how to mi' them in rows and columns. .rameset with noresiDe3>noresiDe> How to use the noresiDe attribute. Move the mouse over the borders between the frames and notice that you cannot move the borders.

&avigation frame How to ma"e a navigation frame. The navigation frame contains a list of lin"s with the second frame as the target. The file called >tryhtmlKcontents.htm> contains three lin"s. The source code of the lin"s6 +a href 3>frameKa.htm> target 3>showframe>,.rame a+/a,+br, +a href 3>frameKb.htm> target 3>showframe>,.rame b+/a,+br, +a href 3>frameKc.htm> target 3>showframe>,.rame c+/a, The second frame will show the lin"ed document. #nline frame How to create an inline frame 4a frame inside an HTML page5. ump to a specified section within a frame Two frames. ;ne of the frames has a source to a specified section in a file. The specified section is made with +a name3>(-B>, in the >lin".htm> file. ump to a specified section with frame navigation Two frames. The navigation frame 4content.htm5 to the left contains a list of lin"s with the second frame 4lin".htm5 as a target. The second frame shows the lin"ed document. ;ne of the lin"s in the navigation frame is lin"ed to a specified section in the target file. The HTML code in the file >content.htm> loo"s li"e this6 +a href 3>lin".htm> target 3>showframe>,Lin" without 2nchor+/a,+br,+a href 3>lin".htmL(-B> target 3>showframe>,Lin" with 2nchor+/a,.

HTML .rame Tags

Tag +frameset, +frame /, +noframes, +iframe, 'escription Defines a set of frames Defines a sub window 4a frame5 Defines a noframe section for browsers that do not handle frames Defines an inline sub window 4frame5

$ %revious

&e't (hapter )

HTML %aragraphs
$ %revious
HTML documents are divided into paragraphs.

&e't (hapter )

HTML %aragraphs
%aragraphs are defined with the +p, tag.

*'ample
+p,This is a paragraph+/p, +p,This is another paragraph+/p,

Try it yourself

ote! Hrowsers automatically add an empty line before and after a paragraph.

Don9t .orget the *nd Tag

Most browsers will display HTML correctly even if you forget the end tag6

*'ample
+p,This is a paragraph +p,This is another paragraph
Try it yourself

The e'ample above will wor" in most browsers1 but don9t rely on it. .orgetting the end tag can produce une'pected results or errors. ote! .uture version of HTML will not allow you to s"ip end tags.

HTML Line Hrea"s

@se the +br /, tag if you want a line brea" 4a new line5 without starting a new paragraph6

*'ample
+p,This is+br /,a para+br /,graph with line brea"s+/p,
Try it yourself

The +br /, element is an empty HTML element. #t has no end tag.

+br, or +br /,
#n GHTML1 GML1 and future versions of HTML1 HTML elements with no end tag 4closing tag5 are not allowed. *ven if +br, wor"s in all browsers1 writing +br /, instead is more future proof.

HTML ;utput - @seful Tips

8ou cannot be sure how HTML will be displayed. Large or small screens1 and resiDed windows will create

different results. With HTML1 you cannot change the output by adding e'tra spaces or e'tra lines in your HTML code. The browser will remove e'tra spaces and e'tra lines when the page is displayed. 2ny number of lines count as one line1 and any number of spaces count as one space. Try it yourself 4The e'ample demonstrates some HTML formatting problems5

*'amples .rom This %age

HTML paragraphs How HTML paragraphs are displayed in a browser. Line brea"s The use of line brea"s in an HTML document. %oem problems !ome problems with HTML formatting.

More *'amples
More paragraphs The default behaviors of paragraphs.

HTML Tag =eference

W:!chools9 tag reference contains additional information about HTML elements and their attributes. Tag +p, +br /, 'escription Defines a paragraph #nserts a single line brea"

DHTML is &;T a language. DHTML is a T*=M describing the art of ma"ing dynamic and interactive

web pages. DHTML combines HTML1 ava!cript1 the HTML D;M1 and (!!. 1tart learning 'HTML now.
DHTML *'ample

(lic" to turn on/off the light

Try it yourself

DHTML *'amples
Learn by -BB e'amplesI With our editor1 you can edit the source code1 and clic" on a button to view the result.

DHTML *'amples HTML D;M *'amples

HTML D;M =eference

2t W:!chools you will find a complete reference of all the built-in ava!cript ob<ects1 all browser ob<ects1 and all the HTML D;M ob<ects1 along with their properties and methods. ava!cript and HTML D;M =eference

$ W:!chools Home
DHTML is the art of combining HTML1 ava!cript1 D;M1 and (!!.

What you should already "now

Hefore you continue you should have a basic understanding of the following6

HTML (!! ava!cript

#f you want to study these sub<ects first1 find the tutorials on our Home %age.

DHTML is &;T a Language

DHTML stands for 'ynamic HTML. DHTML is &;T a language or a web standard. To most people DHTML means the combination of HTML1 ava!cript1 D;M and (!!. 2ccording to the World Wide Web (onsortium 4W:(56 "Dynamic HTML is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated "

HTML
The W:( HTML C standard has rich support for dynamic content6

HTML HTML HTML HTML

supports supports supports supports

ava!cript the Document ;b<ect Model 4')M5 HTML *vents (ascading !tyle !heets 42115

DHTML is about using these features1 to create dynamic and interactive web pages.

ava!cript
ava!cript is the most popular scripting language on the internet1 and it wor"s in all ma<or browsers. DHTML is about using ava!cript to control1 access and manipulate HTML elements. 8ou can read more about ava!cript in the ne't chapter of this tutorial.

HTML D;M
The HTML D;M is a W:( standard. #t describes the 'ocument )bject Model for HTML. The HTML D;M defines a standard way for accessing and manipulating HTML documents. DHTML is about using the D;M to access and manipulate HTML elements. 8ou can read more about the HTML D;M in a later chapter of this tutorial.

HTML *vents
HTML events are a part of the HTML D;M. DHTML is about creating web pages that reacts to 4user5events. 8ou can read more about events in a later chapter of this tutorial.

(!!
(!! defines how to display HTML elements. DHTML is about using ava!cript and the HTML D;M to change the style and positioning of HTML elements. 8ou can read more about (!! in a later chapter of this tutorial.

$ %revious

DHTML - ava!cript
$ %revious
ava!cript can create dynamic HTML content. Date6 Tue &ov -A -:6NB6NN ?B-B

&e't (hapter )

&e't (hapter )

ava!cript 2lone
#n ava!cript1 the statement6 document.write341 is used to write output to a web page.

Example
The following e'ample uses ava!cript to display the current date and time on a page6

*'ample
+html, +body, +script type3>te't/<avascript>, document.write4Date455J +/script, +/body, +/html,

Try it yourself

ava!cript and the HTML D;M

2 ava!cript can also be used to change the content or attributes of HTML elements. To change the content of an HTML element6 document.get*lementHy#d4id5.innerHTML3new HTML To change the attribute of an HTML element6 document.get*lementHy#d4id5.attribute!new value 8ou will learn more about ava!cript and the HTML D;M in the ne't chapter of this tutorial.

ava!cript and HTML *vents

2 ava!cript can also be e'ecuted when an event occurs1 li"e when a user clic"s on an HTML element. To e'ecute code when a user clic"s on an element1 use the following event attribute6 onclic"3"ava#cript 8ou will learn more about ava!cript and HTML events in a later chapter.

ava!cript and (!!

2 ava!cript can also change the style of HTML elements. To change the style of an HTML element6 document.get*lementHy#d4id5.style.property3new style 8ou will learn more about ava!cript and (!! in a later chapter of this tutorial.

What is the HTML D;M0

The HTML D;M is6

2 Document ;b<ect Model for HTML 2 standard programming interface for HTML %latform- and language-independent 2 W:( standard

The HTML D;M defines the objects and properties of all HTML elements1 and the methods 4interface5 to access them. #n other words6 The HTML ')M is a standard for how to get, change, add, or delete HTML elements.

(hange an HTML *lement

The following e'ample changes the content of an h- element6

*'ample
+html, +body, +h- id3>header>,;ld Header+/h-, +script type3>te't/<avascript>, document.get*lementHy#d4>header>5.innerHTML3>&ew Header>J +/script, +/body, +/html,
Try it yourself

*'ample e'plained6

The HTML document above contains an h- element with id3>header> We use the HTML D;M to get the element with id3>header> 2 ava!cript changes the content 4innerHTML5 of that element

(hange an HTML 2ttribute

The following e'ample changes the src attibute of an img element6

*'ample
+html, +body, +img id3>image> src3>smiley.gif>, +script type3>te't/<avascript>, document.get*lementHy#d4>image>5.src3>landscape.<pg>J +/script, +/body, +/html,

Try it yourself

*'ample e'plained6

The HTML document above contains an img element with id3>image> We use the HTML D;M to get the element with id3>image> 2 ava!cript changes the src attribute of that element from >smiley.gif> to >landscape.<pg>

HTML D;M Tutorial

To learn more about the HTML D;M1 please read our complete HTML D;M tutorial.

$ %revious

&e't (hapter )

DHTML - HTML *vents

$ %revious
HTML events can trigger actions in a browser.

&e't (hapter )

HTML *vents
*very element on an HTML page has events which can trigger a ava!cript. .or e'ample1 we can use the on(lic" event of a button element to indicate that a function will run when a user clic"s on the button. We define the events in the HTML tags. *'amples of events6

2 mouse clic" 2 web page or an image loading Mousing over a hot spot on the web page !electing an input field in an HTML form !ubmitting an HTML form 2 "eystro"e

#n the following e'ample1 the content of the h- element will change when a user clic"s on it6

*'ample
+html, +body, +h- onclic"3>this.innerHTML39;oopsI9>,(lic" on this te't+/h-, +/body,

+/html,
Try it yourself

8ou can also add the script in the head section1 and then call a function from the event handler6

*'ample
+html, +head, +script type3>te't/<avascript>, function changete't4id5 Q id.innerHTML3>;oopsI>J R +/script, +/head, +body, +h- onclic"3>changete't4this5>,(lic" on this te't+/h-, +/body, +/html,
Try it yourself

More 2bout HTML *vents

.or all HTML events1 loo" at our complete HTML D;M *vent ;b<ect =eference.

More *'amples
onmousedown and onmouseup (hange an image when a user holds down the mouse button. onload Display an alert bo' when the page has finished loading.

$ %revious

&e't (hapt

DHTML #ntro DHTML ava!cript DHTML HTML D;M DHTML *vents DHTML (!! DHTML !ummary DHTML *'amples DHTML *'amples HTML D;M HTML D;M =eference HTML D;M *'amples

DHTML - (!!
$ %revious

&e't (hapte

ava!cript and the HTML D;M can be used to change the style of any HTML eleme

(hange !tyle of the (urrent HTML *lement

To change the style of the current HTML element1 use the following statement6 this.style.property3new style

*'ample
+html, +body, +h- onclic"3>this.style.color39red9>,(lic" MeI+/h-, +/body, +/html,
Try it yourself

(hange !tyle of a !pecific HTML *lement

To change the style of a specific HTML element1 use the following statement6 document.get*lementHy#d4id5.style.property3new style

*'ample
+html, +body, +h- id3>h-> onclic"3>document.get*lementHy#d49h-95.style.color39red9>,(lic" MeI+/h-, +/body, +/html,
Try it yourself

More 2bout the !tyle ;b<ect and (!!

.or all style properties1 loo" at our complete HTML D;M !tyle ;b<ect =eference.

To learn more about (!!1 please read our complete (!! tutorial.

Try it 8ourself - *'amples

Mouse *vents (hange the color of an element when the cursor moves over it. Fisibility How to ma"e an element invisible. Do you want the element to show or not0

$ %revious

&e't (hapte

DHTML !ummary - What9s &e't0

$ %revious &e't (hapter )
DHTML is about combining HTML1 ava!cript1 D;M1 and (!!.

DHTML is a Term
#n this tutorial you have learned that DHTML is only a term used to describe combinations of HTML1 ava!cript1 D;M1 and (!! to create more dynamic web pages. More DHTML e'amples

ava!cript
ava!cript is the standard scripting language for the #nternet. *very web developer should learn ava!cript. Fisit our ava!cript tutorial1 and our complete ava!cript reference.

The HTML D;M

HTML C supports the HTML Document ;b<ect Model 4D;M5. The HTML D;M is the standard way to access HTML elements. #t wor"s in all browsers.

With the HTML D;M1 you can ma"e interactive web pages that will wor" in all modern browsers. #f you are serious about web development1 study our HTML D;M tutorial1 and our complete HTML D;M reference.

Dynamic (!!
There is no such thing as dynamic (!!. However1 with ava!cript and the HTML D;M you can dynamically change the style of any HTML element.

!erver-side !cripting
#n this tutorial we have created dynamic web pages by using scripts on the client 4in the browser5. Web pages can also be made more dynamic by using scripts on the server. With server-side scripting you can edit1 add1 or change any web page content. 8ou can respond to data submitted from HTML forms1 access data or databases and return the results to a browser1 and customiDe pages for individual users. 2t W:!chools you can study the following server-side scripting tutorials6 %H% tutorial 2!% tutorial .&*T tutorial

$ %revious

&e't (hapter )

How to Ma"e / (reate a Website6 The Heginner9s 2-S 7uide

The essential step by step guide on how to set up a website

How to !tart / (reate 8our ;wn Website6 The Heginner9s 2-S 7uide
by Christopher Heng, thesitewizard !om This tutorial shows you how to ma"e or create a website. #t is intended for the beginner and layperson1 ta"ing you step by step through the whole process from the very beginning. #t ma"es very few assumptions about what you "now 4other than the fact that you "now how to surf the #nternet1 since you9re already reading this article on the #nternet5. !ince some steps are more involved1 it also lin"s to selected relevant articles on thesitewiDard.com that you will need to clic" through to read for more information.

The *ssential !tep-by-!tep 7uide to Ma"ing 8our ;wn Website

1. Get Your Domain Name
The first thing you need to do before anything else is to get yourself a domain name. 2 domain name is the name you want to give to your website. .or e'ample1 the domain name of the website you9re reading is >thesitewiDard.com>. To get a domain name1 you have to pay an annual fee to a registrar for the right to use that name. 7etting a name does not get you a website or anything li"e that. #t9s <ust a name. #t9s sort of li"e registering a business name in the bric"-and-mortar worldJ having that business name does not mean that you also have the shop premises to go with the name.
o

Detailed information on getting a good domain name can be found in the article Tips on (hoosing a 7ood Domain &ame. 2fter you read that1 you will need to "now the steps to registering a domain name and the things you need to loo" out for when registering. 8ou can find a detailed guide in the article How to =egister 8our ;wn Domain &ame.

#t may also be wise to ta"e a loo" at some of the #mportant %recautions to Ta"e When Huying a Domain &ame1 <ust so that you don9t commit the same mista"es that some newcomers ma"e when buying a domain name.

2. Choose a Web Host and Si n !p "or an A##ount

2 web host is basically a company that has many computers connected to the #nternet. When you place your web pages on their computers1 everyone in the world will be able to connect to it and view them. 8ou will need to sign up for an account with a web host so that your website has a home. #f getting a domain name is analogous to getting a business name in the bric"-andmortar world1 getting a web hosting account is analogous to renting office premises for your business.
o

There are many issues involved in finding a good web host. =ead up on the various things you need to loo" for in searching for a good web host in the article How to (hoose a Web Host. 2fter you have an idea of what to loo" for1 you can search for one from the Hudget Web Hosting page. 8ou can also find out which web host #9m currently using from the Which Web Host Do 8ou =ecommend0 page.

2fter you sign up for a web hosting account1 you will need to point your domain to that account on your web host. #nformation on how to do this can be found in the guide How to %oint a Domain &ame to 8our Website 4;r What to Do 2fter Huying 8our Domain &ame5.

$. Desi nin %our Web &a es

;nce you have settled your domain name and web host1 the ne't step is to design the web site itself. #n this article1 # will assume that you will be doing this yourself. #f you are hiring a web designer to do it for you1 you can probably s"ip this step1 since that person will handle this step.
o

2lthough there are many considerations in web design1 as a beginner1 your first step is to actually get something out onto the web. The fine-tuning can come after you9ve figured out how to get a basic web page onto your site. ;ne way is to use a W8!#W87 4>What 8ou !ee #s What

8ou 7et>5 web editor to do it. !uch editors allow you to design your site visually1 without having to muc" around with the technical details. They wor" <ust li"e a normal wordprocessor. There are many commercial and free web editors around. .or those who don9t mind spending money on a good commercial web editor1 one of the most highly-regarded W8!#W87 web editors is Dreamweaver. #f you are planning to use this editor1 thesitewiDard.com has an online tutorial on Dreamweaver (!N Tutorial6 How to Design a Website with Dreamweaver (!N. The tutorial ta"es you through all the steps of creating a fullyfunctional website with multiple pages and a feedbac" form1 and provides you with the theoretical and practical foundation that will help you create and maintain your site. #f you prefer to use free software1 you can find a complete tutorial on using TompoSer1 a free W8!#W87 web editor1 in the article How to Design and %ublish 8our Website with TompoSer. Li"e my Dreamweaver tutorial1 this one also guides you through the process of creating a website that has a home page1 an about page1 a site map1 a lin"s page and a feedbac" form. #t also shows you some of the main features of the TompoSer software so that you can go on improving and updating your website on your own. There are many other web design software around. #f you prefer not to use either of the above1 you can find some others listed on thefreecountry.com9s .ree HTML *ditors and W8!#W87 Web *ditors page.
o

2fter you have followed my tutorial1 and are on the way to designing your website1 you might want to read the article 2ppearance1 @sability and !earch *ngine Fisibility in Web Design as well. The article ta"es a brief loo" at some of the real world issues that every web designer must deal with. 2n integral part of web design is search engine readiness. !earch engine promotion does not start after the web site is made. #t starts at the web design stage. The article A Tips on How to (reate a !earch *ngine .riendly Website is a must-read. My article on How to #mprove 8our !earch *ngine =an"ing on 7oogle is also important for the simple

reason that 7oogle is the most popular search engine around1 at least at the time this article was written.
o

There are many other issues regarding the design of web pages. The above will get you started. However1 if you have the time after you get something out onto the web1 you may want to read my other articles on Web Design and Website %romotion and !earch *ngine =an"ing.

'. (estin Your Website

2lthough # list this step separately1 this should be done throughout your web design cycle. # list it separately to give it a little more prominence1 since too few new webmasters actually perform this step adequately. 8ou will need to test your web pages as you design them in the ma<or browsers6 #nternet *'plorer U1 #nternet *'plorer O1 #nternet *'plorer A1 the latest versions of .irefo'1 ;pera1 !afari and (hrome. !ince all these browsers are free anyway1 it should not be any hardship to get them and install them. The tric" however1 is testing with more than one version of #nternet *'plorer since the later version will overwrite the earlier. .or that1 please see the article How to (hec" 8our Website with Multiple Hrowsers on a !ingle Machine 4(ross-Hrowser (ompatibility (hec"ing5. 2lthough there are two possible ways given in the article1 # suggest that you use the emulator/virtual machine method to do this. 4#t9s probably easier.5 =ead the article to find out more. ;ne way to improve your chances that your website will wor" in future versions of the web browsers is to ma"e sure your web pages9 code validate as correct 4that is1 the underlying code has no errors5. 8ou can read more about this in HTML and (!! Falidation6 !hould 8ou Falidate 8our Web %age0 There are numerous free web page validators listed on the .ree HTML Falidators1 Hro"en Lin" (hec"ers1 Hrowser (ompatibility (hec"ers page.

). Colle#tin Credit Card *n"ormation+ ,a-in ,one%

#f you are selling products or services1 you will need some way to collect credit card information. 8ou should read up on How to 2ccept (redit (ards on 8our Website. # also have a step by step

guide on How to 2dd an ;rder .orm or a >Huy &ow> button using %ay%al to a Website for those using %ay%al. #f you need advertisers for your website1 you might want to read How to Ma"e Money .rom 8our Website and the follow-up article How to #ncrease 8our Website =evenue from 2ffiliate %rograms. 2 list of advertisers and affiliate programs can be found on 2ffiliate %rograms6 .ree !ponsors and 2dvertisers. Those companies are on the constant loo"out for new web publishers to display their advertisements.

.. Gettin Your Site Noti#ed

When your site is ready1 you will need to submit it to search engines li"e 7oogle and Hing. 8ou can use the lin"s below to do this.
o o

"oog#e$s %in& '(bmission )age *ing$s 'ite '(bmission )age

#n general1 if your site is already lin"ed to by other websites1 you may not even need to submit it to these search engines. They will probably find it themselves by following the lin"s on those websites. 2part from submitting your site to the search engine1 you may also want to consider promoting it in other ways1 such as the usual way people did things before the creation of the #nternet6 advertisements in the newspapers1 word-of-mouth1 etc. 2s mentioned in my article on More Tips on 7oogle !earch *ngine =esults %lacement1 you can even advertise in the various search engines 4and not <ust in 7oogle1 which was the only one mentioned in that article since that was the topic of that discussion5. This has the potential of putting your advertisement near the top of the search engine results page1 and possibly even on other websites. There are also less obvious ways of promoting your website1 which you might want to loo" into.

(onclusion
&aturally the above guide is not e'haustive. #t is a distillation of some of the essential steps in getting started with your site. #f you want

more information1 you should read the other articles on thesitewiDard.com. However1 the above tutorial should be enough to help you put your website on the #nternet. (opyright ?BBA-?B-B by (hristopher Heng. 2ll rights reserved. 7et more free tips and articles li"e this1 on web design1 promotion1 revenue and scripting1 from http6//www.thesitewiDard.com/. 8ou are here6 Top , ;ther Webmaster 7etting !tarted 7uides , How to (reate / Design 8our ;wn Website6 The Heginner9s 2-S 7uide

thesitewiDardV &ews .eed 4=!! !ite .eed5

Do you find this article useful0 8ou can learn of new articles and scripts that are published on thesitewiDard.com by subscribing to the =!! feed. !imply point your =!! feed reader or a browser that supports =!! feeds at http6//www.thesitewiDard.com/thesitewiDard.'ml. 8ou can read more about how to subscribe to =!! site feeds from my =!! .2E.

%lease Do &ot =eprint This 2rticle

This article is copyrighted. %lease do not reproduce this article in whole or part1 in any form1 without obtaining my written permission.

=elated %ages

How to )(t a 'ite 'ear!h +ngine ,n -o(r .ebsite How to /p#oad a 0i#e to -o(r .ebsite /sing the 0i#e1i##a 02) C#ient .hat is 0avi!on i!o3 )ersona#ise -o(r 'ite$s *oo&mar& 0ree 02) C#ients, 'e!(re 02) 4'02)5 )rograms 0ree .eb 'tatisti!s and .eb %og 6na#yzers 0ree ''H 4'e!(re 'he##5 and 2e#net C#ients 0ree .eb 'tatisti!s 'ervi!es How to In!rease -o(r 'a#es and C(stomer 'atis7a!tion

&ew %ages

How to 'wit!h *etween the %i8(id and 0i9ed %ayo(t 2emp#ates in :reamweaver

'ho(#d -o( "et a :omain Name with 'pa!es or :ots In *etween to Improve ;eadabi#ity3 How to Centre a *a!&gro(nd Image or )hoto on -o(r .eb )age /sing <ompo1er How to ;es!(e -o(r .ebsite 7rom the C#(t!hes o7 a *ad .eb :esigner or *ad .eb Host How to Created ;o(nded Corners 7or -o(r *o9 *orders in C'' How to 6dd a 0eedba!& 0orm to -o(r .ebsite with :reamweaver C'5 .hat is =y'>%3 .hat is a :atabase3 .hat is '>%3 'ho(#d -o( Choose a %in(9 or a .indows .eb Hosting )a!&age3 Is 2here '(!h a 2hing as a =a! .eb Host3 How to )oint a :omain Name to -o(r .ebsite 4,r .hat to :o 67ter *(ying -o(r :omain Name5 How to /p#oad and %in& to a ):0 0i#e 4or ):0 +boo&5 in <ompo1er and Nv(

%opular %ages

How to =a&e ? Create -o(r ,wn .ebsite@ 2he *eginner$s 6A1 "(ide 2ips on Choosing a "ood :omain Name How to Create a 'ear!h +ngine 0riend#y .ebsite :reamweaver C'5 2(toria#@ How to :esign a .ebsite with :reamweaver C'5 How to :esign and )(b#ish -o(r .ebsite with <ompo1er 47ree .-'I.-" web editor5 0ree C(stomized 0eedba!& 0orm .izard 4)H) ? )er# '!ript5

How to Lin" to This %age

To lin" to this page from your website1 simply cut and paste the following code to your web page.

#t will appear on your page as6 How to Ma"e / (reate 8our ;wn Website6 The Heginner9s 2-S 7uide Copyright B 2CCDA2C1C by Christopher Heng 6## rights reserved thesitewizardE, the7ree!o(ntryE and How2oHavenE are trademar&s o7 Christopher

Heng %ast (pdated@ 1 'eptember 2C1C 'ear!h 2his 'ite

Search

Home :onate Conta!t /s %in& to /s 2opi!s 'ite =ap "etting 'tarted .eb :esign 'ear!h +ngines ;even(e =a&ing :omains .eb Hosting *#ogging Fava'!ripts )H) )er# ? C"I H2=% C'' hta!!ess ? 6pa!he News#etters "enera# 'easona# ;eviews 06>s .izards

0ind this site (se7(#3 )#ease #in& to (s

Difference Hetween #nternet and #ntranet

G Categorized (nder 2e!hno#ogy,internet

#n the information age that we live in today1 the speed at which information can travel inside a company would often indicate the productivity of that company. #t is often necessary to create an environment where the flow of data is unimpeded and the intended recipient gets it instantaneously. (omputers ma"e this possible and there are multiple ways to implement such a networ". 2n #ntranet is a computer networ" that is designed to wor" li"e the internet but in a much smaller scale and is restricted only to the employees of the company. #t is possible to run .T%1 HTT%1 and mail servers in the intranet that is independent and inaccessible from the internet without proper authoriDation. This allows the employees to send progress reports to their manager even when they cannot meet in person. Wor"ers could also wor" collaboratively on a certain pro<ect while "eeping their paperwor" properly synchroniDed. #t is often necessary to have access to the internet from within your intranet1 which is why intranets are placed behind a firewall. !ome companies even deploy two firewalls and place some services inside the DMS in order to raise their security further. 2n intranet1 although very helpful1 wouldnWt be very effective if it is totally removed from the internet. The internet is the massive networ" of computers from all around the world. #t allows people to virtually any point in the world at a very minimal cost. !ervices li"e *mail and

Fo#% has allowed many people to "eep in touch despite geographical locations and time Dones. Heing connected to the internet1 a company can have their people in the field or those who are wor"ing at home to still be able to do what they would usually do when they are inside the office. They can connect to services inside the intranet and submit their wor" or contact their cowor"ers and superiors. They can even call online if their office supports #%-%2HG systems. The #ntranet and the #nternet are two domains that are very ali"e but are often segregated in order to maintain security. #f properly configured and guarded1 an #ntranet that is connected to the #nternet could raise your companyWs productivity by leaps and boundJ not to mention cutting down the cost of traditional communications. #t could also open the door to malicious people who can do ma<or damage or even steal confidential company data if done haphaDardly. #t should be up to the management to ma"e sure that all precautions are ta"en. .ind Hoo"s about internet and intranet.

;ead more@ :i77eren!e *etween Internet and Intranet H :i77eren!e *etween H Internet vs Intranet http@??www di77eren!ebetween net?te!hno#ogy?di77eren!eAbetweenAinternetAandA intranet?#i9zz15>y,Ia1:

E6 Difference between #nternet and #ntranet0

@ IN2;6N+2 6n intranet is a private !omp(ter networ& that (ses Internet proto!o#s, networ& !onne!tivity to se!(re#y share part o7 an organization$s in7ormation or operations with its emp#oyees 'ometimes the term re7ers on#y to the most visib#e servi!e, the interna# website 2he same !on!epts and te!hno#ogies o7 the Internet s(!h as !#ients and servers r(nning on the Internet proto!o# s(ite are (sed to b(i#d an intranet H22) and other Internet proto!o#s are !ommon#y (sed as we##, s(!h as 02) 2here is o7ten an attempt to (se Internet te!hno#ogies to provide new inter7a!es with !orporate J#ega!yJ data and in7ormation systems *rie7#y, an intranet !an be (nderstood as Ja private version o7 the Internet,J or as a version o7 the Internet !on7ined to an organization IN2+;N+2 2he Internet is a wor#dwide, p(b#i!#y a!!essib#e series o7 inter!onne!ted !omp(ter networ&s that transmit data by pa!&et swit!hing (sing the standard Internet )roto!o# 4I)5 It is a Jnetwor& o7 networ&sJ that !onsists o7 mi##ions o7 sma##er domesti!, a!ademi!,

b(siness, and government networ&s, whi!h together !arry vario(s in7ormation and servi!es, s(!h as e#e!troni! mai#, on#ine !hat, 7i#e trans7er, and the inter#in&ed .eb pages and other do!(ments o7 the .or#d .ide .eb 6@ internet is a wor#d wide p(b#i!#y a!!essib#e networ&, whi#e intranet is a private a!!essib#e sma## networ& (sed 7or a sma## organization yadav G abo(t 3 years 6go 6@ internet is a wor#dAwide p(b#i!y networ& b(t intranet is is a private networ& (sed by a sma## organization I m .6Kid 6#i 4waKidLzenithMhotmai# !om5 7rm internationa# is#ami! (niversity waKid G abo(t 1 year 6go 6@ inernet is #i&e a g#oba# vi##age,where anyone !an !omes ,stay and gone intranet is #i&e a ho(se where no one !an enter wito(t peremision *y@ Kawad ahmed Kawad G N months 6go 6@ -o(r intranet and yo(r p(b#i! website on the open Internet are two di77erent in7ormation spa!es and sho(#d have two di77erent (ser inter7a!e designs It is tempting to try to save design reso(r!es by re(sing a sing#e design, b(t it is a bad idea to do so be!a(se the two types o7 site di77er a#ong severa# dimensions@ G /sers di77er Intranet (sers are yo(r own emp#oyees who &now a #ot abo(t the !ompany, its organizationa# str(!t(re, and spe!ia# termino#ogy and !ir!(mstan!es -o(r Internet site is (sed by !(stomers who wi## &now m(!h #ess abo(t yo(r !ompany and a#so !are #ess abo(t it G 2he tas&s di77er 2he intranet is (sed 7or everyday wor& inside the !ompany, in!#(ding some 8(ite !omp#e9 app#i!ationsO the Internet site is main#y (sed to 7ind o(t in7ormation abo(t yo(r prod(!ts G 2he type o7 in7ormation di77ers 2he intranet wi## have many dra7t reports, proKe!t progress reports, h(man reso(r!e in7ormation, and other detai#ed in7ormation, whereas the Internet site wi## have mar&eting in7ormation and !(stomer s(pport in7ormation G 2he amo(nt o7 in7ormation di77ers 2ypi!a##y, an intranet has between ten and a h(ndred times as many pages as the same !ompany$s p(b#i! website 2he di77eren!e is d(e to the e9tensive amo(nt o7 wor&AinAprogress that is do!(mented on the intranet and the 7a!t that many proKe!ts and departments never p(b#ish anything p(b#i!#y even tho(gh they have many interna# do!(ments G *andwidth and !rossA p#at7orm needs di77er Intranets o7ten r(n between a h(ndred and a tho(sand times 7aster than most Internet (sers$ .eb a!!ess whi!h is st(!& at #owAband or midAband, so it is 7easib#e to (se ri!h graphi!s and even m(#timedia and other advan!ed !ontent on intranet pages 6#so, it is sometimes possib#e to !ontro# what !omp(ters and so7tware versions are s(pported on an intranet, meaning that designs need to be #ess !rossAp#at7orm !ompatib#e 4again a##owing 7or more advan!ed page !ontent5 =ost basi!a##y, yo(r intranet and yo(r website are two di77erent in7ormation spa!es 2hey sho(#d #oo& di77erent in order to #et emp#oyees &now when they are on the interna# net and when they have vent(red o(t to the p(b#i! site :i77erent #oo&s wi## emphasize the sense o7 p#a!e and th(s 7a!i#itate navigation 6#so, ma&ing the two in7ormation spa!es 7ee# di77erent wi## 7a!i#itate an (nderstanding o7 when an emp#oyee is seeing in7ormation that !an be 7ree#y shared with the o(tside and when the in7ormation is interna# and !on7identia# 6n intranet design sho(#d be m(!h more tas&Aoriented and #ess promotiona# than an Internet design 6 !ompany sho(#d on#y have a sing#e intranet design, so (sers on#y have to #earn it on!e 2here7ore it is a!!eptab#e to (se a m(!h #arger n(mber o7 options and 7eat(res on an

intranet sin!e (sers wi## not 7ee# intimidated and overwhe#med as they wo(#d on the open Internet where peop#e move rapid#y between sites 4I &now o7 a 7rightening#y #arge n(mber o7 !ompanies with m(#tip#e intranet homepages and m(#tip#e intranet sty#es@ 'tep 1 is to get rid o7 that in 7avor o7 a (ni7ied intranet 5 6n intranet wi## need a m(!h stronger navigationa# system than an Internet site be!a(se it has to en!ompass a #arger amo(nt o7 in7ormation In parti!(#ar, the intranet wi## need a navigation system to 7a!i#itate movement between servers, whereas a p(b#i! website on#y needs to s(pport withinAsite navigation =anaging the Intranet 2here are three ways o7 managing an intranet@ 1 6 sing#e, tight#y managed server@ on#y approved do!(ments get posted, and the site has a sing#e, we##Astr(!t(red in7ormation ar!hite!t(re and navigation system (nder the !ontro# o7 a sing#e designer +ven tho(gh this approa!h ma9imizes (sabi#ity o7 the in7ormation that passes the h(rd#es and gets posted, this is not the best way to b(i#d a !orporate in7ormation in7rastr(!t(re be!a(se the !entra# !ho&e point de#ays the spread o7 new and (se7(# in7ormation 6 tota#itarian intranet wi## !a(se yo( to miss too many opport(nities 2 6 miniAInternet@ m(#tip#e servers are on#ine b(t are not !oordinated, !omp#ete !haos reigns, yo( have to (se Jreso(r!e dis!overyJ methods #i&e spiders to 7ind o(t what is on yo(r own intranet, no !onsistent design 4everybody does their own pages5, no in7ormation ar!hite!t(re 2his approa!h might seem to in!rease opport(nities 7or !omm(ni!ation a!ross the !ompany, b(t in rea#ity does not do so sin!e peop#e wi## be in!apab#e o7 7inding most o7 the in7ormation in an anar!hy 3 =anaged diversity@ many servers are in (se, b(t pages are designed a!!ording to a sing#e set o7 temp#ates and inter7a!e standardsO the entire intranet 7o##ows a we##Ap#anned 4and (sabi#ityAtested5 in7ormation in7rastr(!t(re that 7a!i#itates navigation 2his is my pre7erred approa!h =anaged diversity wi## probab#y !hara!terize many aspe!ts o7 the !oming networ& e!onomy, b(t we have #ess e9perien!e with this approa!h than with more traditiona# topAdown management F(st one e9amp#e o7 improved (sabi#ity 7rom ta&ing advantage o7 managed diversity@ an intranet sear!h engine !an ta&e advantage o7 weighted &eywords to in!rease pre!ision .eights are impossib#e on the open Internet, sin!e every site abo(t widgets wi## !#aim to have the highest possib#e re#evan!e weight 7or the &eyword Jwidget J ,n an intranet, even a #ight to(!h o7 in7ormation management sho(#d ens(re that a(thors assign weights reasonab#y 7air#y and that they (se, say, a !ontro##ed vo!ab(#ary !orre!t#y to !#assi7y their pages +9tranets@ *#ended :esign 6n e9tranet is a spe!ia# set o7 pages that are made avai#ab#e to se#e!ted b(siness partners s(!h that they !an dire!t#y a!!ess !omp(tationa# reso(r!es inside yo(r !ompany 2ypi!a# e9amp#es in!#(de a##owing !(stomers to !he!& on the stat(s o7 their orders 4e g , when wi## my (rgent order ship3 did yo( or did yo( not re!eive o(r payment35 and a##owing approved vendors to #oo& at re8(ests 7or proposa#s 2he e9tranet is a b#end o7 the p(b#i! Internet and the !#osed intranet and needs to be designed as s(!h 0(ndamenta##y, an e9tranet is a part o7 the Internet sin!e it is a!!essed by peop#e in many di77erent !ompanies who wi## be (sing yo(r p(b#i! website b(t wi## not have a!!ess to the tr(#y interna# parts o7 yo(r intranet 2here7ore, the vis(a# sty#e and main navigation options o7 the e9tranet sho(#d be visib#y simi#ar to the design o7 yo(r Internet site@ yo(r b(siness partners sho(#d 7ee# that the two sites !ome 7rom the same !ompany 6 s(bt#e di77eren!e in the two sty#es 4e g , !omp#imentary !o#or tones5 wi## he#p emphasize the !#osed and !on7identia# nat(re o7 the e9tranet It wi## o7ten be reasonab#e to have #in&s 7rom e9tranet pages to pages on the p(b#i! website, b(t yo( sho(#d not have #in&s that point to yo(r private intranet sin!e yo(r b(siness partners wi## not be ab#e to

7o##ow s(!h #in&s 6!t(a# (se o7 the e9tranet shares many properties with intranet (se@ the (sers wi## be (sing the e9tranet as a maKor part o7 their everyday Kob, so it wi## be possib#e to (se spe!ia#ized #ang(age and re#ative#y !omp#e9 intera!tions It may even be reasonab#e to ass(me some amo(nt o7 training on the part o7 the (sers, sin!e they wi## be motivated to improve the e77i!ien!y o7 their own b(siness by ma&ing better (se o7 yo(r e9tranet 2he training needs and the !omp#e9ity o7 yo(r e9tranet !an not be too demanding, however, sin!e yo( norma##y !annot ass(me that e9tranet (sers are dedi!ated to the (se o7 yo(r parti!(#ar design and nothing e#se 6 typi!a# e9tranet (ser may be a !orporate p(r!hasing agent who may need to dea# with yo(r e9tranet as we## as the e9tranets o7, say, 5C other !ompanies where he or she has p#a!ed orders -o(r e9tranet m(st be 7air#y easy to (se i7 this p(r!hasing agent is to remember its 7eat(res and options 7rom one visit to the ne9t