Верстка HTML страниц, какие расширения или форматы изображений выбрать - jpg, jpeg, png, gif, svg
В процессе верстки веб-страниц на языке HTML часто приходится использовать теги, которые предполагают наличие изображения. Путь к таким изображениям указывают, как правило, в специальном атрибуте. Прежде чем использовать изображения на сайте, нужно их подготовить, а также решить, какие расширения изображений использовать на сайте.
Вариантов расширений множество, стоит использовать только наиболее популярные. Важно помнить, что расширение лучше всего прописывать строчными (маленькими) буквами и соответственно также писать и в коде HTML. В противном случае, картинка может не показываться.
Рассмотрим следующие расширения - jpg, jpeg, png, gif, svg:
- jpg и jpeg – это по сути одно и тоже, просто разные названия, но лучше всегда писать jpg. Это расширение наиболее оптимальный вариант - маленький размер файлов на выходе, многие сервисы оптимизации сайтов настойчиво рекомендуют использовать данный формат, так как снижается размер файлов, а значит повышается скорость загрузки сайта. Но качество может быть не очень приемлемым, тогда стоит понизить степень сжатия или использовать другой формат;
- png – отличный вариант, этот формат создавался как раз для веб. Качество изображений на приемлемом уровне, но может быть большой размер файлов. Если нужна поддержка прозрачности – это формат вне конкуренции;
- gif – следует использовать, когда необходимо сделать анимацию на сайте. В остальных случаях рекомендуется использовать другие форматы;
- svg – векторный формат, а это значит, что изображение описывается формулами, что позволяет получить максимальное качество даже при масштабировании. Используется при особой необходимости.
Таким образом, были кратко рассмотрены самые популярные форматы изображений для сайта. Выяснено, что наиболее используемый формат изображений в веб-разработке – это jpg.
Последние статьи
- 09.07.22ИТ / Разное Конвертация офисных файлов DOC, DOCX, DOCM, RTF в форматы DOCX, DOCM, DOC, RTF, PDF, HTML, XML, TXT без потерь и изменения разметки
- 07.07.22ИТ / Безопасность Как защитить исходный код PHP, JS, HTML, CSS - обфускация, минимизация, сжатие и шифрование
- 06.07.22ИТ / Безопасность Подключение не защищено, проблема с Lets Encrypt - как исправить истекший 30.09.2021 DST Root CA X3, удалить его вручную и установить ISRG Root X1. Пример на MS Windows 7
- 08.07.21ИТ / Разное Как бесплатно сделать перевод для сайта без API, перевод документов в Google Translate
- 06.07.21ИТ / Разное Как сделать кнопку подписки на сайте, базу подписчиков и автоматическую рассылку