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

Βήματα για την κατάργηση της υπογράμμισης από συνδέσμους κειμένου και θέματα που πρέπει να γνωρίζετε

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

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

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

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

Πώς λοιπόν απενεργοποιείτε μια υπογράμμιση, αν θέλετε να το κάνετε; Δεδομένου ότι πρόκειται για ένα οπτικό χαρακτηριστικό που μας απασχολεί, θα στραφούμε στο τμήμα της ιστοσελίδας μας που χειρίζεται όλα τα οπτικά - CSS.

Χρησιμοποιήστε τα φύλλα στυλ "Cascading" για να απενεργοποιήσετε τις υπογραμμίσεις στις συνδέσεις

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

ένα {κείμενο-διακόσμηση: κανένα? }}

Αυτό είναι! Αυτή η απλή γραμμή CSS θα απενεργοποιούσε την υπογράμμιση (η οποία στην πραγματικότητα χρησιμοποιεί την ιδιότητα CSS για "διακόσμηση κειμένου") σε όλους τους συνδέσμους.

Θα μπορούσατε επίσης να πάρετε πιο συγκεκριμένα με αυτό το ύφος. Για παράδειγμα, αν θέλετε να απενεργοποιήσετε μόνο την υπογράμμιση ή τους συνδέσμους μέσα στο στοιχείο "nav", θα μπορούσατε να γράψετε:

nav {κείμενο-διακόσμηση: κανένας; }}

Τώρα, οι σύνδεσμοι κειμένου στη σελίδα θα έχουν την προεπιλεγμένη υπογράμμιση, αλλά εκείνοι στο πλοίο θα το έχουν αφαιρέσει.

Ένα πράγμα που πολλοί σχεδιαστές ιστοσελίδων επιλέγουν να κάνουν είναι να γυρίσουν το σύνδεσμο πίσω "on" όταν κάποιος κρέμεται πάνω από το κείμενο. Αυτό θα γίνει χρησιμοποιώντας την εξής: hover pseudo-class CSS, όπως αυτή:

ένα {κείμενο-διακόσμηση: κανένα? } α: περάστε το {text-decoration: underline; }}

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

Ως εναλλακτική λύση για την πραγματοποίηση αλλαγών σε ένα εξωτερικό φύλλο στυλ, μπορείτε επίσης να προσθέσετε τα στυλ απευθείας στο ίδιο το στοιχείο σε HTML, όπως αυτό:

αυτός ο σύνδεσμος δεν έχει υπογράμμιση

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

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

Κλείνοντας

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

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