HTML. 2 World Wide Web WWW is a service internet The total set of interlinked hypertext documents residing on Web servers all around the world. Documents.

World Wide Web

WWW is a service internet

The total set of interlinked hypertext documents residing on Web servers all around the world.

Documents on the WWW, called pages or Web pages

WWW is based on HTML

Introduction

A network of computer networks which operates world-wide using a common set of communications protocols.

What is Internet?

Web Browser

is a computer program which is used to view a Web page.

Browser implements the following functions:Search and access to a Web-server;Loading, formatting, and displaying HTML-document;Hyperlink detection and moving from one document to another;Standard tools support.

Hypertext Mark-up Language

(HTML)

HTML is the standard mark-up language used to create and organize documents on the World Wide Web;HTML lets users to format text, add graphics, sound, video, and save it all in a Text-Only or ASCII format that any computer can read.

HTML Features

Hypertext, that allows to create a link in a Web page that leads to any other pages on the Web. Hence information on the Web can be accessed from many different locations

Universality means that any computer can read a Web page regardless of platforms or operating systems

HTML Files

Must be saved as text files with extension html or htm. The extension tells the browser that file is to be interpreted according to HTML standardsName your files to describe their functionalityFile name of your home page should be index.html

Developing HTML documents

Bottom-up approach: write HTML code in a text editor, and then view the Web page in a browserSteps:

Open a text editorEnter text and tagsSave file as xxx.htmlOpen the file in a browser to view the Web pageRepeat above steps if you need to debug the page

Top-down approach: build the Web page elements using an HTML editor, and then view the HTML code laterSteps:

Open an HTML editorAdd HTML elements using the editor’s GUISave the automatically generated HTML code in a file as xxx.htmlExit the editor and view the page

HTML Building BlocksHTML tags are command words written between symbols < >, that indicate how browser should display the text.Tags may have opening and closing versionText is placed in a container (or HTML element), which starts with opening tag and ends with closing.

Building Blocks

HTML Rules

Case insensitiveSpacing:Browsers ignore extra spaces

Block-level tags include automatic line brakes

Examples: P, H1, UL, TABLE

Tag AttributesAttributes offer a variety of options Attributes are entered between keyword and final symbol >A single tag may have a few attributesAttributes are placed one after the other in any order<IMG SRC=“Image.bmp” HSPACE=5>

Attribute Values

Attributes can accept the values of particular typesValues of attributes should be enclosed in straight quotation marks“” may be omitted if the value contains only letters, digits, hyphen (-), and period (.)

Nesting Tags

Hierarchy – tags that affect entire paragraph may contain tags affecting individual words or letters

Order – the current closing tag should correspond to the last unclosed opening tag

Nesting Tags (example)

Correct:<H1> Information <I>System</I></H1>

Incorrect:<H1> Information <I>System</H1></I>

HTML Document

<HTML><HEAD> …

</HEAD><BODY>

…</BODY>

</HTML>

Starting Web Page

The HEAD Section

<HEAD> - beginning of the head section

<TITLE> - page description</TITLE> - end of title<!-- Script or comment may be placed

here --></HEAD> - end of the head section

The BODY Section

<BODY>

{Text displayed by browser}

</BODY>

HTML Document

<HTML><HEAD><TITLE>My First Page</TITLE></HEAD><BODY>Welcome to NU's Students!</BODY></HTML>

Example HTML Document

Result of <TITLE> tag

Result of <BODY> tag

Commonly Used HTML Tags

<H1> … </H1> Heading. <H2> … </H2> Heading.<H3> … </H3> Heading.<BLOCKQUOTE> … </ BLOCKQUOTE

>Indents block of text

one tab.

Text Formatting

Commonly Used HTML Tags (continued…)

<P> … </P> : Paragraph.<B> … </B> : Bold <I> … </I> : Italic <U> … </U> : Underline<EM> … </EM> : Emphasize (logical – exact

effect depends on browser)

<BR /> : Line break<HR /> : Horizontal Rule (line)

Creating Superscripts & Subscript

<SUB>…</SUB> : Subscript<SUP>…</SUP> : Superscript

Example:H<SUB>2</SUB>O :H2O

10<SUP>th</SUP> :10th

Formatting Text With <FONT>

FONT elementAdd color and formatting to textFONT attributes:

COLOR Preset or hex color codeValue in quotation marksNote: you can set font color for whole document using TEXT attribute in BODY element

SIZETo make text larger, set SIZE = “+x”To make text smaller, set SIZE = “-x”x is the number of font point sizesN=3 corresponds to default value

