Μαθαίνοντας να γράφω CSS Οι διατάξεις μπορεί να είναι δύσκολες, ειδικά εάν είστε εξοικειωμένοι με τη χρήση πινάκων για τη δημιουργία φανταχτερών διατάξεων ιστοσελίδων. Όμως, ενώ HTML5 επιτρέπει πίνακες για διάταξη, δεν είναι καλή ιδέα.
Οι πίνακες δεν είναι προσβάσιμοι
Παρόμοιο με μηχανές αναζήτησης, οι περισσότεροι αναγνώστες οθόνης διαβάζουν ιστοσελίδες με τη σειρά που εμφανίζονται σε HTML και οι πίνακες μπορεί να είναι πολύ δύσκολο για την ανάλυση των αναγνωστών οθόνης. Το περιεχόμενο σε διάταξη πίνακα, ενώ είναι γραμμικό, δεν έχει πάντα νόημα όταν διαβάζεται από αριστερά προς τα δεξιά και από πάνω προς τα κάτω. Επιπλέον, με ένθετα τραπέζια και διάφορα ανοίγματα στα κελιά του πίνακα μπορεί να γίνει δύσκολη η καταγραφή της σελίδας.
Αυτός είναι ο λόγος που το Προδιαγραφή HTML5 συνιστά κατά πίνακες για διάταξη και γιατί το HTML 4.01 το απαγορεύει. Οι προσβάσιμες ιστοσελίδες επιτρέπουν σε περισσότερα άτομα να τα χρησιμοποιούν και αποτελούν το σήμα ενός επαγγελματία σχεδιαστή.
Με το CSS, μπορείτε να ορίσετε μια ενότητα που ανήκει στην αριστερή πλευρά της σελίδας, αλλά να την τοποθετήσετε τελευταία στο HTML. Στη συνέχεια, οι αναγνώστες οθόνης και οι μηχανές αναζήτησης θα διαβάσουν πρώτα τα σημαντικά μέρη (το περιεχόμενο) και τα λιγότερο σημαντικά μέρη (πλοήγηση) τελευταία.
Τα τραπέζια είναι δύσκολα
Ακόμα κι αν δημιουργήσετε έναν πίνακα με έναν επεξεργαστή ιστού, οι ιστοσελίδες σας θα εξακολουθούν να είναι περίπλοκες και δύσκολο να διατηρηθούν. Εκτός από τα πιο απλά σχέδια ιστοσελίδων, οι περισσότεροι πίνακες διάταξης απαιτούν τη χρήση πολλών και χαρακτηριστικών και ένθετων πινάκων.
Η κατασκευή του τραπεζιού μπορεί να φαίνεται εύκολη ενώ το κάνετε, αλλά μόλις ολοκληρωθεί, πρέπει να το διατηρήσετε. Έξι μήνες πιο κάτω, μπορεί να μην είναι τόσο εύκολο να θυμάστε γιατί τοποθετήσατε τους πίνακες ή πόσα κελιά ήταν στη σειρά και ούτω καθεξής. Για να μην αναφέρουμε, εάν διατηρείτε ιστοσελίδες ως μέλος της ομάδας, πρέπει να εξηγήσετε σε όλους τους εμπλεκόμενους τρόπους λειτουργίας των τραπεζιών ή να περιμένετε να χρειαστούν επιπλέον χρόνο όταν πρέπει να κάνουν αλλαγές.
Το CSS μπορεί επίσης να είναι περίπλοκο, αλλά διατηρεί την παρουσίαση ξεχωριστή από το περιεχόμενο και καθιστά πολύ πιο εύκολο να διατηρηθεί μακροπρόθεσμα. Επιπλέον, με τη διάταξη CSS μπορείτε να γράψετε ένα αρχείο CSS και να σχεδιάσετε όλες τις σελίδες σας έτσι. Στη συνέχεια, όταν θέλετε να αλλάξετε τη διάταξη του ιστότοπού σας, απλά αλλάζετε ένα αρχείο CSS και το σύνολο αλλαγές στον ιστότοπο — δεν χρειάζεται να περνάτε κάθε σελίδα μία κάθε φορά για να ενημερώνετε τους πίνακες για να ενημερώνετε το σχέδιο.
Οι πίνακες είναι άκαμπτοι
Παρόλο που είναι δυνατή η δημιουργία διατάξεων πίνακα με πλάτος ποσοστών, είναι συχνά πιο αργή η φόρτωσή τους και μπορεί να αλλάξει δραματικά την εμφάνιση της διάταξής σας. Αλλά αν χρησιμοποιείτε καθορισμένα πλάτη για τους πίνακες σας, καταλήγετε σε μια πολύ άκαμπτη διάταξη που δεν θα φαίνεται καλή σε οθόνες που έχουν διαφορετικό μέγεθος από τη δική σας.
Η δημιουργία ευέλικτων διατάξεων που φαίνονται καλές σε πολλές οθόνες, προγράμματα περιήγησης και αναλύσεις είναι σχετικά εύκολη. Στην πραγματικότητα, με ερωτήματα πολυμέσων CSS, μπορείτε να δημιουργήσετε ξεχωριστά σχέδια για οθόνες διαφορετικού μεγέθους.
Πίνακες Βλάβη βελτιστοποίησης μηχανών αναζήτησης
Η πιο συνηθισμένη διάταξη που δημιουργείται από πίνακα χρησιμοποιεί μια γραμμή πλοήγησης στην αριστερή πλευρά της σελίδας και το κύριο περιεχόμενο στα δεξιά. Όταν χρησιμοποιείτε πίνακες, αυτή η προσέγγιση (γενικά) απαιτεί ότι το πρώτο περιεχόμενο που εμφανίζεται στο HTML είναι η αριστερή γραμμή πλοήγησης. Οι μηχανές αναζήτησης κατηγοριοποιούν σελίδες με βάση το περιεχόμενο και πολλές μηχανές καθορίζουν ότι το περιεχόμενο που εμφανίζεται στο πάνω μέρος της σελίδας είναι πιο σημαντικό από το άλλο περιεχόμενο. Επομένως, μια σελίδα με αριστερή πλοήγηση πρώτα, φαίνεται να έχει περιεχόμενο λιγότερο σημαντικό από την πλοήγηση.
Χρησιμοποιώντας το CSS, μπορείτε να βάλετε το σημαντικό περιεχόμενο πρώτα στο HTML σας και, στη συνέχεια, να χρησιμοποιήσετε το CSS για να προσδιορίσετε πού θα πρέπει να τοποθετηθεί στη σχεδίαση. Αυτό σημαίνει ότι οι μηχανές αναζήτησης θα δουν πρώτα το σημαντικό περιεχόμενο, ακόμα κι αν ο σχεδιασμός το τοποθετήσει κάτω στη σελίδα.
Οι πίνακες δεν εκτυπώνονται πάντα καλά
Πολλά σχέδια τραπεζιού δεν εκτυπώνονται καλά επειδή είναι απλά πολύ ευρύ για τον εκτυπωτή. Έτσι, για να τα καταστήσουν κατάλληλα, τα προγράμματα περιήγησης κόβουν τους πίνακες και εκτυπώνουν τις παρακάτω ενότητες με αποτέλεσμα διαχωρισμένες σελίδες. Μερικές φορές καταλήγετε σε σελίδες που φαίνονται εντάξει, αλλά λείπει ολόκληρη η δεξιά πλευρά. Άλλες σελίδες θα εκτυπώσουν ενότητες σε διάφορα φύλλα.
Με το CSS μπορείτε να δημιουργήσετε ένα ξεχωριστό φύλλο στυλ μόνο για την εκτύπωση της σελίδας.
Οι πίνακες για διάταξη δεν είναι έγκυροι σε HTML 4.01
ο Καταστάσεις προδιαγραφών HTML 4: "Οι πίνακες δεν πρέπει να χρησιμοποιούνται καθαρά ως μέσο για τη διαμόρφωση περιεχομένου εγγράφων, καθώς αυτό μπορεί να παρουσιάζει προβλήματα κατά την απόδοση σε μη οπτικά μέσα."
Έτσι, εάν θέλετε να γράψετε έγκυρο HTML 4.01, δεν μπορείτε να χρησιμοποιήσετε πίνακες για διάταξη. Θα πρέπει να χρησιμοποιείτε μόνο πίνακες για πίνακες δεδομένων και τα δεδομένα πινάκων μοιάζουν γενικά με κάτι που μπορεί να εμφανίζεται σε ένα υπολογιστικό φύλλο ή πιθανώς σε μια βάση δεδομένων.
Ωστόσο, το HTML5 άλλαξε τους κανόνες και τώρα οι πίνακες για τη διάταξη, ενώ δεν συνιστώνται, θεωρούνται έγκυροι HTML. Η προδιαγραφή HTML5 δηλώνει: "Οι πίνακες δεν πρέπει να χρησιμοποιούνται ως βοηθήματα διάταξης." Αυτό συμβαίνει επειδή οι πίνακες διάταξης είναι δύσκολο για τους αναγνώστες οθόνης να διαφοροποιηθούν, όπως αναφέρθηκε προηγουμένως.
Η χρήση του CSS για τη θέση και τη διάταξη των σελίδων σας είναι ο μόνος έγκυρος τρόπος HTML 4.01 για να αποκτήσετε τα σχέδια που χρησιμοποιήσατε για να δημιουργήσετε πίνακες και το HTML5 συνιστά επίσης αυτήν τη μέθοδο.