Uyarlamalı Kartlar için Erişilebilirlik İpuçları

Copilot Studio aracıları, Windows'da NonVisual Desktop Access (NVDA) ve Job Access with Speech (JAWS) gibi ekran okuyucularla uyumlu bir şekilde çalışır. Erişilebilirliği iyileştirmek için şu ipuçlarını değerlendirin.

Ekran okuyucuları

Uyarlamalı kartların ekran okuyucu ve klavye gezintisi erişilebilirliği için en önemli noktalar şunlardır.

• Her zaman "label" özelliğini ekleyin: "label" özelliği, bir kullanıcı bir giriş alanına odaklandığında ekran okuyucuların seslendirdiği ifadedir. Bu olmadan, ekran okuyucular bağlam sağlamadan yalnızca "düzenleme alanı" ifadesini söyleyebilir. Ekran okuyucular genellikle yer tutucuları okumaz ve kullanıcı yazmaya başladığında bu yer tutucular kaybolur. Bu nedenle, erişilebilirlik konusunda size yardımcı olmaları için bunlara güvenmekten kaçının.

  {
    "type": "Input.Text",
    "id": "middleName",
    "label": "Middle name (optional)",
    "placeholder": "Enter your middle name"
  }
  

• "inputStyle" ve "style" öğelerini özenli bir şekilde kullanın: Odak göstergelerini kaldıran özel stil düzenlemelerinden kaçının. Varsayılan odak halkası, klavye kullanıcılarının kart üzerinde nerede olduklarını anlamak için güvendikleri şeydir.

• Okuyucular için "isRequired" ve "errorMessage" kullanın: İsteğe bağlı alanlar için bile açık bir "errorMessage", ekran okuyucuların doğrulama geri bildirimlerini iletmesine yardımcı olur.

  {
    "type": "Input.Text",
    "id": "middleName",
    "label": "Middle name (optional)",
    "isRequired": false,
    "errorMessage": "Please enter a valid middle name"
  }
  

• Mantıksal sekme sırası: Uyarlamalı Kartlar, sekme ile gezinme için Belge Nesne Modeli (DOM) sırasını izler; bu nedenle kartınızın JSON gösterimini, kullanıcıların sekme ile ilerlemesini istediğiniz sıraya göre yapılandırın. Görsel olarak mantıklı bir düzen oluşturan ancak klavye kullanıcıları için kafa karıştırıcı bir sekme sırasına yol açan "ColumnSet" düzenlerini kullanmaktan kaçının.

• Eylem düğmeleri varsayılan olarak klavye ile erişilebilirdir: "Action.Submit" ve "Action.OpenUrl" gibi özellikler yerel olarak odaklanılabilir durumdadır. Ekran okuyucuları başlığı sesli okuduğundan, başlığınızın "Buraya tıklayın" gibi belirsiz bir ifade yerine açıklayıcı olduğundan emin olun.

• "type" ekleyin: Yönergeler için "TextBlock": İsteğe bağlı alanlardan oluşan bir bölüm bağlama ihtiyaç duyuyorsa bu alanlardan önce "type" değerini "TextBlock" olarak ayarlayın. Ekran okuyucular alanları sırayla okuyarak kullanıcıların girişlere ulaşmadan önce ihtiyaç duydukları bağlamı sağlar.

  {
    "type": "TextBlock",
    "text": "The following fields are optional. You can skip them if not applicable.",
    "wrap": true
  }
  

• "isVisible" öğesinden kaçının: Erişilebilirlik senaryoları için "false": Ekran okuyucular gizli öğeleri tamamen atlar. Erişilebilirlik bir öncelikse isteğe bağlı alanları görünür tutun. Bunları gizlemeniz gerekiyorsa iki durumlu düğmenin açık ve açıklayıcı bir etikete sahip olduğundan emin olun.

• Microsoft Teams'de test yapmak için uzman ipucu: Microsoft Teams'in Uyarlamalı Kartlar desteğindeki küçük farklılıklar nedeniyle, sekme sırasını doğrulamak ve duyuruların beklendiği gibi çalıştığından emin olmak için yerleşik Windows Ekran Okuyucusu veya NVDA kullanmanızı öneririz.

Belirli şema özellikleri

Uyarlamalı Kartlar şemasında erişilebilirliği artırmaya yardımcı olabilecek bazı özel özellikler şunlardır.

"label" özelliği

"label" özelliği, ekran okuyucular için kritik önem taşır. Etiketler ve girişler arasında bir bağlantı kurularak, işleyici kitaplıkları, ekran okuyucular gibi yardımcı teknoloji kullanıcılarının Uyarlamalı Kartlar içindeki girişlerle doğru bir şekilde etkileşim kurmasını sağlamak için gerekli özellikleri ayarlayabilir.

Input.Text bölümünde daha fazla bilgi edinin.

Erişilebilirlik açısından neden "label", "placeholder" daha üstündür?

Uyarlamalı Kartlar giriş parametrelerini etiketlemek için "placeholder" özelliği yerine "label" özelliğini kullanmanızı öneririz. Bu, kart yazarları için girdileri etiketlemenin basit ve öz bir yoludur.

"TextBlock" özelliklerini etiket olarak kullanmak, girişler ve etiketler arasındaki yakınlığı zorunlu tutmanızı engeller. "label" özelliğini kullanarak, her iki görsel öğenin de yan yana işlenmesini sağlayabilir ve ekran büyüteci kullanan kullanıcılar için erişilebilirliği artırabilirsiniz.

Giriş doğrulaması bölümünde daha fazla bilgi edinin.

Doğrulama geri bildirimi için "errorMessage" kullanma

"errorMessage" özelliği, kullanıcı geçersiz bir değer girdiğinde gösterilecek iletiyi belirtmek için tüm giriş türlerinde kullanılabilir.

Giriş doğrulaması bölümünde daha fazla bilgi edinin.

Erişilebilirlik yapısı için "style": "heading" şeklindeki TextBlock

"style" kullanarak: "heading", varsayılan başlık stilini uygular ve erişilebilirlik için TextBlock öğesini başlık olarak işaretler.

TextBlock bölümünde daha fazla bilgi edinin.

Eylem düğmeleri: anlatım için "araç ipucu"

"Action.ToggleVisibility" eylemi, kullanıcı fareyi eylemin üzerine getirdiğinde görünen metni tanımlayan bir "tooltip" özelliğini destekler. Anlatım yazılımı bu metni seslendirir.

Daha fazla bilgi için Action.ToggleVisibility bölümünde daha fazla bilgi edinin.

Giriş öğeleri için "isVisible": "false" olan uyarı

Doğrulama içeren giriş öğelerini görünür tutun. "Action.ToggleVisibility" altındaki doğrulama içeren giriş öğeleri, gizli giriş parametreleri geçerli olmadığında kafa karışıklığına yol açabilir.

Daha fazla bilgi için Action.ToggleVisibility bölümünde daha fazla bilgi edinin.

Input.ChoiceSet için "labelPosition" özelliği

"Input.ChoiceSet" için "labelPosition" özelliği, etiketin konumunu satır içi veya (varsayılan olarak) üst kısım şeklinde belirler.

Input.ChoiceSet bölümünde daha fazla bilgi edinin.