Πώς να χρησιμοποιήσετε τη σήμανση Schema.org στον ιστότοπό σας και γιατί πρέπει

Διαφήμιση

Οι μηχανές αναζήτησης είναι εκπληκτικά ισχυρό 7 Εναλλακτικές λύσεις αναζήτησης Google και οι δυνατότητες εμπορικών σημάτων τουςΕίστε ένας σκληρός χρήστης του Google; Δοκιμάστε αυτές τις εναλλακτικές μηχανές αναζήτησης. Από το απόρρητο έως τη βοήθεια φιλανθρωπικών σκοπών, αυτές οι μηχανές αναζήτησης θα μπορούσαν να σας δώσουν κάποιους λόγους για να αλλάξετε τον τρόπο περιήγησής σας. Διαβάστε περισσότερα . Μπορούν να ερμηνεύσουν τη συχνά ασαφή γλώσσα που χρησιμοποιούμε για να καταλάβουμε τι ψάχνουμε, να καθορίσουν τον καλύτερο πόρο για να απαντήσουμε στις ερωτήσεις μας και να μας το δείξουμε σε κλάσματα του δευτερολέπτου.

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

Ωστόσο, οι μηχανές αναζήτησης δεν μπορούν να το κάνουν μόνοι τους - χρειάζονται βοήθεια από κατόχους ιστότοπων και προγραμματιστές. Και η σήμανση σχήματος είναι ένας τρόπος με τον οποίο μπορείτε να βοηθήσετε στον δικό σας ιστότοπο.

Τι είναι η σήμανση σχήματος;

Η σήμανση σχήματος είναι ένας τρόπος επισήμανσης συγκεκριμένων τμημάτων δομημένων δεδομένων.

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

Η Google έχει τη δική της διαδραστικό παράδειγμα σήμανσης σχήματος που περιγράφει μια συνταγή μηλόπιτας:

Πάνω, μπορείτε να δείτε τη JavaScript που καθορίζει τον χρόνο προετοιμασίας, τον συνολικό χρόνο, την απόδοση της συνταγής και διάφορα στοιχεία διατροφής για τη συνταγή.

Πρέπει να σημειωθεί σε αυτό το σημείο ότι υπάρχουν δύο βασικοί τρόποι σήμανσης των δομημένων δεδομένων: με τον JSON Τι είναι το JSON; Επισκόπηση ενός λαϊκούΕίτε σκοπεύετε να γίνετε προγραμματιστής ιστού είτε όχι, είναι καλή ιδέα να γνωρίζετε τουλάχιστον τι είναι το JSON, γιατί είναι σημαντικό και γιατί χρησιμοποιείται σε όλο τον ιστό. Διαβάστε περισσότερα ή με ενσωματωμένες ετικέτες HTML. Η Google συνιστά τη μέθοδο JSON, αλλά θα εξετάσουμε και τα δύο αργότερα.

Δείτε πώς η Google βγάζει τις συγκεκριμένες διατροφικές πληροφορίες:

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

• επίπεδο επάρκειας
• καταμέτρηση λέξεων
• κοινό
• δημιουργός
• Ημερομηνία Δημιουργίας
• ημερομηνία τροποποιήθηκε
• ημερομηνία δημοσίευση
• αρχές δημοσίευσης
• τυπικόAgeRange

Υπάρχουν πλήρες σχήμα για βιβλιοθήκες, επιχειρήσεις διαμονής, διαμερίσματα, εκδηλώσεις εικαστικών τεχνών, κανάλια μετάδοσης, μεθόδους παράδοσης, καταστάσεις διακομιστή παιχνιδιών και πολλά άλλα.

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

Τα οφέλη της σήμανσης σχήματος

ΕΝΤΑΞΕΙ. Η σήμανση σχήματος λέει στις μηχανές αναζήτησης τι υπάρχει στη σελίδα σας - ποια είναι η μεγάλη υπόθεση;

Η Google το θέτει ως εξής:

"Όταν οι πληροφορίες είναι πολύ δομημένες και προβλέψιμες, οι μηχανές αναζήτησης μπορούν να τις οργανώσουν και να τις εμφανίσουν πιο εύκολα με δημιουργικούς τρόπους."

Για παράδειγμα, ενδέχεται να δείτε τις ημερομηνίες περιήγησης για την επερχόμενη περιοδεία Slayer να εμφανίζονται απευθείας στα αποτελέσματα αναζήτησης:

Ή λάβετε συγκεκριμένες πληροφορίες σχετικά με μια ταινία όταν την αναζητάτε:

Η Google βελτιώνεται συνεχώς με την εύρεση αυτών των πληροφοριών από μόνη της, αλλά χρησιμοποιεί σωστά το σχήμα η σήμανση διευκολύνει τη διαδικασία και καθιστά πιο πιθανό τις πληροφορίες στη σελίδα σας να είναι χαρακτηριστικό.

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

Ξεκινώντας με δομημένα δεδομένα

Τώρα που έχετε δει τα οφέλη από τη χρήση της σήμανσης Schema.org, ήρθε η ώρα να ξεκινήσετε την κατάδυση. Θα ξεκινήσουμε με το ευκολότερο εργαλείο γύρω από: Επισήμανση δεδομένων της Google.

Θα χρειαστεί να συνδεθεί ο ιστότοπός σας στο Search Console της Google (παλαιότερα γνωστό ως Εργαλεία για Webmasters Λάβετε βαθύτερες πληροφορίες αναζήτησης για τον ιστότοπό σας με ερωτήματα αναζήτησης εργαλείων για WebmastersΟι αλλαγές στο εργαλείο ερωτημάτων αναζήτησης στο Google Webmasters θα μπορούσαν να αλλάξουν τον τρόπο με τον οποίο πραγματοποιείτε την έρευνα για το θέμα σας. Η δημιουργία περιεχομένου στον ιστό περιλαμβάνει τη δημιουργικότητα και την εστίαση του χρήστη, καθώς και πολλή έρευνα λέξεων-κλειδιών. Διαβάστε περισσότερα ). Εάν χρειάζεστε βοήθεια για να το ρυθμίσετε, ρίξτε μια ματιά Η χρήσιμη αναδρομή του Yoast.

Μόλις το κάνετε αυτό, συνδεθείτε στο Search Console και κάντε κλικ στο Αναζήτηση εμφάνισης> Επισήμανση δεδομένων. Χτύπα το Ξεκινήστε την επισήμανση κουμπί στη δεξιά πλευρά της οθόνης.

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

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

Τώρα θα δείτε μια διαχωρισμένη οθόνη: τη σελίδα σας στα αριστερά και τα διαθέσιμα πεδία σήμανσης στα δεξιά.

Είναι πολύ απλό από εδώ. Απλώς ξεκινήστε να επισημαίνετε! Κάθε φορά που επισημαίνετε κείμενο (ή κάντε κλικ σε μια εικόνα), εμφανίζεται ένα μικρό μενού όπου μπορείτε να επιλέξετε τον τύπο πληροφοριών που επισημαίνετε.

Εδώ, έχω επισημάνει τον τίτλο της σελίδας. Το μόνο που πρέπει να κάνω είναι να κάνω κλικ στο "Τίτλος" στο μενού.

Τώρα ο τίτλος συμπληρώνεται στο δεξιό τμήμα του παραθύρου.

Θα συνεχίσω, επισημαίνοντας τον συγγραφέα, ημερομηνία δημοσίευσης, κύρια εικόνα και κατηγορία (επισήμανα τις ετικέτες στην κορυφή του άρθρου και και οι τρεις εισήχθησαν ως κατηγορίες).

Και τελειώσαμε! Αυτό είναι το μόνο που υπάρχει.

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

Προσθήκη περισσότερων λεπτομερειών

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

Τι κάνουμε εάν θέλουμε να προσθέσουμε περισσότερες λεπτομέρειες στη σήμανση σχήματος;

Θα πρέπει να βυθίσετε τον κώδικα σε αυτό το σημείο. Όπως ανέφερα νωρίτερα, υπάρχουν δύο βασικοί τρόποι για την αναπαράσταση των δομημένων δεδομένων: με JSON και με ενσωματωμένες ετικέτες HTML. Επειδή η Ετικέτες HTML 17 απλά παραδείγματα κώδικα HTML που μπορείτε να μάθετε σε 10 λεπτάΘέλετε να δημιουργήσετε μια βασική ιστοσελίδα; Μάθετε αυτά τα παραδείγματα HTML και δοκιμάστε τα σε ένα πρόγραμμα επεξεργασίας κειμένου για να δείτε πώς φαίνονται στο πρόγραμμα περιήγησής σας. Διαβάστε περισσότερα είναι λίγο πιο διαισθητικό, θα τα ξεπεράσουμε πρώτα.

