Ako vytvoriť návrh webových stránok: 14 krokov (s ilustráciami)

Vytvorenie skvelého webovej stránky sa môže zdať nie je nemožná úloha, ale ak nezabudnete na základné princípy, proces sa bude zaujíma o zaujímavé a zábavné. Dobré miesto by nemalo vyzerať len slušne! Povieme vám základy a základné princípy, ktoré vám pomôžu vytvoriť stránky, na ktoré sa návštevníci budú chcieť znova a znova.

Kroky

Časť 1 z 3:

Nájdeme vlastný dizajn

jeden. Vytvorte si vlastnú webovú stránku. Ak ste nováčikom v písacom kóde a web design, ale naozaj chcete vytvoriť svoje vlastné webové stránky sami, máte veľa možností. Jednoduchá lokalita môže byť napísaná nezávisle, keď sa naučil AZA HTML a CSS. Len sa domnievajú, že výsledok vašej práce môže vyzerať krásne a profesionálne!

Obrázok s názvom Dizajn webovej stránky Krok 2

2. Použite šablónu Ready. Môžete si kúpiť alebo nájsť online zadarmo šablóny webových stránok. Toto je už napísaný kód, ktorý môžete jednoducho používať alebo prispôsobiť svojim potrebám. Existuje pomerne veľa osvedčených vývojárov vysokokvalitných šablón, jeden z nich je Wix.

Obrázok s názvom Dizajn webovej stránky Krok 3

3. Prenájom web designer. Ak potrebujete profesionálne vyrobené miesto a bezchybne pracovné miesto - možno optimálnu možnosť si najíma webového dizajnéra. To, samozrejme, bude vyžadovať určité náklady, ale nie také veľké, ako si myslíte. Nový dizajnér nájdete umiestnením reklamy v miestnej technickej univerzite. Ich skúsenosti vám pomôžu vytvoriť úspešnejšiu a profesionálnu webovú stránku.

Časť 2 z 3:

Myslíme na hlavné myšlienky dizajnu

jeden. NEPOUŽÍVAJTE STRÁNKU. Je žiaduce, aby všetko fungovalo čo najrýchlejšie a bez problémov. Dve číslo položiek menu na minimum, takže navigácia na lokalite jednoduché a zrozumiteľné, pomáhajú návštevníkom stránky .

Obrázok s názvom Dizajn webovej stránky Krok 5

2. Použite priateľské užívateľské rozhranie. Pózovanie prvkov stránok, ako napríklad názov lokality, logo, tlačidlá, grafické prvky a text na rovnakom mieste na každej stránke, budete výrazne zjednodušiť navigáciu na stránke.

Umiestnite hlavičku stránok v hornej časti každej stránky. Bez ohľadu na to, koľko opakovaných prvkov obsahuje vaše stránky, uistite sa, že horná časť stránky je identická na všetkých stránkach.

Dizajn by mal byť logický. Prvky na každej jednotlivej strane by mali byť logicky umiestnené v zostupnom význame, všetky strany by mali byť štruktúrované podobne.

Obrázok s názvom Dizajn webovej stránky Krok 6

3. Držať pohromade. Dizajn webovej stránky by mal dať stránku štrukturálnu integritu a jeho dizajn - theatic harmónia. Držte rozsah lokality v dvoch alebo troch kombinovaných farbách. Vyhnite sa používaniu fontov Všetky veľkosti a farby. Ak plánujete použiť rôzne fonty, štýl, v ktorom sa používajú, by mali byť identické na každej stránke stránky.

Použite CSS na formátovanie stránky a zjednodušiť správu prvkov stránok, ktoré sa majú okúvať od potreby zmeniť položky na každej stránke samostatne.

Obrázok s názvom Dizajn webovej stránky Krok 7

4. Urobte si lokalitu najviac čitateľnú. Ak chcete, aby sa text ľahko čitateľný - prerušte ho na malé časti. Použite titulky a intervaly na oddelené časti textu od seba. Použite výber tučného alebo väčšieho písma, aby ste zdôraznili štruktúru a význam textu.

Formátovanie textu. NEPOUŽÍVAJTE FONT TOO SMALLY A ZVÝŠNUTIE INTERBYTOVANÉHO INTERVÁCIU AKTUÁLNEHO PROSTREDIAK. Dlhé čítanie textu je dosť tvrdo, takže lepšie rozbiť ho do odsekov.

Obrázok s názvom Dizajn webovej stránky Krok 8

päť. Vytvorte webovú stránku v Universal Format. Použite štandardné HTML a vyhnite sa používaniu tagov, funkcií a plug-inov, ktoré sú podporované iba konkrétnym prehliadačom.

