header-logo
Wix ile sitenizi ve işinizi nasıl kuracağınızı öğrenin.
Kullanışlı Wix özellikleri ile sitenizi tasarlayın ve yönetin.
Abonelikleri, planları ve faturaları yönetin.
İşinizi yönetin ve üyelerle bağlantı kurun.
Domain satın alma, bağlama ve transfer işlemlerini öğrenin.
İşinizi ve web varlığınızı büyütmek için araçlar edinin.
SEO ve pazarlama araçlarıyla görünürlüğünüzü artırın.
Verimliliği artıracak yardımcı gelişmiş özellikler edinin.
Çözüm bulun, bilinen sorunları öğrenin veya iletişime geçin.
placeholder-preview-image
Kurslarımız ve eğitimlerimizle becerilerinizi geliştirin.
Web tasarımı, pazarlama ve daha fazlası için ipuçları alın.
Arama motorlarından organik site trafiğini artırmayı öğrenin.
Tam kapsamlı platformumuzu kullanarak özel site oluşturun.
Hedeflerinize ulaşmanıza yardımcı olacak bir uzmanla eşleşin.
placeholder-preview-image
  1. Ana Sayfa
  2. Sitenizi Oluşturma
  3. Erişilebilir Site Oluşturma
  4. Sitenizi Erişilebilir Yapma
  5. Erişilebilirlik: Metinlerinizi ve Grafiklerinizi Hazırlama

Erişilebilirlik: Metinlerinizi ve Grafiklerinizi Hazırlama

7 dk.
Bu makalede
  • Önerilerimiz
  • Renk kodlarını bulma
  • Renk kontrastını ayarlama
  • Renk kontrastını manuel olarak inceleme
Görme sorunları olan veya zorluklar yaşayan ziyaretçiler, bir site sayfalarının ön planını ve arka planını ayırt etmekte zorlanabilir. Bu nedenle sitenizdeki renk kontrastını kontrol edip gerektiği gibi ayarlamanızı öneririz.

Önerilerimiz

Farklı görme ihtiyaçları olan ziyaretçiler için erişilebilirliği artırmak için aşağıdakileri öneriyoruz:
  • Metin rengi ve arka plan arasındaki renk kontrası oranını, normal metinler için 4.5:1 ve geniş metinler için 3:1 oranında ayarlayın. 
  • Grafikler ve kullanıcı arayüzü bileşenleri (form giriş kısmı kenarlıkları, yer tutucuları vb.) için en az 3:1 kontrast oranı. 
  • AAA düzeyi, normal metinler için en az 7:1, geniş metinler için 4.5:1 kontrast oranı gerektirir.
Bilmenizde fayda var:
Geniş metin 14 punto ve üzeri olarak (yaklaşık 18px) ve kalın metin şeklinde 18 punto (yaklaşık 24px) olarak tanımlanır.

Renk kodlarını bulma

Renk kodlarını kullandığınız site oluşturucuda (Studio Editor veya Wix Editor) bulabilirsiniz.
Wix Editor
Studio Editor
  1. İlgili ögeyi seçin (metin, şerit arka planı, konteyner kutu vb.) ve Renk Seçici'ye erişin. 
  2. Renk kodunu görmek için imleçle herhangi bir rengin üzerine gelin. 
Wix Editor'daki renk seçici. İmleç bir rengin üzerinde geziniyor ve kod panelde vurgulanıyor.
Renk kontrastlarını test etme:
Ön plan ve arka plan renklerini (renk kodları kullanarak) karşılaştırma yoluyla renk kontrastlarını test eden birçok site ve tarayıcı eklentisi vardır, örneğin Contrast Checker. Arka plan resmi üzerindeki metnin renk kontrastını test etmek için Colour Contrast Analyser aracını kullanmanızı öneririz, bu araç sayesinde arka plan rengini seçip test edebilirsiniz.

Renk kontrastını ayarlama

