Hoe om 'n webwerf te ontwerp (met foto's)

INHOUDSOPGAWE:

Hoe om 'n webwerf te ontwerp (met foto's)
Hoe om 'n webwerf te ontwerp (met foto's)

Video: Hoe om 'n webwerf te ontwerp (met foto's)

Video: Hoe om 'n webwerf te ontwerp (met foto's)
Video: Wanneer een douche nemen te duur is... 2024, Mei
Anonim

Hierdie wikiHow leer u hoe u 'n webwerf kan ontwerp wat professioneel lyk en goed presteer. Alhoewel die grootste deel van u webwerf se ontwerp uiteindelik aan u is, is daar 'n paar belangrike dinge wat u moet doen en vermy wanneer u 'n webwerf skep.

Stappe

Deel 1 van 2: Hoe om u webwerf te ontwerp

Ontwerp 'n webwerf Stap 1
Ontwerp 'n webwerf Stap 1

Stap 1. Bepaal of u 'n webwerf -skepper wil gebruik

Webwerwe wat van nuuts af geskep is, vereis 'n redelike gedetailleerde begrip van HTML -kodering, maar u kan maklik 'n webwerf skep deur 'n gratis gasheerdiens soos Weebly, Wix, WordPress of Google Sites te gebruik. Skeppers van webwerwe is gewoonlik baie makliker vir die eerste keer ontwerpers as HTML.

  • As u besluit om u eie webwerf te kodeer, moet u HTML- en CSS -kodering leer.
  • As die tyd en energie om u webwerf te skep nie aantreklik klink nie, kan u ook 'n webwerfontwerper huur om u webwerf vir u te skep. Vryskutontwerpers kan tussen $ 30 per uur en meer as $ 100 per uur kos.
Ontwerp 'n webwerf Stap 2
Ontwerp 'n webwerf Stap 2

Stap 2. Stel u webwerf in kaart

Voordat u selfs 'n webwerf -skepper oopmaak, moet u ongeveer weet hoeveel bladsye u wil hê dat u webwerf moet bevat, wat die inhoud op elk van die bladsye moet wees, en die algemene uitleg van belangrike bladsye, soos die tuisblad en die 'About' bladsy.

Die bladsye van u webwerf kan makliker wees om te visualiseer as u ruwe foto's van elkeen teken, eerder as om net te bepaal watter inhoud moet verskyn

Ontwerp 'n webwerf Stap 3
Ontwerp 'n webwerf Stap 3

Stap 3. Gebruik intuïtiewe ontwerp

Alhoewel daar iets te sê is vir vars idees, moet die basiese ontwerp van u webwerf gevestigde riglyne volg, soos die volgende:

  • Navigasie -opsies (bv. Oortjies vir verskillende bladsye) moet bo -aan die bladsy verskyn.
  • As u 'n spyskaartikoon (☰) gebruik, moet dit in die linker boonste hoek van die bladsy wees.
  • As u 'n soekbalk gebruik, moet dit naby die boonste regterkant van die bladsy wees.
  • Nuttige skakels (byvoorbeeld skakels na die 'About' -bladsy of die 'Kontak ons' -bladsy) moet onderaan elke bladsy verskyn.
Ontwerp 'n webwerf Stap 4
Ontwerp 'n webwerf Stap 4

Stap 4. Wees konsekwent

Wat ook al die teksletter, kleurpalet, beeldtema en ontwerpopsies wat u kies, maak seker dat u dieselfde besluit op u hele webwerf gebruik. Dit kan ongelooflik ontstellend wees om een lettertipe of kleurskema te sien wat gebruik word vir die 'About' -bladsy, toe 'n heeltemal ander lettertipe vir die tuisblad gebruik is.

  • As u byvoorbeeld uitsluitlik koel kleure gebruik vir die tuisblad van u webwerf, moet u nie helder, harde kleure op die volgende bladsy implementeer nie.
  • Hou in gedagte dat die gebruik van harde of botsende kleure, veral as die kleure op 'n dinamiese (bv. Bewegende) manier vertoon, epilepsie by 'n klein aantal webgebruikers kan veroorsaak. As u besluit om sulke kleure op u webwerf te gebruik, moet u 'n epilepsie -waarskuwing byvoeg voor relevante bladsye.
Ontwerp 'n webwerf Stap 5
Ontwerp 'n webwerf Stap 5

Stap 5. Voeg navigasie -opsies by

Deur direkte skakels na belangrike bladsye op u webwerf bo-aan die tuisblad te plaas, kan u die eerste keer besoekers na die inhoud lei wat belangrik is. Die meeste werfskeppers voeg hierdie skakels standaard by.

