HTML content linking tips

Utilize bookmarks

Bookmark in content (Header)

This is Header Chapter 1

<h2 id="header-chapter-one">This is Header chapter 1</h2>

 

Go to Chapter 1

<a href="#header-chapter-one">Go to Header chapter 1</a>

or alternative with url address

<a href="21wiki.html#chapter-one">Jump to 21wiki.html part Chapter 1</a>

 

Tip: Utilize "-" as word separator in links, it helps better SEO

Do not use HeaderChapterOne or headerchapterone - tougher to read this text for Search Engine

Also do not use header_chapter_one - it is nonstandard for SEO

Dont use spaces like header chapter one - it causes errors

.

Use list too

<ul>

<li>Go to Chapter 1</li>

<li>Go to Chapter 2</li>

</ul>

 

like:

<ul>

<li><a href="#header-chapter-one">Go to Chapter 1</a></li>

<li><a href="#header-chapter-two">Go to Chapter 2</a></li>

</ul>

looks like

.

Hierarchic lists

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>

Looks like:

  • Coffee
  • Tea
    • Black tea
    • Green tea
  • Milk

Note: Description list (Not so used)

<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>

Looks like:

  
Coffee  
- black hot drink  
Milk  
- white cold drink

.

Alternative tags:

blockquote - different part of text with padding

This text is blockquote.

Comments

<!-- Write your comments here -->

Usefull links

  • Back to Page List Menu