Лого www.SiteHere.ru

Урок 5. Ссылки. Часть 2

Урок 5. Ссылки

Здравствуй, уважаемый читатель.

Это вторая часть урока посвященная ссылкам. Здесь вы узнаете о атрибуте title. Для чего он используется и какое значение ему задавать. А также как делать ссылки на почту и другие файлы.


Это вторая часть пятого урока, посвященная изучению html. Перед прочтением данного урока рекомендую пройти предыдущие уроки:

Урок 1. Что такое html?
Урок 2. Параграфы, заголовки
Урок 3. Списки
Урок 4. Изображения
Урок 5. Ссылки. Часть 1

Теория и практика

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

Посмотреть примерСкачать

    Что изменилось:

  • Появилась папка images в которую в дальнейшем будем «класть» все изображения. Поэтому у адреса изображения в теге img следующее href="images/fruits.jpg". Это сделано для того чтобы соблюдался порядок на сервере. Поэтому приучите себя сразу хранить изображения в отдельной папке.
  • Созданы 3 страницы: banan.html, apple.html и persik.html.
  • У каждой страницы в теге <title> своё название для каждой страницы.Разное название для страниц
  • Создано меню, чтобы можно было перейти с любой страницы на любую:
    ...
    <p>Меню</p>
    <ul>	
        <li>Главная</li>
        <li>Банан</li>
        <li>Яблоко</li>
        <li><a href="persik.html" title="Польза персика">Персик</a></li>
    </ul>
    ...

Вы наверное уже заметили в ссылках атрибут title. Этот атрибут очень важен при индексировании роботом вашего сайта. Он обязательно должен быть прописан для каждой ссылки. Данный атрибут можно увидеть при наведении на ссылку.

Сейчас рассмотрим как сделать ссылку на e-mail. Как это будет выглядеть в коде:

<a href="mailto:myemail@sitehere.ru" title="Отправить e-mail">Отправить e-mail</a>

Как видите это обычная ссылка, только в атрибуте href значение href="mailto:адресс_вашей_электронной_почты".

При клике по данной ссылке будет открываться почтовая программа, которая по умолчанию стоит на вашем компьютере.

Также можно делать ссылки на другие файлы для последующего скачивания. Вот пример кода:

<a href="file.rar" title="Скачать">Скачать файл</a>

По нажатию на ссылку появится окно браузера с запросом куда вы желаете сохранить данный файл.

За два урока мы рассмотрели как создаются ссылки на другие страницы, на элементы внутри страницы, как создать ссылку на e-mail, как создать ссылку на файл. Пробуйте всё прописать руками. Тогда вы лучше запомните их и будете помнить где и как их применить.

Больше практикуйтесь!

Урок 5. Ссылки. Часть 2 5.00/5 (100.00%) 4 голос(ов)

Понравилась статья - расскажи друзьям! :)

3 комментария к записи
  • Игорь

    Добрый вечер.Кодировка Windows-1251,не ANSI почему?

     
  • Светлана

    Во-первых, спасибо за уроки.

    Скажите, пожалуйста, если надо сделать ссылку на скачивание с сайта, то где должен находиться сам файл, который скачивается?

    Т.е. куда его надо поместить, в какую папку на сервере ?

    И только ли на архивы можно так делать ссылки с записей или страниц сайта, или это может быть и pdf, doc, и т.д. ?

     
    • Юрий Немец

      Светлана, файл необязательно должен храниться именно на Вашем сайте. Это может быть сервис "Яндекс.Диск", "Google Drive" и так далее. То есть облачные хранилища данных, которые помогают снять нагрузку с Вашего сайта.

      Данные ссылки можно ставить на что угодно: страницы сайта, PDF-файлы, DOC-файлы, XLS-файлы, изображения и так далее.

      Попробуйте сделать на практике это и Вы поймете сам принцип.

       

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *