2014-11-10 1 views
0

только вопросы некоторых новичка вокруг polyfill Picturefill:Picturefill без атрибута src?

Я заметил короткую вспышку в Firefox (33) и Safari (7.1), когда я использую атрибут src. Эти браузеры делают дополнительный HTTP-запрос. Это мой код:

<img src="images/300x180-1.jpg" 
    alt="My alt text" 
    sizes="(min-width: 768px) 364px, 100vw" 
    srcset="images/[email protected] 728w, images/364x220-1.jpg 364w" /> 
  • не должен Picturefill предотвратить браузер от загрузки ненужных изображений?
  • Есть ли недостатки в удалении атрибута src? (Я знаю, что люди с JS отключились или браузер без собственных откликов изображений не увидит никакого изображения вообще, просто текст alt)
  • Какое влияние имеет недостающий атрибут src на SEO?
+0

Если вам не нужен образ, чем не использовать '' тега, использовать что-то другое или добавить содержимое после йота нагрузки. – skobaljic

+0

Мне нужно изображение – gregory

+0

Но вы сказали, что хотите удалить атрибут img 'src'? Зачем вам нужен образ? – skobaljic

ответ

1
  1. можно только прервать загрузку изображения в хроме и то есть не далее или сафари.
  2. Изображение без СРКА не рассматривается преднатяг анализатор, атрибут SRC требуется спецификация (вы упомянули JS от уже)

О разметке изображения в целом. Разница между 300 и 364 довольно мала. Не думайте, что это на самом деле дает вам эту большую разницу. Однако, если вы хотите его сохранить, было бы замечательно добавить его в srcset, чтобы браузер знал свои свойства (и работать с ним, если экран очень мал или пропускная способность низкая).

<img src="images/300x180-1.jpg" 
    alt="My alt text" 
    sizes="(min-width: 768px) 364px, 100vw" 
    srcset="images/[email protected] 728w, images/364x220-1.jpg 364w, images/300x180-1.jpg 300w" /> 

Вы также можете попробовать использовать respimage, который пробует прервать загрузку изображений в IE, и ждет немного дольше, чтобы изменить источник в сафари/светлячок (реализации качества изображения техники низки замещающей). Кроме того, он пытается сэкономить пропускную способность, используя более разумный выбор ресурсов.

+0

Спасибо за ваш ответ. Я нашел приятное сообщение в блоге после размещения моего вопроса здесь: http://www.filamentgroup.com/lab/to-picturefill.html В '' src'' есть резервное копирование: см. «Любые недостатки»? раздел. – gregory

0

Какое влияние имеет недостающий атрибут src на SEO?

Тестирование с помощью Google, Fetch Как инструмент Google, можно заметить, что, хотя по умолчанию, Google не будет индексировать файлы, указанный в атрибуте srcset, он делает индексировать их, если используется Picturefill.

Я написал более полный ответ на Stack Exchange, Вебмастерах here

+0

Это изменилось с 2013/2014 года. См. Https://github.com/scottjehl/picturefill/issues/549 Пожалуйста, измените или удалите ответ. –

+0

@alexanderfarkas Обновлено. – Undistraction