As u webblaaie wil ontwerp en skep, sal hierdie proses baie makliker wees as u vooruit beplan. In die beplanningsfase kan die ontwerper en kliënt saamwerk om 'n formaat en uitleg te vind wat by hul behoeftes pas. Die beplanningsproses beïnvloed die styl of styl van die webwerf; u kan sê dat dit die belangrikste aspek van webontwerp is, veral as dit vir sakedoeleindes is.
Stap
Deel 1 van 4: Die skep van die basiese struktuur
Stap 1. Bepaal die funksie van die webwerf
As u 'n persoonlike webwerf skep, weet u waarskynlik reeds die antwoord. As u egter 'n webwerf vir 'n ander organisasie, onderneming of persoon skep, moet u uitvind wat hulle wil hê en die funksionaliteit van die webwerf. Alles wat u hier spesifiseer, tree in werking wanneer die webblad voltooi is.
- Vereis die webwerf Storefront? Moet gebruikers kommentaar lewer? Sal die gebruiker later 'n rekening moet skep? Is die webwerfartikel gerig? Of beeldgerig? Al hierdie en ander vrae sal u help met die ontwerp en ontwerp van die webwerf.
- Hierdie beplanningsproses kan in 'n tekening geteken word, veral as dit vir 'n groot onderneming is en baie mense betrokke is by die oprigting van hierdie projek.
Stap 2. Skep 'n werfkaartdiagram (werfkaart)
'N Sitemapdiagram is soortgelyk aan 'n vloeidiagram, wat wys hoe gebruikers van een bladsy na die volgende beweeg. U het in hierdie stadium nie 'n webblad nodig nie, slegs 'n algemene konsepvloei. U kan 'n rekenaarprogram gebruik om diagramme te maak of u eie op papier te skets. Gebruik hierdie diagram om die konsepte van hiërargiese rangskikking en webbladverbinding te demonstreer.
Stap 3. Probeer die kaartopstelmetode
'N Gewilde metode vir groepontwikkeling is om 'n aantal kaarte te gebruik om uit te vind wat almal se verwagtinge is. Neem 'n aantal aantekeninge en skryf die basiese inhoud van 'n webblad afsonderlik op elkeen neer. Reël hierdie kaarte saam met u span om die beste konsep te vind. Hierdie metode is geskik vir gebruik as u met ander saamwerk oor die skep van webblaaie.
Stap 4. Gebruik papier en 'n bord, of 'n witbord
Dit is 'n oorspronklike beplanningsmetode met 'n klein begroting; u kan vinnig inhoud verwyder of verskuif en die vloei verander. Teken u webontwerp op papier, verbind die papier met draad of trek lyne op die bord. Hierdie metode is baie geskik vir gebruik in dinkskrumsessies.
Stap 5. Skep 'n inhoudsvoorraad
Dit is eintlik meer gepas om te gebruik by die herontwerp van webwerwe as in nuwe webontwerpe. Voeg elke voltooide stuk inhoud of webblad in 'n sigblad in. Teken die doel van elke stuk inhoud of bladsy aan en gebruik hierdie lys om te bepaal wat u moet verwyder en wat u moet stoor. U kan die struktuur van die web vereenvoudig en die herontwerpproses later vereenvoudig.
Deel 2 van 4: Skep 'n basiese HTML -uiteensetting
Stap 1. Skep 'n draadraam om die hiërargie van die webblad op te stel
Die basiese HTML -sjabloon is die bloudruk van die webwerf wat u sal bou, met slegs die mees basiese etikette en voorbeeldinhoud (blokke/sjablone). Hierdie raamwerk beantwoord die vraag: "Wat is sigbaar op die internet en waar?" Opmaak en styl is nie nodig vir die opstel van hierdie uiteensetting nie.
- U kan die struktuur en vloeidiagram van die inhoud met 'n basiese uiteensetting sien voordat u 'n stylinstelling kies.
- Basiese HTML -sjablone is nie staties soos PDF's of beelde nie; u kan vinnig deur voorbeeldinhoud blaai om nuwe strukture te skep.
- Die basisraamwerk is interaktief, wat beide webontwikkelaars en kliënte bevoordeel. Aangesien hierdie basiese raamwerk met 'n eenvoudige HTML -kode geskryf is, kan u steeds daarin navigeer en weet hoe die skakel van webblaaie werk. Dit kan nie met PDF gedoen word nie.
Stap 2. Probeer die Gray Box -metode
Blokkeer of lig die inhoud van u webblad in Grey Box uit, die belangrikste inhoud is bo -aan. Sorteer die inhoud in een kolom. As die bladsy byvoorbeeld 'About the Company' is, is gedetailleerde inligting oor die onderneming bo -aan, gevolg deur 'n lys personeel, kontakinligting, ens.
Dit sluit nie kop- en voettekste in nie. Gray Box is 'n visuele voorstelling van die inhoud wat op die internet verskyn
Stap 3. Probeer 'n basiese uiteensetting bouer program
Daar is verskillende programme wat u kan gebruik om 'n basiese webraamwerk te skep. Die hoeveelheid webprogrammeringskode (taal) wat u moet bemeester, verskil vir elke program. Sommige van die gewilde programme sluit in:
- Patroon Lab. Hierdie webwerf is toegewy aan 'atoomontwerp'; elke inhoud word beskou as 'n 'molekule' wat 'n groter webblad saamstel.
- Springkaarte. Hierdie webwerf bied webgebaseerde beplannings- en raamwerkdienste. Hierdie webwerwe word betaal en vereis 'n intekening, maar u kan vinnig webraamwerke bou sonder om baie webprogrammeringskode te bemeester.
- Wirefy. Wirefy is 'n ander webwerf wat 'atomiese ontwerp' bied. Webontwikkelaars kan die hulpmiddel gratis kry.
Stap 4. Gebruik 'n eenvoudige HTML -opmaak
'N Goeie basiese sjabloon kan maklik oorgeskakel word na die oorspronklike webwerf. Moenie te veel dink oor webstilering tydens die skep van hierdie sjabloon nie. Gebruik opmerking wat maklik verstaanbaar en verander kan word.
'N Eenvoudige basiese raamwerk is baie beter. Die doel van die opmaak van 'n opmaak is om 'n struktuur te bou. Visuele voorkoms kan later aangepas word met CSS en gevorderde opmaak
Stap 5. Skep 'n basiese uiteensetting vir elke webblad
U word moontlik versoek om elke webwerf met een basiese uiteensetting gelyk te stel. Dit maak u webwerf eintlik net eenvoudig en vervelig. Maak 'n ander uiteensetting vir elke bladsy, u sal verstaan dat elke bladsy sy eie ontwerp benodig.
Deel 3 van 4: Inhoud skep
Stap 1. Berei die inhoud voor voordat u 'n webblad skep
U sal dit baie makliker vind om 'n voorbeeld van u webbeeld te sien as u reeds werklike inhoud het in plaas van monsters of plekhouers te gebruik. U hoef nie te veel inhoud te hê nie, maar u model sal baie beter lyk as u 'n afskrif van die oorspronklike prent gebruik.
U hoef nie al die artikelmateriaal te hê nie, maar dit moet ten minste 'n werklike opskrif hê
Stap 2. Onthou dat goeie inhoud nie net teks is nie
Die internet is baie meer kompleks as 'n eenvoudige teksbladsy. U benodig verskillende inhoud om 'n wonderlike webwerf te skep om besoekers te lok en uit te nooi. Byvoorbeeld:
- Prent.
- Stem.
- Video's.
- Weboordrag of webstroom (Twitter)
- Facebook -integrasie
- RSS
- Webvoer
Stap 3. Vra 'n professionele fotograaf vir hulp
As u foto's op u webwerf wil insluit, is die eerste indruk van u webwerf baie beter as dit gevul is met professionele fotografie. Een goeie foto is meer as twintig lae kwaliteit foto's werd.
Soek 'n nuwe gegradueerde in die kuns van fotografie as 'n goedkoper oplossing as 'n professionele fotograaf wat al lank in die besigheid is
Stap 4. Skryf kwaliteitartikels
Die geskrewe inhoud op die webbladsy bepaal die hoeveelheid webverkeer. Alhoewel u nie te veel hoef te bekommer oor die skep van inhoud in hierdie ontwerpproses nie, is dit nie kwaad om daaroor te begin dink nie, want u benodig ook gereeld inhoud sodra u webwerf aan die gang is.
Benewens die inhoud van die artikel, is daar ook geskrewe materiaal wat u benodig om 'n webblad saam te stel. Byvoorbeeld kontakinligting, maatskappy se naam of enigiets anders wat op die webwerf verskeie kere gebruik sal word
Deel 4 van 4: Die omskakeling van konsepte na webwerwe
Stap 1. Rangskik die basiese elemente
Hierdie rangskikking van elemente is van toepassing op elke bladsy op u webwerf, soos opskrifte, voetnote en navigasiekieslyste. Stel dit in 'n baie eenvoudige styl op, sodat u kan kyk hoe alle bladsye lyk. Dit is veral handig as u vorder met die webuitlegproses.
Moenie te veel bekommerd wees oor die besonderhede nie; probeer 'n voorskou (voorskou) hoe die kop lyk
Stap 2. Skep 'n eenvoudige uitleg
Begin deur die klokposisie van die basiese kolom na die werklike ligging op die bladsy te skuif. U wil byvoorbeeld die voorbeeldnavigasiekieslys links van die bladsy en die lys opskrifte na regs skuif.
Eksperimenteer met webuitlegte vir verskeie bladsye, voordat u na die volgende stap gaan. Laat ander mense daarna kyk of die uitleg wat u skep lewendig voel
Stap 3. Skep 'n mockup
Gebruik 'n program soos Photoshop om besprekings of voorbeeldbladsye van u webwerf te skep. Gebruik die uitleg wat u saamgestel het as 'n riglyn. U kan vinniger bespotings maak en die gewenste resultate kry met 'n beeldverwerkingsprogram. Die resultate van hierdie beelde kan later as verwysing gebruik word tydens die skryf van webprogrammeringskode.
Plaas die werklike inhoud in die model om dit goed te laat lyk
Stap 4. Vervang die voorbeeldkonsep met die oorspronklike inhoud
Voeg inhoud en elemente by webblaaie. Moenie die instellings van die webstyl vir eers sweet nie, maar stapel alles op die regte plek. Dit sal u help om die veranderings in die webstyl wat u later aanbring, na te gaan.
Stap 5. Skep 'n webstylgids
Dit is baie belangrik om 'n mengsel van style te handhaaf, veral vir groot terreine. As die webwerf bedoel is vir besigheidsdoeleindes en reeds 'n eie handelsmerk of styl het, moet dit in die webwerfontwerp geïntegreer word. Dinge wat u moet oorweeg wanneer u 'n webbladstylgids opstel:
- Navigasie
- Hoofnota
- Paragraaf
- Kursief karakter
- Vet karakter
- Skakels (aktief, onaktief, sweef)
- Beeldgebruik
- Ikoon
- Knop
- lys
Stap 6. Pas die webstyl toe
Sodra u die regte styl en ontwerp gevind het, implementeer dit. CSS is een van die maklikste maniere om style op 'n webwerf of op die webwerf te implementeer. Sien die volgende instruksies om die besonderhede van die gebruik van CSS beter te verstaan.