Value of n

1 2 3 4 5 6 7

Size in pt. 8 10 12 14 18 24 36

FACEFont of the text you are formattingBe careful to use common fonts like Times, Arial, Courier and HelveticaBrowser will display default if unable to display specified font

Example<FONT COLOR = “red” SIZE = “+1” FACE = “Arial”>…</FONT>

Ordered List<OL TYPE=x START=n> Beginning

of an Ordered List<LI> … </LI> A list element<LI> … </LI> Another list element

</OL> End of the Ordered List

TYPE, START are optional X=A, a, I, i, 1 ( X=1 is default value)n – initial value for list items

Unordered List<UL TYPE=shape > Beginning an

Unordered List<LI> … </LI> A list element<LI> … </LI> Another list element

</UL> End of the Unordered List

TYPE is optional, shape represents the kind of bullet, like circle, square…

Nested ListsNested list

Contained in another list elementNesting the new list inside the original

Indents list one level and changes the bullet type to reflect the nesting

Browsers Insert a line of whitespace after every closed list

Indent each level of a nested list Makes the code easier to edit and debug

Uniform Resource Locator (URL)

An address for a resource on the Internet. URL can be

Absolute – contains all parts of URL;Relative – presents path and file name relatively current file.

“http://www.norton-u.com/itdepartment/index.html”

Scheme Server name Part File name

