Ένα σύννεφο ετικέτας είναι μια οπτική απεικόνιση μιας λίστας αντικειμένων. Θα δείτε συχνά σύννεφα ετικετών σε ιστολόγια. Έγινε δημοφιλής από ιστότοπους όπως το Flickr.
Τα σύννεφα ετικετών είναι μια λίστα με συνδέσμους που αλλάζουν σε μέγεθος και βάρος (μερικές φορές και χρώμα) ανάλογα με κάποια μετρήσιμη ιδιότητα. Τα περισσότερα σύννεφα ετικετών είναι κατασκευασμένα με βάση τη δημοτικότητα ή τον αριθμό των σελίδων που έχουν επισημανθεί με τη συγκεκριμένη ετικέτα. Ωστόσο, μπορείτε να δημιουργήσετε ένα σύννεφο ετικετών από οποιαδήποτε λίστα αντικειμένων στον ιστότοπό σας που έχουν τουλάχιστον δύο τρόπους εμφάνισής τους. Για παράδειγμα:
- Μια λίστα με άρθρα με αλφαβητική σειρά με τα στυλ που δείχνουν τη δημοτικότητα των άρθρων.
- Μια λίστα τοποθεσιών Web σε αλφαβητική σειρά με τα στυλ που δείχνουν ποιες από αυτές σας αρέσουν οι καλύτερες.
- Μια λίστα με επεξεργαστές ιστού που παρατίθενται σε σειρά τιμών με τα στυλ που υποδεικνύουν πόσο κοντά πλησιάζει το καθένα ένα προκαθορισμένο σύνολο κριτηρίων.
- Μια λίστα φίλων με τα στυλ που δείχνουν την απόσταση από το σπίτι σας έως το δικό τους.
Τι χρειάζεστε για να δημιουργήσετε ένα σύννεφο ετικετών;
Είναι εύκολο να δημιουργήσετε ένα σύννεφο ετικετών, χρειάζεστε μόνο δύο πράγματα:
- Μια λίστα στοιχείων (όπως τα άρθρα στο Web, οι ιστότοποι ή οι φίλοι σας)
- Μια μέτρηση για κάθε στοιχείο (όπως προβολές σελίδας ανά ημέρα, κατάταξη 1-10 ή απόσταση από το σπίτι σας).
Τα περισσότερα σύννεφα ετικετών είναι λίστες συνδέσμων, έτσι βοηθά αν κάθε στοιχείο έχει μια διεύθυνση URL που συνδέεται με αυτό. Αλλά αυτό δεν απαιτείται για να δημιουργηθεί μια οπτική ιεραρχία.
Βήματα για τη δημιουργία ενός νέφους ετικετών δημοφιλών συνδέσεων
Ο ιστότοπός μας έχει άρθρα που παίρνουν προβολές σελίδας καθημερινά και αυτό είναι ένα εύκολο μετρικό που μπορούμε να χρησιμοποιήσουμε για να δημιουργήσουμε ένα cloud tag. Έτσι για αυτό το παράδειγμα, θα δημιουργήσουμε ένα σύννεφο ετικετών από μια λίστα άρθρων, τα 25 καλύτερα άρθρα στον ιστότοπό μου για την εβδομάδα της 1 Ιανουαρίου 2007.
-
Καθορίστε πόσα επίπεδα θέλετε στην ιεραρχία σας.
Ενώ είναι δυνατόν να έχετε τόσα πολλά επίπεδα στο σύννεφό σας, καθώς έχετε στοιχεία στη λίστα σας, αυτό γίνεται κουραστικό για τον κώδικα και οι διαφορές μπορεί να είναι πολύ ελάχιστες. Σας προτείνω να έχετε πάνω από 10 επίπεδα στην ιεραρχία σας.
-
Αποφασίστε για τα σημεία αποκοπής για κάθε επίπεδο.
Μπορεί να είναι τόσο απλό όσο να κόβετε τις προβολές της σελίδας σας ανά ημέρα σε 1/10 φέτες - δηλαδή. αν η μεγαλύτερη σελίδα στον ιστότοπό σας έχει 100 προβολές σελίδων ημερησίως, θα μπορούσατε να το φέρετε ως 100+, 90-100, 80-90, 70-80, κλπ. Έκοψα τις προβολές της σελίδας μου με αυτόν τον τρόπο.
-
Καταχωρίστε τα στοιχεία σας στη σειρά προβολής σελίδας και δώστε τους μια κατάταξη με βάση το βήμα 2
Μην ανησυχείτε αν δεν έχετε κάποια στοιχεία σε μερικά από τα slots, που κάνει το σύννεφο πιο ενδιαφέρον.
-
Περιορίστε τη λίστα σας με αλφαβητική σειρά (ή ό, τι δεύτερο είδος θέλετε να χρησιμοποιήσετε).
Αυτό κάνει το σύννεφο ενδιαφέρον. Εάν το αφήσετε ταξινομημένο κατά βαθμό, τότε θα είναι απλά ένας κατάλογος με τα μεγαλύτερα αντικείμενα στην κορυφή προς τα κάτω στο μικρότερο στο κάτω μέρος.
-
Γράψτε τον κώδικα HTML έτσι ώστε η κατάταξη να είναι ένας αριθμός κλάσης.
class = "tag4"> Προσθέτοντας Streaming Audio Files
-
Αυτό είναι!
Μόλις έχετε το HTML για κάθε μεμονωμένο στοιχείο λίστας και τη σειρά που θέλετε να τα εμφανίσετε, τότε πρέπει να αποφασίσετε. Μπορείτε να τοποθετήσετε τους συνδέσμους σε μια παράγραφο και θα τελειώσετε. Αλλά αυτό δεν θα σήμανε σημασιολογικά και όποιος δεν έρχεται στο CSS, θα δει μια μεγάλη παράγραφο με συνδέσμους. Το HTML για αυτόν τον τύπο λίστας θα μοιάζει με αυτό:
Αντ 'αυτού, σας συνιστούμε να δημιουργήσετε το σύννεφο ετικετών χρησιμοποιώντας μια μη ταξινομημένη λίστα. Είναι μερικές ακόμη γραμμές κώδικα HTML και CSS, αλλά διασφαλίζει ότι το περιεχόμενο θα είναι ευανάγνωστο, ανεξάρτητα από το ποιος θα έρθει να το δει. Το HTML θα μοιάζει με αυτό:
Αλλά πού είναι τα στυλ για το Cloud Tag
Τώρα φτάνουμε στο διασκεδαστικό μέρος - τα στυλ CSS. Όταν σχεδιάζετε ένα σύννεφο ετικετών, συνήθως αλλάζετε το μέγεθος της γραμματοσειράς και το βάρος της γραμματοσειράς. Μπορείτε επίσης να αλλάξετε το χρώμα της γραμματοσειράς ή του φόντου ή οποιοδήποτε άλλο χαρακτηριστικό στυλ, αλλά το μέγεθος και το βάρος είναι παραδοσιακά.
Χρειάζεστε 10 τάξεις στυλ, ένα για κάθε τάξη ετικετών:
Μας αρέσει να προσθέτουμε ορισμένα στυλ γύρω από το ίδιο το σύννεφο: κεντράρετε το κείμενο σύννεφο, ορίστε ένα ύψος γραμμής έτσι ώστε το σύννεφο να είναι αναγνώσιμο και βεβαιωθείτε ότι οι ετικέτες άγκυρας δεν έχουν επένδυση πάνω τους:
Τέλος, εάν χρησιμοποιείτε τη μέθοδο σημασιολογικού σχεδιασμού (δηλαδή την μη ταξινομημένη λίστα), θα πρέπει να προσθέσετε δύο ακόμη γραμμές CSS, έτσι ώστε η λίστα να μην έχει κουκκίδες και να μην είναι οδοντωτή:
