Bästa webbdesignpraxis för ditt nästa webbplatsprojekt

Vad orsakar den stora skillnaden mellan vad vissa WordPressutvecklare kostar jämfört med andra? Att svara på denna fråga kräver ett övervägande av anledningen till varför du vill ha en webbplats i första hand.

Vissa utvecklare fokuserar på den bokstavliga slutprodukten: kombinationen av kod som resulterar i en trevlig webbdesign.

Men utvecklare med marknadsföringskunskaper ägnar sig åt mer än att bara bygga något som ser bra ut. De fungerar som konsulter till kunder som vill uppnå specifika mål med sina webbplatser.

Att anlita någon för att bygga en webbplats som inte verkar intresserad av/ ställer inte frågor om dina slutmål kan därför vara en röd flagga. Det är viktigt att vara ärlig om att även den vackraste webbdesignen kanske inte är idealisk när det gäller att få besökare att konvertera till kunder.

Med det sagt kommer 94% av dina besökare att bedöma din trovärdighet baserat på din webbdesign.

Så istället måste du fokusera på att använda din design för att erbjuda den perfekta användarupplevelsen. Du måste göra det enkelt för besökare att hitta den information de sökte efter på din webbplats i första hand och samtidigt vägleda dem mot målkonverteringsaktiviteter.

Bästa webbdesignpraxis fokuserar på korsningen mellan att skapa en vacker webbplats och en som tjänar ditt företag.

Föredrar du att titta på videoversionen?

Vad definierar bästa webbdesignpraxis?

Alla och deras mamma har säkert åsikter om vad som utgör en väldesignad webbplats.

Men låt oss tygla allas åsikter genom att lyssna på experterna.

Enligt Orbit Media kan du gruppera bästa webbdesignpraxis i dessa tre grundläggande kategorier av standarder:

• Varumärkesstandarder: Du kan vara mer bekant med detta koncept som ”branding”, ”stilguider” eller ”mood boards”. Dessa standarder inkluderar allt som har att göra med hur en webbplats ser ut och innebär användning av färger, typografi och element som är specifika för den specifika verksamheten.
• Kodningsstandarder: Webbplatser ska byggas enligt de programmeringsstandarder som är framtagna av W3C, det internationella samfundet som arbetar tillsammans för att utveckla webstandarder.
• Tillgänglighetsstandarder: Tillgång till information är en grundläggande mänsklig rättighet som erkänts av FN:s konvention om rättigheter för personer med funktionsnedsättning. Förutom det får en tillgänglig webbplats positiva effekter – inte bara på försäljning men också SEO. W3C delar en grundläggande lista över standarder som du måste följa för att utforma en tillgänglig webbplats. Vi skriver mer om relaterade bästa webbdesignpraxis senare i den här artikeln.

Låt oss titta på hur man utvecklar webbdesignpraxis baserat på var och en av dessa standarder:

Varumärkesstandarder

Webbplatser som saknar konsekvent branding kan vara stressande att interagera med och orsakar lätt förvirring. Därför bör det inte komma som en överraskning att 38% av webbplatsbesökare har sagt att de kommer att sluta engagera med en webbplats om innehållet eller layouten är oattraktiv.

Kom ihåg att utseende inte är allt, men det här är några grundläggande designprinciper att överväga för att skapa en webbplats som människor vill använda:

Balans

Balans är designprincipen som föreskriver hur man effektivt fördelar visuella element. I allmänhet ser en balanserad design ren och naturlig ut och har god symmetri (även om det inte nödvändigtvis är ett villkor för balans).

Du kan införliva balans i webbdesign genom sidlayouten.

Att centrera text eller andra element över sidan är ett enkelt sätt att göra det. I allmänhet är webbsidor byggda på ett rutnät system, vilket skapar en form av balans. Du kan använda CSS float-egenskapen för att placera element och balansera dem över sidan.

Balans kan uppnås på 3 sätt:

1. Symmetrisk design