Schemehttp – Hypertext Transfer Protocol to access Web-pagesftp – File Transfer Protocol to download the file from the netmailto – to send electronic mailFile – to access file on a local hard disk (File scheme uses ///).and others…

Absolute URL (examples)

http://www.norton.com/dir/hpage.html

ftp://ftp.site.com/common/prog.exe

mailto:marina@yorku.ca

file:///Cdisk/ITEC1010/COL.html

Relative URL (examples)A file from the same folder as current file:

“file.htm”A file from a subfolder of current folder:

“images/picture.gif”A file from another folder at the same hierarchical level:

“../info/data.htm”

External Link

is a reference to another page

<A HREF=“URL” > Label text </A>

Label text will be underlined or highlighted, click upon it will bring visitors to the page with given URL

Internal linkIs a reference to a particular part of the same page.Click upon the internal link will bring a visitor to the particular part of the same page.To create an internal link:

Create an anchorAdd a hyperlink to the anchor

Creating AnchorsPlace the cursor in the desirable part of a page, where the link should bring visitorsCreate an anchor

<A NAME=“anchor name”>Label text </A>

Label text is a text or image that should be referenced.

Link to a specific anchor

Within a document <A HREF=“#anchor name”> Label

text </A>

To a separate document

<A HREF=“URL#anchor name”>Label text </A>

Link to E-mail address<A

HREF=“mailto:name@website.ext”>Say HELLO!!!</A>Click on hypertext “Say HELLO!!!” will

invoke an application such as MS Outlook to send E-mail to the address

name@website.ext.

Images

<IMG SRC=“image_URL”>SRC – source of the image (file

address)Another attributes:

BORDER=n, n-thickness of the border in pixelsALT – alternative textWIDTH – width of an image in pixels

Images (continued…)HEIGHT – height of an image in pixelsALIGN – position on a page

<IMG SRC=“images/pic1.bmp” WIDTH=30

HEIGHT=30 ALT=“Digimon” ALIGN=“left” >

Tables

A table is a matrix formed by the intersection of a number of horizontal rows and vertical columns.

Column 1 Column 2 Column 3

Row 1 Row 2 Row 3

Cell Cell Cell

Tables (continued…)

Container <TABLE> … </TABLE>

Attributes:BORDER= n – the border thickness

in pixelsWIDTH=x – width of the table or a

cell within the table in pixels (or %)

Tables (continued…)A table is formed row by row. To define a

<TR>…</TR> is used

Within a row table cells with data is determined by

<TD>…</TD> or with headers by

Simple Table (example)<HTML><HEAD>

<TITLE> Example of table </TITLE></HEAD><BODY><TABLE>

<TR> <TH>Month</TH> <TH>Quantity</TH> </TR><TR> <TD>January</TD> <TD>130</TD></TR><TR> <TD>February</TD> <TD>125</TD> </TR><TR> <TD>March</TD> <TD>135</TD> </TR>

</TABLE></BODY></HTML>

Tables (more complicated)To span a cell across a few columns attribute

COLSPAN=n, where n - number of columns, is used

To span a cell across a few rows attribute

ROWSPAN=n, where n - number of rows, is used

Table (example)<TABLE BORDER=2>

Quarter</TH><TH>Month</TH><TH>Quantity</TH></TR><TR> <TD ROWSPAN=3> I </TD> <TD>January</TD> <TD>130</TD> </TR><TR> <TD>February</TD> <TD>125</TD> </TR><TR>

<TD>March</TD><TD>135</TD></TR>

Table (examplecontinued…)

<TR> <TD ROWSPAN=3> II </TD> <TD>April</TD> <TD>130</TD></TR><TR> <TD>May</TD><TD>125</TD> </TR><TR> <TD>June</TD><TD>135</TD> </TR><TR> <TD COLSPAN=2> Total </TD> <TD>780</TD></TR>

</TABLE>

Cell AttributesFONT – establishes the font of a cellALIGN – determines horizontal alignment of cell content, accepts values:

“left”, “center”, or “right”VALIGN - determines vertical alignment of cell content, accepts values:

“top”, “middle”, or “bottom”

Purposes to use tablesTo present tabular data;To create multicolumn textTo create captions for imagesTo create side bars

Cells may contain various HTML elements:

Images, Hyperlinks, Text, Objects, even Tables

A frame is an independent scrolling region, or window, of a Web page. Every Web page can be divided into many individual frames, which can even be nested within other frames

Each frame can contain a different document.

Create FramesetTo create a frameset with three horizontal rows all in the same column

</frameset

Note: The BODY tag is not used at all in frameset pages

Create Frameset (continued…)

Frameset Attributerows=“a,b,*” where a and b are the height of the first & second rows and asterisk is the height of the third row. The value may either be a percentage or exact number of pixels

Frame Attributename=“name” where name is word that identifies this particular frame’s use.

src=“URL” where path of url for the page that will be displayed in the this frame.

To create frames in columns<frameset cols=“a,b,*”>

</frameset>

Frameset Attributecols=“a,b,*” where a and b are the width of the first & second rows and asterisk is the width of the third row. The value may either be a percentage or exact number of pixels

Creating frame in column

Creating frames in Rows and Columns

To create a frameset with both rows and columns<frameset cols=“a,b” rows=“a,b”>

</frameset>

Note: Defining rows and columns in this way limits you to the same number of frames in each row or column

Combining Framesets

To combine Framesets<frameset rows=“a,b”>

</frameset>

Adjusting a Frame’s Margins

To adjust a frame’s marginsIn the desired FRAME tag, Type MARGINWIDTH=W where w is the desired amount of space, in pixel, between the left and the right edges of the frame.

Type MARGINHEIGHT=H where H is the desired amount of space, in pixel, between the top and the bottom edges of the frame.

Showing or Hiding Scroll Bars

In the FRAME tag of the particular frame, type scrolling=“yes, no, auto” Scrolling value

yes for showing scroll barno for hiding scroll barauto for scroll bars to appear only when necessary.

Adjusting the color of the Borders

To adjust the color of all the borders in the framesets

Inside the topmost FRAMESET tag, type BORDERCOLOR=color

Adjusting Frame Borders

To adjust amount of space between frames

Inside the topmost FRAMESET tag, type BORDER=n where n is the width of the space between frames in pixels

To show or hide bordersInside the FRAMESET or FRAME, type FRAMEBORDER=“1, yes , 0, no”

Keeping Visitors from Resizing Frames

To keep visitors from resizing your frames, type NORESIZE in the FRAME tag for desire frame

Creating Links Between Frames

To target a link to a particular frameMake sure the target frame has a nameOn the page where the link appear, type <a href=“Hello.htm” target=“name”>I want to say…</a>

Target=“name” where name is the reference given to the target frame within the frame tag.

Creating Links Between Frames (continued…)

To target a link to a special spotType < a href=“detail.htm”Type target=“_blank” to open the link in the new window, blank windowOr type target=“_self” to open the link in the same frame that contains the linkOr type target=“_top” to open the link in the current browser window.Or type target=“_parent” to open the link in the frame that contains the current frameset.</a>

Creating Links Between Frames (continued…)

To change the default targetIn the HEAD section of the page that contains the links, <base target=“name” , where name is the word that identifies the frame in which you want the links to appear, by default >

Creating Alternatives to Frames

To create alternatives to framesType <noframe> before the last </frameset> tagCreate the content that you want to appear if the frames do not</noframe>

Creating an Inline Frame

To create an inline frameIn the container page, type <iframe src=“frame.url” name=“name” width=“x” height=“y” align=“direction”>Type the text that should appear if the browser doesn’t support</iframe>

Basic HTML FormsForms

Collect information from people viewing your site

FORM elementMETHOD attribute

Form data can be sent to the server in two waysThe get method, which sends data as part of the URLThe post method, which hides data in the HTTP headers

ACTION attribute The action attribute indicates which page on the server will receive the information from this form when a user presses the submit button.

Basic HTML Forms (Cont)ID Attribute

The id attribute allows you to provide a unique identifier for the <form> element, just as it does for other elements.

Name AttributeAs with most other attributes, the name

attribute is the predecessor to the id attribute.

Form ControlsThis section covers the different types of form controls that you can use to collect data from a visitor to your site. You will see:

Text input controlsButtonsCheckboxes and radio buttonsSelect boxes (sometimes referred to as drop-down menus) and list boxesFile select boxesHidden controls

Text input controls

There are actually three types of text input used on forms:

Single-line text input controlsPassword input controls:Multi-line text input controls:

Single-line text input controls

Single-line text input controls are created using an <input> element whose type attribute has a value of text

Attribute Purpose

type Indicates the type of input control you want to create.

name Used to give the name part of the name/value pair that is sent to a server.

value Provides an initial value for the text input control that the user will see when the form loads.

size Allows you to specify the width of the text-input control.

maxlength Allows you to specify the maximum number of characters a user can enter into the text box.

Password Input ControlsPassword input controls are created almost identically to the single-line text input controls, except that the type attribute on the <input> element is given a value of password.

Example:<form action="http://www.example.com/login.asp" method="post">Username:<input type="text" name="txtUsername" value="" size="20"

maxlength="20"><br>Password:<input type="password" name="pwdPassword" value="" size="20"maxlength="20“><input type="submit" value="Submit"></form>

Multiple-Line Text Input Controls

Allowing a visitor to your site to enter more than one line of text, you should create a multiple-line text input control using the <textarea>…</textarea> element.

Attribute Purpose

name Used to give the name part of the name/value pair that is sent to a server.

rows it indicates the number of rows of text a <textarea> element

cols It specifies the width of the box and refers to the number of columns. One column is the average width of a character.

Multiple-Line Text Input Controls(Cont)

Attribute Values

Wrapallows you to Indicate howthe textshould be wrapped.

Selecting Off or Default prevents text from wrapping to the next line.

Selecting Virtual sets word wrap in the text area. When the user’s input exceeds the right boundary of the text area, text wraps to the next line.

Selecting Physical sets word wrap in the text area, as well as to the data when it is submitted for

processing.

Button ControlsYou can create a button in three ways:

Using an <input> element with a type attribute whose value is submit, reset, or buttonUsing an <input> element with a type attribute whose value is imageUsing a <button> element

Button ControlsCreating Buttons Using the <input> Element

The type attribute can take the following values:submit, which creates a button that automatically submits a formreset, which creates a button that automatically resets form controls to their initial valuesbutton, which creates a button that is used to trigger a client-side script when the user clicks that button

The name attribute provides a name for the button.The value attribute enables you to specify what the text on the button should read.

Button ControlsUsing Images for ButtonsCreating an image button is very similar to creating any other button, but the type attribute has a value of image

Attribute Purpose

src Specifies the source of the image file.

alt Provides alternative text for the image.

Button ControlsCreating Buttons Using the <button> Element

Allowing you to specify what appears on a button between an opening <button> tag and a closing </button> tag. You can include image elements between these tags.

The type attribute can take the following values:submit, which creates a button that automatically submits a formreset, which creates a button that automatically resets form controls to their initial valuesbutton, which creates a button that is used to trigger a client-side script when the user clicks that button

Checkbox & RadioINPUT element

TYPE = “checkbox” creates a checkboxUsed individually or in groupsEach checkbox in a group should have same NAMEMake sure that the checkboxes within a group have different VALUE attribute values

TYPE = “radio”Radio buttons similar in function and usage to checkboxesOnly one radio button in a group can be selected

Checkbox & Radio (Cont)Attribute Purpose

type Indicates that you want to create a checkbox or radio.

name Gives the name of the control

value The value that will be used if the checkbox is selected

checkedIndicates that when the page loads, the checkbox or radio should be selected.

sizeThis attribute indicates the size of the radio button in pixels, but this attribute does not work in IE 6 or Netscape 7.

Select Boxes

SELECT elementAdd an item to list

Insert an OPTION element in the <SELECT>…</SELECT> tags

Example

<select name="selColor"><option selected="selected" value="">Select

color</option><option value="red">Red</option><option value="green">Green</option><option value="blue">Blue</option>

</select>

Select BoxesSELECT Element

Attribute Purpose

name This is the name for the control.

sizeThis can be used to present a scrolling list box (list box control)

multiple Allows a user to select multiple items from the menu.

OPTION Element

Attribute Purpose

valueThe value that is sent to the server if this option is selected.

selected Specifies that this option should be the initially selected value when the page loads.

Grouping OptionsThe <optgroup> element can carry a labellabel attribute whose value is a label for that group of options.

<form action="http://www.example.org/info.asp" method="get" name="frmInfo">Please select the product you are interested in:<br><select name="selInformation">

<optgroup label="Hardware"><option value="Desktop">Desktop computers</option><option value="Laptop">Laptop computers</option>

</optgroup><optgroup label="Peripherals">

<option value="InputDevices">Input Devices</option><option value="Storage">Storage</option>

</optgroup></select><br><br><input type="submit" value="Submit"></form>

File Select BoxesINPUT element

TYPE = “file” creates a file uploadNAME=“name” is the name for the controlWhen you are using a file upload box, the method attribute of the <form> element must be post.

Hidden ControlsYou create a hidden control using the <input> element whose type attribute has a value of hidden.hidden control must carry name and value attributes.

<input type="submit" value="Click if this is your favorite page of our

site."></form>

Creating Labels for Controls and the <label> Element

Use the <label> tag to define relationships between a form control, such as a text input field.Labels get associated with a form control in one of two ways:

implicitly by including the form control as contents of the label tagexplicitly by naming the ID of the target form control in the <label> tag's FOR attribute.

</tr></table></form>

Structuring Your Forms with <fieldset> and <legend> Elements

The <fieldset> element creates a border around the group of form controls to show that they are related.

The <legend> element allows you to specify a caption for the <fieldset> element, which acts as a title for the group of form controls.

When used, the <legend> element should always be the first child of the <fieldset> element.

Structuring Your Forms with <fieldset> and <legend> Elements

<fieldset><legend>Contact Information</legend><label>First name:

<input type="text" name="txtFName“ size="20"></label><br><label>Last name:

<input type="text" name="txtLName“ size="20"></label><br><label>E-mail:

Tabbing OrderIf you want to control the order in which elements can gain focus you can use the tabindex attribute to give that element a number between 0 and 32767, which forms part of the tabbing order.

The following elements can carry a tabindex attribute:<a> <area> <button> <input> <object> <select> <textarea>

One<br><input type="checkbox" name="chkNumber" value="2" tabindex="2">

Two<br><input type="checkbox" name="chkNumber" value="3" tabindex="3">

Three<br><input type="checkbox" name="chkNumber" value="4" tabindex="4">

Four<br><input type="checkbox" name="chkNumber" value="5" tabindex="5">

Five<br><input type="submit" value="Submit"></form>

Access KeysThe access key is defined using the accesskey attribute. The value of this attribute is the character.

The following elements can carry an access key attribute:<a> <area> <button> <input> <label> <legend> <textarea>

<input type="checkbox" name="chkNumber" value="2" tabindex="2“ accesskey=“T”> Two

</form>

Disabled and Read-OnlyThe readonly attribute prevents users from changing the value of the form controlThe disabled attribute disables the form control so that users cannot alter it.

The following table indicates which form controls work with the readonly and disabled attributes.

ElementElement readonlreadonlyy

disabledisabledd

<textarea> Yes Yes

Yes Yes

No Yes

No Yes

No Yes

No Yes

No Yes

<select> No Yes

<option> No Yes

<button> No Yes

Multimedia Linking to Multimedia Files

1. Type <a href="multimedia.ext">, where multimedia.ext is the location, name, and extension of the multimedia file.

2. Type the text or insert an image that the visitor will click on to activate the link.

3. Type </a> to complete the link.

Example<a href=“sovat.mp3”>Preap Sowat</a>

MultimediaEmbedding Windows Media

00C04F79FAA6" width="320“ height="305"><param name="URL" value="pond.wmv"><param name="autoStart" value="true"><param name=“uiMode" value=“none"> <embed width="320" height="305“

src="pond.wmv" loop="false" autostart="true”></embed></object>

Multimedia

Embedding Flash<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/ pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" id="flash1" name="flash1“ width="320" height="240"> <param name="movie" value="button1.swf" > <param name="quality" value="high" > <embed src="test.swf“ id="flash1" name="flash1“ width="320"

height="240“ quality="autohigh" bgcolor="#ffffff" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">

</embed> </object>

Creating and Using Image Maps

To use the image map with an IMG elementInsert the USEMAP = “#name” attribute into the IMG elementname - value of the NAME attribute in the MAP element

Example. <IMG SRC = "deitel.gif" WIDTH = "200" HEIGHT="144"

BORDER="1" ALT = "Harvey and Paul Deitel" USEMAP = "#picture">

<map name=“picture" id=“picture"><area shape="rect" coords="6,50,140,143"

href="rectangle.html" alt="rectangle"><area shape="circle" coords="195,100,50" href="circle.html" alt="circle"></map>

Image maps Designate certain sections of an image as hotspots Use hotspots as anchors for linkingAll elements of image map inside <MAP>…</MAP> tags<MAP> tag requires NAME attribute

Ex. <MAP NAME = “picture”>

Hotspots designated with AREA elementAREA attributes:HREF sets the target for the link on that spotSHAPE and COORDS set the characteristics of the AREAALT provides alternate textual description

AREA element (continued)SHAPE = “rect”

Causes rectangular hotspot to be drawn around the coordinates given in the COORDS attributeCOORDS - pairs of numbers corresponding to the x and y axes

x axis extends horizontally from upper-left cornery axis extends vertically from upper-left corner

Ex. <AREA HREF = “form.html” SHAPE = “rect” COORDS = “3, 122, 73, 143” ALT = “Go to the form”>

Rectangular hotspot with upper-left corner of rectangle at (3, 122) and lower-right corner at (73, 143)

AREA element (continued)SHAPE = “poly”

Causes a hotspot to be created around specified coordinatesEx. <AREA HREF = “mailto:deitel@deitel.com” SHAPE = “poly” COORDS = “28, 22, 24, 68, 46, 114, 84, 111, 99, 56, 86, 13” ALT = “Email the Deitels”>

SHAPE = “circle” Creates a circular hotspotCoordinates of center of circle and radius of circle, in pixelsEx. <AREA HREF = “mailto:deitel@deitel.com” SHAPE = “circle” COORDS = “146, 66, 42” ALT = “Email the Deitels”>

Creates a scrolling text marquee

<marquee>text</marquee>Marquee attribute

align = top | middle | bottombehavior = alternate | scroll | sidebgcolor = colordirection = down \ left \ up \ rightheight = number; width = numberloop = numberscrollamount = number (Specifies the number of pixels moved each time the text scrolls)scrolldelay = number (delay in milliseconds between each movements of the scroll)

<META> Tags Meta data refers to data that is not part of the content of an HTML documentMeta data describes Web pages to search engines.Search engines use meta data to index and rank page hits in a given searchThe <META> tag declares meta data. It must be used in the <HEAD> section.

Example:<META NAME = “description” CONTENT = “Everything you

would want to know about using HTML”><META NAME = “keywords” CONTENT = “HTML 4.0, tags,

attributes, editors”>

<META> TagsMETA tags

Contain two attributes that should always be used:NAME identifies type of META tagCONTENT provides info the search engine will catalog about your site

CONTENT of a META tag with NAME = “keywords”Provides search engines with a list of words that describe key aspects of your site

CONTENT of a META tag with NAME = “description”

Should be 3 to 4 linesUsed by search engines to catalog and display your site

Thank you for your attention!

HTML. 2 World Wide Web WWW is a service internet The total set of interlinked hypertext documents residing on Web servers all around the world. Documents.

html slide

html introduction slide

text formatting slide

web page slide

html editor

html documents

html files

th slide

Documents

An Abstract Separation Logic for Interlinked Extensible...

Core Areas of a CA- Interlinked with computers

52233 - World Bank Documents

Interlinked Isohedral Tilings of 3D Space

Charging arrangements for interlinked offshore transmission....

World Architecture Festival Reveals Winner of Inaugural...

HTML – HyperText Markup Language. What is HTML ? the...

Milestones of Kock’s focused and interlinked research...

Interlinked Registries A proposed project leading to a...

Supporting Integrated Design through Interlinked Tools...

Fusion and Fission: Interlinked Processes Critical for...

IOSA Audit Handbook - Interlinked and Repeated ISARPs...

Interlinked Registries A proposed project roadmap leading to...

Financial stability and monetary policy: How closely...

The web of interlinked data and knowledge stripped

World Bank Document - World Bank Documents & Reports