Sådan designer du et websted (med billeder)

Indholdsfortegnelse:

Sådan designer du et websted (med billeder)
Sådan designer du et websted (med billeder)
Anonim

Denne wikiHow lærer dig, hvordan du designer et websted, der fremstår professionelt og fungerer godt. Mens hovedparten af dit websteds design i sidste ende er op til dig, er der nogle kritiske ting at gøre-og undgå-når du opretter et websted.

Trin

Del 1 af 2: Sådan designer du dit websted

Design et websted Trin 1
Design et websted Trin 1

Trin 1. Bestem, om du vil bruge en webstedsskaber

Websites, der er oprettet fra bunden, kræver en ret detaljeret forståelse af HTML -kodning, men du kan nemt oprette et websted ved at bruge en gratis hostingtjeneste som Weebly, Wix, WordPress eller Google Sites. Websiteskabere har en tendens til at være meget lettere for førstegangsdesignere at bruge end HTML.

  • Hvis du beslutter dig for at kode dit eget websted, skal du lære både HTML- og CSS -kodning.
  • Hvis det ikke lyder tiltalende at investere tid og energi til at oprette dit websted, kan du også ansætte en webstedsdesigner til at oprette dit websted for dig. Freelance designere kan koste alt mellem $ 30 i timen og langt over $ 100 i timen.
Design et websted Trin 2
Design et websted Trin 2

Trin 2. Kortlæg dit websted

Inden du overhovedet åbner en webstedsopretter, bør du vide cirka, hvor mange sider du vil have, at dit websted skal have, hvad indholdet på hver af disse sider skal være, og det generelle layout af vigtige sider som f.eks. Hjemmesiden og "Om" side.

Dit websteds sider kan være lettere at visualisere, hvis du tegner grove billeder af hver af dem i stedet for bare at bestemme, hvilket indhold der skal vises

Design et websted Trin 3
Design et websted Trin 3

Trin 3. Brug intuitivt design

Selvom der er noget at sige til friske ideer, bør dit websteds grundlæggende design følge etablerede retningslinjer såsom følgende:

  • Navigationsmuligheder (f.eks. Faner til forskellige sider) skal vises øverst på siden.
  • Hvis du bruger et menuikon (☰), skal det være i øverste venstre hjørne af siden.
  • Hvis du bruger en søgelinje, skal den ligge nær øverste højre side af siden.
  • Nyttige links (f.eks. Links til "Om" -siden eller "Kontakt os" -siden) bør stå helt nederst på hver side.
Design et websted Trin 4
Design et websted Trin 4

Trin 4. Vær konsekvent

Uanset hvilken tekstskrifttype, farvepalet, billedtema og designmuligheder du vælger, skal du sørge for at bruge den samme beslutning på hele dit websted. Det kan være utroligt rystende at se én skrifttype eller farveskema, der blev brugt til "Om" -siden, da en helt anden blev brugt til startsiden.

  • Hvis du f.eks. Udelukkende bruger farver i cool tone til dit websteds hjemmeside, skal du ikke implementere lyse, høje farver på den næste side.
  • Husk på, at brug af høje eller sammenstødende farver, især når farverne vises dynamisk (f.eks. I bevægelse), kan fremkalde epilepsi hos et lille antal webbrugere. Hvis du beslutter dig for at bruge sådanne farver på dit websted, skal du tilføje en advarsel om epilepsi før relevante sider.
Design et websted Trin 5
Design et websted Trin 5

Trin 5. Tilføj navigationsmuligheder

Placering af direkte links til vigtige sider på dit websted øverst på startsiden hjælper med at lede første gangs besøgende til det indhold, der er vigtigt. De fleste webstedsskabere tilføjer disse links som standard.

Det er vigtigt at sikre, at hver side på dit websted er tilgængelig ved at klikke på mulighederne på dit websted frem for kun at være tilgængelig via sidens adresse

Design et websted Trin 6
Design et websted Trin 6

Trin 6. Brug farver, der supplerer hinanden

