Kullanılabilir köprüler, iyi bir kullanıcı deneyiminin işaretleridir.

Bağlantılar, web’deki en önemli etkileşimlerden biridir. Okumaya, kaydırmaya ve yazmaya ek olarak, herhangi bir web sitesini kullanma şeklimize derinden yerleşmişlerdir. Bir düşünün: Bu makaleyi nasıl aldınız? Bağlantıya tıklayarak. Daha önce siteye nasıl girdiniz? Bildiğimiz gibi, bu bağlantılar internete bağlı.

HTML’de her bağlantı bir bağlantı etiketi <a> ile işaretlenir. Tarayıcı, bağlantıyı mavi ve altı çizili yapan standart bir kullanıcı aracısı stil sayfasıyla birlikte gelir. Tüm tarayıcılar aynı şablonu kullandığından, kullanıcılar bu stilin bir bağlantıyı temsil ettiğini bilmelidir. Bu paradigmaya dayanarak, kullanıcıların web sitemizde gezinmesine yardımcı olmak için kullanabiliriz.

Neden bu kadar önemli?

Bağlantılar, kullanıcılar ve web sayfaları arasındaki en temel etkileşimli bileşendir; kullanıcı bir bağlantıya tıklar ve ardından başka bir web sayfası açar. Bunlar önemlidir, ancak giderek daha fazla insan arasında kolayca kaybolurlar. Web formları, animasyonlu araç ipuçları ve harekete geçirici mesaj düğmeleri gibi daha özlü UI öğeleri. Bağlantılar o kadar yaygındır ki projelerde genellikle onları görmezden geliriz.

Web sitenize dahili bağlantılar oluşturmak, arama motorlarındaki içeriği optimize etmenize yardımcı olabilir. UX tasarımı olarak bu konunun SEO’su doğrudan web sitenizin SEO’sunu etkiler. Web sitenizin SEO’sunu etkileyebilecek temel faktörlerden bazıları sayfa hızı, mobil uyumluluk ve en önemlisi bağlantı yapısıdır. Ayrıca, web sitenize verilen bağlantının yapısını ve kullanıcı dostu olup olmadığını açıklar.

Bağlantıların kullanımı ve türleri

İster metin ister dijital görüntü olsun, genellikle tıklanabilen her şeye bağlantı denir. Ayrıca, bağlantılar farklı türlerde olabilir.

Gezinme Bağlantıları: Temel olarak köprüler olarak adlandırılırlar, yeni bir görev başlatmadan sayfanın farklı bölümleri arasında gezinmek için kullanılırlar.

Komut Bağlantıları: Temel olarak yeni komutları yürütmek için kullanılan metin düğmeleri olarak adlandırılır. Genellikle daha az önemli komutlar için kullanılır.

Tanım Bağlantıları: Komut bağlantılarından daha değerli olan bağlantılardır.

Ana sayfa bağlantısı: Adından da anlaşılacağı gibi, ana sayfa bağlantısı, kullanıcıların web sitesinin logosuna veya sloganına tıklayarak ana sayfaya dönmesini sağlar.

Üç Bağlantı Durumu

Düğmeler veya bağlantılar ne zaman kullanılır?

İnternetin daha erken düzeyine dönen köprüler ve düğmeler arasında net farklılıklar vardır.

Uygulamalarda, kullanıcıların arka ucu değiştiren eylemleri hemen gerçekleştirmesine olanak tanıyan düğmeler kullanılmıştır. Bağlantılar, kullanıcıların başka bir bölüme veya sayfaya gitmesine izin vermek için web sitelerinde kullanılır.

Düğmeler ve bağlantılar

İlk olarak, kullanıcıların her ekranda gerçekleştirmesini istediğiniz ana görevleri düşünmek istersiniz. Bir düğme olmalı. Daha önemli olan daha belirgin olmalıdır. Bu eylemi birincil eylem çağrısı olarak adlandırıyoruz. Her ekranda sadece bir tane olmalıdır.

Bir uygulamanın durumunu değiştirmek için asla bağlantıları kullanmamalısınız. Bu, bağlantıya tıklamanın ekranda herhangi bir veri eklememesi, değiştirmemesi veya silmemesi gerektiği anlamına gelir. Silme işlemi bir bağlantı veya kaydetme işlemi olmamalıdır.

Ancak son on yılda, web sitesi gittikçe daha fazla işlev sağladığından bağlantılar ve düğmeler arasındaki ayrım giderek bulanıklaştı. Gezinme için komutlar ve düğmeler için bağlantılar bulabilirsiniz.

Varsayılan Altı Çizili Bağlantılarla İlgili Sorun

Altı çizili köprüler okunabilirliği etkiler çünkü temel karakterlerin altında bulunan ve alt çizginin altında olan p, g, j ve q gibi belirli karakterler CSS özelliğinin değerinden etkilenir.

Alt çizginin stilini tam olarak kontrol edemezsiniz, ancak alt kenarlığı, örneğin border-bottom: 1px solid #2159AD;hala açıkça görülebilen daha parlak ve daha çekici bir alt çizgi oluşturmak için basit olarak ayarlayabilirsiniz.

Daha iyi bağlantılar için ortak noktalar UX

Buradaki fikir, kullanıcıların bunları kullanabilmesi için web sitesindeki bağlantıları kullanmaktır, ancak kullanıcılar bu bağlantıları kullanmaz. Bu nedenle, kullanılabilirliklerini sağlamak için bağlantıları kullanmak da önemlidir.

1-Yalnızca “buraya tıklayın” bağlantıları yerine anlamlı metin bağlantıları oluşturun.

2-Daha iyi ziyaret edilen bağlantıları tanımlayın. Google’da ziyaret edilen bağlantılar rengi maviden mora değiştirir.

3-Kullanıcılara tıklanabilir olduğunu vurgulayın.

4-Bağlantıyı detaylandırmak için bir işaret eden ok veya el kullanın.

5-Mavi standart seçimdir veya mavi bir bağlantıyı temsil eder, farklı renkler de deneyebilirsiniz ancak bir bağlantı gibi görünmelidir.

6-Renk göremeyen renk körü kullanıcılara yardımcı olmak için alt çizgiler veya diğer renk olmayan göstergeler ekleyin.

7-Mouse ile üzerine gelindiğinde bir bağlantı ifşa etmeyin. Bunun yerine, mouse ile üzerine gelindiğinde daha iyi bir geçiş yapın.