Σήμανση HTML Inline Schema.org

Για παράδειγμα, θα επισημάνουμε μια απλή πρόταση: «Ζω στο Ντένβερ.» Σε HTML, αυτό θα αναπαρασταθεί απλά, ως εξής:

Ζω στο Ντένβερ.

Για να ξεκινήσετε τη σήμανση, πρέπει να προσδιορίσετε ότι αυτή η συγκεκριμένη πρόταση αφορά ένα άτομο (φαίνεται από τον τύπο αντικειμένου του ατόμου). Δείτε πώς το κάνουμε αυτό:

Ζω στο Ντένβερ.

Τώρα μια μηχανή αναζήτησης θα γνωρίζει ότι όλα περιλαμβάνονται σε αυτό

Στη συνέχεια, θα προσθέσουμε ένα χαρακτηριστικό σήμανσης: homeLocation. Το Schema.org ορίζει το HomeLocation ως "Τοποθεσία επικοινωνίας για την κατοικία ενός ατόμου".

Πρέπει να προσθέσουμε το συγκεκριμένο χαρακτηριστικό στο HTML. Δείτε πώς το κάνουμε αυτό:

Ζω Ντένβερ.

Τώρα το "Ντένβερ" αναγνωρίζεται ως το homeLocation ιδιοκτησία και η Google γνωρίζει ότι το άτομο που προσδιορίζεται σε αυτήν την παράγραφο ζει εκεί.

Εάν αλλάξουμε την πρόταση σε "Ζω και εργάζομαι στο Ντένβερ", μπορούμε να το δείξουμε επίσης:

Ζω και εργάζομαι Ντένβερ.

Το Ντένβερ αναγνωρίζεται πλέον ως και τα δύο homeLocation και τοποθεσία εργασίας. (Χάρη στην Lloyd Bank και unor στο Stack Exchange για σκιαγραφώντας αυτό το παράδειγμα.)

Αυτή είναι μια μάλλον απλή περίπτωση σήμανσης σχήματος, αλλά έχετε την ιδέα. Με τη χρήση και ετικέτες, μπορείτε να προσθέσετε χαρακτηριστικά και ιδιότητες σε οτιδήποτε στη σελίδα σας.

Σήμανση Schema.org με JSON

Η Google συνιστά τη χρήση JSON-LD (Σημείωση αντικειμένου JavaScript για συνδεδεμένα δεδομένα) για σήμανση σχήματος. Το μεγαλύτερο πλεονέκτημα αυτής της μεθόδου είναι ότι διατηρεί το HTML σας πολύ πιο καθαρό. Εάν επιστρέψετε για να επεξεργαστείτε μια σελίδα και δείτε δεκάδες σελίδες κώδικα με σήμανση, δεν θα είστε ευχαριστημένοι.

Η σήμανση JSON εξακολουθεί να απαιτεί πολύ χώρο, αλλά διαχωρίζεται από τον κώδικα HTML, διευκολύνοντας τη συντήρηση.

Ας υποθέσουμε ότι έχετε ένα βιβλιοπωλείο που ονομάζεται Harker's και έχετε συμπεριλάβει τις ακόλουθες πληροφορίες στη σελίδα επικοινωνίας σας:

Αριθμός τηλεφώνου: 555-8710. Διεύθυνση: 749 Stoker St., Boulder, Κολοράντο. Ώρες: 10–9 Δευτέρα έως Παρασκευή, 11–8 Σάββατο, 12–5 Κυριακή

Δείτε πώς θα το αντιπροσωπεύατε με το JSON-LD:

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

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

Προσθήκη σήμανσης σχήματος στον ιστότοπό σας

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

Ανεξάρτητα από το αν θέλετε να πάρετε τα βασικά ή να αρχίσετε να επισημαίνετε τα πάντα, έχετε πλέον τους πόρους που χρειάζεστε για να ξεκινήσετε!

Έχετε χρησιμοποιήσει τη σήμανση Schema.org στον ιστότοπό σας; Έχετε συμβουλές για κατόχους ιστότοπων ή προγραμματιστές που θέλουν να ξεκινήσουν; Μοιραστείτε τις σκέψεις σας στα παρακάτω σχόλια!

Πιστωτική εικόνα: iinspiration μέσω Shutterstock.com