Cecelia_Salas_ATag_Presentation
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Cecelia_Salas_ATag_Presentation

on

  • 784 views

 

Statistics

Views

Total Views
784
Views on SlideShare
784
Embed Views
0

Actions

Likes
0
Downloads
4
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Cecelia_Salas_ATag_Presentation Presentation Transcript

  • 1. What is the <a> tag?
    • It defines a hyperlink, linking one page to another.
    • To create this link, the attribute href needs to follow the “a” tag.
    • The href indicates the destination of the link. It is the URL.
  • 2. What will your links look like?
    • An unvisited link will be underlined and blue, looking like this:
    • A visited link will also be underlined and will be purple, looking like this:
    Yahoo! Yahoo!
  • 3.
    • An active link will be underlined and will be red, looking like this:
    • These three link styles will be the same in all browsers by default.
    • The styles can be changed with CSS, like color.
    Yahoo!
  • 4. HTML 4.01 vs. HTML5
    • The <a> tag in HTML 4.01 was used as either a hyperlink or an anchor, a way to pinpoint readers to a specific part of a web page, like a special shortcut.
    • In HTML5, it will always be a hyperlink.
  • 5. How to create your hyperlink
    • You MUST make sure you have the href attribute after your “a”.
      • <a href =”http://www.yahoo.com”></a>
    • Make sure there is a space between the two.
      • < a href =”http://www.yahoo.com”></a>
  • 6.
    • After the href attribute, an “=” sign needs to go into place.
      • <a href = ”http://www.yahoo.com”></a>
    • Next, you put your destination page between quotes.
      • <a href= ”http://www.yahoo.com” ></a>
  • 7.
    • DON'T forget to put http:// before your destination.
      • <a href=” http:// www.yahoo.com”></a>
    • Make sure you close your bracket and close your tag, like so:
      • <a href=”http://www.yahoo.com” ></a>
  • 8.
    • Now, you add the text that will be seen on your page as the link to your destination, like so:
      • <a href=” http://www.yahoo.com ”> Yahoo! </a>
    • It does not need to be one word. It can be a sentence if you'd like. You can use spaces in this area.
  • 9. Placement in your code
    • In your code, the <a> tag will be put inside your body. For example:
    • <!DOCTYPE html>
    • <head>
    • </head>
    • <body>
    • Check out <a href=“ http://www.yahoo.com ”>Yahoo!</a> for local news.
    • </body></html>
  • 10. What it will look like and other attributes
    • On your web page, this is what would be seen:
    • It will now be clickable, and will take you to your destination.
    Attribute Value Description charset char_encoding Not supported in HTML5 coords coordinates Not supported in HTML5 href URL Specifies URL to go to hreflang language_code Specifies language of link media media_query Specifies what media link is optimized for name section_name Not supported in HTML5 rel alternate, author, bookmark, help, license, next, nofollow, noreferrer, prefetch, prev, search, tag Specifies relationship between current and linked rev text Not supported in HTML5 shape default, rect, circle, poly Not supported in HTML5 target _blank, _parent, _self, _top, framename Specifies where to open link type MIME_type Specifies the MIME type Check out Yahoo! for local news.