Jak utworzyć diagram drzewa dla strony internetowej

Diagram drzewa strony ilustruje sposób organizacji stron w witrynie. Strony nadrzędne są pokazane powyżej lub po lewej stronie stron podrzędnych, wskazując relacje między stronami internetowymi i sposób ich dostępu. Zespoły tworzące strony internetowe używają diagramów podczas tworzenia lub przeprojektowywania stron internetowych. Diagramy drzewa witryn mogą być proste lub rozbudowane, w zależności od wielkości strony internetowej i potrzeb zespołu programistów.

Krok 1
Utwórz listę stron internetowych, które zawiera lub będzie zawierać strona internetowa . Upewnij się, że każda wymieniona pozycja będzie stroną na Twojej stronie. W zależności od rozmiaru witryny przypisz numeryczne odniesienie do każdej strony, aby pomóc Ci w tworzeniu diagramu witryny i śledzeniu postępów podczas tworzenia witryny.

Krok 2
Korzystanie z list punktowanych, zorganizuj kontur aby pokazać relacje rodzic-dziecko między każdą stroną w witrynie. Na przykład strona internetowa sklepu z odzieżą online może mieć strony nadrzędne najwyższego poziomu, które prowadzą do odzieży męskiej, damskiej i dziecięcej. Każda z tych stron zawiera rodzaje ubioru, takie jak koszule i spodnie wymienione pod nimi w zarysie, prowadzące ostatecznie do stron dla poszczególnych produktów.

Krok 3
Rozpocznij tworzenie diagramu, rysując jeden prostokąt dla każdego kategoria w górnej części dokumentu. Wstaw krótki tytuł dla każdej strony internetowej najwyższego poziomu do swojego diagramu. Dołącz numer referencyjny strony, abyś mógł wyszukać dodatkowe informacje o stronie w innych dokumentach planowania witryny.

Krok 4
Narysuj prostokąty dla każdej podkategorii poniżej jednej z kategorii najwyższego poziomu. Na przykład narysuj cztery prostokąty pod kategorią odzieży męskiej na najwyższym poziomie na koszule, spodnie, szorty i płaszcze. Wyrównaj te prostokąty obok siebie, aby zilustrować, że reprezentowane przez nie strony są na tym samym poziomie w strukturze witryny.

Krok 5
Połącz strony podkategorii z kategorią najwyższego poziomu, do której należą, jako jeśli tworzyłeś wykres hierarchii organizacji. Na przykład narysuj linie od stron koszul, spodni, szortów i płaszczy do kategorii rodziców odzieży męskiej. Twórz linie proste podobne do tych w schemacie organizacyjnym, aby zwiększyć czytelność diagramu witryny.

Krok 6
Kontynuuj rozgałęzianie diagramu na podkategorie, aż diagram drzewa będzie zawierał ilość szczegółów potrzebnych do skutecznego rozwijać swoją stronę. Na przykład narysuj pudełka z koszulami i koszulami casualowymi w sekcji koszulek kategorii odzieży męskiej. Dołączenie strony do każdej codziennej męskiej koszulki w schemacie witryny może nie być konieczne.

Krok 7
Uzupełnij sekcje diagramu dla wszystkich kategorii najwyższego poziomu witryny w tym samym sposób. Na przykład wypełnij sekcję damską i dziecięcą na stronie internetowej odzieży.
Zmodyfikuj symbole używane na diagramie drzewa, aby wskazać informacje, które musisz przekazać swojemu zespołowi. Na przykład za pomocą zaokrąglonych prostokątów dla dynamicznych stron internetowych i ilustracji kilku stron internetowych ułożonych razem, aby pokazać grupę podobnych stron internetowych, które nie są wymienione osobno. Dołącz legendę do diagramu, aby wyjaśnić swoje konwencje.

Porada
Rozważ narysowanie części diagramu na papierze przed rozpoczęciem tworzenia diagramu za pomocą komputera.

Ostrzeżenie