Hyvällä kuvituksella saadaan aikaiseksi näyttävämpiä web-julkaisuja. Kuvien lisääminen käy koodin kirjoittamisen lisäksi kuvassa näkyvällä Standard-välilehden nappulalla, joka on laitettu mustan laatikon sisään:
Kun nappulaa painaa, siitä aukeaa seuraavanlainen valikko:
Siinä on seuraavia elementtejä:
Se, millaisia kuvia web-julkaisussa voidaan käyttää, on myöskin määritelty. Seuraavat kuvaformaatit ovat sallittuja kaikissa html-kielen versioissa:
Näiden lisäksi HTML5 antaa embed-tagin avulla esittää suuren määrän erilaisissa formaateissa olevia kuvia ym. tiedostoja
Eri kuvaformaattien ominaisuuksista löytää tietoa muun muassa seuraavasta osoitteesta: http://www.joutsi.com/gimp/formaatit.html.
Jos otetaan digikameralla taikka puhelimella kuva kohteesta, se tuskin koskaan on suoraan nettikäyttöön sopiva. Syykin on aivan yksinkertainen: ne ovat yleensä liian suuria nettiin. Vaikka tuolla img-tagissa onkin mahdollista määrittää kuvalle sivulla näkyvä koko, asiaa ei ole järkevää toteuttaa näin: se kuvan skaalaaminen sopivaksi tuon tagin kanssa ei vaikuta kuvan tiedostokokoon. Jos jokainen sivulla oleva kuva on useamman megatavun kokoinen, se hidastaa sivun lataamista tarpeettomasti, samoin jossain tilanteissa se syö turhaan käyttäjän latausresursseja (esim. liittymässä saattaa olla rajoituksia sille, paljonko saa milläkin hinnalla ladata dataa netistä).
Kuvia pitää siis pienentää. Siihen on olemassa useita ohjelmia. Seuraavassa kaksi ilmaisohjelmaa, joilla voi myös tehdä muita kuvaan liittyviä muokkausoperaatiota:
Paint.net on kevyt ja helppokäyttöinen Windows-ohjelma digikuvien muokkaamiseen. Tällä onnistuvat useat toimenpiteet varsin helposti kuvan koon muuttamisen lisäksi.
GIMP, eli Gnu Image Manipulation Program on taas erittäin laaja ohjelmisto, joka osaa paljon asioita. Sillä voi myös ottaa ruutukaappauksia tarvittaessa.
GIMP:n käyttölogiikka saattaa aloittelijalle olla vähän erikoinen, mutta sen opiskelu kuitenkin palkitsee. GIMP:n käyttöön löytää suomenkielisiä ohjeita esimerkiksi osoitteesta http://www.joutsi.com/gimp-ohjeet/. Jos epäilet väitettäni että GIMP:n logiikka olisi vähän erilainen kuin muiden, niin piirräpä huviksesi ympyrä GIMP:llä... :-)
Jos tarvitaan kuvien massamuokkausta, eli on kansiollinen kuvia (eli paljon!), niin sellaiseen sopiva ohjelma on esimerkiksi IrfanView. Sen avulla pystyy tekemään yhdellä operaatiolla useisiin kuviin vaikuttavia toimenpiteitä, esimerkiksi juuri pienentää niitä nettikäyttöön sopivaksi.
Ohjelmien tarkempi opiskelu jätetään jokaisen itsensä hoidettavaksi.
Eri käyttöjärjestelmissä on erilaiset tavat ottaa ns. ruutukaappauskuvia. Seuraavat kaksi ovat Windowsista:
Linuxissa ruutukaappauksia voi tehdä vaikkapa aiemmin mainitulla GIMP:llä.
Jos halutaan joku tietty pala irti kuvasta, sen voi tehdä kaappauksen jälkeen kuvankäsittelyohjelman leikkaus-toimenpiteellä (crop).