Dit is belangrik om seker te maak dat elke bladsy op u webwerf toeganklik is deur op die opsies op u webwerf te klik eerder as om slegs toeganklik te wees via die adres van die bladsy

Ontwerp 'n webwerf Stap 6
Ontwerp 'n webwerf Stap 6

Stap 6. Gebruik kleure wat mekaar aanvul

Net soos enige ander ontwerp, maak webwerf -ontwerp staat op visueel aangename kleurkombinasies; Daarom is dit baie belangrik om temakleure te kies wat bymekaar pas.

Swart, wit en grys is 'n goeie kombinasie as u nie weet waar om te begin nie

Ontwerp 'n webwerf Stap 7
Ontwerp 'n webwerf Stap 7

Stap 7. Oorweeg dit om 'n minimalistiese ontwerp te gebruik

Minimalisme moedig koel kleure, eenvoudige grafika, swart-op-wit teksbladsye en so min as moontlik versiering aan. Omdat minimalisme weinig elemente vereis, is dit 'n maklike manier om u webwerf professioneel en aantreklik te laat lyk sonder om baie werk te verg.

  • Baie webwerf -skeppers het 'n 'minimalistiese' tema wat u kan kies tydens die opstel van u webwerf.
  • 'N Alternatief vir minimalisme is' brutalisme ', wat strenger lyne, helder kleure, vet teks en minimale beelde gebruik. Brutalisme het minder volg as minimalisme, maar afhangende van die inhoud van u webwerf, pas dit moontlik beter by u ontwerpbehoeftes.
Ontwerp 'n webwerf Stap 8
Ontwerp 'n webwerf Stap 8

Stap 8. Maak unieke keuses

Reguit lyne en netwerkelemente is 'n veilige weddenskap, maar as u 'n paar unieke stilistiese besluite neem, sal dit u persoonlikheid verleen en u webwerf opval.

  • Moenie bang wees om neigings te trek deur webwerf -elemente asimmetries te plaas of oorvleuelende elemente te gebruik om 'n gelaagde voorkoms te skep nie.
  • Alhoewel elegante, skerp hoeke en vierkantige elemente (ook bekend as '' kaartgebaseerde '' voorstelling) minder gunstig is as afgeronde, sagte elemente.

Deel 2 van 2: Hoe om die prestasie van die webwerf te maksimeer

Ontwerp 'n webwerf Stap 9
Ontwerp 'n webwerf Stap 9

Stap 1. Maak gebruik van mobiele optimaliseringsopsies

Mobiele blaaiers sorg vir meer webverkeer as desktop -blaaiers, wat beteken dat die hoeveelheid aandag wat u aan die mobiele weergawe van u webwerf gee, ten minste gelyk moet wees aan die ontwikkeling van u lessenaarwebwerf. Die meeste webwerf -skeppersdienste skep outomaties 'n mobiele weergawe van u webwerf, maar u wil die volgende inligting vir u mobiele webwerf in gedagte hou:

  • Maak seker dat die knoppies (byvoorbeeld werfskakels) groot en maklik is om te tik.
  • Vermy die implementering van funksies wat nie op die selfoon gesien kan word nie (bv. Flash, Java, ens.).
  • Oorweeg om 'n mobiele app vir u webwerf te laat maak.
Ontwerp 'n webwerf Stap 10
Ontwerp 'n webwerf Stap 10

Stap 2. Vermy die gebruik van te veel foto's per bladsy

Beide desktop- en mobiele blaaiers kan sukkel om bladsye te laai wat 'n groot aantal foto's of video's bevat. Alhoewel beelde belangrik is in webontwerp, kan die gebruik van meer as 'n paar per bladsy onnodig lang laai tye veroorsaak, wat mense sal verhinder om die betrokke bladsy (s) te besoek.

Oor die algemeen wil u hê dat u webwerf se bladsye binne vier sekondes moet laai

Ontwerp 'n webwerf Stap 11
Ontwerp 'n webwerf Stap 11

Stap 3. Voeg 'n "Kontak" -bladsy by

U sal agterkom dat feitlik alle gevestigde webwerwe 'n 'Kontak ons' -bladsy bevat met kontakinligting (byvoorbeeld 'n telefoonnommer en 'n e -posadres); sommige webwerwe het selfs 'n ingeboude vraagvorm op hierdie bladsy. As u 'n 'kontak' -bladsy byvoeg, sal u aan die webwerf -kykers 'n direkte kommunikasieboodskap aan u gee, wat 'n oplossing bied vir moontlike frustrasies.

Ontwerp 'n webwerf Stap 12
Ontwerp 'n webwerf Stap 12

Stap 4. Skep 'n pasgemaakte 404 -bladsy