Ordna element på ett jämnt sätt över webbsidan. Till exempel, om du har ett tungt element till vänster, borde du ha ett tungt element till höger. Centrering är det enklaste sättet att uppnå symmetri, men det kan ibland kännas platt eller tråkigt.

För att undvika att sidan ser monoton ut kan du skapa balans med olika element, till exempel balansera en stor bild med ett textblock. Det finns också en typ av symmetrisk balans som kallas radiell balans, där objekt utstrålar från en central punkt.

2. Asymmetrisk design

Detta är mer utmanande att göra bra, men asymmetrisk design innebär en ojämn fördelning av element på en sida. Till exempel kan du ha ett stort element i mitten, vilket balanseras av ett mindre längre bort.

Du kan använda andra delar av design, såsom färg eller textur, för att balansera en asymmetrisk design.

3. Felbalans

Dessa typer av designer föreslår rörelse och handling, vilket kan göra vissa obekväma. Om din webbplats har för avsikt att få folk att tänka, då är en felbalanserad design helt rätt för dig.

Komposition

Termen komposition innebär placering och organisation av designelement.

Tredjedelsregeln används ofta för att skapa balanserad komposition, särskilt med foton.

Avstånd

Element bör vara jämnt fördelade så att användarna kan skilja mellan sektioner, eller mellan block.

Du bör också införa negativt utrymme eller utrymmet mellan och runt ämnet för en bild. Negativt utrymme kan minska visuellt brus, öka läsbarheten och ge balans.

Du kan introducera negativt utrymme genom att lägga till marginaler och spaltfyllnad runt dina designelement.

Fokuspunkt

Skapa ett fokusområde dit du vill dra uppmärksamheten. Det borde vara den viktigaste delen av din sida, och helst bör varje sida fokusera på bara ett huvudfokus.

Färg

Färg är ett viktigt designelement när det gäller branding. Helst kommer du in i webbdesignprocessen med en förståelse för webbplatsens färgschema du vill ska associeras med ditt varumärke.

För webbdesign specifikt hjälper det att börja med en mood board för ditt varumärke.

Välj en primär och sekundär färg (den sekundära färgen kan komplettera eller kontrastera med den primära färgen), och en ljusare och mörkare nyans för båda färgerna. Begränsa din användning av färg så att olika accenter inte blir jobbiga för ögonen.

Adobe Color är ett utmärkt gratisverktyg för att testa olika kombinationer av färger för att skapa en arbetspalett för Webbplatselement.

När du bestämmer dig för färg är det också viktigt att tänka på personer som är färgblinda, vilket inkluderar upp till 4,5% av världens befolkning.

Det finns tre typer av färgblindhet (total färgblindhet, tvåfärgat seende och defekt färgseende) så se till att din design fortfarande är användbar med tanke på personer som kanske inte kan skilja färger åt.

Kontrast

När du väljer färg är det viktigt att vara medveten om färgförhållanden och kontrast.

Färgkontrast avser skillnaden i ljus mellan förgrund och bakgrund. Med hjälp av tillräckligt kontrasterande färger kan webbplatsens synlighet lätt särskiljas. Använd i allmänhet färgalternativ med hög kontrast – som svart text på en vit bakgrund – för att göra din webbplats läsbar.

Kontrastförhållande är det numeriska värdet som tilldelas skillnaden i kontrast mellan sidelement.

World Content Accessibility Guidelines (WCAG) 2.0 rekommenderar ett kontrastförhållande på 4,5:1 för normal text. WebAIM delar några förutbestämda kombinationer som har ett perfekt kontrastförhållande för att hjälpa dig att visualisera bästa webbdesignpraxis.

För att hjälpa till att navigera detta förhållande, se till att du planerar för alla målgrupper (inklusive de med tillgänglighetsproblem) när du utformar din webbplats. Det är lättare jämfört med att ta itu med dessa frågor efter att allt är klart.

Överväg alla aspekter av webbplatsen folk kommer interagera med, inklusive header, sidfot, menyer – alla måste vara lätt synliga för att kunna användas.

