Jekyll: получить ширину / высоту изображения без использования внешнего плагина - PullRequest
Новая
       12

Jekyll: получить ширину / высоту изображения без использования внешнего плагина

0 голосов
/ 15 ноября 2018

Я хочу автоматически добавить атрибуты height и width ко всем моим изображениям. Это прекрасно сделано через этот красивый плагин , но я размещаю свой сайт на страницах GitHub, где внешние плагины не поддерживаются.

Вопрос: Как предварительно заполнить атрибуты высоты / ширины изображения без использования плагина?

Зачем мне это нужно?

Мой сайт отлично работает даже без height и width, но я хочу указать их, потому что это важно с точки зрения SEO (некоторые подробности о его важности можно найти здесь ).

1 Ответ

0 голосов
/ 15 ноября 2018

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

Краткий ответ

Вы можете просто установить ширину и высоту непосредственно в HTML вВаша уценка, например: 

# Markdown title

paragraph

<img src="/path/to/image.jpg" width="400" height="300" />

Длинный ответ

Вы не можете получить ширину и высоту изображения программно без плагина, поэтому, когдапри использовании (чистой) уценки вы получаете изображение без свойства width и height.Вопрос в том, ПОЧЕМУ вы хотели добавить ширину и высоту в первую очередь.Установка ширины и высоты предотвращает оплавление, но при загрузке оставляет большое отверстие.Это действительно лучше?Это, конечно, не выглядит красиво.Прогрессивные JPG - очень хорошее решение для этой проблемы, но я не предпочитаю устанавливать ширину и высоту для них, поскольку «нет изображения» выглядит хорошо, и прогрессивный JPG также всегда выглядит хорошо.

Вы говорите, что хотите этого по причинам SEO, но я не могу думать ни о чем.

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

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

...