Pokud chcete rozvíjet a vytvořit web, pak vše půjde mnohem snazší, pokud trávíte nějaký čas na jeho plánování. Stage plánování umožňuje vývojářovi a klientovi spolupracovat, dokud nenajdou formát a uspořádání, které odpovídají jejich potřebám. Proces plánování ovlivňuje výběr stylu webu a případně, je nejdůležitějším aspektem webového designu, zejména pro podnikání.

Kroky

Část 1 z 4:

Vytvoření základní struktury

jeden. Určete funkčnost webu. Pokud vytvoříte webové stránky pro sebe, pravděpodobně již zná odpověď na tuto položku. Pokud vytvoříte stránku pro jinou osobu, společnost nebo organizaci, je nutné zjistit, co očekávají od webu a jeho funkčnosti. Vše, co se rozhodnete zde, bude mít dopad na konečné místo.

Potřebujete elektronický obchod? Potřebujete uživatelské komentáře? Uživatelé používají účet? Potřebujete webové stránky orientované na webu? Obraz orientovaný? Všechny tyto a mnoho dalších otázek pomůže vyplnit návrh a strukturu stránek.
Může to být dlouhý proces, zejména pro velké společnosti s velkým počtem lidí zapojených do projektu.

Obrázek s názvem Plán webové stránky Krok 2

2. Vytvořte schéma mapového webu. Schéma mapa - Jako blokové schéma ukazuje, jak se uživatelé pohybují z jedné stránky do druhé. Nemusíte ani nepotřebujete stránky v tomto bodě, pouze celkový tok nápadů. Můžete použít počítačový program pro vytvoření diagramu nebo si jej nastínit na list papíru. Použijte schéma mapy webu, abyste ukázali, jak si představujete hierarchii webových stránek a komunikace (připojení).

Obrázek s názvem Plán webové stránky Krok 3

3. Zkuste karty třídění. Populární metodou skupiny je použití karetních zásobníků, aby zjistil dokonalý přístup každého. Vezměte si hromadu karet pro poznámky a e-mailem hlavní obsah jedné stránky na každém z nich. Nechte svůj tým organizuje karty, aby byly považovány za nejužitečnější. To je nejlepší pro situace, když spolupracujete s ostatními, abyste vytvořili webové stránky.

Obrázek s názvem Plán webové stránky Krok 4

4. Použijte papír a nástěnku nebo desku. Toto je původní nízkorozpočtoucí metoda plánování, umožňuje rychle odstranit nebo přesouvat obsah a přesměrovat. Nakreslete design na papíře a připojte je do sekvence nebo nakreslete okruh na desce. Skvělé pro brainstorming.

Obrázek s názvem Plán webové stránky Krok 5

Pět. Proveďte obsah inventáře. Je mnohem snazší znovu než nové stránky. Zadejte každou část obsahu nebo existujících stránek v tabulce. Zaznamenejte schůzku každého z nich, použijte tento seznam k určení toho, co se děje a co zbývá. To pomůže snížit nejlepší část a zjednodušit proces redesign.

Část 2 ze 4:

Vytvoření html rámu

jeden. Vytvořit rámec (Strana Structural Schémata), který vám pomůže zabezpečit hierarchii. HTML-Rám je bonecloth budoucí stránky, které používají pouze nejzákladnější značky a bloky pro prezentaci obsahu. On odpoví na otázku: "Co je na obrazovce a kde?". Formátování a styl jsou v rámečku zcela ignorovány.

Rámec vám umožní vidět strukturu obsahu a toku až do výběru stylu.
HTML rámce nejsou statické jako soubory PDF nebo obrázky, umožňují rychle přesunout bloky obsahu pro vytvoření nové struktury.
Rám je interaktivní, což je přínosné pro vývojáře i klienta. Vzhledem k tomu, že rám je napsán jednoduchým HTML, pak se můžete stále pohybovat a cítit, jak běží mezi stránkami. To nemůže být vyjádřeno konceptem PDF.

Obrázek s názvem Plán webové stránky Krok 7

2. Vyzkoušejte šedou metodu (šedé pole). Umístěte obsah stránky v šedých polích s nejdůležitějším obsahem na vrcholu. Bloky jsou umístěny v jednom sloupci, s nejdůležitější částí obsahu na stránce nahoře. Pokud je například stránka stránka o společnosti (O), podrobnosti o společnosti by mohly jít do horního bloku následovaným seznamem zaměstnanců, pak kontaktní informace a tak dále.

Nezahrnuje horní a zápatí. Šedá pole je jen vizuální reprezentací obsahu, který se nachází na stránce.

Obrázek s názvem Plán webové stránky Krok 8

3. Zkuste použít program Wireframing. Existuje několik programů, které vám mohou pomoci v procesu vytváření interaktivního designu prototypu (wireframing). Výše znalosti zdrojového kódu se liší od programu do programu. Zde jsou některé z nejoblíbenějších programů:

Laboratoře.Tato stránka se specializuje na "atomový design", kde je každá část obsahu reprezentována jako "molekula", která je velká stránka.

Jumpcharts. Toto je webová stránka plánovací služby služby pro interaktivní design prototypu.Vyžaduje placené předplatné, ale umožňuje rychle vybudovat stránky blokové schémata, aniž by se příliš obávali příliš mnoho o práci s kódem.

Wirefy. Wirefy Další systém "atomového projektu". Všechny nástroje jsou dostupné pro vývojáře.

Obrázek s názvem Plán webové stránky Krok 9

