Wszelkie obrazy, które chcesz połączyć w swojej witrynie HTML należy najpierw przesłać do tego samego miejsca, w którym wysyłasz kod HTML strony internetowej, niezależnie od tego, czy witryna jest hostowana na serwerze sieciowym, do którego docierasz FTP lub korzystasz z usługi hostingowej. Jeśli korzystasz z usługi hostingowej, prawdopodobnie korzystasz z formularza przesyłania udostępnionego przez tę usługę. Formularze te zazwyczaj znajdują się w sekcji administracyjnej Twojego konta hostingowego.
Przesłanie obrazu do usługi hostingowej to dopiero pierwszy krok. Następnie musisz dodać tag w kodzie HTML, aby go zidentyfikować.
Przesyłanie obrazów do tego samego katalogu co HTML
Twoje zdjęcia mogą znajdować się w tym samym katalogu co kod HTML. Jeśli tak jest:
- Prześlij obraz do katalogu głównego swojej witryny.
- Dodaj tag obrazu w kodzie HTML, aby wskazać obraz.
- Prześlij plik HTML do katalogu głównego swojej witryny.
- Przetestuj plik, otwierając stronę w przeglądarce internetowej.
Tag obrazu ma następujący format:
Zakładając, że przesyłasz zdjęcie księżyca o nazwie „lunar.jpg”, tag obrazu ma następującą postać:
Wysokość i szerokość są opcjonalne, ale zalecane. Te wartości domyślne są wyrażone w pikselach, ale mogą być również wyrażone w procentach:
Tag obrazu nie wymaga tagu zamykającego.
Jeśli tworzysz łącze do obrazu w innym dokumencie, użyj znaczników zakotwiczenia i zagnieździj znacznik obrazu w środku.
Przesyłanie obrazów do podkatalogu
Częściej przechowuje się obrazy w podkatalogu, zwykle nazywanym Obrazy. Aby wskazać obrazy w tym katalogu, musisz wiedzieć, gdzie się one znajdują w stosunku do katalogu głównego Twojej witryny.
Katalog główny Twojej witryny to miejsce, w którym wyświetla się adres URL, bez żadnych katalogów na końcu. Na przykład dla witryny o nazwie „MyWebpage.com” katalog główny ma następującą postać: http://MyWebpage.com/. Zwróć uwagę na ukośnik na końcu. W ten sposób zwykle wskazywany jest katalog główny. Podkatalogi zawierają ten ukośnik, aby pokazać, gdzie się znajdują w strukturze katalogów. Przykładowa witryna MyWebpage może mieć strukturę:
http://MyWebpage.com/ — katalog główny
http://MyWebpage.com/products/ — katalog produktów
http://MyWebpage.com/products/documentation/ — katalog dokumentacji w katalogu produktów
http://MyWebpage.com/images/ — katalog obrazów
W takim przypadku, gdy wskazujesz swój obraz w katalogu images, piszesz:
To się nazywa ścieżka bezwzględna do Twojego wizerunku.
Typowe problemy z obrazami, które się nie wyświetlają
Wyświetlanie obrazów na Twojej stronie internetowej może na początku być trudne. Dwa najczęstsze przyczyny to fakt, że obraz nie został przesłany w miejscu, na które wskazuje HTML, lub kod HTML jest napisany niepoprawnie.
Pierwszą rzeczą do zrobienia jest sprawdzenie, czy możesz znaleźć swój obraz w Internecie. Większość dostawców hostingu ma jakiś rodzaj narzędzia do zarządzania, którego możesz użyć, aby zobaczyć, gdzie przesłałeś swoje obrazy. Gdy uznasz, że masz prawidłowy adres URL obrazu, wpisz go w przeglądarce. Jeśli obraz się pojawi, masz poprawną lokalizację.
Następnie sprawdź, czy Twój kod HTML wskazuje na ten obraz. Najprostszym sposobem na to jest wklejenie URL obrazu które właśnie przetestowałeś w atrybucie SRC. Ponownie prześlij stronę i przetestuj.
Atrybut SRC tagu obrazu nigdy nie powinien zaczynać się od DO:\ lub plik: Wygląda na to, że działają one podczas testowania strony internetowej na własnym komputerze, ale każdy, kto odwiedza Twoją witrynę, zobaczy uszkodzony obraz. Dzieje się tak, ponieważ C:\ wskazuje na lokalizację na Twój twardy dysk. Ponieważ obraz znajduje się na dysku twardym, wyświetla się, gdy go oglądasz, ale nie będzie widoczny dla nikogo innego.