Innehåll

• Att gå
• Metod 1 av 2: De 3 grundläggande reglerna
• Metod 2 av 2: Riktlinjer
• Tips
• Varningar

Att designa en bra webbplats kan verka som en skrämmande uppgift, men så länge du håller grunderna i åtanke kommer du att tycka att processen är intressant och rolig. Det handlar om mer än bara snyggt utseende! Vi visar dig grunderna och några allmänna riktlinjer som hjälper dig att designa webbplatser som människor kommer att besöka om och om igen.

Att gå

Metod 1 av 2: De 3 grundläggande reglerna

1. Regel 1:Lyssna på din klient. Du kan utforma "världens största webbplats någonsin i universums historia och vidare" med rika svarta, raffinerade teckensnitt och ljusa, konstnärliga färger för en webbplats som skriker "utforska mig nu!" Tyvärr ville din klient ha en orange menyrad med ljusrosa och orange bokstäver. Du har fått sparken, och din bästa webbplats någonsin - som klienten har rättigheterna till - finns någonstans på deras reservdisk utan att någon någonsin ser den igen.
   • Studera din kunds företagsidentitet. Låt klienten visa dig några webbplatser de älskar. Detta kommer inte bara att ge dig en uppfattning om vad de gillar, det kommer också att ge dig några designidéer som du kanske inte har tänkt på.
   • Om du trodde att vi skojade den orange och rosa webbplatsen, överväg den här coola, sofistikerade webbplatsen:
2. Regel nr 2:Känn din publik och vad de letar efter och anpassa din design därefter. Anledningen till att människor har webbplatser är att de vill att andra ska se dem. Det kan vara informativt eller kommersiellt eller att underhålla en specifik målgrupp. Ditt jobb som designer är att veta vem du designar för och att hålla dem kvar på sidan när de landar där.
   • Du kanske tänker "Om det ser bra ut kommer de att stanna." Men detta behöver inte nödvändigtvis vara fallet. Ta till exempel fastigheter. Här är en webbplats med en ren, rolig design. Det har mycket vitt utrymme som ger ett öppet utseende, ljusa färger och ett modernt widescreen-format med länkar på en framträdande plats:
   • Titta nu på detta tillvägagångssätt för att sälja fastigheter i samma område: rörigt och mycket upptagen, tråkiga färger och täckt av reklam.
   • Gissa vilken som fungerar bättre för dem som letar efter ett hem? Rätt, den där hus! När människor söker efter "bostäder till salu i Santa Monica" bryr de sig inte om hur en webbplats ser ut. De vill inte läsa om fastighetsmäklaren eller se vackra bilder av staden. De vill se hus.
3. Regel 3:Lyssna på dig själv. Du förstår vad kunden vill ha och du vet vad din marknad letar efter. Nu är det äntligen dags att vara uppmärksam på dig, designern!
   • Bygg en mall i det grafikprogram som du väljer. Gör elementen på din sida i olika lager (så att du kan justera saker senare utan att förstöra hela mallen). Dessa element kan vara:
     • Rubrik. Detta är ett element som är detsamma på varje sida på din webbplats. Sidhuvudet består av webbplatsens titel och logotyp, samt länkar till andra delar av webbplatsen (t.ex. Om, Kontakt etc.). Visuellt och praktiskt kommer detta att knyta ihop allt. Det är bra praxis att länka den första knappen i en menyrad till hemsidan.
     • Låt oss till exempel titta på Apple:
     • Som med de flesta Apple-saker har deras hemsida en mycket ren, enkel design. Observera menyraden längst upp, med logiska ämnen för varje knapp, plus ett sökfält - alltid en bra idé om din webbplats stöder den. Låt oss nu titta på en målsida för en av knapparna, iPad, för att se några element:
     • Menyfältet ändras endast genom att göra iPad-knappen mörkare.
     • Ämnet för målsidan visas med stora svarta bokstäver.
     • En ny undermeny visas så att du kan lära dig mer om produkten. Om du klickar på en av dessa knappar ser du att varje sida erbjuder nytt innehåll beroende på ämne, men kommer att vara identiskt i layout och design.
     • Ofta kommer varje huvudämne i din menyrad att ha olika underrubriker som du kan fylla i. Istället för att skapa en andra menyrad kan du använda popup-menyer som detta exempel från Musicians Friend:
     • Sidofält. Detta kommer att visas på många sidor på din webbplats, men inte nödvändigtvis alla - sammanhanget avgör. Det är emellertid ett mycket viktigt inslag och måste utformas noggrant för att vara intuitivt och inte för rörigt. Till skillnad från menyraden kan innehållet i ett sidofält vara väldigt dynamiskt. Kolla in dessa två sidofält från fastighetsmarknadsföraren Trulia Det första är för köpare:
       
       