4. Použijte jednoduchý HTML Markup. Dobrý rám může být snadno převeden na skutečné stránky později. Neboj se obecně o stylu v procesu vytváření interaktivního prototypového designu. Místo toho použijte značku, které lze snadno pochopit a změnit s trochou úsilí.

"Méně" znamená "více" s rámem. Cílem je jednoduše vybudovat strukturu. Vzhled lze nastavit později s CSS a rozšířeným značením.

Obrázek s názvem Plán webové stránky Krok 10

Pět. Udělejte rámec pro každou stránku na svých stránkách. Může být lákavé vytvořit jednoduchý rám a říkat: "Cool, mohu ji aplikovat na každou stránku, to se hodí". Ve skutečnosti to povede k vytvoření obyčejného a nudného místa. Strávit čas na vytvoření interaktivního designu prototypu každé stránky a brzy zjistíte, že každá stránka má své vlastní organizační "potřeby".

Část 3 ze 4:

Vytvoření obsahu

jeden. Připravte si nějaký obsah před zahájením vytváření webových stránek. Bude mnohem snazší vidět, jak styl webu vypadá, pokud máte skutečný obsah místo prázdných polí. Nepotřebujete příliš mnoho informací, ale všechno bude vypadat mnohem lépe v rozvržení, pokud máte nějaký materiál pro články a originální obrázky.

Nepotřebujete hromadnou část článku, ale musíte mít alespoň reálné titulky.

Obrázek s názvem Plán webové stránky Krok 12

2. Nezapomeňte, že dobrý obsah je více než text. Internet - je to mnohem více než jednoduché textové stránky. Chcete-li vyniknout ve vašem výklenku, budete potřebovat mnoho různých typů obsahu, jak přilákat a pořádat návštěvníky. Některý možný obsah pro zapamatování:

Fotky.

Zvuk

Video

Nitě nebo proud (Twitter)

Facebook Integration

RSS (z angličtiny. Opravdu jednoduchá syndikace - standardizovaný obsahový systém)

Novinky obsahu kanálu

Obrázek s názvem Plán webové stránky Krok 13

3. Vyberte si profesionální fotograf. Pokud přidáte fotografie na své stránky, pak s profesionální fotografií první dojmy z toho budou mnohem lepší. Jedna dobrá fotografie je více než 20 špatných.

Práce začínajících fotografů bude mnohem levnější než díla zkušených profesionálů.

Obrázek s názvem Plánujte webové stránky Krok 14

4. Činnosti kvality zápisu. Písemný obsah na vaší stránce určí obrovské množství webového provozu. Ačkoliv se nemusíte bát příliš mnoho o vytváření obsahu v této fázi procesu návrhu, nebudete zranit a přemýšlet o tom, protože obsah bude muset pravidelně vytvářet, když "inhalování života" v místě.

Po článcích budou psány mnoho věcí, které budete s největší pravděpodobností používat v procesu vytváření webových stránek. To může zahrnovat kontaktní informace, jména společnosti nebo něco jiného, které budou používány na několika místech na místě.

Část 4 z 4:

Otočení myšlenek na místě

jeden. Rozvíjet společné prvky. To jsou ty věci, které jsou viditelné na každém feetu, jako jsou: horní a stoproof, navigační menu. Vytvořte velmi jednoduchý styl, takže vidíte, jak se vaše stránky budou dívat s nimi na místě. Bude velmi užitečné při přesunu do procesu vytváření uspořádání.

Nebojte se příliš mnoho o detailech, ale zkuste je učinit téměř stejně jako všechno, co by mělo vypadat.

Obrázek s názvem Plán webové stránky Krok 16

2. Vytvořit základní plán (ubytování). Začněte pohybovat průvodce z jednoho sloupce v jejich obecně přijímaných místech na stránce. Můžete například přesunout navigační blok na levou stranu stránky a seznam záhlaví - vpravo.

Pokračujte v experimentování s umístěním pro více stránek před pohybem dál. Nechte ostatní zkontrolovat, aby viděli, jak jsou anorganizovány.

Obrázek s názvem Plán webové stránky Krok 17

3. Vytvořit rozložení. Použijte program (jako Photoshop) a vytvořte rozložení několika stránek stránek. Použijte rozložení, které jste vybrali jako průvodce. Můžete pracovat mnohem rychleji v programu upravit obrázky a získat vše v tomto formuláři, kolik potřebujete. To vám umožní použít tyto snímky jako odkazy, když přijde skutečný kód.

Přidat tento obsah do rozvržení, abyste se ujistili, že všechno vypadá dobře.

Obrázek s názvem Plán webové stránky Krok 18

4. Nahradit obsah bloků. Začněte přidat systém a položky na stránku. Nedělejte si starosti o styl, prostě místo na správném místě. To vám pomůže naučit se, zda budou vaše změny ve stylu fungovat.

Obrázek s názvem Plán webové stránky Krok 19

Pět. Vytvořit průvodce stylem. Je velmi důležité udržovat pojivový styl, zejména pro velké stránky. Pokud je stránka pro podnikání, které již má vizuální značky, musí být zahrnuta do designu stránek. Věci, které je třeba zvážit v příručce bude post:

Navigace

Záhlaví (

,

, ATD.)

Odstavce

Italice (kurzíva)

Sumující (tučné)

Reference (aktivní, neaktivní, plovoucí)

Pomocí obrázku

Ikony

Knoflíky

Seznamy

Obrázek s názvem Plán webové stránky Krok 20

6. Použijte svůj styl. Jakmile styl a design pro stránky, to přišel čas implementovat. CSS je jedním z nejjednodušších způsobů, jak prodávat styl pro celou stránku nebo celý web. Přečtěte si tuto příručku pro více informací o používání CSS.