As iemand 'n spesifieke bladsy op u webwerf besoek wat óf nie opgestel is nie óf nie bestaan nie, sal 'n '404 -fout' -webbladsy verskyn. Die meeste blaaiers het 'n standaard 404 -bladsy, maar u kan moontlik die uwe binne die instellings van u webwerf -skepper aanpas; so ja, maak seker dat u die volgende besonderhede insluit:

  • 'N Lighartige foutboodskap (bv. "Baie geluk - u het ons foutbladsy gevind!")
  • 'N Skakel na die tuisblad van die webwerf
  • 'N Lys met algemene skakels
  • 'N Beeld of logo vir u webwerf
Ontwerp 'n webwerf Stap 13
Ontwerp 'n webwerf Stap 13

Stap 5. Gebruik 'n soekbalk indien moontlik

As u webwerf -skeppingsmetode die toevoeging van 'n soekbalk by u webwerf ondersteun, word dit sterk aanbeveel dat u dit doen. Dit sal verseker dat gebruikers vinnig na 'n spesifieke bladsy of item kan navigeer sonder om deur u navigasie -opsies te hoef te klik.

Soekbalk is ook handig as u gehoor na 'n algemene term wil soek sonder om te probeer en te probeer

Ontwerp 'n webwerf Stap 14
Ontwerp 'n webwerf Stap 14

Stap 6. Belê die meeste tyd in u tuisblad

As iemand op die tuisblad van u webwerf aankom, moet hy onmiddellik die kern van die tema van u webwerf kry; Daarbenewens moet alle elemente van die tuisblad vinnig gelaai word, insluitend navigasie -opsies en beelde. U tuisblad moet die volgende aspekte hê:

  • 'N Oproep tot aksie (byvoorbeeld 'n knoppie om op te klik of 'n vorm om in te vul)
  • 'N Navigasie -nutsbalk of spyskaart
  • 'N Uitnodigende grafika (bv.' N soliede foto, 'n video of 'n klein groepie foto's met gepaardgaande teks)
  • Sleutelwoorde wat verband hou met die diens, onderwerp of fokus van u webwerf
Ontwerp 'n webwerf Stap 15
Ontwerp 'n webwerf Stap 15

Stap 7. Toets u webwerf in verskeie blaaiers op verskeie platforms

Dit is ongelooflik belangrik, aangesien verskillende blaaiers aspekte van u webwerf anders kan hanteer. Probeer u webwerf besoek en gebruik in die volgende blaaiers op Windows-, Mac-, iPhone- en Android -platforms voordat u u webwerf begin promoveer:

  • Google Chrome
  • Firefox
  • Safari (slegs iPhone en Mac)
  • Microsoft Edge en Internet Explorer (slegs Windows)
  • Die ingeboude blaaier op verskillende Android-fone (bv. Samsung Galaxy, Google Nexus, ens.)
Ontwerp 'n webwerf Stap 16
Ontwerp 'n webwerf Stap 16

Stap 8. Gaan voort met die opdatering van u webwerf namate dit ouer word

Ontwerpneigings, skakels, foto's, konsepte en sleutelwoorde verander almal soos die tyd aanstap, dus u moet voortgaan om veranderinge aan u webwerf te maak om op datum te bly. Dit vereis dat u ten minste een keer elke drie maande die prestasie van u webwerf langs ander soortgelyke webwerwe nagaan (verkieslik meer gereeld).

Basiese HTML -hulp

Image
Image

Voorbeeld webbladsy met HTML

Ondersteun wikiHow en ontsluit alle monsters.

Image
Image

HTML Cheat Sheet

Ondersteun wikiHow en ontsluit alle monsters.

Image
Image

Voorbeeld van eenvoudige webwerf

Ondersteun wikiHow en ontsluit alle monsters.

Wenke

  • Toeganklikheid tot webwerwe is nog 'n belangrike aspek van die ontwikkeling van webwerwe. Dit sluit dinge in soos onderskrifte vir gehoorgestremde gehore, klankbeskrywings vir blinde besoekers en waarskuwings vir liggevoeligheid as u webwerf moontlike aanvalle veroorsaak.
  • Die meeste webwerf -skeppers het 'n stel sjablone wat u kan gebruik om die uitleg en ontwerp van u webwerf te versterk voordat u die elemente wat u verkies, byvoeg.

Waarskuwings

  • Die meeste werfskeppers is gratis; As u egter u eie domein wil gebruik (byvoorbeeld "www.yourname.com" in plaas van "www.yourname.wordpress.com"), moet u 'n maandelikse of jaarlikse fooi betaal.
  • Vermy plagiaat en neem alle kopieregwette in ag: moenie toevallige beelde van die internet, of selfs strukturele elemente, sonder toestemming byvoeg nie.

Aanbeveel: