Старая поговорка гласит, что «картина стоит тысячи слов». Этот лозунг сияет в Интернете, где объемы внимания общеизвестно короткие — правильное изображение может создать или разрушить сайт, привлекая правильное внимание и привлекая посетителей страницы.
Тем не менее, когда изображение не загружается, дизайн выглядит испорченным, а в некоторых случаях может ухудшить взаимодействие с пользователем на этом сайте. «Тысяча слов», которые посылает ломаная картинка, безусловно, не являются положительными!
1. Неправильные пути к файлам
Когда вы добавляете изображения в файл HTML или CSS сайта , вы должны создать путь к месту в структуре каталогов, где находятся эти файлы. Это код, который сообщает браузеру, где искать и получать изображение. В большинстве случаев это будет внутри папки с именем images . Если путь к этой папке и файлы внутри нее неверны, изображения не будут загружаться должным образом, потому что браузер не сможет получить правильные файлы. Он будет следовать по пути, который вы указали, но он зайдет в тупик и вместо отображения соответствующего изображения выйдет пустым.
2. Имена файлов с ошибками
Проверяя пути к файлам, убедитесь, что вы правильно написали имя изображения. Неправильные имена или орфографические ошибки являются наиболее распространенной причиной проблем с загрузкой изображений.
3. Неправильное расширение файла
В некоторых случаях у вас может быть правильно написано имя файла, но расширение файла может быть неправильным. Если ваше изображение представляет собой файл .jpg , но ваш HTML- файл ищет .png, возникнет проблема. Используйте правильный тип файла для каждого изображения, а затем укажите то же расширение в коде вашего сайта.
Также обратите внимание на чувствительность к регистру. Если ваш файл оканчивается на .JPG с буквами в заглавных буквах, но ваш код ссылается на .jpg, то все веб-серверы в нижнем регистре видят эти два отличия, даже если они представляют собой одинаковые наборы букв. Чувствительность к регистру имеет значение.
Лучше всего всегда сохранять файлы со строчными буквами. Это позволяет нам всегда использовать строчные буквы в нашем коде, устраняя одну возможную проблему, которая может возникнуть с нашими файлами изображений.
4. Файлы отсутствуют
Если пути к файлам изображений указаны правильно, а имя и расширение файла также не содержат ошибок, убедитесь, что файлы загружены на веб-сервер. Пренебрежение загрузкой файлов на этот сервер при запуске сайта — распространенная ошибка, которую легко не заметить.
Загрузите эти изображения, обновите веб-страницу, и она должна сразу же отобразить файлы, как и ожидалось. Вы также можете попробовать удалить изображение на сервере и повторно загрузить его. Иногда файлы повреждаются во время передачи (например, текстовой, а не двоичной передачей во время FTP), поэтому этот метод «удаления и замены» иногда помогает.
5. Веб-сайт, на котором размещены изображения, не работает
Обычно вы размещаете изображения, которые использует ваш сайт, на вашем собственном сервере , но в некоторых случаях вы можете использовать изображения, размещенные в другом месте. Если этот сайт, на котором размещено изображение, отключится, ваши изображения также не будут загружаться.
6. Проблема передачи
Независимо от того, загружен ли файл изображения из внешнего домена или из вашего собственного, всегда есть вероятность, что может возникнуть проблема с передачей этого файла, когда он впервые запрашивается браузером. Эта проблема не должна быть частым явлением (если это так, возможно, вам придется искать нового хостинг-провайдера), но это может происходить время от времени.
Распространенной причиной этого сбоя является то, что сервер перегружен и не может достаточно быстро обслуживать все ресурсы страницы до истечения срока ожидания запроса. Вы увидите эту проблему чаще с недорогими виртуальными веб-серверами, которые пытаются справиться с более сложными сайтами с большим количеством сценариев. Если эта проблема возникает часто, рассмотрите возможность обновления возможностей сервера или найдите новый хост.
7. Проблемы с базой данных
Современные динамические веб-приложения, такие как WordPress, полагаются на базу данных для хранения информации обо всем на сайте, включая изображения. Если ваш сайт не может загрузить изображения, есть вероятность, что в базе данных возникли проблемы.
Существует множество способов возникновения проблем с базами данных. Ваше приложение может даже не подключаться к базе данных, потому что оно либо недоступно, либо недоступно на другом сервере. Возможно, что-то повреждено в самой базе данных или изменилась информация о пользователе вашей базы данных, когда вы вышли из системы. Даже простые изменения настроек могут вызвать непредвиденные последствия, которые либо изменят базу данных, либо сделают ее недоступной. Проверьте журналы сервера, чтобы увидеть, может ли база данных быть виновником.
Несколько заключительных замечаний
Подумайте о правильном использовании тегов ALT, скорости вашего сайта и общей производительности.
Теги ALT, или «альтернативный текст», — это то, что отображается браузером, если изображение не загружается. Они также являются важным компонентом в создании доступных веб-сайтов, которые могут использоваться людьми с ограниченными возможностями. Каждое встроенное изображение на вашем сайте должно иметь соответствующий тег ALT. Изображения, применяемые с помощью CSS, не предлагают этот атрибут.