Contacts

Stays a href http site. Email links

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 a 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) 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

Tag A

Look at my picture!

How to take the same photo?



Using html tag links are created on any site, both external and internal. Tag occurs on every page of the site. If it were not for it, it would be very difficult to navigate the Internet, since each page address (URL) would have to be manually written in the browser line.

Tag syntax

anchor

The required parameter for the link is only href = "URL", i.e. link address. Between the opening tag and the closing tag an anchor link is written, which can consist of words, symbols, objects (pictures, etc.).

... ...
Note 1

If you have opened a tag , then everything that follows it will be a link until the closing tag is met... Any object can be a link. Very often, an image is made in the form of a link. For example

Note 2

To the opening tag you can write various attributes. They are responsible for the correct functioning of the links. Let's take a look at them.

Tag attributes and properties

1. Attribute target = "parameter", which can take the following values:

  • _blank - opens the page in a new window
  • _self - loads the page into the current window
  • _parent - loads the page into the parent frame
  • _top - cancels all frames and loads the page in full browser window

Target example

how to make money on your website

The most commonly used value is _blank because it allows you to open the page in a new tab. This is convenient for the user, since the current page remains open in the adjacent tab.

2. Attribute title = "(! LANG: hint" позволяет прописать подсказку, которая высветится при наведении курсора на ссылку. Это нужно для более точного описания ссылки. Атрибут тайтл поможет пользователю убедиться в том, что по ссылке он найдет нужную информацию, а для поисковой системы это дополнительный ключевые слова для страницы, на которую ведет ссылка.!}

Example with title hint

... !} how to make money on your website ...

Converted on the page to the following:

In this case, the tooltip is displayed in a standard way. However, you can also make a nicer tooltip: how to make a nice tooltip for a link "

3. Attribute class = "class name" specifies the style class for the link. You already know about classes from the previous lesson (styles in html). For the a tag, the styles are slightly different. I will explain all the nuances with the following example.

Example

как заработать на сайте

Преобразуется на странице в следующее:

Поясню выше описанный пример. Класс, в котором мы описали тег называется list . Давайте разберемся, что значат приписки visited , link и hover .

  • a.класс:visited стиль для ссылки, который пользователь уже посетил. Это позволяет пользователю не заходить на одну и ту же страницу дважды, даже если у ссылки на эту страницу будут разные анкоры.
  • a.класс:link стиль для тех ссылок, которые ещё не посещал пользователь (можно не указывать приписку ":link", поскольку a.класс - делает то же самое).
  • a.класс:hover стиль ссылки при наведении курсора. Обычно для этого стиля делают другой цвет, а также подчеркивание, чтобы дать пользователю понять, что ссылка стала активной.

4. Атрибут rel="параметр" - определяет отношения между текущим документом и документом, на который ведет ссылка. Этот атрибут носит важное значение для поисковых машин, но браузерами никак не трактуется. Может принимать следующее значения:

4.1. nofollow - означает то, что вес по ссылке не будет передаваться (робот не будет переходить по ссылке). Например:

как заработать на сайте

Визуально никаких отличий Вы не заметите, однако для поисковых систем эта ссылка не будет передавать вес. Поэтому мой совет для всех: закрывайте все внешние ссылки атрибутом , чтобы сохранить вес на Вашем сайте.

4.2. canonical - в случае множества дублей на сайте, указывает главную страницу среди всех дублей

Есть также множество других значений атрибута rel, но они вообще никак не влияют не на внешний вид, ни на поисковые системы, поэтому рассматривать их не вижу смысла.

Как сделать ссылку на адрес почты

У ссылок есть еще одна интересная возможность: можно сразу указать адрес почты в таком формате, что при переходе по ней у пользователя будет открываться программа, которая стоит по умолчанию по обработке его почты. Возможно это будет OutLook или же браузер по умолчанию с почтой.

[email protected]сайт

Уважаемый читатель, теперь Вы узнали гораздо больше о html теге a. Теперь советую перейти к следующему уроку.

The HTML element (or anchor element), with , creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a URL can address. Content within each should indicate the link"s destination.

The source for this interactive example is stored in a GitHub repository. If you"d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Attributes

download HTML5 Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:
  • Without a value, the browser will suggest a filename/extension, generated from various sources:
    • The final segment in the URL path
    • The media type (from the Content-Type header , the start of a data: URL , or Blob.type for a blob: URL)
  • Defining a value suggests it as the filename. / and \ characters are converted to underscores (_). Filesystems may forbid other characters in filenames, so browsers will adjust the suggested name if necessary.
href

The URL that the hyperlink points to. Links are not restricted to HTTP-based URLs - they can use any URL scheme supported by browsers:

  • Sections of a page with fragment URLs
  • Pieces of media files with media fragments
  • Telephone numbers with tel: URLs
  • Email addresses with mailto: URLs
  • While web browsers may not support other URL schemes, web sites can with registerProtocolHandler()
hreflang Hints at the human language of the linked URL. No built-in functionality. Allowed values are the same as the global lang attribute . ping A space-separated list of URLs. When the link is followed, the browser will send POST requests with the body PING to the URLs. Typically for tracking. referrerpolicy How much of the referrer to send when following the link. See Referrer-Policy for possible values and their effects. rel The relationship of the linked URL as space-separated link types . target Where to display the linked URL, as the name for a browsing context (a tab, window, or