Τι σημαίνει ότι ο κωδικός δεν είναι έγκυρος; Τι είναι η εγκυρότητα και η επικύρωση και γιατί χρειάζονται; τρόπος. Service validator.w3.org

Γεια σε όλους!

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

Μία από αυτές τις υπηρεσίες είναι η validator.w3.org, η οποία είναι ίσως η καλύτερη. Είναι εξ ολοκλήρου στα Αγγλικά, επομένως ορισμένοι μπορεί να έχουν προβλήματα με το να το δουλέψουν, αλλά μην ανησυχείτε: το πρόγραμμα επικύρωσης θα σας δείξει τόσο τον αριθμό γραμμής όσο και το ίδιο το σφάλμα.

Έγκυρος κωδικός είναι ο κώδικας που πληροί όλα τα πρότυπα.

Για το μάθημα θα χρειαστείτε το παρακάτω υλικό:

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

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

Πώς να διορθώσετε σφάλματα στον κώδικα HTML;

Η υπηρεσία W3c Validator μου έδειξε δύο σφάλματα και μου έδωσε 8 προειδοποιήσεις. Θα προσπαθήσω να τα διορθώσω και θα σας δείξω πώς γίνεται.

Διόρθωση του σφάλματος "Το στυλ στοιχείου δεν επιτρέπεται ως παιδί του στοιχείου div σε αυτό το πλαίσιο. (Αποστολή περαιτέρω σφαλμάτων από αυτό το υποδέντρο.)”. Αυτό το σφάλμα μου λέει ότι δεν χρειάζεται να προσδιορίσετε στυλ στον κώδικα HTML, δηλαδή στην ετικέτα. Επομένως, τα στυλ που είναι γραμμένα σε αυτό το μπλοκ πρέπει να μεταφερθούν στο αρχείο style.css και τέλος.

Ο επικυρωτής υποδεικνύει επίσης πού ακριβώς βρίσκεται το σφάλμα:

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

Έλεγχος του κωδικού CSS για εγκυρότητα

Μπορείτε επίσης να ελέγξετε τον κωδικό CSS για εγκυρότητα στο πρόγραμμα επικύρωσης W3c. Μπορείτε να το κάνετε χρησιμοποιώντας αυτόν τον σύνδεσμο. Η αρχή λειτουργίας είναι η ίδια: καθορίζετε τη διεύθυνση URL του ιστότοπου ή επιλέγετε ένα αρχείο στον υπολογιστή σας και κάνετε κλικ στο κουμπί "Έλεγχος".

Σε αντίθεση με το ίδιο εργαλείο επικύρωσης HTML, το πρόγραμμα επικύρωσης CSS είναι στα ρωσικά.

Σφάλματα και προειδοποιήσεις CSS

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

Στην περίπτωσή μου, οι περισσότερες από τις 281 προειδοποιήσεις είναι ιδιότητες CSS για κανονική εμφάνιση σε διαφορετικά προγράμματα περιήγησης:

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

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

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

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

Λοιπόν τώρα, αντίο!

Προηγούμενο άρθρο
Επόμενο άρθρο

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

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

Πώς να ελέγξετε έναν ιστότοπο για την εγκυρότητα του κώδικα HTML

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

Σφάλμα: Διπλότυπο ID min_value_62222

Και πίσω από αυτό το σφάλμα υπάρχει μια προειδοποίηση.

Προειδοποίηση: Η πρώτη εμφάνιση του ID min_value_62222 ήταν εδώ

Αυτό σημαίνει ότι το αναγνωριστικό στυλ είναι διπλό, το οποίο, σύμφωνα με τους κανόνες εγκυρότητας html, πρέπει να είναι μοναδικό. Αντί για ID, μπορείτε να χρησιμοποιήσετε CLASS για διπλότυπα αντικείμενα.

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

Ομοίως, μπορεί να υπάρχουν και άλλες επιλογές:

