Saltar al contenido

Μάθετε έναν εύκολο τρόπο κατάργησης των υπογραμμίσεων από συνδέσμους σε HTML

8 de mayo de 2021

Από προεπιλογή, το περιεχόμενο κειμένου που συνδέεται με HTML χρησιμοποιώντας το στοιχείο «άγκυρα» έχει στυλ με υπογράμμιση. Συχνά, οι σχεδιαστές ιστοσελίδων επιλέγουν να καταργήσουν αυτό το προεπιλεγμένο στυλ αφαιρώντας την υπογράμμιση.

Λόγοι και κατά της υπογράμμισης

Πολλοί σχεδιαστές δεν ενδιαφέρονται για την εμφάνιση υπογραμμισμένου κειμένου, ειδικά σε πυκνά τμήματα περιεχομένου με πολλούς συνδέσμους. Όλες αυτές οι υπογραμμισμένες λέξεις μπορούν πραγματικά να σπάσουν τη ροή ανάγνωσης ενός εγγράφου. Πολλοί έχουν υποστηρίξει ότι αυτές οι υπογραμμίσεις κάνουν πραγματικά τις λέξεις πιο δύσκολο να διακριθούν και να διαβαστούν γρήγορα λόγω του τρόπου με τον οποίο υπογραμμίζει αλλάζει τις φυσικές μορφές γραμμάτων. Ωστόσο, υπάρχουν νόμιμα οφέλη από τη διατήρηση αυτών των υπογραμμίσεων σε συνδέσμους κειμένου. Για παράδειγμα, όταν κάνετε περιήγηση σε μεγάλα τμήματα κειμένου, οι υπογραμμισμένοι σύνδεσμοι σε συνδυασμό με την κατάλληλη χρωματική αντίθεση διευκολύνουν τους αναγνώστες να σαρώσουν αμέσως μια σελίδα και να δουν πού βρίσκονται οι σύνδεσμοι. Εάν αποφασίσετε να αφαιρέσετε συνδέσμους από το κείμενο (μια απλή διαδικασία την οποία θα καλύψουμε σύντομα), φροντίστε να βρείτε τρόπους για να διαμορφώσετε αυτό το κείμενο για να διαφοροποιήσετε τον σύνδεσμο από το απλό κείμενο. Αυτό γίνεται πιο συχνά με την αντίθεση χρώματος, αλλά μόνο το χρώμα μπορεί να αποτελέσει πρόβλημα για τους επισκέπτες με προβλήματα όρασης, όπως η τύφλωση του χρώματος. Ανάλογα με τη συγκεκριμένη μορφή τύφλωσης χρώματος, η αντίθεση μπορεί να χαθεί εντελώς, αποτρέποντάς τους να δουν τη διαφορά μεταξύ συνδεδεμένου και μη συνδεδεμένου κειμένου. Αυτός είναι ο λόγος για τον οποίο το υπογραμμισμένο κείμενο εξακολουθεί να θεωρείται ο καλύτερος τρόπος για την εμφάνιση συνδέσμων. Λοιπόν, πώς απενεργοποιείτε μια υπογράμμιση εάν εξακολουθείτε να θέλετε να το κάνετε; Δεδομένου ότι αυτό είναι ένα οπτικό χαρακτηριστικό που μας ενδιαφέρει, θα στραφούμε στο τμήμα του ιστότοπού μας που χειρίζεται όλα τα πράγματα οπτικά – CSS.

Χρησιμοποιήστε Cascading Style Sheets για να απενεργοποιήσετε τις υπογραμμίσεις στους συνδέσμους

Στις περισσότερες περιπτώσεις, δεν θέλετε να απενεργοποιήσετε μια υπογράμμιση σε έναν μόνο σύνδεσμο κειμένου. Αντ ‘αυτού, το στυλ σχεδίασής σας πιθανότατα απαιτεί από εσάς να καταργήσετε υπογραμμίσεις από όλους τους συνδέσμους. Αυτό θα το κάνατε προσθέτοντας στυλ στο εξωτερικό φύλλο στυλ. ένα {
διακόσμηση κειμένου: κανένα;
}

Αυτό είναι! Ότι μια απλή γραμμή CSS θα απενεργοποιούσε την υπογράμμιση (η οποία χρησιμοποιεί πραγματικά την ιδιότητα CSS για «διακόσμηση κειμένου») σε όλους τους συνδέσμους. Θα μπορούσατε επίσης να γίνετε πιο συγκεκριμένοι με αυτό το στυλ. Για παράδειγμα, εάν θέλετε απλώς να απενεργοποιήσετε την υπογράμμιση ή τους συνδέσμους στο εσωτερικό του στοιχείου «nav», θα μπορούσατε να γράψετε: nav a {
διακόσμηση κειμένου: κανένα;
}

Τώρα, οι σύνδεσμοι κειμένου στη σελίδα θα είχαν την προεπιλεγμένη υπογράμμιση, αλλά αυτοί που περιλαμβάνονται στο πλοίο θα το είχαν αφαιρέσει. Ένα πράγμα που πολλοί σχεδιαστές ιστοσελίδων επιλέγουν να κάνουν είναι να ενεργοποιήσετε ξανά τον σύνδεσμο όταν κάποιος αιωρείται πάνω από το κείμενο. Αυτό θα γινόταν χρησιμοποιώντας το: hover CSS pseudo-class, όπως αυτό: a {
διακόσμηση κειμένου: κανένα;
}
α: αιωρηθείτε {
κείμενο-διακόσμηση: υπογράμμιση?
}

Χρησιμοποιώντας Inline CSS

Ως εναλλακτική λύση για την πραγματοποίηση αλλαγών σε ένα εξωτερικό φύλλο στυλ, μπορείτε επίσης να προσθέσετε τα στυλ απευθείας στο ίδιο το στοιχείο σε HTML. Το πρόβλημα με αυτήν τη μέθοδο είναι ότι τοποθετεί τις πληροφορίες στυλ μέσα στη δομή HTML, η οποία δεν είναι η καλύτερη πρακτική. Το στυλ (CSS) και η δομή (HTML) πρέπει να διατηρούνται ξεχωριστά. Εάν θέλετε να καταργηθούν όλοι οι σύνδεσμοι κειμένου ενός ιστότοπου, η προσθήκη αυτών των πληροφοριών στυλ σε κάθε σύνδεσμο σε μεμονωμένη βάση θα σήμαινε ότι θα προστεθεί αρκετός επιπλέον αριθμός σήμανσης στον κώδικα του ιστότοπού σας. Αυτό το bloat σελίδας μπορεί να επιβραδύνει το χρόνο φόρτωσης ενός ιστότοπου και να κάνει τη συνολική διαχείριση σελίδων πολύ πιο δύσκολη. Για αυτούς τους λόγους, είναι προτιμότερο να στραφείτε πάντα σε ένα εξωτερικό φύλλο στυλ για όλες τις ανάγκες στυλ σελίδας.

Κλείνοντας

Όσο εύκολο είναι να αφαιρέσετε την υπογράμμιση από τους συνδέσμους κειμένου μιας ιστοσελίδας, θα πρέπει επίσης να λάβετε υπόψη σας τις συνέπειες. Ενώ μπορεί πράγματι να καθαρίσει την εμφάνιση μιας σελίδας, μπορεί να το κάνει σε βάρος της συνολικής χρηστικότητας. Λάβετε αυτό υπόψη την επόμενη φορά που θα σκεφτείτε να αλλάξετε τις ιδιότητες «διακόσμηση κειμένου» μιας σελίδας.