Här är några verktyg för att kontrollera färgkontrastförhållanden:

• Color contrast checker från Level Access.
• Contrast Ratio.
• WCAG 2.0 AA & AAA Color contrast checker, som bygger på riktlinjerna från WCAG 2.0.

Typografi

Webbplatstypografi är ett annat viktigt övervägande när det gäller branding.

Det finns många olika källor för att hitta potentiella typsnitt att använda på din webbplats, men du bör först överväga de alternativ som kommer att visas konsekvent oavsett vilka typsnitt slutanvändaren har installerat på sin dator.

Google Fonts erbjuder ett brett utbud av gratis webbsäkra typsnitt som du kan räkna med kommer visas korrekt, oavsett användarens installerade typsnitt/program. Se till att du inkluderar typsnitt i din mood board för att se om de matchar din färgestetik.

Om du har problem med att komma på kombinationer kan Google Fonts föreslå populära parningar. Du kan också använda en webbplats som FontPair för att få förslag.

Försök att begränsa typnittsvikterna du använder eftersom det kan bidra till långsam sidhastighet att behöva ladda för många filer. När vi ändå är på ämnet: överväg att hosta Google Fonts lokalt för att få ytterligare prestandafördelar.

När det gäller att välja typografiska element baserade på bästa webbdesignpraxis är en allmän tumregel att använda sans-serif-typsnitt för rubriker och serif-typsnitt för innehåll. Använd åtminstone inte dekorativa typsnitt för brödtextsinnehåll, eftersom det blir svårt att läsa.

Frestas inte heller att använda en mängd olika typsnitt på din webbplats. En bra tumregel är att använda ett typsnitt för din logotyp, ett annat för dina menyer/rubriker och ett till för brödtext. Prova att para ihop typsnitt som kompletterar varandra, till exempel sådana som kommer från samma typsnittsfamilj.

Elementhierarki

Hierarki handlar om arrangemanget av designelement som visar deras relativa betydelse. Detta uppnås genom att manipulera element som visuell kontrast, storlek och placeringar av uppmaningar till handling.

Till exempel måste innehållet delas upp i logiska block så att användarna kan skilja avsnitt från varandra.

Du kan göra detta genom att använda innehållsrubriker, som inte bara gör det enkelt för användare att hoppa till de delar som de vill läsa, men också bryta upp stora mängder text i läsbara bitar så att skärmläsare kan avgöra sammanhanget för varje avsnitt.

Om du letar efter användbara visuella illustrationer över dessa designkoncept och mer, går Tilda Publishing Blog igenom några av de vanligaste webbdesignmisstagen och hur du fixar dem.

Bästa design/formateringspraxis för webben

Enligt forskning från Orbit Media finns det några vanliga standarder inom webbdesign som återkommit i de 50 bästa marknadsföringssajterna.

Med ”standarder” menar de att 80% av webbplatserna använder en liknande designmetod:

• Logo i övre vänstra hörnet.
• Horisontell huvudnavigering längst upp på varje sida.
• Värdeförslaget högt på hemsidan så det syns utan att behöva bläddra nedåt. Observera att de flesta webbdesigners kommer att säga att det inte finns någon standard pixelhöjd för webbläsare och tekniskt sett ingen gräns mellan vad som syns direkt och vad som inte gör det. Men i allmänhet bör viktiga designelement visas högt på sidor som i allmänhet är synliga för de flesta besökare, även utan att bläddra nedåt.

Här är några bästa webbdesignpraxis för vanliga webbplatselement:

Bilder

Bästa webbdesignpraxis för att använda bilder skulle kunna inspirera till många hyllmeter av råd, men låt oss fokusera på det viktigaste i denna diskussion om bästa webbdesignpraxis:

