Sobes.tech
Назад к вопросам
Junior — Middle
88

Какие типы файлов изображений могут быть вставлены с помощью тега <img> в HTML?

Ответ от нейросети

sobes.tech AI

Что хотят услышать интервьюеры:

Тег <img> может вставлять не только JPEG и PNG, но и другие распространённые форматы изображений, если браузер их поддерживает. Обычно ожидается, что кандидат знает про статические форматы и понимает, что итог зависит от поддержки браузером. Для современных задач важно помнить и про SVG, и про WebP.

Определение:

<img> — это HTML-тег для встраивания изображения на страницу через атрибут src. Формат файла напрямую зависит от того, умеет ли его отображать браузер. На практике чаще всего используются jpg/jpeg, png, gif, webp, svg, а также реже bmp и ico.

Пример использования:

<img src="photo.jpg" alt="Фотография">
<img src="logo.png" alt="Логотип">
<img src="animation.gif" alt="Анимация">
<img src="picture.webp" alt="Изображение в WebP">
<img src="icon.svg" alt="Векторная иконка">

Пояснение кода:

Код не требует отдельной логики: каждый тег <img> указывает путь к файлу в src, а alt задаёт текстовое описание на случай, если изображение не загрузится или недоступно для экранных читалок.
В примере показаны разные типы файлов, которые браузер обычно умеет отображать. Если формат не поддерживается, изображение не будет показано.

Ключевые моменты:

  • Наиболее распространённые форматы: JPEG, PNG, GIF, WebP, SVG.
  • Поддержка зависит от браузера, а не только от HTML.
  • SVG — удобен для иконок и логотипов, потому что масштабируется без потери качества.
  • GIF часто используют для простых анимаций.
  • alt обязателен для доступности и как fallback при ошибке загрузки.
  • img не вставляет сам файл в документ, а ссылается на него через src.