Metod 2 av 2: Riktlinjer

1. Utforma ett bra användargränssnitt. Placera de olika elementen på webbplatsen som titel, sidofält, logotyper, bilder och text på samma plats på varje sida för att göra din webbplats navigerbar och intuitiv.
   • Håll samma rubrik högst upp på varje sida. Oavsett om webbplatsens innehåll tillåter många upprepande element eller inte, se till att toppen på varje sida är densamma.
   • Använd logik i din design. Elementen på en sida bör ordnas logiskt efter vikt eller ämne; de olika sidorna på webbplatsen borde också vara.
2. Skapa en konsekvent stil. Där layouten ska ge din webbplats strukturell konsistens bör stilen ge tematisk harmoni.
   • Håll dig till två eller tre huvudfärger och se till att de passar bra tillsammans.
   • Undvik att använda för många typsnitt eller storlekar; om du vill växla några, använd dem på samma sätt på varje sida.
   • Använd Cascading Style Sheets (CSS) för att upprätthålla en enhetlig stil och för att göra det lättare att ändra element över en hel webbplats utan att behöva gå till varje sida separat.
3. Maximera läsbarheten. För att göra din text lättare att läsa kan du dela den i mindre delar.
   • Använd undertexter och rätt avstånd för att separera var och en av delarna.
   • Använd fetstil eller olika storlekar för att visa ämnens hierarki och betydelse.
   • Var uppmärksam på hur du behandlar text. Gör inte teckensnittet för litet och öka radavståndet för att göra stora bitar av text lättare att läsa. Stora textfläckar är svårare att läsa; dela upp det i mindre stycken.
4. Gör din webbplats universell läsbar. Använd standard HTML och undvik taggar, funktioner och plugin-program som endast är tillgängliga för ett varumärke eller version av en webbläsare.
   • Medan de flesta moderna webbläsare och datorer kan hantera komplexa bilder ser allt snyggare ut om du krymper och optimerar dina bilder för webben. Väg kvalitetens vikt mot vikten av hastighet.
5. Testa din webbplats. Se till att varje länk fungerar som du förväntar dig och bilder visas korrekt.
   • Du kanske vill organisera användartest genom att låta medlemmar av din målgrupp testa tydligheten och användarvänligheten för din design och ge feedback om din webbplats.
6. Publicera din webbplats. Köp ett domännamn om du inte redan har gjort det. Kontrollera regelbundet om länkar fortfarande fungerar och lyssna på förslag som besökare skickar e-post till dig.

Tips

• Medan du är fri att designa layouten utifrån din egen personliga vision eller saker du har sett på andra webbplatser kan det vara lättare att köpa en färdig design.
• Bombardera inte besökaren med söta, speciella bilder. Flash-animering, ljusa färger, mönstrade bakgrunder och musik som automatiskt spelas upp på sidläsning var roliga experiment på 90-talet, men nu kommer de att skrämma bort användare. Håll dig till enkla bakgrunder som står i kontrast till textfärgen för maximal läsbarhet.
• Du kan alltid använda CSS för att optimera avsnittavstånd.
• För besökare med nedsatt hörsel eller syn kan du undertexta videor, transkribera ljud och lägga till ett tillgänglighetsmeddelande. Tabeller kan vara ett effektivt sätt att organisera information, men synskadade besökare som använder skärmläsarprogramvara kanske inte hör materialet i rätt ordning.
• Låt dina besökare spara bläck: använd ett separat formatmall för att skriva ut sidor.
  • Stäng av bakgrundsbilder när du ställer in utskriftsparametrar.
  • Använd svart text på en vit bakgrund.
  • Ta bort menyraden och onödiga bilder.

Varningar

• Undvik plagiering och följ alla upphovsrättslagar. Ta inte med slumpmässiga bilder som du hittar online eller till och med strukturella element utan godkännande. Allt du använder på din webbplats måste vara både lagligt och etiskt.