Voi itku!

Olet epäilemättä tehnyt sivut sen tarkemmin miettimättä mitä lopulta olet tekemässä: tehnyt, muutellut korjaillut, korjaillut, fixannu vikoja, korjaillu...

Mitäpä jos aloittaisit alusta. Mieti ihan oikeasti ensin sivun rakenne kuntoon (html ILMAN ulkoasumäärittelyjä). Sen jälkeen MIETIT css-osan ensin ja TEET vasta sitten.

Ensin suunnitellaan ja sitten vasta tehdään.

Muuten: kun tekee isommalla näytöllä sivut, niin ei tarvitse mennä toiselle koneelle tarkastamaan. Riittää kun pienennät selainikkunaa :)

Valitettavasti tätä se on. Erilaisella näyttölaitteella ja tietokoneella sivut näyttävät erilaiselta.
Pahimpien ongelmien välttämiseksi on kuitenkin joitain keinoja.

1) Tee sivuistasi täysin skaalautuvat. Käytä vain relatiivisia mittayksiköitä (esim. %).
Jotkut sivut saa toimivan näköiseksi tällä tavalla, mutta joihinkin sivuihin se ei yksinkertaisesti käy. Itse en tee oikeastaan koskaan näin.

2) Yleisin tällä hetkellä käytössä oleva näytön resoluutio on 1024x786. Jos teet sivun, jonka maksimileveys on n. 800-900px, se luultavasti näkyy kokonaan useimmilla tietokoneilla. Isommilla näytöillä sivu on vain pienempi, mikä ei ainakaan minun mielestäni ole mikään ongelma. Pystysuunnassa vieritettävät sivut ovat ihan ok.

3) Kirjoita validia koodia ja testaa sivut käytetyimmillä selaimilla (IE6, IE7, Firefox, Opera, Safari).

4) Kokemuksen kautta oppii minkälaisia ratkaisuja kannattaa käyttää ja minkälaisia välttää. Pääasiassa kaikki erikoiset systeemit ja toteutukset aiheuttavat eniten ongelmia, joten pyri tekemään sivuista rakenteeltaan mahdollisimman yksinkertaiset.

5) Et pysty millään tekemään sellaisia sivuja, jotka toimisivat kaikilla maailman koneilla ja näytöillä, joten raja on hyvä vetää johonkin.

Hyperdokumentteja kirjoitettaessa tulee pitää mielessä joitakin HTML:lle ominaisia periaatteita.
Ensimmäinen periaate, joka kannattaakin pitää mielessä on, että lukuohjelma hoitelee aina sivun muotoilun.

HTML-dokumentteja saatetaan lukea useilla erilaisilla tietokoneilla. Joillakin lukijoilla on käytössään 17 tai 19 tuumainen tarkka värinäyttö, jossa suuretkin dokumentit näkyvät kokonaan kerralla. Toiset lukevat samaa dokumentia kannettavalla tietokoneella, jossa on pieni harmaasävynäyttö.

Word Wibe Webin periaatteena on tuottaa mahdollisimman hyvännäköistä jälkeä kaikilla mahdollisilla laitteistoilla, kaikenkokoisilla ikkunoilla ja kaikilla mahdollisilla resoluutioilla. Kaikille käyttäjille lopputulos ei ole teitenkään yhtä hyvän näköinen kuin kalleimpien ja hienoimpien laitteistojen omistajille, mutta se on aina niin hieno kuin laitteisto vain mahdollistaa.

HTML:ssä ei kuvata sivun ulkonäköä vaan tekstin loogiset osat - otsikot, leipätekstin, sanojen korostuksen. Näiden tietojen perusteella lukuohjelmat muotoilevat lukijan näytölle dokumentin hänen omien toiveidensa ja laitteistonsa mukaisesti.

Tämän vuoksi myös dokumentissa olevat ylimääräiset välilyönnit ja kaikki rivinvaihdot tiputetaan pois dokumenttia muotoiltaessa. Dokumentin kirjoittajana et voi tietää, minkä kokoisilla näytöillä tiedostoasi tullaan lukemaan - joillakin lukijoilla voi olla 80 merkkiä leveä näyttö, joillakin satojen merkkien levyinen suhteellisia kirjaimia tulostava näyttö ja joillakin taas pikkuruinen parinkymmenen merkin levyinen ikkuna.

Lukuohjelma muotoilee tekstin ikkunan koon mukaan, joten käyttäjät saavat tekstin näytölleen aina ruudulleen sopivaksi muotoiltuna.

HTML-dokumentteja kirjoitettaessa tekstiin merkitään kappaleiden sijainti. Lukuohjelma osaa näiden merkintöjen perusteella muotoilla tekstin kuvaruudulle

HTML tarjoaa kuitenkin mahdollisuuden myös muotoilla tekstiä käyttäen välilyöntejä ja rivinvaihtoja, jos tarve vaatii.