Verkkosivuston julkaisijan tsekkauslista

Tällä kertaa LumoLinkin testaustiimi antaa kattavat vinkit, joilla nettisivuston julkaisija voi varmistua siitä, että julkaistavassa sivustossa perusasiat ovat kunnossa. Tämä niin sanottu checklist on tarkoitettu perussivustoille, sillä monimutkaiset sivustot ovat asia erikseen ja ne vaativat aina omat, sivustokohtaiset toimenpiteensä ennen julkaisua.

Erilaiset tsekkauslistat ovat arkipäivää monilla eri aloilla. Esimerkiksi lentäjät käyttävät omanlaisiaan tsekkauslistoja muistaakseen tehdä kaikki tarvittava ennen lentokoneen nousua. Kattavien varmistuslistojen avulla lento-onnettomuuksia onkin saatu ehkäistyä.

Verkkosivujenkin kohdalla varmistuslistat toimivat ja auttavat ennaltaehkäisemään lukuisia ongelmia. Tsekkauslistaa ei ole syytä väheksyä vaan se on hyvä ottaa käyttöön. Toki sitä voi aina muokata omiin tarpeisiinsa sopivaksi.

Pitemmittä puheitta me LumoLinkillä haluamme tässä ja nyt tarjota tosielämän verkkosivuhankkeissa toimivaksi todetun checklistin kaikkien verkkosivujen julkaisijoiden iloksi ja hyödyksi.

SISÄLTÖ

• Kaikki teksti on kirjoitettu oikein eikä sisällä kirjoitusvirheitä
• Sivujen ja sisällön muotoilut yhtenäisiä kaikilla sivuilla
• Väliaikaiset tekstit poistettu
• Kaikilla sivuilla on sisältöä
• Yksityisyyskäytäntö lisätty
• Tulostuksen tyylimääritykset olemassa ja testattu
• Favicon-kuvake luotu ja se näyttää oikeanlaiselta (Retina-näytöt huomioitu)
• Alatunnisteeseen sisältyy tekijänoikeuslauseke
• 404-virhesivu on olemassa ja informatiivinen
• Oikeat tekijät on määritetty sivujen ja postausten author-attribuuteissa (vaaditulla tavalla)

HAKUKONEOPTIMOINTI (SEO) JA ANALYTIIKKA

• Sivujen otsikot (title) ovat kuvaavia ja hakukoneystävällisiä
• Kaikki sivujen otsikot ovat uniikkeja
• Metatiedot sisällytetty ja tarkoituksenmukaisia
• H1-tageja käytetty sivujen otsikoissa ja vain yksi H1 per sivu
• XML-sivustokartta on generoitu ja lisätty palvelimelle sivuston juureen
• robots.txt on generoitu ja siirretty palvelimelle sivuston juureen
• 301-uudelleenohjaukset olemassa olevalle sivustolle on määritetty ja oikeassa paikassa
• Verkkosivusto on hakukoneiden saavutettavissa (poista sivujen noindex- ja nofollow-määritykset)
• Google Analytics ja tarvittavat analytiikka- ja seurantatyökalut asennettu

SOSIAALINEN MEDIA (SOME)

• Open Graph –tagit lisätty koko sivustolle ja oikeanlaisia? (mukaan lukien kuvat mahdollisuuksien mukaan)
• Sosiaalisen median tilit integroitu, linkittämällä oikeisiin osoitteisiin (URL)

HTML & CSS

• HTML on validia eli läpässyt validoinnin (tai tiedossa olevat ongelmat huomioitu)
• CSS on validia ja virheetöntä (tai tiedossa olevat ongelmat huomioitu)
• Bonus: CSS testattu työkalulla CSS Lint
• Sivuston linkit on testattu ja todettu toimiviksi
• JavaScript on virheetöntä

KÄYTETTÄVYYS JA ESTEETTÖMYYS

• Sivusto on halutun verkkosisällön saavutettavuusohjeistuksen (WCAG) tason mukainen
• ARIA Landmark Roles eli role-attribuutit määritetty
• Semanttiset otsikot ja rakenne käytössä
• Linkit erottuvat selvästi ja niiden tila :focus on määritetty
• Kuvissa käytetään asianmukaisia ALT-tekstejä
• Vaihtoehtoisia tapoja tarjolla käyttäjille, joilla JavaScript on kytketty pois päältä
• Lomakkeet ovat ulkoasultaan loogisia
• Otsikko- eli label-elementti yhdistetty jokaiseen lomake-elementtiin
• Värikontrastit testattu
• Sivuston käytettävyys ja esteettömyys on testattu sitä varten kehitetyllä ohjelmalla (esimerkiksi Total Validator Pro tai WAVE) ja havaitut ongelmat on ratkaistu (poikkeukset huomioitu)

