Stare powiedzenie mówi, że "obraz jest wart tysiąca słów". Jest to szczególnie ważne w Internecie, w którym rozpiętość uwagi jest bardzo krótka, a więc właściwy obraz może naprawdę spowodować lub złamać witrynę, przyciągając odpowiednią uwagę i przyciągając odwiedzających stronę wystarczająco długo, aby mogli nauczyć się, czego chcą się nauczyć lub akcja sygnalizująca "wygraną" witryny. Tak, jeśli chodzi o stronę internetową, obrazy mogą być warte więcej niż tysiąc słów!
Więc mając na uwadze znaczenie obrazów online, zastanówmy się nad tym, co mówi twoja witryna, jeśli obraz, który powinien znajdować się w witrynie, nie wczytuje się? Może się tak zdarzyć, jeśli masz wbudowane obrazy, które są częścią HTML lub obrazów tła zastosowanych w CSS (a twoja strona prawdopodobnie ma obie te). Najważniejsze jest to, że gdy grafika nie ładuje się na stronie, powoduje to, że wygląd projektu jest zepsuty, aw niektórych przypadkach może całkowicie zniszczyć komfort użytkownika na tej stronie. "Tysiące słów", które wysyła obraz, z pewnością nie są pozytywne!
Rzućmy okiem na niektóre typowe powody, dla których obrazy nie zostały załadowane na stronę, a także o to, na co powinieneś zwrócić uwagę podczas rozwiązywania tego problemu podczas testowania witryny.
Niepoprawne ścieżki do plików
Gdy dodajesz obrazy do pliku HTML lub CSS witryny, musisz utworzyć ścieżkę do lokalizacji w strukturze katalogów, w której znajdują się te pliki. To jest kod, który informuje przeglądarkę, gdzie szukać i pobrać obraz z. W większości przypadków znajduje się on wewnątrz folderu o nazwie "images". Jeśli ścieżka do tego folderu i znajdujące się w nim pliki są nieprawidłowe, obrazy nie zostaną załadowane poprawnie, ponieważ przeglądarka nie będzie mogła pobrać właściwych plików. Będzie podążał ścieżką, którą mu kazałeś, ale uderzy w ślepy zaułek i zamiast wyświetlać odpowiedni obraz, pojawi się pusty.
Krok 1 przy debugowaniu problemów z ładowaniem obrazu polega na upewnieniu się, że ścieżka pliku, którą zakodowałeś, jest poprawna. Być może podałeś zły katalog lub nie podałeś poprawnie ścieżki do tego katalogu. Jeśli tak nie jest, możesz mieć inny problem z tą ścieżką. Czytaj!
Nazwy plików błędnie napisane
Podczas sprawdzania ścieżek plików dla plików upewnij się, że poprawnie wpisałeś nazwę obrazu. Z naszego doświadczenia wynika, że niepoprawne nazwy lub błędy pisowni są najczęstszą przyczyną problemów z ładowaniem obrazów. Pamiętaj, przeglądarki internetowe są bardzo pamiętliwe, jeśli chodzi o nazwy plików. Jeśli przez pomyłkę zapomnisz list lub użyjesz niewłaściwej litery, przeglądarka nie będzie szukała podobnego pliku i mówi: "Och, prawdopodobnie chodziło ci o to, prawda?" Nie - jeśli plik jest nieprawidłowy, nawet jeśli jest blisko, nie zostanie załadowany na stronę.
Niewłaściwe rozszerzenie pliku
W niektórych przypadkach może być poprawnie zapisana nazwa pliku, ale rozszerzenie pliku może być nieprawidłowe. Jeśli obraz jest plikiem .jpg, ale Twój kod HTML szuka pliku .png, wystąpi problem. Upewnij się, że używasz poprawnego typu pliku dla każdego obrazu, a następnie upewnij się, że wywołałeś to samo rozszerzenie w kodzie Twojej witryny.
Poszukaj także wrażliwości na wielkość liter. Jeśli twój plik kończy się na .JPG, z literami wszystko w literach, ale twój kod odnosi się do .jpg, wszystkie małe litery, istnieją pewne serwery internetowe, które zobaczą te dwa są różne, mimo że są to te same zestawy liter. Rozróżnia wielkość liter! Dlatego zawsze zapisujemy nasze pliki małymi literami. Dzięki temu możemy zawsze używać małych liter w naszym kodzie, eliminując jeden możliwy problem, jaki mogliśmy mieć z naszymi plikami graficznymi.
Brakuje plików
Jeśli ścieżki do plików obrazów są poprawne, a nazwa i rozszerzenie pliku są również wolne od błędów, następnym elementem do sprawdzenia jest upewnienie się, że pliki zostały faktycznie przesłane na serwer WWW. Zaniedbanie przesyłania plików na ten serwer podczas uruchamiania witryny jest częstym błędem, który łatwo przeoczyć.
Jak rozwiązać ten problem? Przesyłaj te obrazy, odświeżaj stronę internetową i powinna natychmiast wyświetlać pliki zgodnie z oczekiwaniami. Możesz także spróbować usunąć obraz z serwera i ponownie go przesłać. Może wydawać się to dziwne, ale widzieliśmy tę pracę więcej niż raz. Czasami pliki są uszkodzone, więc ta metoda "usuń i zastąp" może w końcu pomóc.
Witryna Hosting obrazów jest wyłączona
Zwykle chcesz hostować dowolne obrazy, które Twoja witryna używa na własnym serwerze, ale w niektórych przypadkach możesz używać obrazów hostowanych gdzie indziej. Jeśli witryna, w której znajduje się obraz, przestaje działać, Twoje obrazy również się nie załadują.
Przenieś problem
Niezależnie od tego, czy plik obrazu jest ładowany z domeny zewnętrznej, czy z własnej, zawsze istnieje ryzyko, że może wystąpić problem z transferem tego pliku, gdy zostanie po raz pierwszy zgłoszony przez przeglądarkę. Nie powinno to być częstym zjawiskiem (jeśli tak, być może trzeba będzie szukać nowego dostawcy usług hostingowych), ale może się zdarzyć od czasu do czasu.
Niefortunną stroną tego problemu jest to, że naprawdę nic nie można z tym zrobić, ponieważ jest to problem pozostający poza kontrolą. Dobrą wiadomością jest to, że jest to tymczasowy problem, który jest często rozwiązywany dość szybko. Na przykład, gdy ktoś zobaczy zepsutą stronę i odświeży ją, sam to często naprawi problem i prawidłowo załaduje obrazy. Jeśli widzisz zepsuty obraz, odśwież przeglądarkę, aby sprawdzić, czy nie był to tylko problem z transmisją twoja początkowa prośba.
Kilka uwag końcowych
Zastanawiając się nad obrazami i problemami z ładowaniem, należy pamiętać o dwóch rzeczach: używaniu znaczników ALT i szybkości witryny oraz ogólnej wydajności.
Znaczniki ALT lub "tekst alternatywny" są wyświetlane przez przeglądarkę, jeśli obraz nie zostanie załadowany. Są również ważnym elementem w tworzeniu dostępnych stron internetowych, z których mogą korzystać osoby z pewnymi niepełnosprawnościami. Każdy obraz śródliniowy w Twojej witrynie powinien mieć odpowiedni tag ALT. Pamiętaj, że obrazy zastosowane w CSS nie mają tego atrybutu.
Jeśli chodzi o wydajność witryny, ładowanie zbyt wielu obrazów lub nawet kilka gigantycznych obrazów, które nie są odpowiednio zoptymalizowane do wyświetlania w Internecie, będzie miało negatywny wpływ na szybkość ładowania. Z tego powodu należy przetestować wpływ dowolnych obrazów wykorzystywanych w projekcie witryny i podjąć wszelkie kroki, które są niezbędne do poprawy wydajności witryny, a jednocześnie stworzyć ogólny wygląd odpowiedni dla projektu witryny.
