197 lines
12 KiB
HTML
197 lines
12 KiB
HTML
<!doctype html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<link rel="preload" as="font" href="/fonts/vendor/jost/jost-v4-latin-regular.woff2" type="font/woff2" crossorigin>
|
|
<link rel="preload" as="font" href="/fonts/vendor/jost/jost-v4-latin-700.woff2" type="font/woff2" crossorigin>
|
|
<link rel="stylesheet" href="/main.daf9ee98168127ebe801fa49abea19e9b93a1e6615b5fb8613d39531c652f02d2d15c7680cf20e2047c2887b04f2192dc9a7847c62393718246d9f3e634a4e4d.css" integrity="sha512-2vnumBaBJ+voAfpJq+oZ6bk6HmYVtfuGE9OVMcZS8C0tFcdoDPIOIEfCiHsE8hktyaeEfGI5NxgkbZ8+Y0pOTQ==" crossorigin="anonymous">
|
|
<noscript><style>img.lazyload { display: none; }</style></noscript>
|
|
<meta name="robots" content="index, follow">
|
|
<meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1">
|
|
<meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1">
|
|
<title>Testing on screenreaders - mCaptcha</title>
|
|
<meta name="description" content="A network of mCaptcha instances sharing PoW stats to make mCaptcha more efficient and accessible">
|
|
<link rel="canonical" href="/blog/testing-on-screenreaders/">
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:image" content="/blog/testing-on-screenreaders/icon.png">
|
|
<meta name="twitter:title" content="Testing on screenreaders">
|
|
<meta name="twitter:description" content="A network of mCaptcha instances sharing PoW stats to make mCaptcha more efficient and accessible">
|
|
|
|
<meta name="twitter:site" content="@">
|
|
<meta name="twitter:creator" content="@">
|
|
|
|
<meta property="og:title" content="Testing on screenreaders">
|
|
<meta property="og:description" content="A network of mCaptcha instances sharing PoW stats to make mCaptcha more efficient and accessible">
|
|
<meta property="og:type" content="article">
|
|
<meta property="og:url" content="/blog/testing-on-screenreaders/">
|
|
<meta property="og:image" content="/blog/testing-on-screenreaders/icon.png">
|
|
<meta property="article:published_time" content="2024-02-10T00:00:00+00:00">
|
|
<meta property="article:modified_time" content="2024-02-12T18:21:49+05:30">
|
|
<meta property="og:site_name" content="mCaptcha">
|
|
|
|
<meta property="article:publisher" content="https://www.facebook.com/">
|
|
<meta property="article:author" content="https://www.facebook.com/">
|
|
<meta property="og:locale" content="en_US">
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "http://schema.org",
|
|
"@type": "BreadcrumbList",
|
|
"itemListElement": [{
|
|
"@type": "ListItem",
|
|
"position": 1 ,
|
|
"name": "Home",
|
|
"item": "\/"
|
|
},{
|
|
"@type": "ListItem",
|
|
"position": 2 ,
|
|
"name": "Blogtesting on Screenreaders",
|
|
"item": "\/blogtesting-on-screenreaders\/"
|
|
}]
|
|
}
|
|
</script>
|
|
|
|
<meta name="theme-color" content="#fff">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
|
<link rel="manifest" href="/site.webmanifest">
|
|
|
|
</head>
|
|
<body class="blog single">
|
|
|
|
|
|
<div class="header-bar fixed-top"></div>
|
|
<header class="navbar fixed-top navbar-expand-md navbar-light">
|
|
<div class="container">
|
|
<input class="menu-btn order-0" type="checkbox" id="menu-btn">
|
|
<label class="menu-icon d-md-none" for="menu-btn"><span class="navicon"></span></label>
|
|
<a class="navbar-brand order-1 order-md-0 me-auto" href="/">mCaptcha</a>
|
|
<button id="mode" class="btn btn-link order-2 order-md-4" type="button" aria-label="Toggle mode">
|
|
<span class="toggle-dark"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg></span>
|
|
<span class="toggle-light"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></span>
|
|
</button>
|
|
<ul class="navbar-nav social-nav order-3 order-md-5">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="https://github.com/mCaptcha"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-github"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg><span class="ms-2 visually-hidden">GitHub</span></a>
|
|
</li>
|
|
</ul>
|
|
<div class="collapse navbar-collapse order-4 order-md-1">
|
|
<ul class="navbar-nav main-nav me-auto order-5 order-md-2"><li class="nav-item active">
|
|
<a class="nav-link" href="/blog/">Blog</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/community/">Community</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/contact/">Contact</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/about/">About</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/docs/webmasters/installing-captcha/">Docs</a>
|
|
</li>
|
|
</ul>
|
|
<div class="break order-6 d-md-none"></div>
|
|
<form class="navbar-form flex-grow-1 order-7 order-md-3">
|
|
<input id="userinput" class="form-control is-search" type="search" placeholder="Search docs..." aria-label="Search docs..." autocomplete="off">
|
|
<div id="suggestions" class="shadow bg-white rounded"></div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="wrap container" role="document">
|
|
<div class="content">
|
|
|
|
<div class="row flex-xl-nowrap">
|
|
<nav class="docs-toc d-none d-xl-block col-xl-3" aria-label="Secondary navigation">
|
|
<div class="page-links">
|
|
<h3>On this page</h3>
|
|
<nav id="TableOfContents">
|
|
<ul>
|
|
<li><a href="#android-in-built-screen-reader-on-fennec">Android in-built screen reader on Fennec</a></li>
|
|
<li><a href="#nvda-on-microsoft-windows-and-mozilla-firefox">NVDA on Microsoft Windows and Mozilla Firefox</a></li>
|
|
<li><a href="#macos-in-built-screen-reader-on-google-chrome">macOS in-built screen reader on Google Chrome</a></li>
|
|
<li><a href="#ios-in-built-screen-reader-on-safari">iOS in-built screen reader on Safari</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
|
|
</nav>
|
|
<main class="docs-content col-lg-11 col-xl-9 mx-xl-auto">
|
|
|
|
<article>
|
|
<div class="blog-header">
|
|
<h1>Testing on screenreaders</h1>
|
|
<p><small>Posted February 10, 2024 by <a class="stretched-link position-relative" href="/contributors/aravinth-manivannan/">Aravinth Manivannan</a> ‐ <strong>1 min read</strong></small><p>
|
|
<p><small>Last Edited February 12, 2024</small><p>
|
|
|
|
</div>
|
|
<p class="lead"></p>
|
|
<p><a href="www.han.nl">HAN University of Applied Sciences</a> kindly did an
|
|
accessibility test of the mCaptcha widget and the showcase site, which
|
|
features a real world integration of mCaptcha in a third-party service.
|
|
The report motived us to make screen reader testing an integral part of
|
|
the release process.</p>
|
|
<p>Here are the results:</p>
|
|
<h2 id="android-in-built-screen-reader-on-fennec">Android in-built screen reader on Fennec</h2>
|
|
<iframe title="Testing mCaptcha on Android screenreader with Fennec browser" width="560" height="315" src="https://peertube.batsense.net/videos/embed/e9579d73-b19e-4051-9337-8432fc15c3b3" frameborder="0" allowfullscreen="" sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
|
|
<h2 id="nvda-on-microsoft-windows-and-mozilla-firefox">NVDA on Microsoft Windows and Mozilla Firefox</h2>
|
|
<iframe title="Testing mCaptcha on NVDA screen reader on MS Windows with Mozilla Firefox browser" width="560" height="315" src="https://peertube.batsense.net/videos/embed/cf534270-8089-4aad-95b3-543c467a6a12" frameborder="0" allowfullscreen="" sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
|
|
<h2 id="macos-in-built-screen-reader-on-google-chrome">macOS in-built screen reader on Google Chrome</h2>
|
|
<iframe title="Testing mCaptcha on macOS in-built screen reader and Google Chrome browser" width="560" height="315" src="https://peertube.batsense.net/videos/embed/45be4f8c-1978-4650-b9f1-972cfead8420" frameborder="0" allowfullscreen="" sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
|
|
<h2 id="ios-in-built-screen-reader-on-safari">iOS in-built screen reader on Safari</h2>
|
|
<iframe title="Testing mCaptcha on iOS screenreader with Safari" width="560" height="315" src="https://peertube.batsense.net/videos/embed/ac9722a4-3dce-4c40-bb0c-7bc8d721c3db" frameborder="0" allowfullscreen="" sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
|
|
|
|
</article>
|
|
<div class="docs-navigation d-flex justify-content-between">
|
|
|
|
<a class="ms-auto" href="/blog/introducing-mcaptcha-net/">
|
|
<div class="card my-1">
|
|
<div class="card-body py-2">
|
|
Introducing mCaptcha net →
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<p class="edit-page"><a href="https://git.batsense.net/mCaptcha/website/blob/master/content/blog/testing-on-screenreaders.md"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-edit-2"><path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z"></path></svg>Edit this page on git.batsense.net</a></p>
|
|
|
|
</main>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<footer class="footer text-muted">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-8 order-last order-lg-first">
|
|
<ul class="list-inline">
|
|
<li class="list-inline-item">Powered by <a href="https://gohugo.io/">Hugo</a>, and <a href="https://getdoks.org/">Doks</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-8 order-first order-lg-last text-lg-end">
|
|
<ul class="list-inline">
|
|
<li class="list-inline-item"><a href="/about/">About</a></li>
|
|
<li class="list-inline-item"><a href="/donate">Donate</a></li>
|
|
<li class="list-inline-item"><a href="/privacy-policy/">Privacy</a></li>
|
|
<li class="list-inline-item"><a href="/security">Security</a></li>
|
|
<li class="list-inline-item"><a href="https://stats.uptimerobot.com/GK7VLFJnBl">Status</a></li>
|
|
<li class="list-inline-item"><a href="/thanks">Thanks</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="/main.min.70f918bab2664d7be941298c2bbe499887e963319637b9d3caf20dc1803bb92e051efe68b3607d5ed5426842d80ac1e73f48bed63468a7139e31546f0c3ffb80.js" integrity="sha512-cPkYurJmTXvpQSmMK75JmIfpYzGWN7nTyvINwYA7uS4FHv5os2B9XtVCaELYCsHnP0i+1jRopxOeMVRvDD/7gA==" crossorigin="anonymous" defer></script>
|
|
<script src="/index.min.8e2c5b66d3a3b8a6089866a5588aa2b9a97df428eebf33fd518690ce9bc1172b809b3a138e891a9fe1965832688b9f535efe05248ecef5787f9727128e6ff5c7.js" integrity="sha512-jixbZtOjuKYImGalWIqiual99CjuvzP9UYaQzpvBFyuAmzoTjokan+GWWDJoi59TXv4FJI7O9Xh/lycSjm/1xw==" crossorigin="anonymous" defer></script>
|
|
|
|
</body>
|
|
</html>
|