HTML5 Yer Tutucu Bağlantıları Ne İçin?
HTML5'e kadar idUp olan bir etiket bir özellik gerektirdi: href. Ancak HTML5 bu özelliği bile isteğe bağlı yapar. Bir etiketi hiçbir öznitelik olmadan yazdığınızda buna yer tutucu bağlantısı denir.
Bir yer tutucu bağlantısı şöyle görünür:
ÖncekiGeliştirme Sırasında Yer Tutucu Bağlantılarını Kullanma
Hemen hemen her web tasarımcısı bir web sitesi tasarlarken ve oluştururken bir zamanlar ya da başka bir yerde yer tutucu bağlantıları oluşturdu. HTML5'ten önce şunları yazabiliriz:
bağlantı metniyer tutucu olarak. Ve ben de bu yer tutucuları ile müşterilerime mockup siteleri gönderdim ve sadece müşterinin bana “metinde iş bağlantıları olmasın” diye sormasını istiyorum.
Bir yer işareti bağlantısı olarak bir hashtag (#) kullanmayla ilgili problem, bağlantının tıklanabilir olmasıdır ve bu, müşterileriniz için karışıklığa neden olabilir. Ve birileri onları doğru URL'lerle güncellemeyi unutursa, bu linkler canlı sitede herhangi bir bağlantıya bağlı olmadığından bozuk görünebilir.
Bunun yerine, herhangi bir öznitelik içermeyen bir etiket kullanmaya başlamalısınız. Bunları sayfanızdaki başka herhangi bir bağlantıya benzeyecek şekilde düzenleyebilirsiniz, ancak yalnızca yer tutucuları oldukları için tıklanabilir olmayacaktır.
Canlı Sitelerde Yer Tutucu Bağlantılarını Kullanma
Ancak yer tutucu bağlantılarının, web tasarımında yalnızca geliştirme aşamasından daha fazlası için bir yeri vardır. Bir yer tutucu bağlantısının parlayabileceği bir yer navigasyondadır. Çoğu durumda, web sitesi gezinme listelerinin hangi sayfada bulunduğunuzu gösteren bir yolu vardır. Bunlar genellikle “buradasınız” göstergeleri olarak adlandırılır.
Çoğu site, "buradasınız" işaretçisine ihtiyaç duyan öğedeki kimlik özniteliklerine güvenir, ancak bazıları sınıf özelliğini de kullanır. Bununla birlikte, kullandığınız özellik ne olursa olsun, öğenin gezinmesini sağlayan her sayfaya, öğenin doğru öğelerden eklenmesi ve kaldırılmasıyla ilgili bir sürü iş yapmanız gerekir.
Yer tutucu bağlantısıyla, navigasyonunuzu istediğiniz gibi yazabilir ve daha sonra gezinmeyi bir sayfaya eklediğinizde href özelliğini uygun bağlantıdan kaldırabilirsiniz. Tüm gezinme listemi editörümde snippet olarak saklıyorum, bu yüzden sadece hızlı bir kopyala yapıştır ve sonra href'i sil. Aynı zamanda CMS'nizi de aynı şeyi yapabileceksiniz.
Ayrıca, özel stil ekleme (size aşağıdan nasıl göstereceğim) yerine bir yer tutucu linki eklemek için bağlantı tıklanabilir değildir. Müşteriler, şu anda bulundukları navigasyon bağlantısına tıkladıklarında başka bir şey elde edebileceğini düşünerek kafasını karıştırmazlar.
Styling Yer Tutucu Bağlantıları
Yer tutucu bağlantıları, web sayfanızdaki diğer bağlantılardan farklı şekilde stil ve stil bakımından kolaydır. Hem bir etiketi hem de:: link etiketini mutlaka uyguladığınızdan emin olun. Örneğin:
bir {color: kırmızı; font ağırlığı: kalın; metin-dekorasyon: yok; } a: link {color: mavi; yazı tipi ağırlığı: normal; metin-dekorasyon: alt çizgi; }Bu CSS yer tutucu bağlantılarını alt çizgisiz, kalın ve kırmızı yapar. Düzenli bağlantılar normal ağırlıkta, mavi ve altı çizili olacaktır.
Bir etiketten taşınmak istemediğiniz stilleri sıfırlamayı unutmayın. Örneğin, font-weight değerini yer tutucu linkleri için kalın olacak şekilde ayarladım, bu yüzden şöyle ayarladım:
yazı tipi ağırlığı: normal;standart bağlantılar için. Aynı şey, metin dekorasyonunda, bir seçiciyle onu kaldırarak doğrudur: eğer geri koymamış olsaydım: link seçici için çıkarılmış olurdu.