• Lägga till ALT-text. Bilder kan inte behandlas med skärmläsare om inte ALT-text används. Att lägga till ALT-text bidrar också till SEO, men vissa webbplatser använder ALT-text endast för att komplettera sin sökordsstrategi. En mer användbar användning av ALT-text skulle vara att beskriva bilden – men du kan absolut tillfredsställa sökrobotar och skärmläsare samtidigt med rätt tillvägagångssätt.
• Att använda bilder med mänskliga ansikten tenderar att vara effektivare än annan grafik eller animeringar. Det gör folk mer benägna att engagera med bilden, eftersom folk dras till vad de uppfattar som verklig empati och känslor.
• Använd responsiva bilder, som växer eller krymper beroende på webbläsarens storlek. Detta hjälper till med både webbplatsens hastighet och SEO.
• Glöm aldrig favicons. Favicons är de små ikonerna som dyker upp bredvid webbplatsens titel och i sökresultat också. Det hjälper med varumärkeskännedom och förbättrar webbplatsens UX.

Webbplatsnavigering

Användare förväntar sig att enkelt kunna hitta det innehåll de söker efter på en webbplats. Således är det viktigt för webbplatsnavigering att vara enkel och okomplicerad.

Webbplatsnavigering är en allmän term som hänvisar till den interna länkarkitekturen för en webbplats. Glöm inte att huvudsyftet med navigering är att hjälpa användare att enkelt hitta relevant innehåll på din webbplats.

Webbplatsens interna länkarkitektur utgör grunden för din webbplatskarta, vilken hjälper sökmotorer att hitta ditt innehåll lättare. Det har visat sig att en väl utformad webbplats där innehållet är lätt att hitta positivt påverkar webbplatstrafiken du får från sökmotorer (tillsammans med en högre chans att få Google webbplatslänkar).

Menynavigering

Det finns flera aspekter som utgör webbplatsen navigering, men din topp/huvudmeny bör vara ett primärt fokus eftersom den kommer att vara ett av de första elementen som användare interagerar med när de besöker din webbplats.

Det finns olika sätt att designa en webbplatsmeny men de mest populära inkluderar:

Navigeringsmeny

Helst syns denna klart och tydligt på en webbplats redan från första sidan. Detta kan innebära användning av en rullgardinsmeny om det finns flera kategorier. Rullgardinsmenyer är dock inte rekommenderade, speciellt när det gäller teknisk SEO (de är svårare att genomsöka). Dessutom har det visat sig att många ogillar rullgardinsmenyer.

Detta beror på att det mänskliga ögat är snabbare än handen, så folk tycker det är irriterande när de redan har bestämt vad de ska klicka på och något annat faller ner — vilket kan leda till en minskning av besök på sidor.

Hamburgaremeny

En hamburgaremeny används främst för en mobiloptimerad design, och ligger vanligtvis längst upp till vänster eller höger på sidan. Den ser ut som en kvadrat med tre linjer som kan expanderas med ett klick. Men många designers föraktar hamburgaremenyn, vilket har inspirerat webbutvecklare att överväga nya sätt att göra mobil webbplatsnavigering roligt och funktionellt.

Här är några tips för att designa navigeringen baserat på bästa webbdesignpraxis:

• Lägg till ett sökfält för att hjälpa användare att enkelt hitta innehåll (så här förbättrar du WordPress sökfunktionalitet). Detta är särskilt användbart för webbplatser som har mycket innehåll, som en nyhetsblogg.
• Designa din webbplats med treklicksregeln, som säger att användare ska kunna hitta önskad information med högst tre musklick. Detta beror på att användare faktiskt föredrar att navigera genom en webbplats snarare än att titta igenom sökresultaten, när det är möjligt.
• Gör dina menytitlar beskrivande (med sökord i åtanke), vilket hjälper användare att hitta objekt lättare och också bidrar positivt till SEO.
• Menyobjektens placering är viktig. Sätt de viktigaste sidorna längst fram i din meny så att de är lättillgängliga.
• Ha högst 7 menyobjekt, inte bara för att hålla webbplatsdesign ren men också för att för många menykategorier potentiellt kan påverka din förmåga att ranka i sökresultaten. Google kan tolka dessa till synes orelaterade kategorier som ett tecken på att din webbplats inte har bestämt sig för en specifik nisch.

