Πώς να δημιουργήσετε ένα διάγραμμα δέντρων για μια ιστοσελίδα

Ένα διάγραμμα δέντρων ιστότοπων δείχνει πώς οργανώνονται οι σελίδες σε έναν ιστότοπο. Οι γονικές σελίδες εμφανίζονται επάνω ή αριστερά από τις δευτερεύουσες σελίδες, υποδεικνύοντας τις σχέσεις μεταξύ ιστοσελίδων και τον τρόπο πρόσβασης τους. Οι ομάδες ανάπτυξης ιστού χρησιμοποιούν τα διαγράμματα όταν δημιουργούν ή επανασχεδιάζουν ιστότοπους. Τα διαγράμματα δέντρων ιστοτόπων μπορεί να είναι απλά ή πολύπλοκα, ανάλογα με το μέγεθος της ιστοσελίδας και τις ανάγκες της ομάδας ανάπτυξης.

Βήμα 1

Δημιουργία μιας λίστας των ιστοσελίδων που περιέχει ή θα περιέχει . Βεβαιωθείτε ότι κάθε στοιχείο που αναφέρεται θα είναι μια σελίδα στον ιστότοπό σας. Ανάλογα με το μέγεθος του ιστότοπού σας, αντιστοιχίστε μια αριθμητική αναφορά σε κάθε σελίδα για να σας βοηθήσουμε να δημιουργήσετε το διάγραμμα του ιστότοπού σας και να παρακολουθήσετε την πρόοδο κατά την ανάπτυξη του ιστοτόπου σας.

Βήμα 2

Χρήση των καταλόγων με κουκκίδες, για να εμφανίσετε τις σχέσεις γονέα-παιδιού μεταξύ κάθε σελίδας στον ιστότοπό σας. Για παράδειγμα, ένας ιστότοπος ηλεκτρονικού καταστήματος ειδών ένδυσης μπορεί να έχει σελίδες γονέων υψηλού επιπέδου που οδηγούν σε ανδρικά, γυναικεία και παιδικά ρούχα. Κάθε μία από αυτές τις σελίδες θα έχει τύπους ενδυμάτων όπως τα πουκάμισα και τα παντελόνια που παρατίθενται κάτω από αυτά στο περίγραμμα, οδηγώντας τελικά σε σελίδες για μεμονωμένα προϊόντα.

Βήμα 3

Ξεκινήστε τη δημιουργία του διαγράμματος σας σχεδιάζοντας ένα ορθογώνιο για κάθε ένα στην κορυφή ενός εγγράφου. Εισαγάγετε ένα σύντομο τίτλο για κάθε ιστοσελίδα ανώτερου επιπέδου στο διάγραμμα. Συμπεριλάβετε τον αριθμό αναφοράς της σελίδας έτσι ώστε να μπορείτε να αναζητήσετε πρόσθετες λεπτομέρειες σχετικά με τη σελίδα στα άλλα έγγραφα προγραμματισμού του ιστοτόπου σας.

Βήμα 4

Σχεδιάστε ορθογώνια για κάθε υποκατηγορία κάτω από μία από τις κατηγορίες ανώτατου επιπέδου. Παραδείγματος χάριν, αντλήστε τέσσερα ορθογώνια κάτω από την ανώτατη κατηγορία ανδρικών ενδυμάτων για πουκάμισα, παντελόνια, σορτς και παλτά. Ευθυγραμμίστε τα ορθογώνια αυτά δίπλα-δίπλα για να δείξετε ότι οι σελίδες που αντιπροσωπεύουν βρίσκονται στο ίδιο επίπεδο μέσα στη δομή του ιστότοπού σας.

Βήμα 5

Συνδέστε τις σελίδες υποκατηγοριών στην κατηγορία ανώτατου επιπέδου στην οποία ανήκουν όπως εάν δημιουργούσατε ένα γράφημα ιεραρχίας ενός οργανισμού. Για παράδειγμα, σύρετε γραμμές από τις σελίδες πουκάμισων, παντελονιών, σορτς και παλτών στην κατηγορία μητρικών ρούχων. Δημιουργήστε ευθείες γραμμές παρόμοιες με εκείνες ενός οργανωτικού χάρτη για να αυξήσετε την αναγνωσιμότητα του διαγράμματος του ιστοτόπου σας.

Βήμα 6

Συνέχιση της διακλάδωσης του διαγράμματος σας στις υποκατηγορίες μέχρι το δέντρο διάγραμμα να περιέχει την ποσότητα λεπτομέρειας που χρειάζεστε αποτελεσματικά Για παράδειγμα, σχεδιάστε κιβώτια των πουκάμισων φόρεμα και των casual πουκάμισα κάτω από το τμήμα πουκάμισα της κατηγορίας ανδρικών ρούχων. Μπορεί να μην είναι απαραίτητο να συμπεριλάβετε τη σελίδα για κάθε casual ανδρικό πουκάμισο στο διάγραμμα του ιστοτόπου σας.

Βήμα 7

Συμπληρώστε τις ενότητες διάγραμμα για όλες τις κατηγορίες ανώτερου επιπέδου του ιστότοπού σας στην ίδια τρόπος. Για παράδειγμα, συμπληρώστε τα τμήματα των γυναικών και των παιδιών στο δικτυακό τόπο ένδυσης.

Τροποποιήστε τα σύμβολα που χρησιμοποιούνται στο δέντρο διάγραμμα για να υποδείξετε τις πληροφορίες που πρέπει να μεταφέρετε στην ομάδα σας. Για παράδειγμα, χρησιμοποιήστε στρογγυλεμένα ορθογώνια για δυναμικές ιστοσελίδες και μια απεικόνιση διαφόρων ιστοσελίδων στοιβάζονται μεταξύ τους για να εμφανίσετε μια ομάδα παρόμοιων ιστοσελίδων που δεν αναφέρονται ξεχωριστά. Συμπεριλάβετε ένα μύθο στο διάγραμμα για να εξηγήσετε τις συμβάσεις σας.

Συμβουλή: Σκεφτείτε να σχεδιάσετε ένα τμήμα του διαγράμματος σας σε χαρτί πριν αρχίσετε να δημιουργείτε το διάγραμμα χρησιμοποιώντας έναν υπολογιστή.

Προειδοποίηση

Διαγράμματα δέντρων ιστοτόπων μπορεί να είναι πολύ μεγάλα. Τοποθετήστε το διάγραμμα σε μικρότερα διαγράμματα που αντιπροσωπεύουν το καθένα ένα μικρό τμήμα της ιστοσελίδας για να εκτυπώσετε το διάγραμμα. Συγκεντρώστε το διάγραμμα σε έναν τοίχο για μια μεγάλη οπτική αναπαράσταση της ιστοσελίδας σας ή τοποθετήστε τα διαγράμματα σε ένα σημειωματάριο για αναφορά καθώς αναπτύσσετε πολλές σελίδες του ιστότοπου.