URI fragment

In computer hypertext, a URI fragment is a string of characters that refers to a resource that is subordinate to another, primary resource. The primary resource is identified by a Uniform Resource Identifier (URI), and the fragment identifier points to the subordinate resource.

The fragment identifier introduced by a hash mark # is the optional last part of a URL for a document. It is typically used to identify a portion of that document. The generic syntax is specified in [https://tools.ietf.org/html/rfc3986 RFC 3986].{{cite news |url=https://datatracker.ietf.org/doc/html/rfc3986#section-3.5 |title=RFC 3986 Uniform Resource Identifier (URI): Generic Syntax |publisher=Internet Engineering Task Force |date=January 2005 |access-date=2012-03-06}} The hash mark separator in URIs is not part of the fragment identifier.

Basics

In URIs, a hash mark # introduces the optional fragment near the end of the URL. The generic RFC 3986 syntax for URIs also allows an optional query part introduced by a question mark ?. In URIs with a query and a fragment, the fragment follows the query. Query parts depend on the URI scheme and are evaluated by the server—e.g., http: supports queries unlike ftp:. Fragments depend on the document MIME type and are evaluated by the client (web browser). Clients are not supposed to send URI fragments to servers when they retrieve a document.{{cite web

|title=Hypertext Transfer Protocol (HTTP/1.1): Message Syntax and Routing

|publisher=Internet Engineering Task Force (IETF)

|url=https://datatracker.ietf.org/doc/html/rfc7230#section-3.3.3

|author1=R. Fielding, Ed., Adobe

|author2=J. Reschke, Ed., greenbytes

|date=June 2014

|access-date=2023-12-27

|quote=The target URI excludes the reference's fragment component, if any, since fragment identifiers are reserved for client-side processing}}

A URI ending with # is permitted by the generic syntax and is a kind of empty fragment. In MIME document types such as text/html or any XML type, empty identifiers to match this syntactically legal construct are not permitted. Web browsers typically display the top of the document for an empty fragment.

