"HTML BASICS is The EASIEST to use and understand Web
Site building course on the Net!"
Previous Lessons
Lesson #1
HTML
Reference and Basic HTML
Lesson #2
Adding
Text to your Web Site
Lesson #3
Using
Colors in HTML
Lesson #4
Web
Site Structure
Lesson #5
Adding
Graphics to your web site
Lesson #6
Changing
Background Color
Lesson #7
Using
Graphics for Backgrounds
Lesson #8
Creating Hyperlinks
with Text and Graphics |
Lesson
# 8 : "Creating HTML Hyperlinks With Text and Graphics"
There are a several reasons why you would want
to create hyperlinks. There also a few different ways you can link. The
easiest way to demonstrate would be to show you link examples.
| HYPERLINKS
USING TEXT |
| 1) Linking to a Page
within your own site |
| Link Back to Lesson #7: HTML
Background Graphics
Source Code
<a href="htmlbackgroundgraphics.html">HTML Background
Graphics</a> |
| 2) Linking to External
Site |
| Example: www.externalharddrive.com
Source Code
<a href="http://www.externalharddrive.com">www.externalharddrive.com</a> |
| 3) Linking to a Image |
| HTML Basics
Box
Source Code
<a href="graphics/htmlbasicssmall.jpg" |
| 4) Linking to text
file |
| Text File Link
Source Code
<a href="textlinkexample.txt">Text File Link</a> |
| 5)Linking to Sound Files |
4 Examples
1) .wav
2) .mid
3) .mp3
4) .au
Source Code
1) <a href="sounds/musthaveprecious.wav">.wav</a>
2) <a href="sounds/chinese.mid">.mid</a>
3) <a href="sounds/top10-affair.mp3">.mp3</a>
4) <a href="sounds/doorbell.au">.au</a>
|
| 6)Linking
to A Target |
| Jump to target
Linking to a target is often used when you want
to jump to a specific section of a page.
To do this you insert a "Anchor Tag" where you
want them to jump to. Then you create a link to the target.
This is the Anchor
<a NAME="targetlink">
This is the Link
Jump to target
<a href="#targetlink">Jump to target</a> |
| 7) Link to Open/Send a Email |
| Using this link will open the site visitors email
program and have your email address ready for them to send. You can
even enter the Email Subject in thier email with this link
The Link
email
us
The Source
<a href="mailto:YOUREMAILADDRESS@YOURDOMAIN.COM?subject=SUBJECT
OF THE EMAIL">email us</a> |
| There are many other linking tricks like... open
a new browser window when clicked, hide address in the browser address
bar, and many more but...This is HTML Basics so I won't take this any further.
There is still a bit more BASIC HTML to learn. That being said... lets
look at linking with Images. |
| HYPERLINKS
USING GRAPHICS |
 <
Click The Smiley Image to see linking with a Graphic |
The Source
<a href="smileylink.html"><img
SRC="graphics/smiley.gif" BORDER=0 height=17 width=17></a> |
|