![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-300329-63831d1ed236e.webp\")
<\/a><\/p>\n\n Se kuitenkin muuttuu yhden sarakkeen asetteluksi, jossa on piilotettu valikko sek\u00e4 tabletilla ett\u00e4 mobiililaitteella. Ty\u00f6p\u00f6yt\u00e4version verkkosivustovalikon mukana tulee my\u00f6s tarroja ja kuvakkeita, mik\u00e4 helpottaa vanhempien sukupolvien (jotka k\u00e4ytt\u00e4v\u00e4t todenn\u00e4k\u00f6isemmin p\u00f6yt\u00e4tietokonetta tai kannettavaa tietokonetta) ymm\u00e4rt\u00e4mist\u00e4.\n<\/p>\n
\n Sujuvalla navigoinnilla on t\u00e4rke\u00e4 rooli mahdollisten asiakkaiden pit\u00e4misess\u00e4 verkkosivustollasi pidemp\u00e4\u00e4n. K\u00e4ytt\u00e4j\u00e4t ovat k\u00e4rsim\u00e4tt\u00f6mi\u00e4. He eiv\u00e4t aio odottaa ikuisesti, jos he eiv\u00e4t l\u00f6yd\u00e4 haluamaansa. T\u00e4m\u00e4n seurauksena huono navigointi voi vaikuttaa suoraan tulosprosenttiisi ja siten my\u00f6s voittoihisi. K\u00e4ytt\u00e4jien pit\u00e4isi siis voida k\u00e4ytt\u00e4\u00e4 verkkosivustoasi ja navigoida siin\u00e4 saumattomasti eri laitteilla.\n<\/p>\n \n Mit\u00e4 tulee verkkosivustolla liikkumiseen, v\u00e4hemm\u00e4n on yleens\u00e4 enemm\u00e4n. Minimoi siis navigointilinkkien m\u00e4\u00e4r\u00e4 mahdollisimman paljon. Et halua kuormittaa k\u00e4ytt\u00e4ji\u00e4 liian monilla valinnoilla. Useiden linkkien tarjoaminen voi vaikuttaa haitallisesti my\u00f6s hakukoneoptimointiisi, koska indeksointirobottien on vaikea tulkita t\u00e4llaista sis\u00e4lt\u00f6\u00e4.\n<\/p>\n \n Muista siis lis\u00e4t\u00e4 linkkej\u00e4 sopiviin avainsanoihin ja lauseisiin. Korjaa rikkin\u00e4iset linkit mahdollisimman pian. Jos olet korvannut vanhan verkkosivun uudella, muista luoda sopiva uudelleenohjauslinkki.\n<\/p>\n \n V\u00e4lt\u00e4 liikaa leikkimist\u00e4 luovuutesi kanssa. Usein on parempi pysy\u00e4 vakionavigointiarkkitehtuurissa. Ihmiset k\u00e4ytt\u00e4v\u00e4t usein liikaa animaatioita tai grafiikkaa erottuakseen joukosta ja heill\u00e4 on k\u00e4ytt\u00e4jiin t\u00e4ysin p\u00e4invastainen vaikutus.\n<\/p>\n \n On kuitenkin toivottavaa sis\u00e4llytt\u00e4\u00e4 uusimmat navigointitrendit verkkosivustoosi. Esimerkiksi vuonna 2017 tahmeiden navigointipalkkien, megavalikoiden ja reagoivien alivalikoiden m\u00e4\u00e4r\u00e4 lis\u00e4\u00e4ntyi huomattavasti. Mink\u00e4 tahansa n\u00e4ist\u00e4 ominaisuuksista k\u00e4ytt\u00e4minen verkkosivustossasi on luultavasti hyv\u00e4 idea.\n<\/p>\n \n San Franciscon modernin taiteen museon verkkosivusto on ehk\u00e4 paras yhdistelm\u00e4 helppoa navigointia ja upeaa grafiikkaa. Yksinkertainen, mutta tyylik\u00e4s p\u00e4\u00e4valikko tarjoaa linkit kaikkeen olennaiseen, mukaan lukien n\u00e4yttelyt, projektit, esill\u00e4 olevat taideteokset, lippujen tiedot, k\u00e4yntiajat ja j\u00e4senyys.\n<\/p>\n \n Sinun ei tarvitse vieritt\u00e4\u00e4 etusivua alas n\u00e4hd\u00e4ksesi kaikki n\u00e4m\u00e4 linkit. Tekstin ja kuvien sijaan he ovat k\u00e4ytt\u00e4neet videoita, jotka saavat sinut tuntemaan kuin seisoisit museossa.\n<\/p>\n \n He ovat my\u00f6s pit\u00e4neet intuitiivisen navigointikehyksen ennallaan koko sivustolla. Tarkasteletpa taidetta tai projekteja, et koskaan tunne olosi eksykseksi. Sivusto viestii taiteen ja maalausten monimutkaisuudesta suhteellisen yksinkertaisella tavalla, juuri sellaisella tavalla kuin tavalliset ihmiset haluaisivat kokea sen.\n<\/p>\n \n Kaikki tiet\u00e4v\u00e4t, ett\u00e4 verkkosivuston nopeudella on v\u00e4li\u00e4. Mutta kuinka nopea verkkosivustosi on oltava, on keskustelun aihe. Googlen tuoreen tutkimuksen mukaan yksi sekunti on ihanteellinen verkkosivun latausaika. Kuitenkin, jos verkkosivustosi lataaminen kest\u00e4\u00e4 jopa kolme sekuntia, voit silti hyvin, sill\u00e4 v\u00e4lit\u00f6n poistumisprosentti on enint\u00e4\u00e4n 32 %. Mutta jos latausaika pitenee edelleen, vaikkapa viiteen sekuntiin, poistumisprosentti on 90 %, kun taas kymmenen sekunnin viive johtaa 123 % kasvuun.\n<\/p>\n \n Google on suositellut nopeasti latautuvia verkkosivustoja jo jonkin aikaa. Se rajoittui kuitenkin vain henkil\u00f6kohtaisiin tietokoneisiin. Matkapuhelimien verkkoliikenteen lis\u00e4\u00e4ntyess\u00e4 Google on kuitenkin p\u00e4\u00e4tt\u00e4nyt asettaa sivun nopeuden mobiilihakujen sijoitustekij\u00e4ksi hein\u00e4kuusta 2018 alkaen. Sivuston latausnopeuden on siis oltava mahdollisimman korkea.\n<\/p>\n \n Ensimm\u00e4inen asia, joka sinun on teht\u00e4v\u00e4, on selvitt\u00e4\u00e4, kuinka paljon aikaa kuluu verkkosivustosi kunkin verkkosivun eri osien lataamiseen. Vaikka voit k\u00e4ytt\u00e4\u00e4 nopeusanalysaattority\u00f6kaluja, kuten WebPageTest<\/strong> tai Pingdom<\/strong>, ne eiv\u00e4t riit\u00e4.\n<\/p>\n \n N\u00e4hd\u00e4ksesi kuinka nopeasti kukin sivustosi elementti latautuu, voit napsauttaa hiiren kakkospainikkeella analysoitavaa sivua, klikata ”Tarkista” ja sitten ”Verkko”-v\u00e4lilehte\u00e4. Voit tehd\u00e4 t\u00e4m\u00e4n mill\u00e4 tahansa selaimella. Esimerkiksi lataus Web-sivun http:\/\/www.instantshift.com\/category\/web-design\/<\/a> eri elementtien k\u00e4ytt\u00f6aika Firefox-selaimessa on kuvattu alla. T\u00e4m\u00e4 analyysi antaa sinulle tiedot hitaan latautuvien elementtien tunnistamiseksi jokaiselta verkkosivulta.\n<\/p>\n \n Se n\u00e4ytt\u00e4\u00e4 my\u00f6s kuinka monta HTTP-pyynt\u00f6\u00e4 sivustosi tekee. HTTP-pyynt\u00f6jen m\u00e4\u00e4r\u00e4n v\u00e4hent\u00e4minen on loistava tapa parantaa sen nopeutta. Tunnista ja poista tarpeettomat kuvat, tekstit tai grafiikat, jos niit\u00e4 on.\n<\/p>\n \n Muita nopeutta parantavia vaiheita ovat sis\u00e4ll\u00f6njakeluverkon (CDN) k\u00e4ytt\u00f6, CDN:n tukeman ev\u00e4steett\u00f6m\u00e4n verkkotunnuksen k\u00e4ytt\u00e4minen staattisten tiedostojesi is\u00e4nn\u00f6imiseen, HTML-, CSS- ja JavaScript-tiedostojen pienent\u00e4minen ja yhdist\u00e4minen, Google PageSpeedin asentaminen palvelimellesi ja lyk\u00e4t\u00e4 JavaScriptin lataamista mm.\n<\/p>\n \n Sek\u00e4 teksti ett\u00e4 visuaalinen ilme ovat verkkosivuston kriittisi\u00e4 tekij\u00f6it\u00e4. Sivustosi ei kuitenkaan voi houkutella lis\u00e4\u00e4 verkkoliikennett\u00e4 saavuttamatta oikeaa tasapainoa n\u00e4iden kahden elementin v\u00e4lill\u00e4. Toisin sanoen grafiikan ei pit\u00e4isi ylitt\u00e4\u00e4 teksti\u00e4 ja p\u00e4invastoin.\n<\/p>\n \n Ihmisen aivoilla on kuitenkin taipumus muistaa visuaalisuus paremmin ja pidemp\u00e4\u00e4n. Itse asiassa ihmiset pystyv\u00e4t muistamaan 65 % visuaalisista kuvista l\u00e4hes kolme p\u00e4iv\u00e4\u00e4 my\u00f6hemmin, kun vastaava luku oli 10 % tekstisis\u00e4ll\u00f6st\u00e4. Sis\u00e4lt\u00f6si voi saada jopa 94 \u200b\u200b% enemm\u00e4n n\u00e4ytt\u00f6kertoja, jos lis\u00e4\u00e4t siihen houkuttelevia visuaalisia elementtej\u00e4 ja grafiikkaa.\n<\/p>\n \n Lis\u00e4ksi viraalinen visuaalinen sis\u00e4lt\u00f6 (videot, GIF-tiedostot ja kuvat) voi luoda lis\u00e4\u00e4 saapuvia linkkej\u00e4. Lis\u00e4ksi yh\u00e4 useammat ihmiset, erityisesti nuori sukupolvi, k\u00e4ytt\u00e4v\u00e4t verkkoa matkapuhelimillaan. Visuaalisen sis\u00e4ll\u00f6n lis\u00e4\u00e4minen on j\u00e4rkev\u00e4\u00e4, koska videon katsominen on paljon helpompaa kuin pitk\u00e4n kappaleen lukeminen mobiililaitteella.\n<\/p>\n \n Siin\u00e4 on kuitenkin saalis. Mit\u00e4 enemm\u00e4n ter\u00e4v\u00e4piirtovideoita, grafiikkaa ja kuvia, sivustosi latautuu hitaammin. Kuten edellisess\u00e4 kohdassa mainittiin, hitaammin latautuvat verkkosivustot lis\u00e4\u00e4v\u00e4t poistumisprosentteja. Hakukoneiden on my\u00f6s vaikea tunnistaa visuaalista sis\u00e4lt\u00f6\u00e4 tekstiin verrattuna. Yksi tapa ratkaista t\u00e4m\u00e4 ongelma on lis\u00e4t\u00e4 kuviin sopiva vaihtoehtoinen teksti.\n<\/p>\n \n Kun k\u00e4yt\u00e4t vaihtoehtoista teksti\u00e4, keskity avainsanakohdistuksen lis\u00e4ksi my\u00f6s k\u00e4ytt\u00e4jien tarkoitukseen. Katso esimerkiksi seuraavaa kuvaa. Se voi tarkoittaa monenlaisia \u200b\u200basioita. Voit n\u00e4hd\u00e4 t\u00e4m\u00e4n kuvan merkkin\u00e4 onnesta tai motivaatiosta tai jopa saavutuksen tunteesta.\n<\/p>\n \n Joten jos verkkosivustosi k\u00e4sittelee jotain, kuten henkil\u00f6kohtaista tai ammatillista menestyst\u00e4, ”tapoja saavuttaa tavoitteesi” mainitseminen vaihtoehtoisessa tekstiss\u00e4 on paljon parempi kuin pelkk\u00e4 ”tytt\u00f6 hypp\u00e4\u00e4m\u00e4ss\u00e4 auringonlaskun aikaan”.\n<\/p>\n \n Toisaalta masennusta ja neuvontaa k\u00e4sittelev\u00e4ll\u00e4 verkkosivustolla tulisi k\u00e4ytt\u00e4\u00e4 jotain ”masennuksen voittamisen luontaisella onnella” tapaa. \u00c4l\u00e4 kuitenkaan mene yli laidan kuvauksen kanssa. Sen ei pit\u00e4isi n\u00e4ytt\u00e4\u00e4 luonnottomalta, koska hakukoneet eiv\u00e4t pid\u00e4 avainsanojen t\u00e4ytt\u00e4misest\u00e4. K\u00e4yt\u00e4 asianmukaista ja merkityksellist\u00e4 kuvausta.\n<\/p>\n \n Visuaalinen ja tekstin tasapaino ei kuitenkaan v\u00e4ltt\u00e4m\u00e4tt\u00e4 ole symmetrinen. Voit j\u00e4rjest\u00e4\u00e4 n\u00e4m\u00e4 kaksi elementti\u00e4 ep\u00e4symmetrisesti, varsinkin jos aiot antaa web-suunnittelullesi ep\u00e4muodollisemman, modernimman tai rennomman ilmeen.\n<\/p>\n \n Dropboxin<\/strong> kotisivu on esimerkki tekstin ja visuaalien ep\u00e4symmetrisest\u00e4 asettelusta. Se tuo k\u00e4ytt\u00e4j\u00e4n huomion painopisteisiin v\u00e4litt\u00f6m\u00e4sti. Mutta visuaalisuus tai teksti eiv\u00e4t n\u00e4yt\u00e4 ylitt\u00e4v\u00e4n toisiaan.\n<\/p>\n \n Seedlip<\/strong>, tislattuja alkoholittomia alkoholijuomia myyv\u00e4 yritys, k\u00e4ytt\u00e4\u00e4 runsaasti v\u00e4lily\u00f6ntej\u00e4 sek\u00e4 lihavoituja fontteja ja yksinkertaista teksti\u00e4 aina kun mahdollista. Tekstin ja visuaalisen tasapainon on tarkoitus palvella hyvin kohdeyleis\u00f6\u00e4\u00e4n.\n<\/p>\n \n Huolimatta kaikista varotoimista, asiat voivat silti menn\u00e4 pieleen, mik\u00e4 voi johtaa verkkosivuston virheisiin. Vaikka et voikaan v\u00e4ltt\u00e4\u00e4 n\u00e4it\u00e4 ep\u00e4suotuisia virheit\u00e4 kokonaan, voit varmasti omaksua ne armollisesti. Potentiaaliset asiakkaasi ovat jo \u00e4rtynyt havaittuaan virheellisen verkkosivun. Miksi hieroa suolaa heid\u00e4n haavaansa humdrum (tai suorastaan \u200b\u200b\u00e4rsytt\u00e4v\u00e4ll\u00e4) virheilmoituksella? Valitettavasti t\u00e4m\u00e4 web-suunnittelun n\u00e4k\u00f6kohta j\u00e4\u00e4 suurelta osin huomiotta.\n<\/p>\n \n Vaikka k\u00e4ytt\u00e4j\u00e4si ovat kirjoittaneet v\u00e4\u00e4r\u00e4n k\u00e4ytt\u00e4j\u00e4nimen tai URL-osoitteen, v\u00e4lt\u00e4 heid\u00e4n syyllist\u00e4mist\u00e4 hinnalla mill\u00e4 hyv\u00e4ns\u00e4. P\u00e4invastoin, virheilmoitusten on oltava mahdollisimman k\u00e4ytt\u00e4j\u00e4yst\u00e4v\u00e4llisi\u00e4. K\u00e4yt\u00e4 aina kohteliasta kielt\u00e4 osoittaessasi virhett\u00e4. Esimerkiksi Mail Chimp<\/strong> k\u00e4ytt\u00e4\u00e4 seuraavaa virheenk\u00e4sittelykuvausta tavallisen viestin, kuten ”Annoit v\u00e4\u00e4r\u00e4n s\u00e4hk\u00f6postiosoitteen” sijaan.\n<\/p>\n \n Piccsy<\/strong> vie virheiden k\u00e4sittelyn aivan uudelle tasolle kevyen huumorin avulla. Jos kohtaat heid\u00e4n verkkosivustollaan ”404 – sivua ei l\u00f6ydy” -virheen, n\u00e4et t\u00e4m\u00e4n.\n<\/p>\n<\/a><\/p>\n\n 2 Helppo navigointi
\n<\/h3>\n\n A. V\u00e4hemm\u00e4n on enemm\u00e4n
\n<\/h5>\n\n B. Liiallinen luovuus voi olla haitallista
\n<\/h5>\n<\/a><\/p>\n<\/a><\/p>\n\n 3 Nopeasti latautuva verkkosivusto
\n<\/h3>\n<\/a><\/p>\n\n A. Tunnista kunkin elementin latausaika
\n<\/h5>\n<\/a><\/p>\n\n B. V\u00e4henn\u00e4 HTTP-pyynt\u00f6jen m\u00e4\u00e4r\u00e4\u00e4
\n<\/h5>\n\n 4 Visuaalien ja tekstin tasapainoinen k\u00e4ytt\u00f6
\n<\/h3>\n\n V. Muistamme visuaalit helposti
\n<\/h5>\n<\/a><\/p>\n\n B. Visuaalit tulevat maksamaan
\n<\/h5>\n<\/a><\/p>\n\n C. Ep\u00e4symmetrinen kuva-tekstitasapaino toimii my\u00f6s
\n<\/h5>\n<\/a><\/p>\n<\/a><\/p>\n\n 5 Oikea virheenk\u00e4sittely
\n<\/h3>\n\n A. Ole kohtelias
\n<\/h5>\n<\/a><\/p>\n\n B. K\u00e4yt\u00e4 kevytt\u00e4 huumoria
\n<\/h5>\n