Σφάλμα: Διπλότυπο αναγνωριστικό placeWorkTimes
Σφάλμα: Διπλότυπο αναγνωριστικό callbackCss-css
Σφάλμα: Διπλότυπο ID Capa_1

Η παρακάτω είναι μια πολύ κοινή προειδοποίηση.

Προειδοποίηση: Το χαρακτηριστικό type δεν είναι απαραίτητο για πόρους JavaScript

Αυτό είναι ένα πολύ συνηθισμένο λάθος κατά τον έλεγχο της επικύρωσης του ιστότοπου. Σύμφωνα με τους κανόνες HTML5, το χαρακτηριστικό type δεν χρειάζεται για την ετικέτα script, είναι ένα στοιχείο που έχει καταργηθεί.

Παρόμοια προειδοποίηση για στυλ:

Προειδοποίηση: Το χαρακτηριστικό type για το στοιχείο στυλ δεν χρειάζεται και πρέπει να παραλειφθεί

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

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

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

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

Σφάλμα: Καθορίστηκε το χαρακτηριστικό itemprop, αλλά το στοιχείο δεν αποτελεί ιδιότητα κανενός στοιχείου

Αυτή είναι η μικροσήμανση, το χαρακτηριστικό itemprop πρέπει να βρίσκεται μέσα στο στοιχείο με αντικείμενο. Νομίζω ότι αυτό το σφάλμα δεν είναι κρίσιμο και μπορεί να παραμείνει ως έχει.

Προειδοποίηση: Τα έγγραφα δεν πρέπει να χρησιμοποιούνται για:legacy-compat, εκτός εάν δημιουργούνται από παλαιού τύπου συστήματα που δεν μπορούν να εξάγουν το τυπικό doctype

Η γραμμή about:legacy-compat χρειάζεται μόνο για γεννήτριες html. Εδώ πρέπει απλώς να το κάνετε, αλλά το σφάλμα δεν είναι καθόλου κρίσιμο.

Σφάλμα: Αδέσποτη πηγή ετικέτας τέλους

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

Κατά συνέπεια, πρέπει να αφαιρέσετε την ετικέτα κλεισίματος από τον κώδικα. Παρόμοια με αυτό το σφάλμα, ενδέχεται να προκύψουν ετικέτες

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

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

Σφάλμα: Το στοιχείο ol δεν επιτρέπεται ως θυγατρικό του στοιχείου ul σε αυτό το πλαίσιο. (Κατάργηση περαιτέρω σφαλμάτων από αυτό το υποδέντρο.)

Η ένθεση των ετικετών είναι εσφαλμένη εδώ. ΣΕ

. Σε αυτό το παράδειγμα, αυτά τα στοιχεία δεν χρειάζονται καθόλου.

Ομοίως, μπορεί να υπάρχουν άλλα σφάλματα όπως αυτό:
- Το στοιχείο h2 δεν επιτρέπεται ως παιδί του στοιχείου ul σε αυτό το πλαίσιο.
- Το στοιχείο a δεν επιτρέπεται ως παιδί του στοιχείου ul σε αυτό το πλαίσιο.
- Το στοιχείο noindex δεν επιτρέπεται ως θυγατρικό του στοιχείου li σε αυτό το πλαίσιο.
- Το στοιχείο div δεν επιτρέπεται ως παιδί του στοιχείου ul σε αυτό το πλαίσιο.
Όλα αυτά πρέπει να διορθωθούν.
- Σφάλμα: Το χαρακτηριστικό http-equiv δεν επιτρέπεται στο meta στοιχείο σε αυτό το σημείο
Το χαρακτηριστικό http-equiv δεν προορίζεται για το μεταστοιχείο, πρέπει να αφαιρεθεί ή να αντικατασταθεί.