Som enhver anden form for design, bygger webstedsdesign på visuelt tiltalende farvekombinationer; på grund af dette er det afgørende at vælge temafarver, der hænger sammen.

Sort, hvid og grå er en god kombination, hvis du ikke ved, hvor du skal starte

Design et websted Trin 7
Design et websted Trin 7

Trin 7. Overvej at bruge et minimalistisk design

Minimalisme tilskynder til cool-tone farver, enkel grafik, sort-på-hvide tekstsider og så lidt udsmykning som muligt. Fordi minimalisme kræver lidt i stil med fancy elementer, er det en nem måde at få dit websted til at se professionelt og attraktivt ud uden at kræve meget arbejde.

  • Mange webstedsskabere vil have et "minimalistisk" tema, du kan vælge, når du opretter dit websted.
  • Et alternativ til minimalisme er "brutalisme", der bruger hårdere linjer, lyse farver, fed tekst og minimale billeder. Brutalisme har mindre efterfølgelse end minimalisme, men afhængigt af dit websteds indhold passer det måske bedre til dine designbehov.
Design et websted Trin 8
Design et websted Trin 8

Trin 8. Tag unikke valg

Lige linjer og gitterlåste webelementer er sikre spil, men at tage et par unikke stilistiske beslutninger vil både give dit websted personlighed og hjælpe dit websted til at skille sig ud.

  • Vær ikke bange for at bukke tendenser ved at placere webstedselementer asymmetrisk eller bruge overlappende elementer til at skabe et lagdelt udseende.
  • Mens elegante, skarpe hjørner og kvadrerede elementer (også kendt som en "kortbaseret" præsentation) er mindre gunstige end afrundede, bløde elementer.

Del 2 af 2: Sådan maksimeres webstedets ydeevne

Design et websted Trin 9
Design et websted Trin 9

Trin 1. Udnyt mulighederne for mobiloptimering

Mobilbrowsere tegner sig for mere webtrafik end desktopbrowsere, hvilket betyder, at den opmærksomhed, du lægger på dit websteds mobilversion, mindst skal svare til din desktopwebsites udvikling. De fleste webstedsoprettelsestjenester opretter automatisk en mobilversion af dit websted, men du vil huske følgende oplysninger for dit mobilwebsted:

  • Sørg for, at knapperne (f.eks. Webstedslinks) er store og lette at trykke på.
  • Undgå at implementere funktioner, der ikke kan ses på mobilen (f.eks. Flash, Java osv.).
  • Overvej at få lavet en mobilapp til dit websted.
Design et websted Trin 10
Design et websted Trin 10

Trin 2. Undgå at bruge for mange fotos pr. Side

Både desktop- og mobilbrowsere kan kæmpe med at indlæse sider, der viser et stort antal fotos eller videoer. Selvom billeder er vigtige i webdesign, kan brug af mere end et par pr. Side forårsage unødigt lange indlæsningstider, hvilket forhindrer folk i at besøge de pågældende sider.

Generelt vil du have, at dit websteds sider indlæses på under fire sekunder

Design et websted Trin 11
Design et websted Trin 11

Trin 3. Tilføj en "Kontakt" -side

Du vil bemærke, at stort set alle etablerede websteder har en "Kontakt os" -side, som har kontaktoplysninger (f.eks. Et telefonnummer og en e -mail -adresse); nogle websteder har endda en indbygget spørgeskema på denne side. Tilføjelse af en "Kontakt" -side vil give seerne på webstedet en direkte kommunikationslinje til dig og dermed tilføje en løsning på potentielle frustrationer.

Design et websted Trin 12
Design et websted Trin 12

Trin 4. Opret en brugerdefineret 404 -side