Wix Editör'ü veya Studio Editor'u kullandığınızdan bağımsız olarak, bir sitedeki düşük renk kontrastını bulmak ve ayarlamak için editörünüzdeki Erişilebilirlik Sihirbazı'nı kullanabilirsiniz. Sihirbaz, sitenizi olası erişilebilirlik sorunlarına karşı tarar ve sitenin erişilebilirliğini iyileştirmenin yollarını vurgular.
Çoğu ögede değişiklik yapmayı sihirbazın kendisinde yapabilirsiniz. Ancak bazı ögeler (ör. app ögeleri) şimdilik sihirbazla tam olarak entegre değildir ve manuel olarak gözden geçirilmeleri veya ayarlanması gerekir.
Wix Editor
Studio Editor
  1. Editörünüze gidin.
  2. Editörünüzün üst kısmındaki Ayarlar'a tıklayın.
  3. Erişilebilirlik Sihirbazı'nı seçin.
  4. Siteyi Taratın'ı seçin.
  5. Algılanan sorunlar sekmesine tıklayın.
  6. Listeden bir sayfa seçin.
  7. Renk kontrastını iyileştir simgesine tıklayın.
  8. İlgili ögeyi seçin ve gerektiği gibi ayarlayın:

Renk kontrastını manuel olarak inceleme

Sitede Erişilebilirlik Sihirbazı'nın tanımlamadığı renk kontrastları olabilir. Site içeriğini Wix Kontrast Denetleyici'yi kullanarak manuel olarak gözden geçirmenizi ve kontrastı gerektiği gibi ayarlamanızı öneririz.
Kontrast Denetleyici'yi site oluşturucunuzdan (Wix Editör veya Studio Editor) yükleyebilir ve kullanabilirsiniz. Ögeler gereksinimleri karşılamıyorsa, seçiciyi kullanarak yeni oranları test edebilirsiniz.
Wix Editor
Studio Editor

Kontrastı kontrol etmek için:

  1. (Yalnızca ilk seferde) Eklentiyi editörünüze yükleyin.
  2. Editörün sağ üst köşesindeki Araçlar seçeneğine tıklayın.
  3. Editör Eklentileri'ne tıklayın. 
  4. Contrast Checker'a tıklayın. 
  5. Denetleyicide renk kutularını kullanarak ögenin ve arka planın rengini seçin veya ilgili renk kodlarını yapıştırın.
Wix Editör'deki kontrast denetleyicisi. Bir renk kutusu seçildiğinde renk seçici açılmış. Kontrast ayarı başarısız.

Kontrastı ayarlamak için:

  1. Kontrast Denetleyici'de ön plan ve arka plan renklerini önerilen orana ayarlayın.
  2. Seçicinin sağ alt köşesindeki renk kodlarını kopyalayın.
  3. Editör'de ilgili ögeye tıklayın.
  4. Ögenin tasarım ayarlarından renk seçiciyi açın.
  5. Renklerim'in yanındaki Ekle'ye tıklayın.
  6. Kopyalanan kodu ilgili alana yapıştırın.
Seçiciden yeni bir renk seçilmiş ve kontrast sorunu geçmiş. Renk kodu vurgulanır.
İpucu:
Tasarım ayarlarını nasıl açtığınız ögeye bağlı olarak değişir, ancak genellikle bunları ögeyi seçip Tasarım simgesine tıklayarak bulabilirsiniz.
Sitenizde grafikler ve veriler mi gösteriliyor?
Yüksek kontrast renkleri, sitenizde veri göstermenin harika bir yoludur. Ancak yine de bilgiler arasındaki farkın ayırt edilebilmesi için (dokular ve desenler gibi) başka göstergeler de kullanmanızı öneririz.  
Sonraki Adım:
Sitenizi erişilebilirlik açısından geliştirmeye devam etmek için Erişilebilirlik Yapılacaklar Listesi'ne geri dönün.

Bu içerik yardımcı oldu mu?

|
Bu makalede
  • Önerilerimiz
  • Renk kodlarını bulma
  • Renk kontrastını ayarlama
  • Renk kontrastını manuel olarak inceleme

Bu içerik yardımcı oldu mu?

|