170 likes | 518 Vues
Links in HTML. 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.
E N D
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.
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
What can be linked • Text • Images/Graphics/Pictures • Autoshapes • Buttons
The code… • <a href="url">Link text</a> • The start tag contains attributes about the link. • The element content (Link text) defines the part to be displayed. • Note: The element content doesn't have to be a text. You can link from an image or any other HTML element.
<A HREF="http://www.htmlgoodies.com">Click Here For HTML Goodies</A>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
Anchors • An anchor--used to define a hyperlink destination inside a document • Example idea for anchors: Named anchors are often used to create "table of contents" at the beginning of a large document. Each chapter within the document is given a named anchor, and links to each of these anchors are put at the top of the document.
Hyperlink, link tags • <BODY LINK=“color” VLINK=“color” ALINK=“color”> • Body link----original color • Vlink---------visited link • Alink---------Active link • Most web browsers have a standard default link for links (blue)
Link Attributes • Target attribute • defines where the linked document opens • If you set the target attribute of a link to "_blank", the link will open in a new window. Sample Text: <a href="http://www.w3schools.com/"target="_blank">Visit W3Schools!</a>
Link Attributes • name Attribute • When used, the <a> element defines a named anchor inside a HTML document • Named anchor syntax: <a name="label">Any content</a> • The link syntax to a named anchor <a href="#label">Any content</a>The # in the href attribute defines a link to a named anchor.
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
Home page • Clearly state what web site is about • Design navigation clear for user • How to move from one page to another should be obvious to user
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)