Når nogen besøger en bestemt side på dit websted, som enten ikke er oprettet eller ikke findes, vises en "404 fejl" webside. De fleste browsere har en standard 404 -side, men du kan muligvis tilpasse din inden for dit websteds skabers indstillinger; i så fald skal du sørge for at inkludere følgende detaljer:

  • En letfed fejlmeddelelse (f.eks. "Tillykke - du har fundet vores fejlside!")
  • Et link tilbage til webstedets hjemmeside
  • En liste over ofte sete links
  • Et billede eller logo til din hjemmeside
Design et websted Trin 13
Design et websted Trin 13

Trin 5. Brug en søgelinje, hvis det er muligt

Hvis din metode til oprettelse af websted understøtter tilføjelse af en søgelinje til dit websted, anbefales det på det kraftigste, at du gør det. Dette vil sikre, at brugerne hurtigt kan navigere til en bestemt side eller et bestemt element uden at skulle klikke igennem dine navigationsmuligheder.

Søgelinjer er også nyttige, når dit publikum ønsker at søge efter et generelt udtryk uden at bruge trial-and-error

Design et websted Trin 14
Design et websted Trin 14

Trin 6. Invester mest tid på din hjemmeside

Når nogen ankommer til dit websteds hjemmeside, bør de straks få kernen i dit websteds tema; ud over dette skulle alle elementer på hjemmesiden indlæses hurtigt, inklusive navigationsmuligheder og eventuelle billeder. Din hjemmeside skal have følgende aspekter:

  • En opfordring til handling (f.eks. En knap, der skal klikkes på, eller en formular, der skal udfyldes)
  • En navigationsværktøjslinje eller menu
  • En indbydende grafik (f.eks. Et solidt foto, en video eller en lille gruppe fotos med tilhørende tekst)
  • Søgeord, der vedrører dit websteds service, emne eller fokus
Design et websted Trin 15
Design et websted Trin 15

Trin 7. Test dit websted i flere browsere på flere platforme

Dette er utrolig vigtigt, da forskellige browsere kan håndtere aspekter af dit websted forskelligt. Inden du begynder at promovere dit websted, kan du prøve at besøge og bruge dit websted i følgende browsere på Windows, Mac, iPhone og Android -platforme:

  • Google Chrome
  • Firefox
  • Safari (kun iPhone og Mac)
  • Microsoft Edge og Internet Explorer (kun Windows)
  • Den indbyggede browser på flere forskellige Android-telefoner (f.eks. Samsung Galaxy, Google Nexus osv.)
Design et websted Trin 16
Design et websted Trin 16

Trin 8. Fortsæt med at opdatere dit websted, når det ældes

Designtendenser, links, fotos, koncepter og søgeord ændres alle med tiden, så du bliver nødt til at fortsætte med at foretage ændringer på dit websted for at holde dig opdateret. Dette vil kræve, at du kontrollerer dit websteds ydeevne sammen med andre lignende websteder mindst en gang hver tredje måned (helst oftere).

Grundlæggende HTML -hjælp

Image
Image

Eksempel på webside med HTML

Understøtt wikiHow og låse alle prøver op.

Image
Image

HTML snydeblad

Understøtt wikiHow og låse alle prøver op.

Image
Image

Eksempel på enkel webside

Understøtt wikiHow og låse alle prøver op.

Tips

  • Tilgængelighed af websteder er et andet vigtigt aspekt af webstedsudvikling. Dette inkluderer ting som billedtekster til hørehæmmede publikum, lydbeskrivelser for blinde besøgende og lysfølsomhedsadvarsler, hvis dit websted anvender potentielt anfaldsfremkaldende effekter.
  • De fleste webstedsskabere har et sæt skabeloner, som du kan bruge til at cementere dit websteds layout og design, før du tilføjer dine foretrukne elementer.

Advarsler

  • De fleste webstedsskabere er gratis; Men hvis du vil bruge dit eget domæne (f.eks. "www.yourname.com" i stedet for "www.yourname.wordpress.com"), skal du betale et månedligt eller et årligt gebyr.
  • Undgå plagiat og overhold alle love om ophavsret: tilføj ikke tilfældige billeder fra internettet eller endda strukturelle elementer uden tilladelse.

Anbefalede: