Атрибут download не работает

Здравствуйте уважаемые добрые люди. Подскажите пожалуйста, почему ссылка с атрибутом download открывает картинку, а не скачивает ее?
Вот код:

Здесь будут отображатся важные файлы

Пробовал открывать и в яндекс браузере и в хроме. Иконка только открывается а не скачивается.

Здесь будут отображатся важные файлы

Файлы

Здесь будут отображатся важные файлы

Иконка

Существуют решения, которые можно использовать, если у вас есть серверный доступ к сайту, например настройка .htaccess для скачивания этих файлов напрямую. Если ваш сайт размещен на бесплатных площадках, таких как WordPress.com, Blogspot или Github, которые не позволяют этого сделать — следует использовать атрибут download .

Использование атрибута "Download"

Атрибут download является частью спецификации HTML5 и определяет ссылку именно как ссылку на скачивание, а не навигационную.

Он также позволяет переименовать файл после скачивания. Файл, находящийся на сервере, особенно если он создается автоматически, может называться например так acme-doc-2.0.1.txt . Но для пользователей было бы лучше скачивать файл с более разумным именем, возможно таким: Acme Documentation (ver. 2.0.1).txt (не забываем расширение файла).

Вот как это будет выглядеть:

Попробуйте скачать файл с этой страницы, он должен скачаться с названием, которое указано в атрибуте download .

Несколько замечаний:

  • Firefox разрешает загрузку файлов лишь с текущего источника (same origin), заботясь о безопасности. Файл должен приходить именно с вашего сервера или домена, в противном случае он будет открыт в браузере.
  • Пока загрузка cross-origin файлов поддерживается в Chrome и последней версии Opera (с Chromium/Blink), эти браузеры проигнорируют значение атрибута. Другими словами, имя файла останется неизменным.
Читайте также:  Arw to jpg converter

Обеспечиваем Fallback

На время написания этой статьи поддержки атрибута download еще не было в Safari и (как можно было ожидать) в Internet Explorer. Cогласно modern IE status, эта фича в настоящее время находится в верхней части списка разработки и получает много голосов.

Тем временем, мы можем добавить неплохой запасной вариант (fallback) для браузеров, которые не поддерживают этот атрибут — показывать дополнительные инструкции под ссылкой на скачивание. Чтобы это сделать, нам нужно скачать Modernizr с включенным тестом на поддержку атрибута download .

Конфигурация сборки Modernizr.

Затем мы можем добавить следующий скрипт.

Скрипт проверит, поддерживает ли браузер данный атрибут; если нет — то под всеми ссылками с указанным download атрибутом будет добавлен новый

Текстовая инструкция показывается в Safari.

Подводя итог

Атрибут download делает обработку ссылок на скачивание очень удобным для тех, кто не имеет доступа к серверным настройкам. С нетерпением жду, что Internet Explorer и Safari скоро реализуют поддержку атрибута download !

Дата публикации: 2014-09-15

От автора: Атрибут download позволяет нам заставлять компьютер или мобильное устройство пользователя загружать медиа файлы.

Давайте детальнее познакомимся с атрибутом download в HTML5.

Итак, атрибут download позволяет нам заставлять компьютер или мобильное устройство пользователя загружать медиа файлы. Например:

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

Обычно, когда мы ставим ссылку на HTML документ, PDF, файл изображения или другие медиа файлы, они открываются в браузере, когда пользователь переходит по ссылке.

Но если гиперссылка содержит атрибут download, такой как в примере выше, то браузер полуучает инструкции загружать файл, таким же образом, как и если ссылка указывает на файл .zip или .exe.

Читайте также:  В квартире слышно как работает лифт

Атрибут download откроет диалог “Сохранить”, в браузере Firefox, давая пользователю возможность сохранить файл на компьютер или мобильное устройство.

Атрибут download отлично подходит для файлов PDF, изображений, видео и аудио клипов, и другого медиа контента, который бы ваши пользователи сохраняли на свои устройства.

Изменение имени файла

Вы можете изменить имя загружаемого файла, задав значение атрибуту download. Например: