Testaa kuvat ja tekstin pituudet varmistaaksesi, että sivustosi reagoi asianmukaisesti
Kun suunnittelemme verkkosivustoja ja suunnittelemme, kuinka näiden sivustojen sisältö näytetään, teemme usein niin ihanteellisen tilanteen. Otsikoita ja tekstikenttiä kuvataan pitämällä tiettyjä pituuksia, kun taas tekstin mukana tulevat kuvat on suunniteltu näyttämään ulottuvuuksina, joiden avulla he voivat työskennellä suunnitellulla tavalla. Vaikka nämä elementit olisivat jonkin verran nestemäisiä osana reagoivasta verkkosivustosta (jonka pitäisi olla), on olemassa raja sen joustavuudelle.
Jos asennat verkkosivuston CMS: ään (sisältöhallintajärjestelmä) ja sallit asiakkaat hallinnoimaan kyseistä sivustoa ja lisäämällä uutta sisältöä ajan mittaan, määritykset, jotka olet suunnitellut, testataan ehdottomasti. Luota siihen, että asiakkaasi löytävät tapoja muuttaa sivustoa, jota et koskaan unelmoinut. Jos et ole ottanut huomioon tilanteita, joissa työskentelet suunnitteluprosessin ulkopuolella ihanteellisissa ulkopuolella, kyseisen sivuston ulkoasu saattaa olla vakavassa vaarassa. Siksi on erityisen tärkeää, että stressit testataan kaikkiin verkkosivujen sisältöihin ja sivuston ulkoasun näkökohtiin ennen kyseisen sivuston käynnistämistä. Tässä on muutamia vinkkejä siitä, miten voit tehdä tämän.
Testaa kuvakokoja
Epäilemättä yleisimpiä tapoja, joilla ihmiset rikkovat verkkosivustonsa ulkoasua, on lisäämällä epäasianmukaisesti koottuja kuvia (tämä on myös tapa, jolla ne vaikuttavat negatiivisesti sivuston yleiseen suorituskykyyn ja aiheuttavat hidas latausnopeuden). Tämä sisältää liian suuria kuvia sekä ne, jotka ovat liian pieniä toimimaan verkkosivustossasi.
Vaikka käytätkin CSS: ää näiden kuvien koon määrittämiseen ulkoasussa, kuvat, jotka ovat jyrkästi skaalautuneita, alkuperäisen sivustosi tiedot aiheuttavat ongelmia. Jos kuvan mitat ovat virheellisiä, CSS voi pakottaa kuvan näyttämään sopivan leveyden ja korkeuden mukaan, mutta itse kuva ja sen kuvasuhde voivat olla vääristyneitä. Tämä on varmasti kielteinen vaikutus sivustosi ulkoasuun, koska liian pieni kuva "puhaltaa" ja menettää laadun. Kuvan, joka on liian suuri, joka on pienempi CSS: n kanssa, näyttää hienolta ja säilyttää sen laadun, mutta tiedostokoko voi olla kohtuuttoman suuri käytettävyyden suhteen.
Kun testaat sivustosi työtä, muista lisätä kuvia, jotka eivät kuulu aiottuun soveltamisalaan. Lisää CSS- ja reagoiva kuvantekniikoita, jotka vastaavat näihin haasteisiin koon mukaan kuvasta tai, jos kyseessä on väärä kuvasuhde, harkitsee myös CSS-leikeominaisuuden käyttämistä kuvan rajaamiseksi tarpeen mukaan.
Muiden tallennusvälineiden testaus
Kuvien lisäksi voit testata myös muita materiaaleja, kuten videoita sivustossasi, ja nähdä, miten nämä elementit näkyvät ulkoasussa käyttäen erilaisia mitoitus- ja kuvasuhteen arvoja. Tarkastele jälleen kerran sivustosi reagoiva luonne ja miten se toimii eri laitteiden ja näytön koon mukaan .
Tekstin otsikkojen testaaminen
Kuvien jälkeen seuraava verkkosivustoalue, joka aiheuttaa eniten ongelmia elävissä verkkosivustoissa, joita hallitsevat muut kuin web-ammattilaiset, ovat tekstirivit. Nämä ovat (oletettavasti) lyhyitä tekstirivejä, jotka usein aloittavat kyseisen sivun tai osion sisällön. Tämän kohdan yläpuolella oleva teksti, joka lukee "Tekstin otsikkojen testaaminen", on esimerkki tästä.
Jos olet suunnitellut sivuston tämän otsikon mukauttamiseksi:
"Tekstin otsikkojen testaaminen"
Mutta asiakas käyttää CMS: ää lisäämällä artikkeli, jonka otsikko on seuraava:
"Tekstin otsikoiden testaaminen erilaisilla verkkosivuilla, joilla on eri kokoisia vaatimuksia ja käyttäjien tarpeita"
Sitten ulkoasu ei välttämättä pysty siististi kaikkia ylimääräistä tekstiä. Aivan kuten sinun pitäisi stressata testiäsi kuvia ja tietovälineitä lisäämällä merkintöjä, jotka jäävät hyvin alun perin suunniteltujen kokojen ulkopuolelle, joten sinun pitäisi tehdä tekstin otsikoita varmistaaksesi, että ne ovat riittävän joustavia, jotta voit näyttää tehokkaasti jopa erittäin pitkiä linjoja, kuten yksi yllä.
Tekstin pituuksien testaaminen
Tekstin aiheen pysyessä kannattaa myös testata eri tekstipituuksia sivun pääsisällölle . Tämä sisältää tekstin, joka on hyvin, hyvin pitkä ja hyvin lyhyt teksti - joka voi itse asiassa olla kysymys, joka tuomitsee monen sivun asettelun.
Koska verkkosivut luonteensa mukaan kasvaisivat tekstin korkeuden mukaan, ne sisältävät paljon tekstiä, joiden pituus on yleensä vain korkeuskorkeus tarpeen mukaan. Ellei ole rajoitettu sivun korkeutta (jota sinun ei pitäisi tehdä, jos haluat sivusi olevan joustava), ylimääräinen teksti ei saisi aiheuttaa ongelmia. Liian pieni teksti on toinen asia - ja se on yksi, jota monet suunnittelijat unohtavat kokeillaan niiden suunnitteluprosessissa.
Liian vähän tekstiä voi tehdä sivun näyttää epätäydelliseltä tai jopa rikki, joten muista skaalata sivusi sisältöä nähdäksesi, mitä näissä tapauksissa tapahtuu ja tehdä tarvittavat muutokset sivustosi CSS: ään näiden tilanteiden käsittelemiseksi.
Testaa sivun zoomia
Näköhäiriöt voivat käyttää Web-selaimen sivun zoom -ominaisuutta verkkosivujen koon lisäämiseen. Jos joku suurentaa huomattavasti, asettelu voi hajota. Tämä on yksi syy siihen, miksi haluat haluta käyttää EM: ää sivustosi fonttikoon mittausyksikkönä sekä mediakyselyjäsi . Koska EM: t ovat suhteellinen mittayksikkö (joka perustuu kyseisen selaimen oletustekstikokoon), ne edistävät nestemäisiä ja joustavia verkkosivujen ulkoasuja.
Testaa verkkosivustosi sivun zoomilla ja älä vain pysähdy yhdellä tai kahdella zoomaustasolla. Suurenna sivustosi ylös ja alas eri tasoilla varmistaaksesi, että sivusi reagoivat suunnitellulla tavalla.
Älä unohda latausnopeudesta ja suorituskyvystä
Kun testaat asiakaspäätösten ulkoasun vaikutuksia, älä unohda myös kiinnittää huomiota näiden päätösten vaikutukseen sivuston suorituskykyyn. Näiden asiakkaiden lisäämät kuvat ja sisältö voivat haitata sivuston latausnopeutta ja vahingoittaa sivuston yleistä käytettävyyttä. Suunnittele näiden lisäysten vaikutukset ja tee osuutesi kehittämisprosessiin näiden vaikutusten minimoimiseksi.
Jos sivustosi rakennetaan tehokkuusbudjetilla, jaa nämä tiedot asiakkaillesi ja näytä heille, kuinka voit testata verkkosivun tehokkuustietojen perusteella. Selosta heille, kuinka tärkeää on ylläpitää näille vahvistetuille kynnysarvoille sivun koko ja latausnopeus ja näyttää heille, miten heidän tekemät lisäykset voivat vaikuttaa koko sivustoon. Ota aikaa kouluttaa heitä siitä, miten sivusto toimii ja näyttää hyvältä. Koulutuksen aihe ...
Asiakkaan koulutus on välttämätöntä
On tärkeää korostaa sivustosi kuvia, tekstiä ja muita sivuelementtejä ja luoda tyylejä, jotka käsittelevät ääritapauksia, mutta jotka eivät koskaan korvaa asiakaskoulutusta. Sivustosi luodinkestävyyden tulisi olla sen ajan lisäksi, kun käytät harjoittelua asiakkaillesi, kuinka tehokkaasti hoidat ja hallinnoit sivustosi. Loppujen lopuksi hyvin koulutettu asiakas, joka ymmärtää heidän velvollisuutensa ja tekemästään sivustolla tekemien päätösten vaikutukset, on korvaamatonta työtäsi pitääkseen sivuston toimivan ja parhaimmillaan.