Všetky obrázky, ktoré chcete prepojiť, na svojich webových stránkach HTML by sa mali najskôr nahrať na to isté miesto, kam pošlete HTML pre webovú stránku, či už je web hostený na webovom serveri, na ktorý sa dostanete FTP alebo používate webhostingovú službu. Ak používate webhostingovú službu, pravdepodobne použijete formulár na odovzdanie, ktorý táto služba poskytuje. Tieto formuláre sa zvyčajne nachádzajú v administračnej sekcii vášho hostiteľského účtu.
Nahranie vášho obrázka na hostiteľskú službu je iba prvý krok. Potom musíte do značky HTML pridať značku, ktorá ju identifikuje.
Nahrávanie obrázkov do rovnakého adresára ako HTML
Vaše fotografie sa môžu nachádzať v rovnakom adresári ako HTML. V takom prípade:
- Nahrajte obrázok do koreňovej časti svojej webovej stránky.
- Pridajte značku obrázka do svojho kódu HTML, aby ukazoval na obrázok.
- Nahrajte súbor HTML do koreňového adresára svojej webovej stránky.
- Otestujte súbor otvorením stránky vo webovom prehliadači.
Značka obrázka má nasledujúci formát:
Za predpokladu, že nahrávate fotografiu mesiaca s názvom „lunar.jpg“, má značka obrázka nasledujúcu formu:
Výška a šírka sú voliteľné, ale odporúčané. Tieto predvolené hodnoty sú v pixeloch, ale môžu byť vyjadrené aj v percentách:
Značka obrázka nevyžaduje uzatváraciu značku.
Ak odkazujete na obrázok v inom dokumente, použite značky ukotvenia a vnorte značku obrázka dovnútra.
Nahrávanie obrázkov do podadresára
Častejšie je ukladať obrázky do podadresára, ktorý sa zvyčajne nazýva snímky. Ak chcete smerovať na obrázky v tomto adresári, musíte vedieť, kde sú v súvislosti s koreňom vašej webovej stránky.
Koreň vašej webovej stránky je miesto, kde sa zobrazuje adresa URL bez akýchkoľvek adresárov na konci. Napríklad pre web s názvom „MyWebpage.com“ koreň sleduje tento formulár: http://MyWebpage.com/. Všimnite si lomku na konci. Takto je zvyčajne označený koreň adresára. Podadresáre obsahujú lomku, ktorá v štruktúre adresárov zobrazuje miesto, kde sa nachádzajú. Vzorový web MyWebpage môže mať štruktúru:
http://MyWebpage.com/ - koreňový adresár
http://MyWebpage.com/products/ - adresár výrobkov
http://MyWebpage.com/products/documentation/ - adresár dokumentácie v adresári produktov
http://MyWebpage.com/images/ - adresár obrázkov
V takom prípade, keď ukážete na svoj obrázok v adresári obrázkov, napíšete:
Toto sa nazýva absolútna cesta k tvojmu obrazu.
Bežné problémy s obrázkami, ktoré sa nezobrazujú
Získanie obrázkov, ktoré sa zobrazia na vašej webovej stránke, môže byť spočiatku náročné. Dva najbežnejšie dôvody sú, že sa obrázok nenahral tam, kam smeruje HTML, alebo že je HTML napísaný nesprávne.
Prvá vec, ktorú musíte urobiť, je zistiť, či môžete nájsť svoj obrázok online. Väčšina poskytovateľov hostingu má nejaký typ nástroja na správu, pomocou ktorého môžete zistiť, kam ste svoje obrázky nahrali. Keď si myslíte, že máte pre svoj obrázok správnu adresu URL, zadajte ju do svojho prehliadača. Ak sa obrázok zobrazí, máte správne umiestnenie.
Potom skontrolujte, či váš HTML smeruje na tento obrázok. Najjednoduchší spôsob, ako to urobiť, je nalepiť adresa URL obrázka že ste práve otestovali atribút SRC. Znova načítajte stránku a otestujte.
Atribút SRC vašej obrázkovej značky by nemal nikdy začínať C: \ alebo spis: Zdá sa, že budú fungovať, keď otestujete svoju webovú stránku na svojom počítači, ale každý, kto navštívi váš web, uvidí nefunkčný obrázok. Je to tak preto, lebo C: \ ukazuje na miesto v tvoj pevný disk. Keďže sa obrázok nachádza na pevnom disku, zobrazuje sa pri prezeraní, ale nebude sa zobrazovať nikomu inému.