Παρόμοια σφάλματα:
- Σφάλμα: Το χαρακτηριστικό n2-lightbox δεν επιτρέπεται στο στοιχείο α σε αυτό το σημείο.
- Σφάλμα: Το χαρακτηριστικό asyncsrc δεν επιτρέπεται στο σενάριο στοιχείων σε αυτό το σημείο.
- Σφάλμα: Η τιμή χαρακτηριστικού δεν επιτρέπεται στην επιλογή στοιχείου σε αυτό το σημείο.
- Σφάλμα: Η συμβολοσειρά κατακερματισμού χαρακτηριστικών δεν επιτρέπεται στο εύρος στοιχείων σε αυτό το σημείο.
Εδώ πρέπει επίσης να αφαιρέσετε τα χαρακτηριστικά n2-lightbox, asyncsrc, price, hashstring ή να τα αντικαταστήσετε με άλλες επιλογές.
- Σφάλμα: Κακή ετικέτα έναρξης στο img στο κεφάλι
Ή όπως αυτό:
- Σφάλμα: Κακή ετικέτα έναρξης στο div in head
Οι ετικέτες img και div δεν πρέπει να βρίσκονται στο . Αυτό το σφάλμα πρέπει να διορθωθεί.
- Σφάλμα: CSS: Σφάλμα ανάλυσης
Σε αυτήν την περίπτωση, δεν πρέπει να υπάρχει ερωτηματικό μετά την αγκύλη στα στυλ.

Λοιπόν, ένα τέτοιο λάθος, ασήμαντο, αλλά όχι ευχάριστο) Δείτε μόνοι σας αν πρέπει να αφαιρεθεί ή όχι, δεν θα έχει καμία επίδραση στην προώθηση του ιστότοπου.
- Προειδοποίηση: Το χαρακτηριστικό συνόλου χαρακτήρων στο στοιχείο του σεναρίου είναι ξεπερασμένο
Δεν υπάρχει πλέον καμία ανάγκη να προσδιορίσετε την κωδικοποίηση σε σενάρια, αυτό είναι ένα απαρχαιωμένο στοιχείο. Η προειδοποίηση δεν είναι κρίσιμη, κατά την κρίση σας.
- Σφάλμα: Το σενάριο του στοιχείου δεν πρέπει να έχει σύνολο χαρακτήρων χαρακτηριστικών, εκτός εάν έχει καθοριστεί και το χαρακτηριστικό src
Σε αυτό το σφάλμα, πρέπει να καταργήσετε το χαρακτηριστικό charset="uft-8" από το σενάριο, καθώς εμφανίζει την κωδικοποίηση εκτός του σεναρίου. Νομίζω ότι αυτό το λάθος πρέπει να διορθωθεί.
- Προειδοποίηση: Κενή επικεφαλίδα
Εδώ είναι μια κενή κεφαλίδα h1. Πρέπει να αφαιρέσετε τις ετικέτες ή να βάλετε έναν τίτλο μεταξύ τους. Το σφάλμα είναι κρίσιμο.
- Σφάλμα: Τελική ετικέτα br
Η ετικέτα br είναι single, αλλά είναι φτιαγμένη σαν να κλείνει ένα ζευγάρι. Πρέπει να αφαιρέσουμε / από την ετικέτα.
- Σφάλμα: Η αναφορά με όνομα χαρακτήρα δεν τερματίστηκε με ερωτηματικό. (Ή το & θα έπρεπε να είχε διαφύγει ως &.)
Αυτοί είναι ειδικοί χαρακτήρες HTML, πρέπει να τους γράψετε σωστά ή να &αντιγράψετε. Είναι καλύτερα να διορθώσετε αυτό το λάθος.
- Μοιραίο σφάλμα: Δεν είναι δυνατή η ανάκτηση μετά το τελευταίο σφάλμα. Οποιαδήποτε περαιτέρω σφάλματα θα αγνοηθούν
Αυτό είναι ένα σοβαρό σφάλμα:

Δεν θα έπρεπε να υπάρχει τίποτα μετά από αυτό, καθώς αυτή είναι η τελευταία ετικέτα κλεισίματος της σελίδας. Πρέπει να διαγράψετε τα πάντα μετά από αυτό ή να τα μετακινήσετε ψηλότερα.
- Σφάλμα: CSS: δεξιά: μόνο το 0 μπορεί να είναι μονάδα. Πρέπει να βάλετε μια μονάδα μετά τον αριθμό σας
Πρέπει να γράψετε την τιμή σε px:

Εδώ είναι ένα παρόμοιο σφάλμα:
- Σφάλμα: CSS: margin-top: μόνο το 0 μπορεί να είναι μονάδα. Πρέπει να βάλετε μια μονάδα μετά τον αριθμό σας
- Σφάλμα: Μη κλειστό στοιχείο α
Ο έγκυρος κώδικας HTML είναι κώδικας που πληροί όλα τα πρότυπα του W3C (World Wide Web Consortium). Παντού υπάρχουν πρότυπα: στο Διαδίκτυο - εγκυρότητα, σε γλώσσες - γραμματική, σε επιχειρήσεις - κρατικά πρότυπα.

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

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

Στην αρχή υπήρξαν σκέψεις: «Το τσάκωσα μόνος μου». Αλλά όταν σιγά σιγά αφαίρεσα σφάλματα μετά από λάθος, συνειδητοποίησα ότι έλαβα πολλά ως δώρο από τους σχεδιαστές διάταξης ή από τον συγγραφέα του προτύπου.
Πώς να δημιουργήσετε έγκυρο κώδικα html στο διαδίκτυο
Μπορείτε να ελέγξετε την εγκυρότητα του κώδικα HTML ενός ιστότοπου χρησιμοποιώντας τον επίσημο πρότυπο επικύρωσης του W3C. Ακολουθήστε τον σύνδεσμο >>> για την ηλεκτρονική υπηρεσία. Ελέγξτε τη σήμανση (HTML, XHTML, ...) των εγγράφων ιστού. Στη γραμμή διεύθυνσης, πληκτρολογήστε τη διεύθυνση url του ιστότοπού σας και κάντε κλικ στο «Έλεγχος».
Πώς να διορθώσετε σφάλματα εγκυρότητας κώδικα html
Στο άρθρο θα περιγράψω τη μέθοδο μου για το πώς φτιάχνω έγκυρο κώδικα. Μεταβείτε στην κύρια σελίδα του ιστολογίου σας και χρησιμοποιήστε τον συνδυασμό πλήκτρων Ctrl+U για να ανοίξετε τον πηγαίο κώδικα του ιστότοπου. Εξετάζουμε ποια σειρά σφαλμάτων και προειδοποιήσεων στον επικυρωτή

Βρίσκουμε την απαιτούμενη γραμμή στον πηγαίο κώδικα, την αντιγράφουμε, ανοίγουμε οποιοδήποτε οπτικό ηλεκτρονικό πρόγραμμα επεξεργασίας κώδικα HTML, επικολλάμε τον κώδικα στο πρόγραμμα επεξεργασίας και κοιτάμε το αποτέλεσμα.

σφάλμα "γρήγορης επεξεργασίας".

Βρείτε τη γραμμή και επικολλήστε την στον ηλεκτρονικό επεξεργαστή HTML. Σφάλμα - κουμπί για γρήγορη επεξεργασία των gadget. Έχω ένα πρότυπο τρίτων, αλλά ειδικά για την πλατφόρμα Blogger (Blogspot), δώρο από τον συγγραφέα του προτύπου.

Τα κουμπιά δεν ήταν ορατά στην πραγματική ζωή, αλλά οι κωδικοί παρέμειναν στο πρότυπο. Εγώ προσωπικά είχα 15 κουμπιά.

Λύση . Ανοίξτε το blog, μεταβείτε στο πρότυπο, δημιουργήστε ένα αντίγραφο ασφαλείας, διαγράψτε όλα τα κουμπιά. Εύρεση του κωδικού

και διαγράψτε το.

