URI Fragment Identifiers



#Fragment

Some URIs refer to a location within a resource. This kind of URI ends with a number sign (#) followed by an anchor identifier (called the Fragment Identifier).

Fragment Identifiers (also known as: Fragment IDs, Anchor Identifiers, Named Anchors) are strongly suggested for usability and accessibility purposes. Using Fragment IDs allows you to put visitors directly at a specific section or reference point within a document. This is an excellent usability feature for glossaries, FAQs, and other content rich documents.

Note: There can only be one instance of an ID on a page which means only one instance of a fragment identifier. Be sure that duplication of IDs does not occur within your documents. Use the W3C Markup Validation Service to check for duplicate ID references and other HTML, XHTML, CSS Elements and Attributes that may be malformed and/or use improper syntax.

Named Anchors (<a name="">) are deprecated in XHTML 1.0, the ID attribute is the suggested replacement. XHTML Appendix A Compatibility Guidelines state this...

DO NOT use the name attribute to identify elements, even in languages that permit the use of name such as XHTML 1.0.

Back to Previous

Examples of Fragment ID Syntax
<h2 id="Examples">

Fragment Identifiers ARE case sensitive. Fragment IDs are client-side only and are ARE NOT dereferenced by user agents. Read Page Fragment Navigation in Mini Sitelinks at WebmasterWorld.

Fragment identifiers have a special role in information retrieval systems as the primary form of client-side indirect referencing, allowing an author to specifically identify aspects of an existing resource that are only indirectly provided by the resource owner.

As such, the fragment identifier is not used in the scheme-specific processing of a URI; instead, the fragment identifier is separated from the rest of the URI prior to a dereference, and thus the identifying information within the fragment itself is dereferenced solely by the user agent, regardless of the URI scheme.

Although this separate handling is often perceived to be a loss of information, particularly for accurate redirection of references as resources move over time, it also serves to prevent information providers from denying reference authors the right to refer to information within a resource selectively. Indirect referencing also provides additional flexibility and extensibility to systems that use URIs, as new media types are easier to define and deploy than new schemes of identification.

Back to Previous

Fragment Identifier Usage
<h2 id="Fragment-Identfier-Usage">

How do we use the fragment ID in our everyday Webmastering roles? For starters, almost every single <h2> thru <h6> element we write these days has a fragment identifier associated with it. We like specificity and will put visitors right at the sections they need to be through the use of IDs. Fragment identifiers can be assigned to all HTML 4 Elements.

For example, the ID assigned to the <h2> that precedes this paragraph is id="Fragment-Identfier-Usage". We like to use the Pascal Casing method of identifying fragments in URIs. Remember, fragment identifiers ARE case sensitive and are ARE NOT dereferenced by user agents.

Back to Previous

Finding Fragment Identifiers
<h2 id="Finding-Fragment-Identifiers">

View Selection Source Finding fragment IDs can be a daunting task if Webmasters are not using them to their advantage. The quickest way using the Firefox browser is through a right click function (see example at right of View Selection Source) after selecting the block of text you wish to inspect for fragments.

Select the area you want to provide a direct link to and look for fragment IDs in this order...

  1. Assigned to an <h> element (or semantically correct element) that precedes the area you want to link to. This is absolutely the best method of linking to a specific reference point. If a web page is constructed properly using semantically rich HTML, it usually makes the tasks of other Webmasters that much easier. In this instance, I can put the visitor directly at the beginning of the content I want them to see.

    <h2 id="Finding-Fragment-Identifiers">Finding Fragment Identifiers

    After using the View Selection Source option from the right click menu in Firefox, I find the above fragment ID assigned to the <h2> element that precedes the content I want to link to. I take the above ID and append it to the URI. In this instance, it would look like this...

    http://www.seoconsultants.com/html/fragment/#Finding-Fragment-Identifiers

    Note: Fragment identifiers ARE case sensitive and are ARE NOT dereferenced by user agents.

  2. Assigned to any element within the block of text you want to link to. Be careful with this method as it will put the visitor right at the exact line where the ID is assigned. While not the most optimal solution, at least it puts the visitor closer to the targeted destination.
  3. Assigned to any element within the general area of the block of text you want to link to. Be careful with this method also as it may put the user out of viewport range and this could cause a bit of confusion. I usually don't recommend this method and will just link to the page directly and let the visitor locate the specific references.
Back to Previous

References and Discussion about the Fragment Identifier
<h2 id="References">

Back to Previous

 


SEO Consultants Directory