A href html attributes. Href - required attribute of any hyperlink tag

Html link is one of the basic concepts in creating html documents. Every Internet user has used them at least once. Each time you click on the Internet to enter, view, read, in more detail, follow the news and so on, you use the links! The pages you go to can be on completely different sites.
The link is usually highlighted with an underscore and blue. However, links in other colors, images, and site areas can be used as links.

Go to Yandex

As a result, we get

Title attribute

Title attribute serves to pop up a hint when you hover over a link. V title attribute the text of the hint or explanation is prescribed accordingly

When you hover over the link, the message "Link to Yandex" will be displayed.

Charset attribute

Charset attribute serves to send information to the browser that the link site was created in a different encoding. This action will avoid incorrect display of symbols during the transition.

Website in utf-8 encoding

Thank you for the attention! The lesson is very important! Using links is the backbone! Good luck!

Description

HTML tag defines a hyperlink (also known simply as a "link") that is used to navigate from one page to another. The text content of the tag acts as the title of the link. Externally, the link is easy to distinguish from ordinary text, since by default it is displayed as underlined text, and when you hover the mouse cursor over it, it takes the form of a hand with an index finger, as if showing that this text is active and you can click on it with LMB ...

• Unvisited link - blue text
• Visited link - purple text
• Active (when clicking (and holding) LMB) - red text

The peculiarity of links is that the link itself can lead not only to another web page, but also to a file of any type. The file to which the link leads is opened in the browser window only in those cases when the browser knows the type of the document, in other cases a message is displayed as to how the file should be processed - open it or save it to the specified folder.

By default, the page to which the link leads is opened in the same window where the current link is located. A link that leads to a non-existent page, file or image is called "dead" or "broken".

Links to navigate within a web page

Links can also be used to navigate to a specific location within a web page (not necessarily the current one). Any HTML element is used to determine the place on the page to which the link will be navigated. To determine the element to which the link will be made, you need to use the global id attribute, specifying it at the desired element:

Heading

