Menu
I am a bit confused about the behavior of <link rel="alternate" ...> in browsers and i am looking for some clarification. Let's use the following code for illustration:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="a.css" type="text/css"
title="Main Stylesheet">
<link rel="alternate stylesheet" href="b.css" type="text/css"
title="Alternative Stylesheet">
<link rel="alternate" href="fr.pdf" hreflang="fr" type="application/pdf"
title="Alternative document in French">
</head>
<body>
</body>
</html>
When this code runs in a modern browser (e.g. Firefox v27.01), the browser parses the above HTML document and then downloads the stylesheets, a.css and b.css. The former is used to apply the style to the document. However, b.css is available through the 'View > Page Style' menu of the said browser. So, clearly the parser in Firefox is able to recognize the "alternative" stylesheet and in this case decided to download it.
One can read at W3C > HTML5 > 4.8.4.1 that the outcome of parsing those <link>s are basically hyperlinks referencing the respective document. In the case of stylesheet, the browser is smart enough to download it as well. But, for the other alternate document (fr.pdf) in our example, it looks like Firefox does not download it and if it links it, it is not visible anywhere. I tested in Chrome (v.33.0.1750.117), Opera (v.19.0.1326.63), IE (v.10.0.9200.16798) and could observe same thing (i.e. no visible artifact that the fr.pdf has been linked). So, as all those modern browsers behave like this, it looks like I have misunderstood the meaning of "alternate" relationships:) Would someone have an explanation for me of how they are intended to be used? My belief is that in a RESTful manner, user-agents should be able to (hyper)link all the <link>s in order to navigate that web.
Thanks in advance.
690
link rel="alternate" media. Mobile attribute implementation. The rel="alternate" media attribute, mobile attribute for short, is used to indicate a relation between a desktop and a mobile website to search engines. Using the mobile attribute is only necessary if you have a separate desktop and mobile website.
The rel attribute defines the relationship between a linked resource and the current document.
rel is short for relation. It specifies the relation between the tag and href . href stands for hypertext reference. It's the source of the file used by the tag.
The rel attribute specifies the relationship between the current document and the linked document. Only used if the href attribute is present. Tip: Search engines can use this attribute to get more information about a link!
The <link> element does indeed identify external documents that are related to the current document. And the rel attribute specifies the nature of that relationship. In the specific case of rel="alternate stylesheet" (some) browsers can do something specific with the link. In particular, Firefox and Opera give the user a chance to select this "alternate" stylesheet from the application's menu. See, e.g., the screen shot
from this article.
In order to apply that style sheet, the browser needs to download it.
In the more general case of rel="alternate" (not a stylesheet), then the browser won't know anything useful to do with the related link. Therefore, as far as the browser is concerned, there's no need to download it.
158
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
