Κοινοί τύποι μετα-ετικετών
1. Μετα-περιγραφή
Παρέχει μια σύντομη περίληψη του περιεχομένου της ιστοσελίδας, που χρησιμοποιείται από τις μηχανές αναζήτησης για εμφάνιση στα αποτελέσματα αναζήτησης.
<meta name=”description” content=”Αυτή είναι μια ιστοσελίδα σχετικά με τις μετα-ετικέτες HTML και τις λειτουργίες τους.” >
2. Μετα-λέξεις-κλειδιά
Καθορίζει λέξεις-κλειδιά σχετικές με το περιεχόμενο της σελίδας. (Λιγότερο σημαντικό για το SEO στις μέρες μας.)
<meta name=”keywords” content=”HTML, meta tags, webpage, SEO”>
3. Θύρα προβολής
Ελέγχει τον τρόπο εμφάνισης της ιστοσελίδας σε κινητές συσκευές.
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
4. Σύνολο χαρακτήρων
Καθορίζει την κωδικοποίηση χαρακτήρων για την ιστοσελίδα (χρησιμοποιείται συνήθως UTF-8).
<meta charset=”UTF-8″>
5. Συγγραφέας
Καθορίζει το όνομα του συντάκτη του περιεχομένου.
<meta name=”συγγραφέας” content=”John Doe”>
Παράδειγμα μετα-ετικετών σε HTML
<! DOCTYPE html>
<html>
<κεφάλι>
<meta charset=”UTF-8″>
<meta name=”description” content=”Μάθετε τα πάντα σχετικά με τις μετα-ετικέτες HTML και πώς βελτιώνουν το SEO και τη λειτουργικότητα της σελίδας.” >
<meta name=”λέξεις-κλειδιά” content=”HTML, meta tags, SEO”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta name=”συγγραφέας” content=”Jane Smith”>
<τίτλος>Κατανόηση των μετα-ετικετών</τίτλος>
</κεφαλή>
<σώμα>
<h1>Καλώς ήλθατε στο Meta Tag Tutorial</h1>
</σώμα>
</html>
Σημασία των μετα-ετικετών
– SEO: Οι μετα-ετικέτες, ειδικά η περιγραφή και οι λέξεις-κλειδιά, βοηθούν τις μηχανές αναζήτησης να κατανοήσουν το περιεχόμενο μιας σελίδας.
– Εμπειρία χρήστη: Ετικέτες όπως το «viewport» βελτιώνουν την ανταπόκριση σε κινητά.
– Μεταδεδομένα: Παρέχει πρόσθετες πληροφορίες (συγγραφέας, charset) χρήσιμες για προγράμματα περιήγησης και μηχανές αναζήτησης.