Now to navigate to it, in the value of the href attribute of the element we must specify the value of the id attribute (identifier), preceded by a hash (#) character. If the element to which the transition will be made is on the same page with the link leading to it, then the document name in the href attribute can be omitted by writing only the identifier.

To navigate to a specific location on another page, you need to specify the required identifier after the URL:

Note: The main benefit of links within a web page is that the user does not have to browse the entire web page looking for the section they want. These links are useful on pages with a lot of content so that visitors can quickly jump to the section they want.

Link to mailbox

Attributes

download: Indicates that the linked file will be downloaded when the user clicks on the link: The value of the attribute determines under what name the file will be saved. For example, the original file name is sun.png, if flower.png is specified as the value, then the file will be saved under the name flower.png. If no value is specified, the original filename will be used.

Note: the download attribute is only used in conjunction with the href attribute.

Href: Specifies the URL of the web page to which the link will be made (the number of characters in the value of the address must not exceed 255). Since the path to a file of any type can be specified as the link address, the result of following the link will depend on the final file.

Note: the URL can be used absolute or relative address.

Example »hreflang: Determines the language of the text in the document to which the link leads. Example »media: Indicates the media type of the document to which the link points. rel: Indicates the relationship between the current document and the referenced document. Possible attribute values:

• alternate - link to an alternative version of the document (page for printing, page in another language, etc.)
• author - link to the author of the document
• bookmark - the permanent url used for bookmarks
• help - link to the help document
• license - links to copyright information for the document
• next - the next document in the selected area
• nofollow - a link to a document that does not need to be indexed ("nofollow" is used by the search engine Google system to indicate that the search bot should not follow this link)
• noreferrer - tell the browser not to send the HTTP header if the user follows the link
• prefetch - indicates that the target document should be cached
• prev - the previous document in the selected area
• search - the search link for the document
• tag - tag (keyword) for the current document

Default style

a: link, a: visited (color: (browser dependent); text-decoration: underline; cursor: auto;) a: hover, a: active (color: (browser dependent);)

Description

Tag is one of the important elements of HTML and is intended for creating links. Depending on the presence of the attributes name or href tag sets a link or anchor. An anchor is a bookmark within a page that you can specify as the target of a link. When you use a link that points to an anchor, you navigate to a bookmark within the web page.

To create a link, you must tell the browser what the link is, and also indicate the address of the document to which the link should be made. As the value of the href attribute, the address of the document (URL, Universal Resource Locator, universal resource locator) is used, to which the transition occurs. The link address can be absolute or relative. Absolute addresses work everywhere and everywhere, regardless of the name of the site or web page where the link is registered. Relative links, as their name suggests, are built relative to the current document or site root.

Syntax

... ...

Attributes

Activate a link using a keyboard shortcut. Sets the coordinates of the hotspot. Offers to download the file specified by the link. Specifies the address of the document to go to. Identifies the language of the referenced text. Sets the name of the anchor within the document. Relationship between referenced and current documents. The relationship between the current and referenced documents. Specifies the shape of the active link area for images. Determines the sequence of transitions between links when you press the Tab key. The name of the window or frame where the browser will load the document. Adds a tooltip to the link text. Indicates the MIME type of the document being linked to.

End tag

Required.

HTML5 IE Cr Op Sa Fx

Look at my picture!

How to take the same photo?

Simple link generator

open link in current tab open link in new window / tab download file

Href link attribute

Do URLs in a link always start with http: //?

In the a tag, the URL can be shortened according to the established rules. A shortened link is called a relative link. It will lead you to the page relative to the starting point.

When a slash (/) is used at the end of a URL

These pages are different for a crawler. They duplicate each other's content ().

The main one is selected from them. On the Blogger's Cheat Sheet with a slash (http: // shpargalkablog .. With a minor one, you should set up a redirect to the main one using a 301 redirect or rel = "canonical". If the link looks like

The main page of the blogger's cheat sheet, then the visitor or, in the case of rel = "canonical" only the search robot, will first go to http: // shpargalkablog ..

You can reduce the waiting time for a web document to load by immediately moving the user to the desired page. To avoid mistakes, it is advisable to copy the URL from the address bar of the browser.

Web documents ending in, say, .html, .png, .css are considered the final file and it is not advisable to write a slash after them. That is

Http: //site/2010/09/postroenie-ssylok-v-html.html

Link to a given place in the text

Each value of the identifier (id) should be used only once on the page. Recognized in CSS by the hash (# character) in front of the identifier value.

If in address bar browser add an identifier selector to the URL without gaps, then the page will scroll to the tag itself without reloading. Using a script, you can.

Search engines do not consider each other as duplicates of URLs like

Http: //site/2010/09/postroenie-ssylok-v-html.html #tut #zdes

Link to send mail

The URL should be mailto: email_address. Several addresses can be separated by commas. The parameters cc = cc, bcc = bcc, subject = subject, body = email are optional and are combined with &.

href = "mailto: email? cc = cc & bcc = bcc & subject = subject & body = email"> anchor
Example:	mailto: [email protected] "> [email protected]
Result:	[email protected]
Example:	mailto: [email protected],[email protected]? subject = Link Code Question"> support service
Result:	support
Example:	href = "mailto:?. html"> http: //site/2010/09/postroenie-ssylok-v-html.html" > share the link with your friends
Result:

Telephone call

Link to download the file

Open link in new window, new tab, frame

* the page has the specified link code	* the page has a frame that contains another frame with a page that has the specified link code
target = "_ self"> anchor
target = "_ self"> or the current iframe
target = "_ parent"> anchor
target = "_ parent">
show emoticon in current tab or parent frame
target = "_ top"> anchor
target = "_ top"> show emoticon in current tab
show emoticon in current tab
target = "_ blank"> anchor
target = "_ blank">
show emoticon in a new tab or in a new window (depending on the user's browser settings)
target = "name"> anchor
target = "raz">
show emoticon in an iframe with the specified name

Ignoring the user's desires, using JavaScript is possible and not in a new tab. But in such a window it will not be possible to change the URL in the address bar of the browser.

Save to Browser Bookmarks Link (HTML)

rel can have multiple values ​​separated by a space, eg rel = "nofollow noreferrer". Whatwg.org has a slightly larger list of values. The table shows only those that have practical use since often devices only consider the link tag: rel = "prefetch" in Mozilla Firefox and Google Chrome, rel = "next" and rel = "prev" for Google.

Close link in nofollow

1. links to sites with low-quality content (violating copyright (plagiarism), containing malware(viruses), material only for adults, related to drugs, with elements of violence, etc.),
2. paid links.

Those who disobey are expected to be downgraded. Therefore, links left by visitors (for example, in the comments) either require verification or are automatically closed by nofollow.

You don't need to close everything in nofollow external links... No need to close in nofollow internal links, for example, located in the menu. If necessary, then they are better.

Explanatory text to the link when you hover the mouse cursor

Link in CSS code

How to change link color

You cannot work with pseudo-classes in the style attribute, that is, say, you cannot change the color of a specific link on hover. Therefore, you need to set the value of the id attribute (for one link) or class (for several) and.

The color property value can be specified keyword e.g. red, green (list of supported) or in RGB formats and HSL. Find out the color code: # ff0000

Link underscore

The text-decoration property is responsible for the underlining of the text, the.

Example:	style = " text-decoration: none; border-bottom: 1px dashed;" > underline a link with a dotted line
Result:
Example:	the underline of a link appears only after hovering over it
Result:
Example:	beautiful text links
Result:	tram-pam-pam tram-pam-pam-pam-pam

(HTML Anchor Element).

The main function of links is that they allow you to move from one HTML document to another, or contain the address of a file intended for opening in the user's browser, or for further downloading.

Browser support

Tag			Opera		IExplorer	Edge
	Yes	Yes	Yes	Yes	Yes	Yes

Attributes

Attribute	Meaning	Description
charset	char_encoding	Not supported in HTML5. Specifies the encoding of the associated document.
coords	coordinates	Not supported in HTML5. Specifies the coordinates of the link.
	filename	If the attribute is specified, then the browser does not follow the link, but offers to download the document specified in the link address.
href	Url	Sets Url page, or document to which the link leads.
hreflang	language_code	Determines the language of the linked document to which the link points.
media	media_query	Indicates that the document to which the link leads is adapted for certain types of devices.
name	section_name	Not supported in HTML5. Specifies the name of the anchor. Use the global attribute instead.
rel	alternate author bookmark help license next nofollow noreferrer prefetch prev search tag
rev	text	Not supported in HTML5. Indicates the relationship between the current document and the linked document (which is linked to).
shape	default rect circle poly	Not supported in HTML5. Specifies the shape of the link (used with the coords attribute). Use an element instead of this tag.
target	_blank _parent _self _top framename	Indicates where to open the document.
type	media_type	Indicates The MIME-type of the document to be navigated to.

Usage example