Presentation is loading. Please wait.

Presentation is loading. Please wait.

Links in HTML What you need to know….. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another.

Similar presentations


Presentation on theme: "Links in HTML What you need to know….. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another."— Presentation transcript:

1 Links in HTML What you need to know….

2 Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another web page on the same server or to a server located anywhere in the world. Hyperlinks can point to any resource on the web: an HTML page, an image, a sound file, a movie, etc.

3 Types of Links Linking within a web page Used with large web pages Moves from top to bottom of page or a specific section Linking to another web page Connects one web page to another web page on the same site (forward/back) Linking to another web site Links site to another site Linking to email Starts new email message to address in link

4 What can be linked Text Images/Graphics/Pictures Autoshapes Buttons

5 The code… Link text The start tag contains attributes about the link. The element content (Link text) defines the part to be displayed on a web site Note: The element content doesn't have to be a text. You can link from an image or any other HTML element.

6 Click Here For HTML Goodies Here's What's Happening A stands for Anchor begins link to another page HREF stands for Hypertext REFerence short way to say to browser-- "This is where the link is going to go." http://www.htmlgoodies.com FULL ADDRESS of link Notice equal sign in front of it and is enclosed in quotes--Why? Because it's an attribute of the Anchor tag, a command inside of a command Where it reads "Click Here For HTML Goodies“ text you want to appear on the page /A ends the entire link command. Here's what will appear on the page using the command above... Click Here For HTML Goodies Click Here For HTML Goodies

7 Anchors An anchor--used to define a hyperlink destination inside a document Example idea for anchors: To create "table of contents" at the beginning of a large document Back to Top links for a long web page

8 Color in Links link - standard link - to a page the visitor hasn't been to yet. (standard color blue - #0000FF). vlink - visited link - to a page the visitor has been to before. (standard color purple - #800080). alink - active link - the color of the link when the mouse is on it. (standard color is red - #FF0000).

9 Link Attributes Target attribute: defines where the linked document opens By default, links will open in the current window or frame Predefined targets are: _blank loads the page into a new browser window _self loads the page into the current window _parent loads the page into the frame that is superior to the frame the hyperlink is in _top cancels all frames, and loads in full browser window. Sample Text: Visit W3Schools! http://www.w3schools.com/

10 Link Attributes name Attribute defines a named anchor inside a HTML document Named anchor Any content Link to a named anchor Any content # defines a link to a named anchor inside a HTML document

11 Home page The home page--main page of a web site MUST be saved as index.html inside a folder created for website Visitors to a web site normally see this page first On a home page it is important to identify the purpose of your web site

12 Home Page Characteristics Clearly state what web site is about Keep it Simple Appearance of page should GRAB the user to want to stay on your site No distractions from the meaning of the site Free of spelling/grammar errors Design navigation clear for user

13 Hotspot A hotspot is an area of text or an image in which the mouse pointer changes when it is moved over the area. When the pointer changes this tells the user that there is a link Text links are generally underlined and in a different color font than the rest of the web page (normally blue)

14 How much do you know… Now that you are finished, visit http://www.echoecho.com/html.htm http://www.echoecho.com/html.htm Click on the HTML LINKS section Read through each section skipping these: ADVANCED TEXT LINKS IMAGE MAPPING Links in Framesets Take the Quiz at the end of the Tutorial


Download ppt "Links in HTML What you need to know….. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another."

Similar presentations


Ads by Google