Ovaj wikiHow vas uči kako dizajnirati web stranicu koja izgleda profesionalno i ima dobre performanse. Iako najveći dio dizajna vaše web stranice na kraju ovisi o vama, postoje neke kritične stvari koje trebate učiniti i izbjeći ih prilikom izrade web stranice.
Koraci
1. dio 2: Kako dizajnirati svoju web stranicu
Korak 1. Odredite želite li koristiti kreatora web stranice
Web stranice stvorene od nule zahtijevaju prilično detaljno razumijevanje HTML kodiranja, ali web stranicu možete lako stvoriti koristeći besplatnu uslugu hostinga poput Weebly, Wix, WordPress ili Google Sites. Kreatori web stranica dizajnerima koji su prvi put u upotrebi mnogo su lakši za korištenje od HTML-a.
- Ako odlučite kodirati svoju web stranicu, morat ćete naučiti HTML i CSS kodiranje.
- Ako ulaganje vremena i energije u izradu vaše web stranice ne zvuči privlačno, možete angažirati i dizajnera web stranice koji će za vas izraditi web lokaciju. Samostalni dizajneri mogu koštati između 30 USD po satu i preko 100 USD po satu.
Korak 2. Mapirajte svoju web lokaciju
Prije nego uopće otvorite kreatora web stranice, trebali biste otprilike znati koliko stranica želite da vaša web stranica ima, kakav bi sadržaj trebao biti na svakoj od tih stranica i opći izgled važnih stranica, poput početne stranice i "O" stranici.
Stranice vaše web stranice mogu biti lakše vizualizirane ako nacrtate grube slike svake od njih, a ne samo odredite koji bi se sadržaj trebao pojaviti
Korak 3. Koristite intuitivni dizajn
Iako se ima što reći za svježe ideje, osnovni dizajn vaše web stranice trebao bi slijediti utvrđene smjernice, poput sljedećih:
- Opcije navigacije (na primjer, kartice za različite stranice) trebaju se nalaziti pri vrhu stranice.
- Ako koristite ikonu menija (☰), ona bi se trebala nalaziti u gornjem lijevom kutu stranice.
- Ako koristite traku za pretraživanje, ona bi trebala biti blizu gornje desne strane stranice.
- Korisne veze (na primjer, veze do stranice "O nama" ili stranice "Kontaktirajte nas") trebale bi se nalaziti pri samom dnu svake stranice.
Korak 4. Budite dosljedni
Koji god font teksta, paletu boja, temu slike i opcije dizajna odabrali, pobrinite se da koristite istu odluku na cijeloj web stranici. Može biti nevjerojatno uznemirujuće vidjeti jedan font ili shemu boja koja se koristi za stranicu "O programu" kada se za početnu stranicu koristila potpuno drugačija.
- Na primjer, ako za početnu stranicu web lokacije koristite isključivo hladne boje, nemojte primjenjivati svijetle, glasne boje na sljedećoj stranici.
- Imajte na umu da upotreba glasnih ili sukobljenih boja, posebno kada se boje prikazuju dinamično (na primjer, u pokretu), može izazvati epilepsiju kod malog broja korisnika weba. Ako odlučite koristiti takve boje na svojoj web lokaciji, svakako dodajte upozorenje o epilepsiji prije bilo koje relevantne stranice.
Korak 5. Dodajte opcije navigacije
Postavljanje direktnih veza do važnih stranica na vašoj web stranici na vrhu početne stranice pomoći će posjetiteljima koji prvi put usmjere sadržaj na bitan sadržaj. Većina kreatora web lokacija prema zadanim postavkama dodaje ove veze.
Važno je osigurati da svaka stranica na vašoj web stranici bude dostupna klikom na opcije na vašoj web stranici, a ne samo putem adrese stranice
Korak 6. Koristite boje koje se međusobno nadopunjuju
Kao i svaka druga vrsta dizajna, dizajn web stranice oslanja se na vizualno ugodne kombinacije boja; zbog toga je odabir boja tema koje idu zajedno ključan.
Crna, bijela i siva dobra su kombinacija ako ne znate odakle početi
Korak 7. Razmislite o upotrebi minimalističkog dizajna
Minimalizam potiče boje hladnih tonova, jednostavnu grafiku, stranice s crno-bijelim tekstom i što manje uljepšavanja. Budući da minimalizam ne zahtijeva mnogo elegantnih elemenata, to je jednostavan način da vaša web stranica izgleda profesionalno i atraktivno bez puno rada.
- Mnogi kreatori web stranica imat će "minimalističku" temu koju možete odabrati prilikom postavljanja web stranice.
- Alternativa minimalizmu je "brutalizam", koji koristi oštrije linije, svijetle boje, podebljani tekst i minimalne slike. Brutalizam ima manje sljedbenika od minimalizma, ali ovisno o sadržaju vaše web stranice može bolje odgovarati vašim dizajnerskim potrebama.
Korak 8. Napravite jedinstvene izbore
Ravne linije i mrežni elementi zaključani mrežom sigurne su opklade, ali donošenje nekoliko jedinstvenih stilskih odluka dat će vašoj web stranici osobnost i pomoći joj da se istakne.
- Ne bojte se uskladiti trendove postavljanjem elemenata web stranice asimetrično ili korištenjem preklapajućih elemenata za stvaranje slojevitog izgleda.
- Dok su elegantni, oštri uglovi i kvadratni elementi (poznati i kao prezentacija zasnovana na kartama) manje povoljni od zaobljenih, mekih elemenata.
Dio 2 od 2: Kako poboljšati performanse web stranice
Korak 1. Iskoristite mogućnosti optimizacije mobilnih uređaja
Mobilni preglednici čine veći promet od web preglednika, što znači da bi količina pažnje koju posvećujete mobilnoj verziji vaše web stranice trebala biti barem jednaka razvoju vaše web stranice za računare. Većina usluga za kreiranje web stranica automatski stvara mobilnu verziju vaše web lokacije, ali za svoju web lokaciju za mobilne uređaje trebate imati na umu sljedeće podatke:
- Uvjerite se da su dugmad (npr. Veze na web lokaciju) velika i da ih je lako dodirnuti.
- Izbjegavajte implementaciju funkcija koje se ne mogu vidjeti na mobilnim uređajima (npr. Flash, Java itd.).
- Razmislite o izradi mobilne aplikacije za svoju web stranicu.
Korak 2. Izbjegavajte korištenje previše fotografija po stranici
I desktop i mobilni preglednici mogu imati problema s učitavanjem stranica koje prikazuju veliki broj fotografija ili video zapisa. Iako su slike važne u web dizajnu, korištenje više njih po stranici može uzrokovati nepotrebno dugo vrijeme učitavanja, što će spriječiti ljude da posjete dotične stranice.
Općenito govoreći, želite da se stranice vaše web stranice učitaju za manje od četiri sekunde
Korak 3. Dodajte stranicu "Kontakt"
Primijetit ćete da gotovo sve uspostavljene web stranice imaju stranicu "Kontaktirajte nas" koja sadrži podatke za kontakt (npr. Telefonski broj i adresu e -pošte); neke web stranice čak imaju ugrađen obrazac za pitanja na ovoj stranici. Dodavanjem stranice "Kontakt" gledatelji web stranice dobit će direktnu komunikaciju s vama, dodajući tako rješenje potencijalnim frustracijama.
Korak 4. Kreirajte prilagođenu stranicu 404
Kada netko posjeti određenu stranicu na vašoj web stranici koja ili nije postavljena ili ne postoji, prikazat će se web stranica "Greška 404". Većina preglednika ima zadanu stranicu 404, ali možda ćete moći prilagoditi svoju unutar postavki kreatora web stranice; ako je tako, obavezno uključite sljedeće detalje:
- Lagana poruka o grešci (npr. "Čestitamo - pronašli ste našu stranicu s greškom!")
- Veza nazad na početnu stranicu web lokacije
- Spisak često gledanih veza
- Slika ili logotip za vašu web stranicu
Korak 5. Koristite traku za pretraživanje ako je moguće
Ako način izrade vaše web stranice podržava dodavanje trake za pretraživanje na vašu web stranicu, toplo se preporučuje da to učinite. To će osigurati da korisnici mogu brzo doći do određene stranice ili stavke bez klikanja kroz vaše opcije navigacije.
Trake za pretraživanje također su korisne kada vaša publika želi tražiti opći pojam bez upotrebe pokušaja i greške
Korak 6. Uložite najviše vremena u svoju početnu stranicu
Kada neko dođe na početnu stranicu vaše web stranice, trebao bi odmah shvatiti suštinu teme vaše web stranice; osim toga, svi elementi početne stranice trebali bi se brzo učitati, uključujući opcije navigacije i sve slike. Vaša početna stranica bi trebala imati sljedeće aspekte:
- Poziv na akciju (npr. Dugme za klik ili obrazac za popunjavanje)
- Traka sa alatkama za navigaciju ili meni
- Grafika koja poziva (na primjer, jedna čvrsta fotografija, video zapis ili mala grupa fotografija s popratnim tekstom)
- Ključne riječi koje se odnose na uslugu, temu ili fokus vaše web stranice
Korak 7. Testirajte svoju web stranicu u više preglednika na više platformi
Ovo je nevjerojatno važno jer različiti preglednici mogu različito upravljati aspektima vaše web stranice. Prije nego počnete promovirati svoju web stranicu, pokušajte posjetiti i koristiti je u sljedećim preglednicima na Windows, Mac, iPhone i Android platformama:
- google chrome
- Firefox
- Safari (samo za iPhone i Mac)
- Microsoft Edge i Internet Explorer (samo Windows)
- Ugrađeni preglednik na nekoliko različitih Android telefona (npr. Samsung Galaxy, Google Nexus itd.)
Korak 8. Nastavite ažurirati svoju web lokaciju kako stari
Trendovi u dizajnu, veze, fotografije, koncepti i ključne riječi mijenjaju se kako vrijeme prolazi, pa ćete morati nastaviti s promjenama na svojoj web stranici kako biste bili u toku. To će zahtijevati da provjerite performanse svoje web stranice zajedno sa drugim sličnim web stranicama najmanje jednom u tri mjeseca (po mogućnosti češće).
Osnovna HTML pomoć
Uzorak web stranice s HTML -om
Podržite wikiHow i otključajte sve uzorke.
HTML Cheat Sheet
Podržite wikiHow i otključajte sve uzorke.
Primjer jednostavne web stranice
Podržite wikiHow i otključajte sve uzorke.
Savjeti
- Pristupačnost web stranice je još jedan važan aspekt razvoja web stranice. To uključuje stvari poput naslova za publiku oštećenog sluha, audio opise za slijepe posjetitelje i upozorenja na fotoosjetljivost ako vaša web stranica koristi efekte koji izazivaju napade.
- Većina kreatora web stranica ima niz predložaka koje možete koristiti za učvršćivanje izgleda i dizajna web stranice prije dodavanja željenih elemenata.
Upozorenja
- Većina kreatora web stranica je besplatna; međutim, ako želite koristiti vlastitu domenu (npr. "www.vaše ime.com" umjesto "www.vaše ime.wordpress.com"), morat ćete platiti mjesečnu ili godišnju naknadu.
- Izbjegavajte plagijat i pridržavajte se svih zakona o autorskim pravima: nemojte dodavati nasumične slike s weba, pa čak ni strukturne elemente, bez dozvole.
