• Increase font size
  • Decrease font size
  • Default font size

Stay connected with us!

Lesson 3 - Adding text and links

Attention: open in a new window. PDFPrint

If we're going to entice someone to rent our lake house, we better describe it! Let's add the following to our file, right after the

< h1 >New England Lake House For Rent< /h1 > line:

 

Enter this code
1
2
3
4
5
6
7
8
9
10
11
<p>
Picture yourself on your next vacation in a spacious 3-bedroom home on beautiful <a href="http://en.wikipedia.org/wiki/Lake_Winnisquam">Winnisquam Lake</a> in central New Hampshire's Lakes Region.
</p>
 
<p>
Whether your favorite season is Winter, Spring, Summer, or Fall, you'll be both right in the middle of the action and blissfully secluded on a private, wooded four-acre piece of paradise!
</p>
 
<p>
Call 603-555-5555 today to reserve heaven on earth!
</p>

 

 

Save your file and load it up in your browser and let's see what we have!

lesson03-screencap01

Well, that was perhaps a bit anti-climactic... We've got a website, but it's a little boring—more like a slightly dressed-up newspaper classified ad than a beautiful website showing off our rental property. But first things first, let's talk about what we did here.

The Header Level 1 < h1 >< /h1 > Tag

The header level 1 tag is a tag that, like most tags, consists of an opening tag, < h1 >, and a closing tag, < /h1 >. Header tags both affect the way text is displayed as well as signal to search engines that important text has been displayed. There are six levels of header tags, from H1 through H6, but you'll probably never use anything beyond H3. H4 through H6 actually produce text that is as small as—or smaller than—regular paragraph text! H1 is the most important tag and you should use it only once on your page. If you use it more often than that, search engines may decide you are "crying wolf" and penalize your ranking.

The Paragraph Tag < p >< /p >

The paragraph tag also consists of an opening and closing tag. Each paragraph in your text should be surrounded by paragraph tags. These tags help set off each paragraph by placing extra white space before and after the paragraph, like hitting an extra enter after the paragraph.

Link Tags < a ... >< /a >

If you forget to close your link tag, the link will just keep going forever and the rest of your page will be one big link!

Link tags are the most important part of the web—without them, we wouldn't have a web at all, just millions of individual web pages with no connections between them.

Link tags are constructed like this: < a href="/LINK GOES HERE" >LINK TEXT OR IMAGE< /a >

All links start with < a href="/, followed by either the name of the file to which you are linking, if it is on your website, or the full address of the web page to which you are linking, if it is on someone else's site. In our example above we are linking to the Wikipedia article on Winnisquam Lake. The opening link tag then ends with " > and your link content follows. Your link can be either text or an image. To get started we're just linking with text. All link tags must end with < /a >.

Let's Go!

Let's add some life to this site with Lesson 4 — Adding Images.



How to link to this page



To create a link to this page on your website,
copy and paste the code below to your webpage.




Here's how it will appear on your web page:
Lesson 3 - Adding text and links

Comments  

 
# missing codelaura 2011-06-20 07:56
what is the rest of the code missing on the right hand side of the yellow box? i tried to close the link tag using but the rest of the content is still showing up as one long link. even then the link doesn't direct me to wikipedia so something has gone wrong somewhere! please help if you can, thanx
Reply
 
 
# RE: Lesson 3 - Adding text and linkslaura 2011-06-20 08:32
i fixed it :lol: :D
Reply
 

Add comment


Security code
Refresh