Μπορεί να υπάρχουν πολλοί τέτοιοι κωδικοί· για να τους αφαιρέσετε όλους, επιλέξτε τον κωδικό στο παράθυρο αναζήτησης και πατήστε Enter.

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

Αποτέλεσμα: 15 αφαιρέσεις κωδικών και μείον 50 σφάλματα

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

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

Δεύτερο σφάλμα και μείον 42 σφάλματα στον επικυρωτή.

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

Λύση και διόρθωση σφαλμάτων: η αναζήτηση του ιστολογίου μου προέρχεται από το Yandex, που σημαίνει ότι ο κώδικας δεν είναι από . Πώς να βρείτε τη σωστή δημοσίευση;! Εισάγω το ερώτημα "Αναζήτηση ιστολογίου" στην αναζήτησή μου και βρίσκω ένα άρθρο. Στο πρόγραμμα επεξεργασίας μηνυμάτων διαγράφω τον κωδικό και τον προσθέτω ξανά.

Ο επικυρωτής έχει το ακόλουθο σφάλμα

Ανοίγω τον πηγαίο κώδικα του ιστολογίου χρησιμοποιώντας τη συντόμευση πληκτρολογίου Ctrl+U και αναζητώ τη γραμμή 666, η οποία υποδεικνύει σφάλμα στο πρόγραμμα επικύρωσης.

Παίρνω πάλι το δικό μου δρόμο για να διορθώσω τα λάθη. Αντιγράφω τον κώδικα και τον επικολλώ σε ένα ηλεκτρονικό πρόγραμμα επεξεργασίας HTML.

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

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

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

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

Η επικύρωση δοκιμάζει κάτι σε σχέση με τα πρότυπα (απαιτήσεις). Στο πλαίσιο των webmasters, η επικύρωση του ιστότοπου σημαίνει τον έλεγχο του κώδικά του ορθότηταΚαι Σφάλματα. Με άλλα λόγια: δεν πρέπει να υπάρχουν ακατανόητες ετικέτες ή δομές και, φυσικά, να μην υπάρχουν σφάλματα html.
Τι επηρεάζει η επικύρωση;
1. Η επικύρωση του ιστότοπου επηρεάζει κυρίως τον τρόπο εμφάνισης του ιστότοπου στα προγράμματα περιήγησης. Κάθε πρόγραμμα περιήγησης έχει τους δικούς του μηχανισμούς επεξεργασίας κώδικα html. Εάν υπάρχουν σφάλματα στη διάταξη (και σχεδόν πάντα υπάρχουν), τότε το ίδιο το πρόγραμμα περιήγησης τα διορθώνει και βλέπουμε τον ιστότοπο να εμφανίζεται στη σωστή μορφή. Αλλά τα προγράμματα περιήγησης δεν ήταν πάντα τόσο ικανά, και προηγουμένως οι webmasters είχαν περισσότερα προβλήματα με την ορθότητα της διάταξης. Η σωστή επικύρωση επηρεάζει άμεσα τη συμβατότητα μεταξύ προγραμμάτων περιήγησης.

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

Αλλά για τις μηχανές αναζήτησης, ο κώδικας html είναι το μόνο που βλέπει το ρομπότ αναζήτησης. Εάν υπάρχουν λάθη εκεί, τότε απλώς παρερμηνεύει κάποια στοιχεία, τα οποία μερικές φορές μπορεί να είναι κρίσιμα. Για παράδειγμα, εάν ο ιστότοπος έχει λανθασμένες ετικέτες .. , (για παράδειγμα, δεν υπάρχει ετικέτα κλεισίματος). Η μηχανή αναζήτησης δεν θα διορθώσει τίποτα όπως κάνουν τα προγράμματα περιήγησης. Ως αποτέλεσμα, η θέση του ιστότοπου μπορεί να υποφέρει πολύ λόγω τέτοιων σφαλμάτων.
Παράδειγμα από τη ζωή
Θα δώσω ένα πρακτικό παράδειγμα για το πώς η επικύρωση μπορεί να έχει κακό αντίκτυπο στον ιστότοπό σας τόσο από την άποψη του SEO όσο και από την άποψη των χρηστών. Μια φορά κι έναν καιρό, ξαναδούλευα έναν ιστότοπο και κατά λάθος ξέχασα να κλείσω μια ετικέτα. Αφού έλεγξα την ορθότητα της τροποποίησης σε δημοφιλή προγράμματα περιήγησης, έκανα αλλαγές στον ιστότοπο.

