Erişilebilirlik: CMS En İyi Uygulamaları
10 dk.
Bu makalede
- CMS alt metin en iyi uygulamaları
- Dekoratif olmayan görüntüler için
- Dekoratif görüntüler için
- Tıklanabilir düğme işlevi gören görüntüler için
- 'Görüntü' alanlarına bağlı galeriler için
- 'Medya galerisi' alanlarına bağlı galeriler için
- (Yalnızca Studio Editor) 'Daha Fazla Yükle' düğmelerini kullanırken ögeleri ayrı bölümlere ekleme
- (Yalnızca statik sayfalar) Kapsayıcılara 'Sonraki/Önceki öge' düğmeleri ekleme
- Bir kapsayıcıya 'öge sayısı' metni ekleme
- Giriş ögelerini erişilebilir hale getirme
- Sayfalandırma çubuklarını erişilebilir hale getirme
- SSS
İçerik Yönetim Sistemi (CMS) kapsamında erişilebilirlik en iyi uygulamalarını takip ederek sitenizin yardımcı teknolojilere ihtiyaç duyan kişiler dahil olmak üzere herkes tarafından kullanılabilir olmasını sağlayabilirsiniz. En iyi uygulamalar arasında ögelere erişilebilir adlar ekleme, görseller/galeriler için etkili alternatif metinler kullanma ve ögeleri ARIA öznitelikleri içeren bölümlere/kapsayıcılara yerleştirme sayılabilir.
Bu talimatları izleyerek tüm kullanıcıların kolayca gezinebileceği ve etkileşimde bulunabileceği kapsayıcı bir web sitesi oluşturabilirsiniz.
CMS alt metin en iyi uygulamaları
Alt metinler görüntülere ve galerilere bağlam kazandırmak açısından kritik bir rol oynar. Alt metin yazarken ilgili görüntüyü bir yapay zekanın yorumlayacağını düşünerek olabildiğince betimleyici olun, metni 125 karakteri geçmeyecek şekilde kısa tutun ve “... görüntüsü” gibi ifadelerden kaçının. Etkili alt metin yazımıyla ilgili daha fazla bilgi için Erişilebilirlik: Görüntülerinizi ve Galerilerinizi Hazırlama rehberimizi inceleyebilirsiniz.
Genel olarak, CMS bağlantılı görüntüler ve galeriler için alt metin kaynağı olarak kullanmak üzere bir koleksiyon alanı oluşturmanızı öneririz. Koleksiyonunuzu düzenli tutmak için alt metin alanını temsil ettiği görüntünün veya galerinin yanına yerleştirebilir ve "Alt metin görüntü/galeri adı]" olarak adlandırabilirsiniz. Dekoratif görüntüler için alt metin gerekmeyebileceğini unutmayın. Aşağıdaki [dekoratif görüntüler bölümüne göz atın.
Dekoratif olmayan görüntüler için
CMS'ye dekoratif olmayan görüntüler eklerken açıklayıcı alt metinler sağlamanız önemlidir. CMS koleksiyonunuza görüntülerin alt metnini temsil eden ayrı bir 'Metin' alanı eklemenizi öneririz. Alt metninizde spesifik ve açıklayıcı bir dil kullanmaya odaklanın. Örneğin, alt metin olarak "bir kadın" yazmak yerine, "bahçeye çiçek eken bir kadın" ifadesini kullanabilirsiniz.
Editörünüzde görüntüyü veri kümesine bağlarken Alt metin buna bağlanır alanına tıklayın ve oluşturduğunuz alt metin alanını seçin. Böylece ekran okuyucuların görüntüyü ve amacını tanımlayabilmesini sağlayarak sitenizin kapsayıcılığını artırabilirsiniz.
Dekoratif görüntüler için
Dekoratif görüntüler genellikle bilgi iletme amacı taşımazlar ve bu nedenle alt metin eklemeniz gerekmez. Görüntüler yalnızca dekoratif amaçlıysa, veri kümesinde alt metni bağlamadan bırakabilirsiniz. Bu durumda ekran okuyucular görüntüyü atlar ve alt metnin gereksiz yere dikkat dağıtmasının önüne geçilmiş olur.
Tıklanabilir düğme işlevi gören görüntüler için
Görüntü bağlantısı bir veri kümesi eylemine (ör. dinamik öge sayfasını açma eylemine) yönlendirme yapıyorsa, alt metin görüntünün yanı sıra ilgili eylemi de açıklamalıdır. Örneğin, görüntüye tıklayan ziyaretçiler bir profil sayfasına yönleniyorsa, “Willis McSmoot hakkında daha fazla bilgi” gibi bir alt metin kullanabilirsiniz.
İfadeleri (expressions) kullanarak dinamik koleksiyon alanı değerleriyle (ör. "Willis McSmoot") sabit bir metni (ör. "hakkında daha fazla bilgi") birleştirerek alt metnin görüntüye göre değişmesini sağlayabilirsiniz. Böylelikle, yardımcı teknolojiler kullanan ziyaretçiler görüntünün verdiği mesajı anlayabilirler.
İfadeleri özel alt metin oluşturmak amacıyla kullanmak için:
- İlgili görüntüyü koleksiyonunuza bağlı veri kümesine bağlayın.
- Görüntü Bağlayın panelinde Alt metin buna bağlanır açılır menüsüne tıklayın ve İfade (expression) seçeneğini seçin.
- İfade (Expression) alanına tıklayın ve ihtiyacınız olan alt metni üreten bir fonksiyon girin. Örneğin, "hakkında daha fazla bilgi" cümlesini bir 'title' (başlık) alanıyla birleştirmek için aşağıdaki fonksiyonu girebilirsiniz:
1CONCAT(title," hakkında daha fazla bilgi")İfadeleri kullanarak birden fazla alandaki değerleri birleştirme hakkında daha fazla bilgi edinin.
'Görüntü' alanlarına bağlı galeriler için
'Görüntü' alanlarına bağlı galerilerde her görüntü için alt metin girilmesi önemlidir. CMS koleksiyonunuzda özellikle görüntülerin alt metinleri için ayrı bir 'Metin' alanı oluşturun. Galeriyi veri kümenize bağlarken Alt metinler şuraya bağlanır bağlanır açılır menüsünü ilgili alt metin alanına bağlayın. Böylece ekran okuyucuların galerideki görüntüleri açıklayabilmesini sağlayarak erişilebilirliği artırabilirsiniz.
'Medya galerisi' alanlarına bağlı galeriler için
Dinamik öge sayfasında bir ögeyle ilgili çok sayıda görüntü veya video sergilemenin en etkili yollarından biri 'Medya galerisi' alanına bir galeri bağlamaktır. Koleksiyonunuzdaki her bir ögenin yanındaki 'Medya galerisi' alanına tıklayarak tüm medya dosyaları için alt metinler ekleyin. Bu alana ayrıca her dosya için başlık ve açıklama girerek ekran okuyucuların galerinizdeki görüntüleri ve videoları anlamlandırmalarına yardımcı olabilir ve böylece tüm medya içeriğinizin erişilebilir olmasını sağlayabilirsiniz.
(Yalnızca Studio Editor) 'Daha Fazla Yükle' düğmelerini kullanırken ögeleri ayrı bölümlere ekleme
Studio Editor'da 'Daha Fazla Yükle' düğmesi eklerken, tekrarlayıcının veya galerinin altına yerleştirdiğiniz tüm ögeleri ayrı bir bölüme yerleştirin. Eğer bu ögeleri aynı bölüm içinde ve doğrudan tekrarlayıcının/galerinin altına yerleştirirseniz, 'Daha Fazla Yükle' düğmesine tıklandığında bu ögeler üst üste gelebilir. Bu durum ziyaretçilerin içeriği görmesini ve erişmesini zorlaştırarak kullanıcı deneyimini olumsuz etkileyebilir.
Bu sorunu önlemek için 'Daha Fazla Yükle' düğmesi dahil olmak üzere tekrarlayıcının/galerinin altına yerleştirmek istediğiniz tüm ögelerin ayrı bir bölüme iliştirildiğinden emin olun. Böylece kullanıcılar 'Daha Fazla Yükle' düğmesine tıkladıklarında galeri/tekrarlayıcı herhangi bir üst üste gelme olmadan genişleyerek daha net ve kullanıcı dostu bir deneyim sunar.
'Daha Fazla Yükle' düğmesi ekleme hakkında daha fazla bilgi edinin:
(Yalnızca statik sayfalar) Kapsayıcılara 'Sonraki/Önceki öge' düğmeleri ekleme
Statik sayfalarda, ziyaretçilerin 'Sonraki/Önceki öge' düğmelerine tıklayarak CMS'ye bağlı sayfa ögelerinin içeriğini değiştirmelerine izin veriyorsanız, içerik gösteren ögeleri tek bir kapsayıcıya iliştirin. Ardından bu kapsayıcıya ARIA (Erişilebilir Zengin İnternet Uygulamaları) öznitelikleri tanımlayabilir ve böylece ekran okuyucuların içerik değişikliklerini algılayıp kullanıcıya iletmesini sağlayabilirsiniz.
Kapsayıcıya yalnızca değişen içerik gösteren ögeleri iliştirmeniz gerekir. 'Sonraki/Önceki öge' düğmelerinin iliştirilmesine gerek yoktur.
Wix Editör
Studio Editor
- Editörünüze gidin.
- Bir kapsayıcı ekleyin.
- Sol çubuktaki CMS simgesine
tıklayın. - Koleksiyonlarınız'a tıklayın.
- CMS içeriğini göstermek için kullanmak istediğiniz ögelere tıklayıp kapsayıcıya sürükleyin.
- Henüz yapmadıysanız, kodlamayı etkinleştirin:
- Üst çubuktaki Geliştirici Modu sekmesine tıklayın.
- Geliştirici Modunu Aç'a tıklayın.
- Erişilebilirliğe yönelik geliştirici araçlarını etkinleştirin:
- Editörünüzün üst çubuğundaki Ayarlar sekmesine tıklayın.
- Erişilebilirlik Sihirbazı'nı seçin.
- Sağ panelden Erişilebilirliğe Yönelik Geliştirici Araçları'na tıklayın.
- Editörde gelişmiş erişilebilirlik ayarlarını gösterin geçiş düğmesini etkinleştirin.
- CMS koleksiyonu içeriğini gösteren ögelerin iliştirildiği kapsayıcıya sağ tıklayın.
- Erişilebilirlik'i seçin.
- Öznitelik Ekle'ye tıklayın.
- Özellik açılır menüsüne tıklayın ve aria-live özniteliğini seçin.
- Öznitelik değeri açılır menüsüne tıklayın ve polite değerini seçin.
- Ekle'ye tıklayın.
- Değişiklikleri uygulamaya hazır olduğunuzda sitenizi yayınlayın.
Bir kapsayıcıya 'öge sayısı' metni ekleme
Veri kümesi öge sayısını bir metin ögesinde gösteriyorsanız ve ziyaretçiler gösterilen öge sayısını bir giriş ögesine tıklayarak değiştirebiliyorsa, metin ögesini bir kapsayıcıya ekleyin. Ardından bu kapsayıcıya ARIA (Erişilebilir Zengin İnternet Uygulamaları) öznitelikleri ekleyerek ekran okuyucuların öge sayısındaki değişiklikleri duyurmalarını sağlayın.
Bu yöntem ziyaretçilerin içerik filtreleyen veya içerik toplayan giriş ögelerine tıklamaları durumunda geçerlidir. Ziyaretçilerin gösterilen öge sayısını değiştirebildiği durumlarda, ekran okuyucuların bu yöndeki bir değişikliği duyurabilmesi için öge sayısını gösteren metni bir kapsayıcıya iliştirmeniz gerekir.
Wix Editör
Studio Editor
- Editörünüze gidin.
- Bir kapsayıcı ekleyin.
- Veri kümesi öge sayısını gösteren metin ögesine tıklayın ve kapsayıcıya sürükleyerek iliştirin. Öge sayısının neyi temsil ettiğini açıklayan başka bir metin ögeniz (ör. "Sonuçlar") varsa, bunu da kapsayıcıya iliştirin.
- Henüz yapmadıysanız, kodlamayı etkinleştirin:
- Üst çubuktaki Geliştirici Modu sekmesine tıklayın.
- Geliştirici Modunu Aç'a tıklayın.
- Erişilebilirliğe yönelik geliştirici araçlarını etkinleştirin:
- Editörünüzün üst çubuğundaki Ayarlar sekmesine tıklayın.
- Erişilebilirlik Sihirbazı'nı seçin.
- Sağ panelden Erişilebilirliğe Yönelik Geliştirici Araçları'na tıklayın.
- Editörde gelişmiş erişilebilirlik ayarlarını gösterin geçiş düğmesini etkinleştirin.
- Metin ögelerinin iliştirildiği kapsayıcıya sağ tıklayın.
- Erişilebilirlik'i seçin.
- İlk özniteliği ekleyin:
- Öznitelik Ekle'ye tıklayın.
- Özellik açılır menüsüne tıklayın ve aria-atomic özniteliğini seçin.
- Öznitelik değeri açılır menüsüne tıklayın ve true değerini seçin.
- Ekle'ye tıklayın.
- İkinci özniteliği ekleyin:
- Öznitelik Ekle'ye tıklayın.
- Özellik açılır menüsüne tıklayın ve aria-live özniteliğini seçin.
- Öznitelik değeri açılır menüsüne tıklayın ve polite değerini seçin.
- Ekle'ye tıklayın.
- Değişiklikleri uygulamaya hazır olduğunuzda sitenizi yayınlayın.
Giriş ögelerini erişilebilir hale getirme
İçerik filtrelemeye ayarlanmış giriş ögeleriniz varsa, filtreler varsayılan olarak ziyaretçi seçim yapar yapmaz uygulanır. Bu davranışı değiştirmek istiyorsanız, 'Filtreleri Uygula' düğmesi ekleyebilirsiniz.
'Filtreleri Uygula' düğmesi eklemek erişilebilirlik açısından önemlidir. Bu sayede ziyaretçiler düğmeye tıklayana kadar içerik filtrelenmez. Özellikle birden fazla filtre seçeneği belirleyip ardından topluca uygulamak isteyen ziyaretçiler için bu yaklaşım daha kullanıcı dostu bir deneyim sunar.
Veri kümesi öge sayısını gösterirken:
Ziyaretçiler giriş ögelerine tıklayarak öge sayısını değiştirebiliyorsa, öge sayısını gösteren metni bir kapsayıcıya iliştirmeyi unutmayın. Daha fazla bilgi için yukarıdaki bölüme bakın.
Sayfalandırma çubuklarını erişilebilir hale getirme
Sayfalama çubuklarını daha erişilebilir hale getirmek için hem çubuğa hem de içindeki düğmelere erişilebilir adlar ekleyin. Bu adlar ekranda görünmez ancak ekran okuyucular için önemlidir ve kullanıcıların sayfalar arasında nasıl gezineceklerini anlamalarına yardımcı olur. Örneğin, sayfalandırma çubuğuna 'Sayfada gezinme' adını verebilir; düğmeler için ise 'Sonraki sayfa', 'Önceki sayfa' veya içeriğinize göre 'Sonraki hikaye', 'Önceki ürün' gibi net erişilebilir adlar ekleyebilirsiniz.
İpucu:
Studio Editor'da bir 'Daha fazla yükle' düğmeniz varsa, sayfalandırma çubuğu dahil olmak üzere tekrarlayıcının/galerinin altında gösterilen diğer tüm ögeleri ayrı bir bölüme yerleştirin.
SSS
Erişilebilirlikle ilgili sıkça sorulan soruların yanıtları için aşağıya tıklayın.
CMS'deki alt metin alanını adlandırırken nelere dikkat etmeliyim?
Tekrarlayıcımda dekoratif olan ve olmayan görüntüler karışık olarak gösteriliyorsa ne olur?
Ziyaretçiler görüntünün üzerine geldiğinde görünen bir araç ipucu metni ekleyebilir miyim?