För ett bekvämare format, här är en praktisk infografik:

Kodningsstandard

Med så många webbplatser som skapas och konsumeras globalt finns det verkligen ett behov av en standardiserad uppsättning kodningsprinciper. Vissa aspekter av dessa webstandarder inkluderar:

SEO

SEO kan användas för att öka antalet besökare på din webbplats organiskt (utan annonser). Eftersom det är för komplicerat att gräva allt för mycket i SEO i ett delavsnitt i en artikel, kolla in vår SEO-checklista och våra tips över bästa SEO-plugins för WordPress för att bekanta dig med denna aspekt av bästa webbdesignpraxis.

Observera att följande kodningsstandarder tips går hand i hand med SEO.

Mobil responsivitet

Responsiv design handlar om att skapa en bra användarupplevelse, oavsett vilken enhet eller webbläsare som används för att läsa din webbplats.

Det är viktigare idag än någonsin att designa din webbplats för att vara responsiv eftersom mer än 60% av internetanvändare använder internet via sina mobiltelefoner, och hälften av alla e-handelstransaktioner görs via mobila plattformar. Dessutom prioriterar Googles nya sökalgoritm också mobilvänliga webbplatser.

Att ha en responsiv webbplats hjälper inte bara användarna att navigera på din webbplats enklare, utan bidrar också till ökat engagemang och konverteringar. Användare rekommenderar varumärken med vilka de har en positiv, mobil-responsiv webbplatsupplevelse, och omvänt; de skulle inte bara sluta köpa från varumärken med en dålig mobil webbplatsupplevelse utan kommer också aktivt avskräcka andra från att göra det.

Men trots efterfrågan på en responsiv webbplats har uppskattningsvis 91% av småföretagen inte detta. Det borde de ordna; att utforma en mobilt responsiv webbplats lönar sig. 62% av företag har rapporterat en ökning av försäljningen efter att de utformat en responsiv webbplats.

Läs mer på Kinstas resurs om hur du gör din webbplats mer mobilvänlig vilket innehåller en lista över de bästa mobila pluginsen för WordPress att ladda ner, och se till att kolla in denna kurerade lista över de bästa WordPressteman, där du kan bläddra igenom massor av responsiva teman. Google erbjuder också några tips för hur du utformar en responsiv webbplats.

Webbplatssäkerhet

En annan viktig kodningspraxis? Skapa säkra program och webbplatser som användare kan lita på med sina känsliga personuppgifter. I motsats till vad många tror söker inte hackare aktivt efter specifika webbplatser att hacka, vilket är anledningen till att även små webbplatser är sårbara för attack.

Som helhet är WordPress allmänt säker, men det hjälper till att vidta extra försiktighetsåtgärder för att hålla din webbplats trygg mot attacker

Här är några av de bästa säkerhetspraxis för webbplatser:

