Τι είναι μια ετικέτα HTML σε σχέση με ένα στοιχείο HTML;

Υπάρχει μια διαφορά μεταξύ αυτών των δύο όρων

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

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

Ενώ αυτοί οι δύο όροι έχουν παρόμοια σημασία, δεν είναι πραγματικά συνώνυμα. Ποια είναι λοιπόν η ομοιότητα με τους δύο αυτούς όρους; Η σύντομη απάντηση είναι ότι και οι δύο ετικέτες και τα στοιχεία αναφέρονται στη σήμανση που χρησιμοποιείται για την εγγραφή HTML. Για παράδειγμα, μπορείτε να πείτε ότι χρησιμοποιείτε την ετικέτα

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

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

Όταν γράφετε HTML, γράφετε ετικέτες HTML. Όλες οι ετικέτες HTML αποτελούνται από ορισμένα συγκεκριμένα μέρη, όπως:

• Ένα μικρότερο από το σύμβολο <
• Μια λέξη ή ένας χαρακτήρας που καθορίζει ποια ετικέτα γράφεται
• Οποιοσδήποτε αριθμός προαιρετικών χαρακτηριστικών HTML με τη μορφή ζεύγους name = "value"
• Και τέλος ένα σημάδι μεγαλύτερο από το>

Για παράδειγμα, εδώ είναι μερικές ετικέτες HTML:

Αυτές είναι όλες οι ετικέτες ανοίγματος HTML, χωρίς να προστεθούν προαιρετικά χαρακτηριστικά. Οι ετικέτες αυτές αντιπροσωπεύουν:

• - ορίζει μια παράγραφο.

• - ορίζει τη σελίδα ως HTML
• - ορίζει μια διαίρεση.

Τα παρακάτω είναι επίσης ετικέτες HTML:

• Όλα αυτά τα παραδείγματα περιλαμβάνουν ιδιότητες που έχουν προστεθεί στις ετικέτες HTML που ανοίγουν.

  • Η
    είναι μια μη ταξινομημένη λίστα που περιλαμβάνει ένα χαρακτηριστικό ταυτότητας
    • Το τμήμα έχει ένα χαρακτηριστικό κλάσης
    • Το στοιχείο αγκύρωσης ή συνδέσμου περιλαμβάνει το χαρακτηριστικό "href"
    • Η ετικέτα εικόνας με ένα χαρακτηριστικό "src"

    Για τις ετικέτες αγκύρωσης και εικόνας, τα χαρακτηριστικά δεν είναι στην πραγματικότητα προαιρετικά, είναι απαραίτητα για την σωστή εμφάνιση αυτών των ετικετών. Πρέπει να πείτε στον σύνδεσμο πού να πάτε (και αυτό που κάνει το "href") και την εικόνα τι να δείξει (που είναι αυτό που παρέχει το χαρακτηριστικό "src").

    Τι είναι τα στοιχεία HTML

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

    Για παράδειγμα, για το στοιχείο της παραγράφου γράφετε αυτό:

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

    Σχεδόν όλα τα στοιχεία HTML έχουν μια ετικέτα ανοίγματος και μια ετικέτα κλεισίματος. Αυτές οι ετικέτες περιβάλλουν το κείμενο που θα εμφανίζεται στην ιστοσελίδα. Για παράδειγμα, για να γράψετε μια παράγραφο κειμένου, γράφετε το κείμενο που θα εμφανίζεται στη σελίδα και στη συνέχεια περιβάλλετε το με τις ακόλουθες ετικέτες:

    Εδώ θα γράψετε το κείμενο της παραγράφου που θέλετε να εμφανίζεται στην ιστοσελίδα.

    Ορισμένα στοιχεία HTML δεν έχουν ετικέτα κλεισίματος. Αυτά ονομάζονται "κενά στοιχεία". Μερικές φορές, αναφέρονται επίσης ως στοιχεία " singleton " ή "void". Τα κενά στοιχεία είναι εύχρηστα επειδή πρέπει να συμπεριλάβετε μόνο μία ετικέτα στην ιστοσελίδα σας και το πρόγραμμα περιήγησης θα γνωρίζει τι πρέπει να κάνει. Για παράδειγμα, για να προσθέσετε ένα σπάσιμο γραμμής στη σελίδα σας, θα χρησιμοποιούσατε την ετικέτα b.

    Ένα άλλο κοινό στοιχείο που περιλαμβάνει μόνο μια ετικέτα ανοίγματος είναι το στοιχείο "εικόνα". Για παράδειγμα:

    Είδαμε αυτό το παράδειγμα νωρίτερα, αλλά δεν υπάρχει ετικέτα κλεισίματος για αυτό το στοιχείο εικόνας. Το πρόγραμμα περιήγησης απλά αντικαθιστά αυτόν τον κώδικα με την εικόνα που αναφέρεται στο χαρακτηριστικό "href". Στην περίπτωση αυτή, θα ήταν "logo.png".

    Σε γενικές γραμμές, όταν αναφέρομαι σε ένα στοιχείο ή μια ετικέτα HTML, θα χρησιμοποιήσω τον όρο "στοιχείο" για να υποδείξω ότι αναφέρομαι σε όλα τα μέρη του στοιχείου (και στις ετικέτες ανοίγματος και κλεισίματος). Χρησιμοποιώ "ετικέτα" είναι πραγματικά μια παραπομπή μόνο το ένα ή το άλλο. Αυτή είναι η σωστή χρήση αυτών των δύο όρων και σας ενθαρρύνω να τα χρησιμοποιήσετε σωστά - αλλά απλά γνωρίζετε ότι εάν τα γλιστρήσετε και τα ανταλλάξετε λίγο, θα τα καταλάβετε ακόμα από τους νέους συνεργάτες ανάπτυξης ιστοσελίδων σας!

    Αρχικό άρθρο από την Jennifer Krynin. Επεξεργασμένο από τον Jeremy Girard στις 21/7/17