Aj keď väčšina moderných prehliadačov ľahko vyrovnať s komplexnými obrázkami, stránka bude fungovať zmraziť, ak optimalizujete obrázky pre web a urobte ich malé. Vyvážte svoju túžbu pre kvalitu a rýchlosť.

Obrázok s názvom Dizajn webovej stránky Krok 9

6. Otestujte svoje webové stránky. Uistite sa, že všetky odkazy sú pracovníci a obrázky sa zobrazia správne.

Odporúča sa stráviť malý test "Yubability" (Vybavenie používateľa): Poskytnite prístup k stránke zástupcom vašej cieľovej skupiny, aby ste testovali jasnejšie a jednoduchosť používania dizajnu lokality a získajte spätnú väzbu od účastníkov testov.

Časť 3 z 3:

Návrh stránky pre mobilné zariadenia

jeden. Zohľadnite si pozorovanie stránky z mobilných zariadení. V súčasnosti je prístup k internetu čoraz viac realizovaný z mobilných zariadení. Ak chcete prilákať návštevníkov na vaše stránky a ponechajte ich, musíte vyvinúť stránku, aby vyzerá dobre a bolo ľahko použiteľné pomocou mobilných zariadení. Optimálnou možnosťou je vytvoriť samostatné miesto na tento účel, ale existujú aj iné spôsoby.

Pozrite si príklady mobilných lokalít. Často vloženie písmena "M." namiesto "www" Na webovej adrese stránky sa dostanete na mobilnú verziu stránky. Môžete urobiť niečo podobné.

Obrázok s názvom Dizajn webovej stránky KROKUJE 11

2. Nerobte si miesto príliš komplikované. Návrh vašich stránok by mal byť jednoduchý a v podstate. Webové stránky s komplexnou štruktúrou a blikajú bannery na dlhú dobu v minulosti. Kliknite na položku Jednoduché stránky. To znamená: jednoduchý dizajn, minimálny počet stĺpcov, minimálny text, ktorý potrebujete na čítanie, aby ste našli potrebné informácie na stránke.

Obrázok s názvom Dizajn webovej stránky Krok 12

3. Použitie "Reagujúci" rozloženie. Responzívne usporiadanie - tento spôsob kódovania lokality, ktorým je nastavený pre veľkosť obrazovky, na ktorej sa zobrazí (namiesto pevných veľkostí). Aby sa dosiahol takýto účinok, sa najčastejšie používa sada šírky stĺpca v percentách, a bez toho, aby ho špecifikovala v pixeloch, ale existuje viac sofistikované riešenia.

Obrázok s názvom Dizajn webovej stránky Krok 13

4. Vyhnite sa funkciám, ktoré nie sú podporované mobilnými zariadeniami. Mnoho telefónov a tabliet nemôže zobraziť pop-up, flash animácie, java alebo rámy. To nás vracia k hlavnému princípu - urobte návrh čo najjednoduchšie.

Obrázok s názvom Dizajn webovej stránky Krok 14

päť. Zvážte schopnosť vytvoriť aplikáciu. Za určitých okolností môžete byť jednoduchšie podať žiadosť ako mobilná verzia stránky. Aby ste to urobili, nemusíte byť super-duper programátor! Rovnako ako v prípade lokalít, existuje mnoho spoločností, ktoré budú plniť všetku prácu pre vás. Môžete napríklad využiť služby Conduit Mobile.

Tipy

Aby ste vaši návštevníci nemali tráviť atrament atrament, použite samostatný štýl formátu tlačového miesta

Po zadaní parametrov tlače vypnite obrázky pozadia.
Použite čierny text na bielom pozadí.
Vyberte ponuky a zbytočné obrázky

Vždy môžete vyvinúť vlastnú šablónu webových stránok na základe svojich vlastných nápadov o stránke, ale niekedy je jednoduchšie kúpiť ready-made vzor.

NEPOUŽÍVAJTE NEPOUŽÍVAJTE GRAPHY.V 90. rokoch bolo módne experimentovať s CFlash-animáciou, jasnými farbami a pozadím, nainštalujte hudbu okamžite pri načítaní stránky, ale dnes bude len vystrašiť návštevníkov. Použite jednoduché pozadie, kontrastné textové farby.

CSS (vstavané štýly) môžete použiť, takže musíte nastaviť vzdialenosť medzi odsekmi.

Pre návštevníkov so slabými liečiteľmi a víziou môžete použiť video a zvuk s titrami, čo naznačuje ich dostupnosť.Tabuľky sú účinným spôsobom, ako prenášať informácie, ale vizuálne postihnuté užívatelia, ktorí používajú čítačky obrazovky, nebudú môcť počúvať informácie v sekvencii stĺpca.

Ako vytvoriť návrh stránky

Kroky

Tipy

Upozornenia