RENDERÖINTI

• Näkyy ja toimii oikein selaimella Internet Explorer 9
• Näkyy ja toimii oikein selaimella Internet Explorer 10
• Näkyy ja toimii oikein selaimella Internet Explorer 11
• Näkyy ja toimii oikein selaimella Firefox (Windows)
• Näkyy ja toimii oikein selaimella Firefox (Mac)
• Näkyy ja toimii oikein selaimella Chrome (Windows)
• Näkyy ja toimii oikein selaimella Chrome (Mac)
• Näkyy ja toimii oikein selaimella Safari (Mac)
• Näkyy ja toimii oikein selaimella Safari (iOS, mobiili)
• Näkyy ja toimii oikein selaimella Safari (iOS, iPad)
• Näkyy ja toimii oikein selaimella Chrome (iOS, mobiili)
• Näyttää ja toimii oikein selaimella Chrome (iOS, iPad)
• Näyttää ja toimii oikein selaimella Chrome (Android, mobiili)
• Näyttää ja toimii oikein selaimella Chrome (Android, tabletti)
• Näyttää ja toimii oikein selaimella Android Stock Browser (AOSP)
• Näyttää ja toimii oikein selaimella Microsoft Edge
• Näyttää ja toimii oikein suurilla resoluutioilla

TOIMIVUUS

• Lomakkeet on testattu ja ne toimivat kunnolla
• Pakolliset eli vaaditut lomakekentät on testattu
• Käy läpi syötteen validointi (minimi- ja maksimipituudet, merkkimäärärajoitukset)
• Lomakkeiden tiedot lähetetään halutuille vastaanottajille
• Lomakkeiden lähetys avaa tietyn verkko-osoitteen tai lomakelähetyksiä voidaan seurata muilla tavoilla
• Lomakkeet toimivat ongelmitta JavaScriptin ollessa pois käytöstä
• Sivuston hakutoiminto toimii ja hakutulokset esitetään halutulla tavalla

NOPEUSOPTIMOINTI

• Kuvatiedostot on optimoitu
• CSS-koodit on minimoitu ja yhdistetty
• JavaScript-koodit on minimoitu ja yhdistetty (niin paljon kuin suinkin mahdollista)
• Ota käyttöön gzip-pakkaus
• Varmista, että vain tarpeelliset fontit, painot eli lihavointiarvot ja merkistöt on asennettu
• Aja Googlen nopeustesti ja optimoi sen mukaisesti (pisteet ja tiedetyt ongelmat syytä ottaa talteen)
• Aja verkkosivutesti ja optimoi sen mukaisesti (tulokset talteen)
• Ota tarvittaessa käyttöön CDN (Content Delivery Network) ja välimuistiin tallentaminen (caching)

TURVALLISUUS

• Salatut alueet on suojattu ja myöskään hakukoneilla ei ole pääsyä niihin
• Sisällönhallintajärjestelmän sisäänkirjautumisen oletus-URL on vaihdettu
• Sisällönhallintajärjestelmän oletuskäyttäjänimi on vaihdettu
• SSL-sertifikaatti on voimassa ja aktivoitu

JULKAISUN JÄLKEEN

• Varmista sivuston näkyvyys hakukoneille
• SSL-sertifikaatit oikein asennettu
• Kuvat, muut mediaelementit ja linkit viittaavat toimiviin verkko-osoitteisiin (URL)
• Verkkofontit integroitu ja ne toimivat oikein julkaistulla sivustolla
• Verkkofontit siirretty omalle palvelimelle (tarvittaessa)
• 301-uudelleenohjaukset oikein määritetty ja toimivat kunnolla
• Verkkosivuston URL on lähetetty Googlelle
• Luo uusi sitemap.xml ja siirrä se palvelimelle sivuston juureen
• Sivusto lisätty Google Search Consoleen ja sivustokartta lähetetty
• Analytiikka on asennettu ja integroitu sivustolle

Meidän tsekkauslista perustuu tähän erinomaiseen englanninkieliseen tsekkauslistaan.