• Skaffa ett SSL-certifikat, vilket är särskilt viktigt för webbplatser som hanterar betalningar och personuppgifter. SSL-certifikatet krypterar information som skickas ut via nätverk så att hackare har svårt att avkoda den. Dessutom är det en industristandard. Chrome varnar besökare när webbplatsen de besöker inte har ett SSL-certifikat. Utöver detta har Chrome börjat avveckla äldre TLS-versioner och visar nu ytterligare varningar. Aktivera HTTPS (en del av att installera ett SSL-certifikat) som också är en officiell Google-rankningsfaktor.
• Håll dina inloggningsuppgifter säkra. Flera attacker orsakas av att hackare med kraft försöker få åtkomst till en webbplats. Det hjälper att ha en separat/dold inloggningssida (använd WP Hide Login-pluginet) och att begränsa antalet inloggningsförsök. Använd Login LockDown-pluginet, som registrerar IP-adressen och tidsstämpel för varje misslyckat inloggningsförsök och låser inloggningsfunktionen om antalet misslyckade försök från samma IP-intervall nås på kort tid. Skapa också ett säkert lösenord som är mer än 6 tecken och är en blandning av både stora och små bokstäver, siffror och specialtecken. Ändra ditt lösenord ofta. Du kan också använda tvåfaktorsautentisering för att logga in om du vill ha extra säkerhet.
• Håll WordPresskärnan, plugins och teman uppdaterade. Glöm inte att ladda ner plugins eller teman från en ansedd källa. Ett gott tecken är om pluginet/temat har installerats många gånger och nyligen uppdaterats. Du bör också läsa recensioner för att avgöra själv om pluginet är trovärdigt (se till att kolla de som listas här). Ladda också ner ett säkerhetsplugin som Wordfence, Sucuri, eller Defender, eftersom 73,2% av de mest populära WordPress-installationerna som är sårbara kan upptäckas med gratis automatiserade verktyg. Här är en mer djupgående lista över de bästa säkerhetspluginsen.
• Använd ett säkert webbhotell. För den som inte är så insatt kanske det inte verkar som ditt webbhotell har något att göra med webbplatsens säkerhet, men 41% av attackerna uppstår genom en säkerhetsproblem på hostingplattformen. Leta efter ett webbhotell som inkluderar funktioner som: brandvägg på serversidan och kryptering, webbservrarna NGINX eller Apache, antivirus- och antimalware-programvara, säkerhetssystem för webbplatsen, och tillgång till SSL-certifikat och ett CDN.

För mer information om WordPress-säkerhet, kolla in vår omfattande resurs om hur du håller din WordPress-sajt säker.

Sidhastighet

Ungefär hälften av användarna förväntar sig att en webbplats ska laddas på 2 sekunder eller mindre, och om det tar längre tid än så, kommer 40% inte att tveka att lämna sidan, och (antagligen) aldrig återvända.

Förutom webbplatsbesök är sidhastighet viktigt eftersom det också påverkar konvertering och intäkter. För varje sekund av tillagd sidladdningshastighet kommer försäljningen att sjunka med upp till 27%. Ökad webbplatshastighet kan förhindra förlusten av 7% av möjliga konverteringar.

Här är några sätt att få dina webbsidor att laddas snabbare:

• Använd ett innehållsleveransnätverk (CDN), som tar statiska filer som bilder, CSS och JavaScript , och levererar dem via den server som ligger närmast användarens fysiska plats.
• Tänk på hur du använder bilder. Den genomsnittliga webbplatsen använder 1,8 MB bilder, vilket representerar 60% av webbplatsens storlek. För att hjälpa till med det, ompröva hur du disponerar din webbsida. Om du vill ha snabb sidhastighet, försök att minska antalet stora bilder som används i din design och se till att optimera dem.
• Om din webbplats behöver använda massor av stora bilder, använd plugins som inkluderar funktionalitet för Gzip-komprimering, cachning, eller bildoptimering, såsom WP Rocket och Imagify. De kan hjälpa till att göra dina filer mindre (utan att offra kvalitet) så att de laddas snabbare.
• Tänk på antalet plugins och filer du sparar i din WordPressdatabas eftersom de också kan påverka sidladdningshastigheten. Städa upp de du inte använder. Medan du håller på, håll din PHP, WordPresskärna och plugins uppdaterade till sina senaste versioner.

Kolla in vår omfattande artikel om webbplatshastighetsoptimering.

Tillgänglighetsstandarder

Internet var utformat för att fungera för alla människor, oavsett den specifika hårdvaran, programvaran, språket de använder, deras förmåga eller plats. Men många offrar tillgänglighet för en vacker design.

Tillgänglighet handlar om att göra din webbplats användbar för alla.

Förutom personer med funktionshinder som påverkar tillgängligheten säger W3 att webbplatstillgänglighet också är fördelaktigt för:

• Personer som använder enheter med små skärmar, olika inmatningslägen etc.
• Äldre personer.
• Personer med ”tillfälliga funktionshinder” inklusive en bruten lem, borttappade glasögon eller ett medicinskt tillstånd.
• Användare med ”situationsbegränsningar”, t.ex. användare som använder Internet på enheter i starkt solljus eller i en miljö där de inte kan lyssna på ljud, t.ex. kollektivtrafik.
• Personer med en långsam internetuppkoppling.

