Ο σκοπός των συνδέσμων κράτησης θέσης HTML

click fraud protection

Μέχρι HTML5 κυκλοφόρησε, η ετικέτα απαιτεί ένα Χαρακτηριστικό: href. Ωστόσο, το HTML5 καθιστά ακόμη και αυτό το χαρακτηριστικό προαιρετικό. Όταν γράφετε την ετικέτα χωρίς χαρακτηριστικά, ονομάζεται σύνδεσμος placeholder.

Ένας σύνδεσμος placeholder μοιάζει με αυτόν:

Προηγούμενος

Χρήση συνδέσμων placeholder κατά την ανάπτυξη

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

κείμενο συνδέσμου

Το πρόβλημα με τη χρήση ενός hashtag (#) ως σύνδεσμος placeholder είναι ότι ο σύνδεσμος μπορεί να κάνει κλικ και αυτό μπορεί να προκαλέσει σύγχυση στους πελάτες σας. Και, εάν ένας προγραμματιστής ξεχάσει να τις ενημερώσει με τις σωστές διευθύνσεις URL, αυτοί οι σύνδεσμοι θα εμφανίζουν απλώς την ίδια σελίδα στην οποία βρίσκεται ο χρήστης εάν κάνει κλικ.

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

instagram viewer

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

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

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

Με έναν σύνδεσμο placeholder, μπορείτε να γράψετε την πλοήγησή σας όπως θέλετε και, στη συνέχεια, απλώς να καταργήσετε το χαρακτηριστικό href από τον κατάλληλο σύνδεσμο όταν προσθέτετε την πλοήγηση σε μια σελίδα. Για ανάπτυξη, μια γρήγορη συμβουλή είναι να αποθηκεύσετε ολόκληρη τη λίστα πλοήγησης ως απόσπασμα κώδικα στον επεξεργαστή σας, οπότε είναι απλώς μια γρήγορη αντιγραφή-επικόλληση. Στη συνέχεια, μπορείτε απλά να διαγράψετε το href. Μπορείτε επίσης να κάνετε το σύστημα διαχείρισης περιεχομένου (CMS) να κάνει το ίδιο πράγμα.

Στυλ συνδέσμου κράτησης θέσης

Οι σύνδεσμοι κράτησης θέσης είναι εύκολο να διαμορφώνονται και να διαμορφώνονται διαφορετικά από τους άλλους συνδέσμους στην ιστοσελίδα σας. Απλά φροντίστε να προσθέσετε στυλ τόσο στην ετικέτα όσο και στην ετικέτα συνδέσμου a: Για παράδειγμα:

ένα {
χρώμα: κόκκινο;
γραμματοσειρά: έντονη;
διακόσμηση κειμένου: κανένα;
}
ένας σύνδεσμος {
χρώμα: μπλε;
βάρος γραμματοσειράς: κανονικό;
κείμενο-διακόσμηση: υπογράμμιση?
}

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

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

βάρος γραμματοσειράς: κανονικό;

Το ίδιο ισχύει και για το κείμενο-διακόσμηση. Αφαιρώντας το με τον επιλογέα, θα είχε αφαιρεθεί για τον επιλογέα συνδέσμου a: αν δεν το επαναφέραμε.

instagram story viewer