Μετά από κάποιο χρονικό διάστημα, όταν ανέλυσα την επισκεψιμότητα μέσω του Yandex Metrica, παρατήρησα ότι ο μέσος χρόνος επίσκεψης στο πρόγραμμα περιήγησης Internet Explorer ήταν πολύ μικρότερος. Έχοντας ανοίξει τον ιστότοπο μέσω αυτού του προγράμματος περιήγησης, κατάλαβα τι συνέβαινε. Ολόκληρος ο ιστότοπος ήταν λοξός· ήταν απλά αδύνατο να διαβαστεί το περιεχόμενο. Και αυτό δημιουργεί δύο προβλήματα ταυτόχρονα. Το πρώτο πρόβλημα ήταν ότι έχανα όλη την επισκεψιμότητα από τον IE και το δεύτερο πρόβλημα ήταν ότι μπέρδευα τους παράγοντες συμπεριφοράς.
Πώς να ελέγξετε έναν ιστότοπο για την εγκυρότητα του κώδικα html 1. Διαδικτυακός επικυρωτής html
Υπάρχει μια δωρεάν υπηρεσία στο Διαδίκτυο http://validator.w3.org/. Ελέγχει την εγκυρότητα του κώδικα html. Ας ρίξουμε μια πιο προσεκτική ματιά στον τρόπο λειτουργίας αυτής της υπηρεσίας.

Πραγματοποιεί αρκετούς ελέγχους του κωδικού σας. Τα κυριότερα:
Επικύρωση σύνταξης - έλεγχος για συντακτικά σφάλματα. είναι έγκυρη σύνταξη παρόλο που δεν είναι έγκυρη ετικέτα HTML, επομένως ο έλεγχος σύνταξης είναι ελάχιστα χρήσιμος για τη σύνταξη καλού HTML.
Έλεγχος της ένθεσης των ετικετών - οι ετικέτες πρέπει να κλείνονται με την αντίστροφη σειρά σε σχέση με το άνοιγμά τους. Για παράδειγμα, αυτός ο έλεγχος εντοπίζει σφάλματα με .
Επικύρωση DTD - έλεγχος ότι ο κωδικός σας ταιριάζει με τον καθορισμένο ορισμό τύπου εγγράφου. Αυτό περιλαμβάνει τον έλεγχο ονομάτων ετικετών, χαρακτηριστικών και "ενσωμάτωση" ετικετών (ετικέτες ενός τύπου μέσα σε ετικέτες άλλου τύπου)
Έλεγχος για ξένα στοιχεία - ο έλεγχος προσδιορίζει όλα όσα υπάρχουν στον κώδικα, αλλά λείπουν στο DTD. Για παράδειγμα, προσαρμοσμένες ετικέτες και χαρακτηριστικά.

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

Γενικά, το μεγαλύτερο πρόβλημα επικύρωσής μου είναι να ελέγξω το #4 (για ξένα στοιχεία). Είμαι υπέρμαχος της χρήσης προσαρμοσμένων χαρακτηριστικών σε ετικέτες HTML για την αποθήκευση πρόσθετων μεταδεδομένων που σχετίζονται με ένα συγκεκριμένο στοιχείο. Κατά την κατανόηση μου, αυτό είναι, για παράδειγμα, προσθήκη του χαρακτηριστικού foo όταν έχω δεδομένα (bar) που πρέπει να συσχετίσω με ένα συγκεκριμένο στοιχείο. Μερικές φορές οι άνθρωποι υπερφορτώνουν τα υπάρχοντα χαρακτηριστικά για αυτούς τους σκοπούς απλώς για να περάσουν την επικύρωση, παρόλο που το χαρακτηριστικό θα χρησιμοποιηθεί για άλλους σκοπούς. Δεν έχει νόημα για μένα.

