HTML rel

Created By: chatGPT

In HTML, the rel attribute specifies the relationship between the current document and the linked resource. It is most commonly used within the <link> and <a> tags. Understanding how to effectively use this attribute is crucial for creating well-structured web pages.
<link rel="stylesheet" href="styles.css">
<a href="https://www.example.com" rel="nofollow">Visit Example</a>

Some of the most common values for the rel attribute include:

  • stylesheet: Specifies that the linked document is a stylesheet.
  • nofollow: Informs search engines not to follow the linked URL.
  • noopener: Improves security by preventing the new page from accessing the original page’s window object.
  • noreferrer: Prevents the browser from sending the HTTP referer header when navigating to the linked document.
<a href="https://www.example.com" rel="noopener noreferrer">Secure Link</a>
When you include the rel attribute in your links, it enhances the functionality and security of your website. It's important to use it correctly, especially when dealing with external links and resources.
<link rel="icon" href="favicon.ico">
<a href="https://www.example.com" rel="external">External Site</a>
Introduction And SetupHeadTitleMetaLinkStyleScriptBodyHeaderNavSectionArticleAsideFooterH1H2H3H4H5H6PBlockquoteOlUlLiAImgTableTrTdThCaptionFormInputTextareaButtonSelectOptionLabelFieldsetLegendCanvasSvgVideoAudioEmbedObjectIframeDivSpanStrongEmSmallSubSupMarkCiteDfnAbbrTimeDataVarCodeKbdSampQCiteRubyRbRtRtcRpBdiBdoWbrDatalistOutputProgressMeterDetailsSummaryTemplatePictureSourceTrackMeta CharsetMeta NameMeta ContentMeta ViewportMeta Http EquivLink RelLink HrefScript SrcScript AsyncStyle TypeBody OnloadIdClassStyleSrcHrefAltTitleValueNameTypePlaceholderDisabledReadonlyCheckedActionMethodForMaxlengthMinlengthAutocompleteTargetRelData *WidthHeightLangTabindexAria *DraggableHiddenAutofocusRequiredDownload