Your SlideShare is downloading. ×
0
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Linking overview june 2010
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Linking overview june 2010

938

Published on

Creating links within a web page using standard HTML.

Creating links within a web page using standard HTML.

Published in: Technology, Self Improvement
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
938
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Linking Between web pages and image files
  • 2. Absolute vs Relative URL <ul><li>Absolute URL </li></ul><ul><li>For example, to get the page about hyperlinks on Wikipedia you might type in the URL: </li></ul><ul><ul><li>http://en.wikipedia.org/wiki/Hyperlink </li></ul></ul><ul><li>An absolute URL like this one contains everything you need to uniquely identify a particular file on the Internet. </li></ul><ul><ul><li>http://www.exampleNewsSite.com/Entertainment/TV/index.html </li></ul></ul><ul><ul><li>http://www.exampleNewsSite.com/Entertainment/Arts/index.html </li></ul></ul><ul><ul><li>http://www.exampleNewsSite.com/Entertainment/Music/index.html </li></ul></ul>
  • 3. Absolute vs Relative URL <ul><li>Relative URL </li></ul><ul><li>A relative URL indicates where the resource is in relation to the current page. </li></ul><ul><li>http :// www.eonline.com/  absolute URL </li></ul><ul><li>Rather than including the full URL for each page, you can use a relative URL . For example: </li></ul><ul><ul><li>fashion/fashionpolice/ </li></ul></ul><ul><ul><li>uberblog/the_soup/ </li></ul></ul><ul><li>As I am sure you agree, this is a lot quicker than having to write out the following: </li></ul><ul><ul><li>http://www.eonline.com / fashion /fashionpolice / </li></ul></ul><ul><ul><li>http://www.eonline.com/ uberblog/the_soup/index.html </li></ul></ul>
  • 4. Linking Definition of Root Jen’s Kitchen Web Site Root (Starting Folder) http://www.jenskitchen.com/ jenskitchen index.html about.html
  • 5. Linking To place a link on the index.html page that links to about.html <ul><li>Relative Link - almost always the best to use: <a href=&quot;about.html&quot;>About Jen's Kitchen</a> </li></ul><ul><li>Absolute Link: <a href=&quot; http://www.jenskitchen.com/ about.html&quot;>About Jen's Kitchen</a> </li></ul>jenskitchen index.html about.html
  • 6. Linking Linking to a lower directory <ul><li>To place a link on the index.html that links to salmon.html </li></ul><ul><li><a href=&quot;recipes/salmon.html&quot;>Jen's Salmon Recipes</a> </li></ul>jenskitchen recipes index.html about.html salmon.html topenade.html
  • 7. Linking Linking 2 directories down <ul><li>To place a link on the index.html that links to couscous.html. </li></ul><ul><li><a href=&quot;recipes/pasta/couscous.html&quot;>Jen's Couscous Recipes</a> </li></ul>recipes pasta couscous.html linguine.html jenskitchen index.html about.html salmon.html topenade.html
  • 8. Linking Linking to a higher directory <ul><li>To place a link on the salmon.html that links to index.html. <a href=&quot;../index.html&quot;>Jen's Kitchen Home Page</a> </li></ul>jenskitchen recipes index.html about.html salmon.html topenade.html
  • 9. Linking Linking 2 directories higher <ul><li>To place a link on the couscous.html page that links to index.html. </li></ul><ul><li><a href=&quot;../../index.html&quot;>Jen's Kitchen Home Page</a> </li></ul>recipes pasta couscous.html linguine.html jenskitchen index.html about.html salmon.html topenade.html
  • 10. Linking Site Root Relative Pathnames <ul><li>To place a link on the index.html that links to salmon.html. </li></ul><ul><li>a href=&quot;/recipes/salmon.html&quot;>Jen's Salmon Recipes</a> </li></ul>jenskitchen recipes / index.html about.html salmon.html topenade.html
  • 11. Linking Same Pattern for Images <ul><li>To place a link on salmon.html that links to logo.png. </li></ul><ul><li><a href=&quot;../images/logo.png&quot;>Jen's Salmon Recipes</a> </li></ul>jenskitchen recipes salmon.html / images logo.png
  • 12. Linking Targeting a New Browser Window <ul><li>Creating a link that opens in a new browser window. </li></ul><ul><li><a href=&quot; http:// www.google.com &quot; target=&quot;_blank&quot; > The Google Web Site </a> </li></ul><ul><li>Value Description </li></ul><ul><li>_blank Open the linked document in a new window </li></ul><ul><li>_self Open the linked document in the same frame as it was clicked (this is default) </li></ul><ul><li>_parent Open the linked document in the parent frameset </li></ul><ul><li>_top Open the linked document in the full body of the window </li></ul>
  • 13. Linking To a specific point on a page <ul><li>Name the Destination <h1 id=&quot;top&quot; >This is the text on the page</h1> </li></ul><ul><li>To link to the Destination <a href=&quot;#top&quot;> Go to the Top </a> </li></ul>
  • 14. Mail Links <ul><li><a href=&quot; mailto:mfcarter2@gmail.com &quot;> Contact Mark </a> </li></ul><ul><li>Encryption of mailto: </li></ul><ul><ul><li>http://www.katpatuka.org/pub/doc/anti-spam.html </li></ul></ul><ul><ul><li>http://jumk.de/nospam/stopspam.html </li></ul></ul>

×