Το μυστικό των προγραμμάτων περιήγησης είναι ότι δεν ελέγχουν ποτέ ότι ο κώδικας HTML ταιριάζει με το καθορισμένο DTD. Το Doctype που καθορίσατε στο έγγραφο αλλάζει τον αναλυτή του προγράμματος περιήγησης σε μια συγκεκριμένη λειτουργία, αλλά αυτό δεν φορτώνει το doctype και δεν ελέγχει τον κώδικα για συμμόρφωση με αυτόν. Δηλαδή, ο αναλυτής του προγράμματος περιήγησης επεξεργάζεται HTML με ορισμένες υποθέσεις ακυρότητας, όπως ετικέτες που κλείνουν αυτόματα και στοιχεία μπλοκ μέσα σε ενσωματωμένα στοιχεία (είμαι σίγουρος ότι υπάρχουν και άλλα).

Στην περίπτωση των προσαρμοσμένων χαρακτηριστικών, όλα τα προγράμματα περιήγησης αναλύουν και αναγνωρίζουν τα συντακτικά σωστά χαρακτηριστικά ως έγκυρα. Αυτό καθιστά δυνατή την πρόσβαση σε τέτοια χαρακτηριστικά μέσω του DOM χρησιμοποιώντας Javascript. Γιατί λοιπόν να ανησυχώ για την εγκυρότητα; Θα συνεχίσω να χρησιμοποιώ τα χαρακτηριστικά μου και χαίρομαι πολύ που η HTML5 τα επισημοποιεί.

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

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

Για να ξεκαθαρίσω τη θέση μου: Πιστεύω ότι οι έλεγχοι #1 και #2 είναι πολύ σημαντικοί και πρέπει πάντα να γίνονται. Θεωρώ επίσης σημαντικό τον έλεγχο #3, αλλά όχι τόσο σημαντικό όσο τα δύο πρώτα. Ο έλεγχος #4 είναι πολύ αμφισβητήσιμος για μένα επειδή επηρεάζει προσαρμοσμένα χαρακτηριστικά. Πιστεύω ότι, κατ' ανώτατο όριο, τα προσαρμοσμένα χαρακτηριστικά θα πρέπει να επισημαίνονται ως προειδοποιήσεις (και όχι ως σφάλματα) στα αποτελέσματα επικύρωσης, ώστε να μπορώ να ελέγξω εάν εισήγαγα λάθος το όνομα του χαρακτηριστικού. Η επισήμανση προσαρμοσμένων ετικετών ως σφάλματα μπορεί να είναι καλή ιδέα, αλλά έχει επίσης ορισμένα προβλήματα, για παράδειγμα κατά την ενσωμάτωση περιεχομένου σε άλλη σήμανση - SVG ή MathML.

Το έγκυρο HTML δεν εγγυάται την προσβασιμότητα.
Το έγκυρο HTML δεν εγγυάται καλό UX (εμπειρία χρήστη).
Το έγκυρο HTML δεν εγγυάται έναν λειτουργικό ιστότοπο.
Το έγκυρο HTML δεν εγγυάται τη σωστή εμφάνιση του ιστότοπου.

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

UPD: ευχαριστώ για το κάρμα, το μετέφερα στο θεματικό. Θα επαναλάβω τα λόγια του συγγραφέα: Καταλαβαίνω ότι πρόκειται για ένα αμφιλεγόμενο θέμα, αλλά παρακαλώ να αποφύγετε τα καθαρά συναισθηματικά σχόλια και να προβάλετε επιχειρήματα.