Web-suunnittelun virheet
Harmittavan usein näkee sivuja, joissa teksti on esimerkiksi keltaista ja tausta sinistä. Eihän sellaisesta tekstistä yksinkertaisesti voi saada selvää. Tässä olenkin listannut ja selittänyt mm. tämän ikävän värien väärinkäytön ja monta muuta juttua. Näitä noudattamalla ja soveltamalla, voit saada web-sivuistasi mukavat ja käytännöllisemmät.
Värit:
Mikäs sen mukavampaa, kuin saapua sivuille, joissa on mukavan räikeä taustaväri ja tekstin väriksi on valittu väri, joka ei eroa taustasta juuri lainkaan. Ei, värit tulee valita niin, ettei ne käy silmiin, tai mihinkään muuhunkaan. Värit tulisi olla pehmeät ja sulautua toisiinsa. Tekstin tulee erottua muista väreistä hyvin, etenkin taustasta. Alla on pari esimerkkiä. Jokainen voi miettiä kumpi sivu on mukavamman värinen.
Ensimmäisessä esimerkissä taustan väriksi on valittu keltainen, tekstialueen väriksi sininen ja tekstin väriksi vihreä. Toisessa esimerkissä taustan väri on vihertävä, tekstialueen väri valkoinen ja teksti mustaa. Lähdetään sitten purkamaan näitä. Esimerkissä yksi taustan väri käy välittömästi päähän. Se on liian kirkas. Sisältöalueen väri ei sovi taustan väriin millään tavalla ja sen tekstistä ei saa selvää, koska se ei erotu taustasta. Ei tälläistä sivua ole mukava selata ja näinollen vierailija lähtee sivuilta hyvin nopeasti pois, minä ainakin lähtisin. Esimerkissä kaksi taustan väri ei ole liian kirkas, eikä silmät räjähdä sen nähdessään. Sisältö alueen tausta on valkoista, joten siitä erottuu melkein mikä teksti vain. Etenkin jos tekstin väriksi laitetaan musta. Tosiasiahan on, että ihminen on tottunut lukemaan mustaa tekstiä valkoiselta pohjalta.
Toinen asia miksi värejä tulee käyttää hillitysti on se, että kaikki eivät näe värejä samallatavalla kuin esimerkiksi sinä. Otetaan esimerkki. Teet sivut niin, että tausta on vihreää ja teksti vaihtelee sinisestä keltaiseen. Sivuillesi saapuu henkilö X, joka on siniviherkelta-sokea. Mitä hän sivuillasi näkee?
Käyttäkää siis järkeä valitessanne sivuille värejä. Värejä saa toki käyttää ja niitä kannattaa käyttää, hillitysti.
Navigaatio:
Henkilö X saapuu sivuille, joiden sisältö on mielenkiintoista ja haluaisikin tutkia sivuja tarkemmin. Navigaatio on kuitenkin toteutettu huonosti ja näinollen henkilö X ei pysty tutkimaan sivuja, vaan lähtee pois. Miksi kävi näin? Alla pari esimerkkiä, ensimmäinen huono, toinen parempi. Esimerkit ovat kuvia, johtuen allekirjoittaneen laiskuudesta.
Ensimmäisessä esimerkissä linkit on sijoitettu miten sattuu ja minne sattuu. Jokainen voi miettiä, onko tämmöistä sivua mukava selata. Toisessa esimerkissä linkit löytyvät kutakuinkin samasa paikasta ja ne ovat loogisesti allekkain.
Toinen vakava, harmittavan usein ilmaantuva ongelma on javascript. Javascriptillä toki saa näyttäviä navigaatioita toteutettua, mutta näin ei pitäisi tehdä.
Henkilö X saapuu sivuille, joissa navigaatio on toteutettu käyttäen javascriptiä. Hänellä ei kuitenkaan ole selaimessa javascript tukea, tai hän ei halua sitä käyttää. Näinollen henkilö X ei linkkejä näe ja lähtee sivuilta välittömästi pois. Jos välttämättä haluaa käyttää navigaatiossa javascriptiä, tulee se toteuttaa niin, että käyttäjät joilla ei tarvittavaa tukea löydy, näkevät navigaation normaaleina linkkeinä.
Itsellä selaimeni (Mozilla Firefox) estää kaikki javascriptit sivuilta, ellen itse salli javascriptien näyttämistä. Jos siis navigaatio on toteutettu javascriptillä, niin ainakin minä lähden sivuilta pois välittömästi, vaikka sisältö olisikin mielenkiintoista.
Selaimet:
Usein myös näkee sivuja, joissa kerrotaan, että sivut toimivat vain sillä ja sillä selaimella. Näin ei pidä koskaan tehdä. Sivut tulee suunnitella ja toteuttaa niin, että ne toimivat kaikilla selaimilla. Tekstit tyyliin "Sivut toimivat vain Firefoxilla, lataa se koska se on paljon parempi kuin IE" ovat turhia. Ketään ei kiinnosta mitä mieltä sinä olet selaimista. Miksi tehdä sivut jotka toimivat vain esim. IE:llä, tai Firefoxilla, kun silloin saa vierailijoiksi vain ne käyttäjät, jotka käyttävät kyseistä selainta? Turha myöskään sanoa, että IE:tä käyttää suurin osa internetin käyttäjistä, joten siksi teen sivut vain IE:lle. Miksi tyytyä vain käyttäjiin, jotka käyttävät IE:tä, kun voi saada myös käyttäjät, jotka käyttävät muita selaimia? On myös aivan turha sanoa, että "kyllä sivut mulla toimii, oma vika jos sulla ei toimi". Sivuja tehdään aina muita käyttäjiä varten, ei itseä varten. Jos ei välitetä vieraista, vaan halutaan että sivut toimivat itsellä, niin silloin sivt voidaan jättää kokonaan pois internetistä ja käyttää sivuja siltä omalta koneelta.
Tehkää siis sivunne niin, että ne toimivat mahdollisimman monella selaimilla. Yleensä, jos tekee sivut niin, että ne näkyvät IE:llä ja Gecko-pohjaisilla selaimilla, ne toimivat kaikilla.
Toimivuudella ei myöskään tarkoiteta sitä, että ne näkyvät jokaisella selaimella samalla tavalla. Ei, ketään ei oikeasti kiinnosta näkyvätkö ne täysin samallalailla jokaisella selaimella. Toimivuudella tarkoitetaan sitä, että sivut ovat käytettävissä kaikilla selaimilla ja että niistä saa selvää. Jos siis joku tulee sanomaan sinulle, että "tuo navigaatio on 2 pikseliä alempana selaimella X, kuin selaimella Y", voit sanoa hänelle "mitä sitten?".Tälläiset erot eivät vaikuta sivujen käyttöön millään tavalla.
Flash:
Kuten ylempänä kerrottiin, tulee javascriptiä käyttää varoen. Sama koskee Flashia, ehkä jopa vielä enemmän.
Usein näkee sivuja, jotka on toteutettu Flashilla. Henkilö X haluaisi tutustua sivuihisi, jotka on toteutettu flashilla, mutta hänen selaimestaan puuttuu flash-tuki. Näin ollen sivut eivät hänellä toimi ja henkilö X lähtee sivuilta pois. Vaikka flashilla saakin tehtyä näyttäviä sivuja, niin näin ei pitäisi kuitenkaan tehdä. Kaikilla ei kuitenkaan ole sitä tarvittavaa tukea selaimessaan, tai he eivät halua sitä käyttää.
En kuitenkaan mene täysin kieltämään flash sivujen tekemistä, jos se toteutetaan hyvin, eli huomioidaan myös käyttäjät, joilla ei tukea löydy. Jos siis ajattelit tehdä sivut flashilla, niin tee sivut myös käyttäen html merkkausta. Tee esimerkiksi jonkinlainen aloitussivu, josta käyttäjä voi itse valita haluaako käyttää flashia, vai ihan normaalia html:ää. Näin myös ne käyttäjät, joilla ei tukea ole pääsevät selaamaan sivujasi.
Mainokset:
Harmittavan usein näkee myös sivuja, jotka ovat täynnä mainoksia. Henkilö X saapuu sivuillesi ja haluaisi tutkia sivujasi tarkemmin. Hän kuitenkin huomaa ne kaksisataa mainosta ja ihanasti esiin pomppaavat pop-up ikkunat, joten hän lähtee pois sivuiltasi.
Mainoksia saa toki käyttää, kunhan käyttää hillitysti. Mitään ärsyttäviä esiin lenteleviä pop-up ikkunoita ei pidä käyttää, sillä niistä ei tykkää kukaan. Useat selaimet myös estävät pop-up ikkinat, joten niiden käyttö on turhaa.
Kieli ja sen ymmärrettävyys:
Internet-sivuilla tulisi käyttää aina kirjakieltä. Kirjoitusvirheet tulisi karsia pois. Toki aina joitain kirjoitusvirheitä sattuu itse kullekkin. Allekirjoittanut tekee paljonkin virheitä, joista sitten huomautetaan, kiitos siitä.
Yleisimpiä virheitä on unohtaa isot alkukirjaimet, pilkut ja pisteet. Alla esimerkki.
moi tämä teksti on huonosti kirjoitettu eikä tätä ole ollenkaan mukava lukea eihän se minua haittaa sillä minä itse saan tästä selvää eikä minua kiinnosta mitä muut ajattelevat
Tämän voisi kirjoittaa selvemmin.
Moi! Tämä teksti on huonosti kirjoitettu, eikä tätä ole ollenkaan mukava lukea. Eihän se minua haittaa, sillä minä saan tästä selvää, eikä minua kiinnosta mitä muut ajattelevat.
Toinen virhe on käyttää sivuillaan murretta. Miksi tehdä sivuja, joita muut eivät ymmärrä? Kaikki eivät puhu samaa murretta, kuin sinä. Alla esimerkki.
Hyvvee päivvee siulle. Mie puhun vuan pohojois karajalan murtteella, joten muuta sie tänne ja opettele murre, jos halluut saaha tästä miun tekstistä selevää.
Ei näin. Asian voisi kirjoittaa paljon paremmin esimerkiksi näin:
Hyvää päivää sinulle. Minä puhun vain Pohjois-Karjalan murteella, joten muuta sinä tänne ja opettele murre, jos haluat saada tekstistä selvää.
Yrittäkää siis välttää murteen käyttöä ja käyttäkää pisteitä, pilkkuja ja isoja alkukirjaimia.
Opas loppuu tähän, mutta jatkoa on luvassa artikkelin "web-toteutuksen virheet" muodossa.
-Foxytin 14.09.2006
