Come creare un diagramma ad albero per un sito web

Un diagramma ad albero di un sito Web illustra come sono organizzate le pagine di un sito Web. Le pagine principali sono mostrate sopra oa sinistra delle pagine secondarie, indicando le relazioni tra le pagine Web e la modalità di accesso. I team di sviluppo Web utilizzano i diagrammi durante la creazione o la riprogettazione dei siti Web. I diagrammi dell'albero del sito Web possono essere semplici o elaborati, a seconda delle dimensioni del sito Web e delle esigenze del team di sviluppo.

Passo 1

Crea un elenco delle pagine web che il sito web contiene o conterrà. Assicurati che ogni elemento elencato sia una pagina del tuo sito web. A seconda delle dimensioni del tuo sito web, assegna un riferimento numerico a ciascuna pagina per aiutarti a costruire il diagramma del tuo sito e monitorare i progressi mentre sviluppi il tuo sito web.

Passo 2

Usando elenchi puntati, organizza la struttura per mostrare le relazioni genitore-figlio tra ogni pagina del tuo sito web. Ad esempio, il sito web di un negozio di abbigliamento online può avere pagine principali di primo livello che portano ad abbigliamento per uomo, donna e bambino. Ognuna di queste pagine avrebbe tipi di abbigliamento come camicie e pantaloni elencati sotto di loro nella struttura, portando infine a pagine per singoli prodotti.

Passaggio 3

Inizia a creare il tuo diagramma disegnando un rettangolo per ogni categoria nella parte superiore di un documento. Inserisci un breve titolo per ogni pagina web di primo livello nel diagramma. Includi il numero di riferimento della pagina in modo da poter cercare ulteriori dettagli sulla pagina negli altri documenti di pianificazione del tuo sito web.

Passaggio 4

Disegna rettangoli per ogni sottocategoria sotto una delle tue categorie di primo livello. Ad esempio, disegna quattro rettangoli sotto la categoria di primo livello di abbigliamento maschile per camicie, pantaloni, pantaloncini e cappotti. Allinea questi rettangoli uno accanto all'altro per illustrare che le pagine che rappresentano sono allo stesso livello all'interno della struttura del tuo sito web.

Passaggio 5

Collega le pagine delle sottocategorie alla categoria di primo livello a cui appartengono come se stessi creando un grafico gerarchico di un'organizzazione. Ad esempio, traccia delle linee dalle pagine di magliette, pantaloni, pantaloncini e cappotti alla categoria principale di abbigliamento maschile. Crea linee rette simili a quelle di un organigramma per aumentare la leggibilità del diagramma del tuo sito.

Passaggio 6

Continua a suddividere il diagramma in sottocategorie finché il diagramma ad albero non contiene la quantità di dettagli di cui hai bisogno per sviluppare efficacemente il tuo sito web. Ad esempio, disegna scatole di camicie eleganti e camicie casual nella sezione camicie della categoria abbigliamento maschile. Potrebbe non essere necessario, tuttavia, includere la pagina per ogni camicia da uomo casual nel diagramma del tuo sito.

Passaggio 7

Completa allo stesso modo le sezioni del diagramma per tutte le categorie di primo livello del tuo sito web. Ad esempio, completa le sezioni donna e bambino del sito web di abbigliamento.

Modifica i simboli utilizzati nel diagramma ad albero per indicare le informazioni che devi trasmettere al tuo team. Ad esempio, utilizza rettangoli arrotondati per pagine web dinamiche e un'illustrazione di diverse pagine web impilate insieme per mostrare un gruppo di pagine web simili che non sono elencate singolarmente. Includi una legenda sul diagramma per spiegare le tue convenzioni.