Služba WWW je velmi rozmanitá a umožňuje vkládat na stránky celou řadu zajímavých prvků. Jedním z nich jsou obrázky. Mohou to být naskenované fotografie či obrázky, obrázky nakreslené na počítači nebo grafické prvky vzniklé počítačovou vizualizací. Abyste mohli obrázek na stránku vložit, musí být ve vhodném grafickém formátu (nejčastěji GIF, JPG nebo PNG). Máte-li připravený obrázek, měli byste jej uložit do toho adresáře, kde jsou vaše stránky, a pak vložíte na stránku odkaz na tento obrázek. K tomuto účelu slouží nepárový příkaz IMG, doplněný o atribut SRC, který musí obsahovat URL obrázku.
Jak to bude vypadat na stránce, ukazuje příklad na adrese abc.planeta.cz/krok6.htm. Zdrojový kód kroku 6 bude obsahovat výraz <IMG SRC="Cyrix.jpg">, který je odkazem na obrázek s názvem Cyrix.jpg. Ten je v adresáři stránek, proto stačí uvést relativní URL. Pokud byste se odkazovali do vzdáleného adresáře, museli byste použít absolutní URL:
<IMG SRC="http://abc.planeta.cz/Cyrix.jpg">.
<HTML>
<HEAD>
<TITLE>Moje první stránka</TITLE>
</HEAD>
<BODY BGCOLOR="#F6E5D9">
<FONT COLOR="#967405">
<P>
<H1>Vkládáme obrázek</H1>
<P>
Na prvním obrázku může být třeba náš nejlepší přítel, když byl ještě štěně:
<P>
<IMG SRC="Cyrix.jpg">
<P>
Ale jinak je to holka a jmenuje se Cyrix, tohle je při večerním krmení ve dvou měsících. <BR>
Dneska už je dospělá a je to veliká krásná doga.
</BODY>
</HTML>
Kromě obrázku jsme použili barevné pozadí (atribut BGCOLOR) a nastavení barvy písma na celý dokument (příkaz FONT COLOR). Barva je zadána v RGB formátu, nejedná se o základní barvu, požadovaný odstín lze namíchat například pomocí programu Web Color, který u vybraného barevného tónu rovnou zobrazí HTML kód. U obrázků musíte vedle vhodné volby formátu dbát také na velikost. Celá stránka by neměla být větší než 10 kb, ale obrázky bývají často mnohem větší. Velký obrázek zmenšíte buď zmenšením rozlišení, nebo snížením počtu barev, obrázek by neměl být širší, než je obrazovka při nejběžnějším rozlišení 800 x 600. Při ubírání počtu barev musíte dbát na to, aby výsledná kvalita obrázku byla ještě únosná. Obrázek by měl být velký do 40 kb.
Tabulky
Tabulky se uzavírají do párových značek <TABLE> </TABLE>. Každý řádek tabulky se zahajuje příkazem <TR> (Table Row) a každá buňka příkazem <TD> (Table Data). Tabulky obvykle mívají i buňky obsahující nadpisy jednotlivých sloupců nebo řádků, na to pamatuje příkaz <TH> (Table Head) umístěný místo <TD>. Všechny příkazy jsou párové. U jednoduchých tabulek je nemusíte uzavírat, ale ve složitějších případech je vhodné tagy ukončit. Příklad první jednoduché tabulky najdete na adrese abc.planeta.cz/krok7.htm. Výňatek z kódu na začátku tabulky vypadá takto: <TABLE BORDER="1" ALIGN=LEFT BGCOLOR="#D9EFF6"> <CAPTION><H3>Stručný přehled vývoje Internetu</H3></CAPTION> <TR><TH>Období</TH><TH>Historická událost</TH> <TR VALIGN=TOP><TD> 01.09.1969</TD> <TD>První . základ ARPAnetu</TD> Tabulka se zahajuje příkazem <TABLE> a atributem BORDER, který označuje okraje tabulky. Pokud byste určili hodnotu na nulovou (="0"), nezobrazil by se žádný okraj. Atribut ALIGN stanoví zarovnání celé tabulky na stránce. Hodnota LEFT znamená zarovnat doleva, RIGHT doprava a CENTER na střed stránky. Další atribut, který jsme u tabulky určili, je barva pozadí tabulky BGCOLOR. Mezi jednotlivými atributy jsou mezery. Tabulka by měla mít svůj název, k tomu slouží CAPTION, do tohoto párového znaku se vkládá text nebo nadpis a ten se objeví zarovnaný nad tabulkou. Nyní se již začne s obsahem buněk tabulky, zahajuje se první řádek <TR> a <TH>, abyste zadali názvy sloupců. Příkaz <TH> se ukončuje, <TR> zde můžete ponechat otevřený. Dále vkládáte text do vlastních buněk tabulky, každý řádek musí začínat <TR><TD> obsah </TD> <TD> obsah </TD> a opakovat pro každý další sloupec. Uvnitř buňky můžete používat také některé atributy, nejčastěji to bude VALIGN, který stanoví, kam se zarovná obsah buňky. Může mít hodnoty TOP (k hornímu okraji), BOTTOM (k dolnímu okraji) nebo CENTER (doprostřed). Pokud tento atribut nestanovíte, text se automaticky zarovná doprostřed.