The fragment identifier functions differently to the rest of the URI: its processing is exclusively client-sided with no participation from the web server, though the server typically helps to determine the MIME type, and the MIME type determines the processing of fragments. When an agent (such as a web browser) requests a web resource from a web server, the agent sends the URI to the server, but does not send the fragment. Instead, the agent waits for the server to send the resource, and then the agent processes the resource according to the document type and fragment value.{{cite web |url=http://www.w3.org/TR/webarch/#media-type-fragid |publisher=W3C |date=2004 |work=Architecture of the World Wide Web, Volume One |title=Representation types and fragment identifier semantics |access-date=2011-07-13}}

In an HTML web page, the agent will look for an anchor identified with an HTML tag that includes an id= or name= attribute equal to the fragment identifier.

Examples

In URIs for MIME text/html pages such as http://www.example.org/foo.html#bar the fragment refers to the element with id="bar".
Graphical Web browsers typically scroll to position pages so that the top of the element identified by the fragment id is aligned with the top of the viewport;{{Cite web |last=Coyier |first=Chris |date=2012-04-09 |orig-date=last updated Jan 13, 2022 |title=Using The CSS :target Selector |url=https://css-tricks.com/css-target/ |access-date=2024-10-07 |website=CSS-Tricks |language=en}} thus fragment identifiers are often used in tables of contents.
The appearance of the identified element can be changed through the :target CSS pseudoclass.{{Cite web |last=MDN contributors |date=August 8, 2024 |title=target |url=https://developer.mozilla.org/en-US/docs/Web/CSS/:target |access-date=2024-10-07 |website=CSS: Cascading Style Sheets |publisher=MDN |language=en-US}} Wikipedia uses this to highlight the selected reference. Notably CSS display: block can be used to show content only if it is the target, and otherwise hidden by display: none.
The name attribute of the element served the same purpose, but is now obsolete in favor of the id attribute, which can be applied to any element. {{cite web |url=https://html.spec.whatwg.org/multipage/obsolete.html#obsolete-but-conforming-features |work=HTML Living Standard |date=2024-08-07 |title=Obsolete features |publisher=WHATWG |access-date=2024-08-08}}
In all XML document types including XHTML fragments corresponding to an xml:id or similar id attributes follow the Name-syntax and begin with a letter, underscore, or colon. Notably they cannot begin with a digit or hyphen.{{cite web |url=http://www.w3.org/TR/REC-xml/#id |work=XML 1.0 (Fifth Edition) |date=2008 |title=Validity constraint: ID |publisher=W3C |access-date=2011-07-13}}
xml:id is one of the few generic XML attributes, e.g., xml:lang, which can be used without explicitly declaring a namespace.{{cite web |url=http://www.w3.org/TR/xml-id/ |publisher=W3C |date=2005 |title=xml:id Version 1.0 |access-date=2011-07-13}} In XHTML id can also be used and seems to be preferred,{{Cite web |date=16 December 2010 |orig-date=Copyright © 2001-2010 |editor-last=Birbeck |editor-first=Mark |editor2-last=Gylling |editor2-first=Markus |editor3-last=McCarron |editor3-first=Shane |editor4-last=Pemberton |editor4-first=Steven |title=12. XHTML Core Attributes Module : 12.1. Core Attribute Collection |url=https://www.w3.org/TR/xhtml2/mod-core.html#adef_core_id |access-date=2024-10-07 |website=XHTML™ 2.0 |publisher=World Wide Web Consortium (W3C) |type= |format=W3C Editor's Draft, part of W3C Working Group Note |display-editors=etal }}{{Cite web |date=6 May 2003 |editor-last=Axelsson |editor-first=Jonny |editor2-last=Epperson |editor2-first=Beth |editor3-last=Ishikawa |editor3-first=Masayasu |editor4-last=McCarron |editor4-first=Shane |editor5-last=Navarro |editor5-first=Ann |editor6-last=Pemberton |editor6-first=Steven |title=6. XHTML Attribute Collections : 6.1. Core Attribute Collection |url=https://www.w3.org/TR/2003/WD-xhtml2-20030506/mod-attribute-collections.html#adef_attribute-collections_id |access-date=2024-10-07 |website=XHTML™ 2.0 |publisher=World Wide Web Consortium (W3C) |format=W3C Working Draft}} because XHTML was specified before xml:id existed.
In XML applications, fragment identifiers in a certain syntax can be XPointers;{{Cite web |date=7 June 2000 |editor-last=Daniel |editor-first=Ron, Jr. |editor2-last=DeRose |editor2-first=Steve |editor3-last=Maler |editor3-first=Eve |title=XML Pointer Language (XPointer) Version 1.0 |url=https://www.w3.org/TR/2000/CR-xptr-20000607 |access-date=2024-10-07 |publisher=World Wide Web Consortium (W3C) |format=W3C Candidate Recommendation}}{{Cite web |last1=Møller |first1=Anders |last2=Schwartzbach |first2=Michael I. |date=October 2003 |orig-date=First published: March 2000 |title=XPointer fragment identifiers |url=https://cs.au.dk/~amoeller/XML/linking/fragment.html |access-date=2024-10-07 |website=XML tutorial : The XML Revolution : Technologies for the future Web |publisher=BRICS, Aarhus University |quote=NOTE: These slides have not been updated since 2003. They have been superseded by the book An Introduction to XML and Web Technologies Addison-Wesley, and the accompanying online material. Please see http://www.brics.dk/ixwt/ for more information.}} for example, the fragment identifier in the URI http://www.example.org/foo.xml#xpointer(//Rube) refers to all XML elements named "Rube" in the document identified by the URI http://www.example.org/foo.xml. An XPointer processor, given that URI, would obtain a representation of the document (such as by requesting it from the Internet) and would return a representation of the document's "Rube" elements.
In RDF vocabularies, such as RDFS, OWL, or SKOS, fragment identifiers are used to identify resources in the same XML Namespace, but are not necessarily corresponding to a specific part of a document. For example, http://www.w3.org/2004/02/skos/core#broader identifies the concept "broader" in SKOS Core vocabulary, but it does not refer to a specific part of the resource identified by http://www.w3.org/2004/02/skos/core, a complete RDF file in which semantics of this specific concept is declared, along with other concepts in the same vocabulary.
In URIs for MIME text/plain documents RFC 5147 specifies a fragment identifier for the character and line positions and ranges within the document using the keywords "char" and "line", and an integrity check can be added, either "length" or "md5".{{Cite report |url=https://datatracker.ietf.org/doc/html/rfc5147 |title=URI Fragment Identifiers for the text/plain Media Type |last1=Dürst |first1=Martin J. |last2=Wilde |first2=Erik |date=April 2008 |publisher=Internet Engineering Task Force |issue=RFC 5147 |doi=10.17487/RFC5147 |type=RFC - Proposed Standard |series=Network Working Group Request for Comments|url-access=subscription }} Browser support seems lacking.{{cite web |url=http://code.google.com/p/chromium/issues/detail?id=77024 |title=Issue 77024 |work=Chromium |date=2011 |access-date=2011-07-13}} The following example identifies lines 11 through 20 of a text document:
http://example.com/document.txt#line=10,20
In URIs for MIME text/csv documents, RFC 7111 specifies a fragment identifier as a selector for rows, columns, and cells using the keywords "row" , "col", and "cell",{{Cite report |url=https://datatracker.ietf.org/doc/html/rfc7111 |title=URI Fragment Identifiers for the text/csv Media Type |last1=Hausenblas |first1=Michael |last2=Wilde |first2=Erik |date=January 2014 |publisher=(Not endorsed by) the Internet Engineering Task Force |issue=RFC 7111 |doi=10.17487/RFC7111 |issn=2070-1721 |last3=Tennison |first3=Jeni |series=Independent Submission Request for Comments |type=RFC - Informational|url-access=subscription }} For example:
http://example.com/data.csv#row=4 – Selects the 4th row.
http://example.com/data.csv#col=2 – Selects 2nd column.
http://example.com/data.csv#row=5-7 – Selects three consecutive rows starting with 5th row.
http://example.com/data.csv#row=5-* – Selects all rows starting with 5th row.
http://example.com/data.csv#cell=4,1-6,2 – Selects a region that starts at the 4th row and the 1st column and ends at the 6th row and the 2nd column.
In URIs for MIME audio/*, image/*, video/* documents, very few have defined fragments or fragment semantics.{{cite web |url=http://www.w3.org/2008/WebVideo/Fragments/wiki/MediaTypeReview |title=Media Type Review |work=W3C Media Fragments Working Group |date=2009 |access-date=2009-04-29}} The Media Fragments URI 1.0 (basic) syntax supports addressing a media resource along two dimensions (temporal and spatial) using the keywords t and xywh, and Media Fragments 1.0 URI (advanced) adds track and id.{{Cite web |last1=Hausenblas |first1=Michael |last2=Jägenstedt |first2=Philip |last3=Jansen |first3=Jack |last4=Lafon |first4=Yves |last5=Parker |first5=Conrad |last6=Steiner |first6=Thomas |date=25 September 2012 |editor-last=Troncy |editor-first=Raphaël |editor2-last=Mannens |editor2-first=Erik |editor3-last=Pfeiffer |editor3-first=Silvia |editor4-last=Van Deursen |editor4-first=Davy |title=Media Fragments URI 1.0 (basic) |url=http://www.w3.org/TR/media-frags/ |publisher=W3C Media Fragments Working Group, World Wide Web Consortium |format=W3C Recommendation}} Therefore, one can use the following media fragments URI in the src attribute of the audio or video HTML5 element:
http://example.com/foo.mp4#t=10,20 (this indicates the time interval starting at 10 seconds and ending before 20 seconds)
http://example.com/bar.webm#t=40,80&xywh=160,120,320,240
The specification also allows for specifying hours, minutes (must be 2 digits), and seconds (must be 2 digits) using colons, and milliseconds using a decimal point. Other time schemes may also be able to be specified through prefixes, with npt: (Normal Play Time) being the default.
Other websites use the fragment part to pass some extra information to scripts running on them – for example, Google Video understands permalinks in the format of #01h25m30s to start playing at the specified position,{{cite web |url=http://googlevideo.blogspot.com/2006/07/new-feature-link-within-video_19.html |title=New Feature: Link within a Video |date=2006-07-19 |access-date=2011-07-13}} and YouTube uses similar code such as #t=3m25s.{{Cite web |url=http://youtube-global.blogspot.com/2008/10/link-to-best-parts-in-your-videos.html |title=Link To The Best Parts In Your Videos |publisher=YouTube |date=2008-10-30 |access-date=2011-07-13}}
In JavaScript, the fragment identifier of the current HTML or XHTML page can be accessed in the "hash" property location.hash{{Cite web |last=MDN contributors |date=July 18, 2024 |title=Location: hash property |url=https://developer.mozilla.org/en-US/docs/Web/API/Location/hash |access-date=2024-10-07 |website=Web APIs |publisher=MDN |language=en-US |department=}} – JavaScript can be also used with other document types. With the rise of AJAX, some websites use fragment identifiers to emulate the back button behavior of browsers for page changes that do not require a reload, or to emulate subpages.
For example, Gmail uses a single URL for almost every interface – mail boxes, individual mails, search results, settings – the fragment is used to make these interfaces directly linkable.[http://blogoscoped.com/archive/2007-11-17-n25.html Link to Specific Content in Gmail], Google Blogoscoped, 2007-11-17
Adobe Flash websites can use the fragment part to inform the user about the state of the website or web application, and to facilitate deep linking, commonly with the help of the SWFAddress JavaScript library.
A URI that links to a JSON document can specify a pointer to a specific value.{{cite news |last1=Bryan |first1=P |title=RFC 6901 – JavaScript Object Notation (JSON) Pointer |date=2 April 2013 |url=https://datatracker.ietf.org/doc/html/rfc6901#section-6 |publisher=The Internet Society |access-date=14 July 2022}}
For example, a URL ending in #/foo could be used to extract the value from a key-value pair in a document beginning with { "foo": ["bar", "baz"], ... }
{{anchor|pdf-fragment}}In URIs for MIME application/pdf documents PDF viewers recognize a number of fragment identifiers.{{cite web |url=https://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf#page=7 |title=Parameters for Opening PDF Files – Specifying parameters in a URL |publisher=Adobe |date=April 2007 |access-date=2017-09-20}}{{cite journal |url=https://tools.ietf.org/html/rfc3778#section-3 |website=tools.ietf.org |title=RFC 3778 – The application/pdf Media Type |publisher=The Internet Society |date=May 2004 |doi=10.17487/RFC3778 |access-date=2017-09-20|last1=Taft |first1=E. |last2=Pravetz |first2=J. |last3=Zilles |first3=S. |last4=Masinter |first4=L. |url-access=subscription }} For instance, a URL ending in .pdf#page=35 will cause most readers to open the PDF and scroll to page 35. Several other parameters are possible, including #nameddest= (similar to HTML anchors), #search="word1 word2", #zoom=, etc. Multiple parameters can be combined with ampersands:
http://example.org/doc.pdf#view=fitb&nameddest=Chapter3.
In SVG, fragments are allowed to specify arguments such as viewBox(), preserveAspectRatio(), and transform().{{Cite web | url=http://www.w3.org/TR/SVG11/linking.html#SVGFragmentIdentifiers |title = Linking – SVG 1.1 (Second Edition)}}

Proposals

Several proposals have been made for fragment identifiers for use with plain text documents (which cannot store anchor metadata), or to refer to locations within HTML documents in which the author has not used anchor tags:

As of September 2012 the Media Fragments URI 1.0 (basic) is a W3C Recommendation.{{cite web |url=http://www.w3.org/TR/media-frags/ |title=Media Fragments URI 1.0 (basic) W3C Recommendation |access-date=2012-09-25}}
{{Anchor|Text fragment}}Chrome versions 80 and above{{cite web |url=https://chromestatus.com/feature/4733392803332096 |title=Scroll to Text Fragment |website=Chrome Platform Status |publisher=Google Chrome |access-date=2020-05-18|language=en}}{{Cite web|last=Kelly|first=Gordon|title=Google Chrome 80 Released With Controversial Deep Linking Upgrade|url=https://www.forbes.com/sites/gordonkelly/2020/02/23/google-chrome-80-upgrade-deep-linking-update-chrome-browser/|access-date=2020-06-04|website=Forbes|language=en}} and Firefox versions 131 and above{{cite web |title=Firefox 131.0 Release Notes |url=https://www.mozilla.org/en-US/firefox/131.0/releasenotes/#:~:text=Firefox%20now%20supports%20text%20fragments |website=mozilla.org |access-date=12 November 2024}} implement W3C's WICG Text Fragments,{{cite web |url=https://github.com/WICG/scroll-to-text-fragment|title=WICG/scroll-to-text-fragment: Proposal to allow specifying a text snippet in a URL fragment

|website=GitHub |publisher=WebPlatform.org Incubator Community Group at W3C |access-date=2020-05-18|language=en}} so #:~:text=foo will cause the browser to search for foo, highlight the matching text, and scroll to it. Besides the start and end, the snippet can also specify a context: text that must precede or follow foo but will not be highlighted (example that uses #:~:text=night-,vision to find 'vision' preceded by 'night'{{bots|optout=anchor-fixing}}).

The Python Package Index appends the MD5 hash of a file to the URL as a fragment identifier.{{cite web |url=https://pypi.python.org/pypi/minitage.recipe.egg/1.41#pypi-md5-check-support |title=Pypi md5 check support |quote=Pypi has the habit to append an md5 fragment to its egg urls, we'll use it to check the already present distribution files in the cache |access-date=2011-07-13}} If MD5 were unbroken (it is a broken hash function), it could be used to ensure the integrity of the package.
: https://pypi.python.org ... zodbbrowser-0.3.1.tar.gz#md5=38dc89f294b24691d3f0d893ed3c119c
{{anchors|hash-bang}} A hash-bang{{cite web |url=https://www.w3.org/blog/2011/hash-uris/ |title=Hash URIs |date=2011-05-12 |work=W3C Blog |access-date=2011-07-13}} fragment is a fragment starting with an exclamation mark !. It was used in a now-deprecated approach to index dynamic single-page applications. An exclamation mark is illegal in HTML4, XHTML, and XML identifiers, granting certain degree of separation from that functionality. However, it is allowed in HTML5.{{Cite web|url=https://www.w3.org/TR/html51/dom.html#the-id-attribute |title=HTML 5.1 2nd Edition |date=2017 |publisher=W3C |access-date=2018-08-03}}
Between 2009 and 2015, Google Webmaster Central proposed and then recommended an "AJAX crawling scheme"{{cite web |url=http://googlewebmastercentral.blogspot.com/2009/10/proposal-for-making-ajax-crawlable.html |title=Proposal for making AJAX crawlable |date=2009-10-07 |access-date=2011-07-13}}{{cite web |url=https://developers.google.com/webmasters/ajax-crawling/ |title=(Specifications) Making AJAX Applications Crawlable |publisher=Google Inc. |access-date=2013-05-04}} using an initial exclamation mark in fragment identifiers for stateful AJAX pages: {{Clear}} http://example.com/page?query#!state
Another implementation has been the replacement of #! with ?_escaped_fragment_=
Hash-bang URIs have been considered problematic by a number of writers including Jeni Tennison at the W3C because they make pages inaccessible to those who do not have JavaScript activated in their browser. They also break HTTP referer headers as browsers are not allowed to send the fragment identifier in the Referer header.
In 2015, Google deprecated their hash-bang AJAX crawling proposal, recommending instead the use of progressive enhancement and HTML5's history.pushState(){{Cite web |url=https://developer.mozilla.org/en-US/docs/Web/API/History_API|title=Manipulating the browser history |website=Mozilla Developer Network |language=en-US |access-date=2017-02-23}} method.{{Cite news |url=https://webmasters.googleblog.com/2015/10/deprecating-our-ajax-crawling-scheme.html |title=Deprecating our AJAX crawling scheme |newspaper=Official Google Webmaster Central Blog |access-date=2017-02-23 |language=en-US}}
Mozilla Foundation employee Gervase Markham has proposed a fragment identifier for searching, of the form #!s!search terms. Adding a number after the s (#!s10!) indicates that the browser should search for the nth occurrence of the search term. A negative number (#!s-3!) starts searching backwards from the end of the document. A Greasemonkey script is available to add this functionality to compatible browsers.[http://www.gerv.net/software/fragment-search/ Fragment Search], gerv.net
: http://example.com/index.html#!s3!search terms
Erik Wilde and Marcel Baschnagel of the ETH Zurich extend this to also identify fragments in plain text documents using regular expressions, with the keyword "match".Fragment identifiers for plain text files, Erik Wilde and Marcel Baschnagel, Swiss Federal Institute of Technology (ETH Zürich), Proceedings of the sixteenth ACM conference on Hypertext and hypermedia {{doi|10.1145/1083356.1083398}} They also describe a prototype implementation as an extension for the Firefox browser. For example, the following would find the case-insensitive text "RFC" anywhere in the document:
: http://example.com/document.txt#match=[rR][fF][cC]
K. Yee of the Foresight Institute proposes "extended fragment identifiers" delimited with colons and a keyword to differentiate them from anchor identifiers. A text search fragment identifier with "fragment specification scheme" id "words" is the first proposal in this scheme.[http://zesty.ca/crit/draft-yee-url-textsearch-00.txt Text-Search Fragment Identifiers], K. Yee, Network Working Group, Foresight Institute, March 1998 The following example would search a document for the first occurrence of the string "some context for a search term" and then highlight the words "search term":
: http://example.com/index.html#:words:some-context-for-a-(search-term)
The above scheme was implemented in Chrome version 80.{{cite web |author1=bmcquade |author2=bokan |author3=nburris |title=Feature: Scroll to Text Fragment |url=https://chromestatus.com/feature/4733392803332096 |website=Chrome Platform Status |publisher=chromium.org |access-date=3 May 2022 |date=2022-03-24}}
The LiveURLs project[http://liveurls.mozdev.org/index.html LiveURLs project] proposed a fragment identifier format for referring to a region of text within a page, of the form #FWS+C, where F is the length of the first word (up to five characters), W is the first word itself, S is the length of the selected text and C is a 32-bit CRC of the selected text.[http://liveurls.mozdev.org/tech.html The technology behind LiveURLs], accessed 2011-03-13 They implemented a variant of this scheme as an extension for the Firefox browser,[https://addons.mozilla.org/en-us/firefox/addon/web-marker/ "Web Marker" Firefox add-on], accessed 2011-03-13 using the form #LFWS+C, where L is the length of the fragment itself, in two hex digits. Linking to the word "Fragment" using the implemented variant would yield:
: http://example.com/index.html#115Fragm8+-52f89c4c
Up until Firefox 5, Firefox supported XPath links such as #xpath:/html/body/div[3] which could be used in conjunction with a bookmarklet such as http://antimatter15.com/wp/2009/11/xpath-bookmark-bookmarklet/ to link within HTML documents that lacked proper IDs. This feature was removed as part of a code cleanup in https://bugzilla.mozilla.org/show_bug.cgi?id=457102
In ePub electronic book format, the EPUB Canonical Fragment Identifier (epubcfi,{{Cite web|title=EPUB Canonical Fragment Identifiers 1.1|url=http://idpf.org/epub/linking/cfi/epub-cfi.html|access-date=2020-06-03|website=idpf.org}} 2011-2017) defines a W3C/IDPF-standardized method for referencing arbitrary content using fragment identifiers to locate non-anchored text ranges via document structure and pattern matching. These dynamic deep links assist in locating content after text is updated and are used, for example, in Apple Books.

References

External links

W3C [http://www.w3.org/2008/WebVideo/Fragments/ Media Fragments] Working Group, establishing a URI syntax and semantics to address media fragments in audiovisual material (such as a region in an image or a sub-clip of a video)
MediaMixer [https://web.archive.org/web/20170417192149/http://community.mediamixer.eu/ Community Portal] collects presentations, tutorials, use cases and demonstrators related to use of Media Fragment technology

Category:URI schemes

Category:Identifiers

Category:Hypertext