Tillgänglighet bör vara allas prioritet eftersom vi alla påverkas av det på något sätt.

Skäl att göra din webbplats tillgänglig

Fortfarande inte säker på att det är värt att spendera din tid på tillgänglighet i denna diskussion om bästa webbdesignpraxis?

Tänk på dessa skäl:

• Det är ett ADA-krav. Americans with Disabilities Act (ADA) antogs 1990 för att skydda de medborgerliga rättigheterna för personer med funktionshinder från diskriminering. Det täcker saker som transport, telekommunikation, sysselsättning och till och med byggkoder. Eftersom denna lag antogs för nästan 30 år sedan – en tid då internet inte var så allestädes närvarande – försöker lagstiftare att ändra den.
• Det främjar inklusivitet. En undersökning från Pew Research Center visar att personer med funktionsnedsättning går online tre gånger mer sällan än sina motsvarigheter utan funktionshinder, vilket är synd eftersom statistiken visar att runt 30% av yrkesverksamma har ett funktionshinder, och 62% av personerna med funktionshinder ”flyger under radarn” av rädsla för negativ bias.
• Det hjälper dig att få mer affärer. Genom att vara mer inkluderande kommer du att ta emot ett nätverk av personer med funktionshinder, som representerar $7 biljoner i disponibel inkomst
• SEO fördelar. Sökmotorer belönar webbplatser som är tillgänglighetsanpassade för att uppmuntra fler webbplatser att vara tillgängliga.

Så gör du din webbplats mer tillgänglig

Ett enkelt sätt att göra din webbplats mer tillgänglig är att installera pluginet WP Accessability som lägger till tillgänglighetsfunktioner som:

• Ett verktygsfält där användare kan ändra storlek på typsnitt och visa din webbplats i hög kontrast och gråskala.
• Jämföra färgkontrasten för att kontrollera om det passar ADA:s standard.
• Ta bort titelattribut från bilder som är infogade i innehåll. De flesta skärmläsare kan inte känna av detta och läser ankartexten istället.
• Aktivera överhoppningslänkar, som är interna sidlänkar som låter användare hoppa direkt till innehållet, vilket är användbart för personer som använder skärmläsare.

Några ytterligare steg att ta:

• Lägg till undertexter eller ett transkript om din webbplats producerar media som ljud, ljudböcker, videor, podcaster, och så vidare, för att gynna personer med nedsatt hörsel, liksom människor som vill ta del av ditt innehåll men inte kan konsumera media offentligt.
• Skapa tangentbordsåtkomliga länkar och menyer för personer som har rörelsehinder och bara kan använda ett tangentbord (inte mus) för att navigera på din webbplats. Rullgardinsmenyer rekommenderas inte, men du kan åtgärda det genom att tilldela genvägar för varje rullgardinsalternativ (till exempel: tryck på ”1” för startsidan, ”2” för sidan Om, etc.).
• Slutligen, testa din webbplats för webbplatstillgänglighet. Web Accessibility Initiative stöder inte något specifikt verktyg utan erbjuder istället en lista över verktyg du kan använda för att granska ditt arbete.

Sluttankar: Bästa webbdesignpraxis för ditt nästa webbplatsprojekt

Bra webbplatser bör inte definieras av objektivt god design. Lika viktigt är webbplatsens användbarhet, enkel navigering och tillgänglighet. Beväpnad med dessa bästa webbdesignpraxis har du allt du behöver för att skapa något som ser ut och fungerar bra.

Tänk bara på att det här är bästa praxis för just webbdesign. Troligtvis kommer du inte kunna följa var och en exakt, beroende på vilken typ av din webbplats du driver. Men innan du kan bryta reglerna hjälper det att åtminstone vara medveten om varför de existerar.

Missade vi nåt viktigt? Dela din bästa webbdesignpraxis i kommentarerna nedan!

Lästips: Bästa webbdesignkurser online