{"id":68725,"date":"2025-07-09T10:00:11","date_gmt":"2025-07-09T07:00:11","guid":{"rendered":"https:\/\/elementor.com\/help\/?p=68725"},"modified":"2025-07-03T16:18:17","modified_gmt":"2025-07-03T13:18:17","slug":"understanding-aria-and-authoring-practices-apg","status":"publish","type":"post","link":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/","title":{"rendered":"Understanding ARIA and Authoring Practices (APG)"},"content":{"rendered":"\n<p>ARIA (Accessible Rich Internet Applications) is a set of attributes you can add to HTML elements to make web content and applications more accessible, especially dynamic content and advanced user interface controls. The Authoring Practices Guide (APG) provides guidance on how to use ARIA correctly.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What is ARIA?<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>ARIA provides extra information to assistive technologies that isn&#8217;t available in native HTML. It helps define the roles, states, and properties of custom UI components.<\/li>\n\n\n\n<li><strong>Example:<\/strong> If you create a custom dropdown menu using &lt;div> elements, a screen reader won&#8217;t know it&#8217;s a menu. ARIA attributes like role=&#8221;menu&#8221;, aria-haspopup=&#8221;true&#8221;, and aria-expanded=&#8221;false\/true&#8221; can be used to describe its function and state.<\/li>\n\n\n\n<li><strong>First Rule of ARIA:<\/strong> The most important rule is: if a native HTML element already has the accessibility features you need, use it instead of creating a custom component with ARIA. For example, use a &lt;button> element instead of a &lt;div> with role=&#8221;button&#8221;.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What is the APG?<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The APG (Authoring Practices Guide) is a resource from the W3C that provides design patterns and code examples for creating accessible web components.<\/li>\n\n\n\n<li>It demonstrates how to correctly implement ARIA for common widgets like accordions, sliders, tabs, and modals.<\/li>\n\n\n\n<li>The APG is an essential guide for developers to ensure their custom components are usable by people who rely on assistive technologies.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>ARIA (Accessible Rich Internet Applications) is a set of attributes you can add to HTML elements to make web content and applications more accessible, especially dynamic content and advanced user interface controls. The Authoring Practices Guide (APG) provides guidance on how to use ARIA correctly. What is ARIA? What is the APG?<\/p>\n","protected":false},"author":58,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_elementor_kustomer_id":[],"footnotes":""},"categories":[1475],"tags":[],"class_list":["post-68725","post","type-post","status-publish","format-standard","hentry","category-web-accessibility"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Understanding ARIA and Authoring Practices (APG) | Elementor<\/title>\n<meta name=\"description\" content=\"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor&#039;s Knowledge Base. Get Elementor tips &amp; more.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Understanding ARIA and Authoring Practices (APG) | Elementor\" \/>\n<meta property=\"og:description\" content=\"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor&#039;s Knowledge Base. Get Elementor tips &amp; more.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\" \/>\n<meta property=\"og:site_name\" content=\"Help\" \/>\n<meta property=\"article:published_time\" content=\"2025-07-09T07:00:11+00:00\" \/>\n<meta name=\"author\" content=\"rebeccaf\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"rebeccaf\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\"},\"author\":{\"name\":\"rebeccaf\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/65dd358743d24ed396d4712d9a202727\"},\"headline\":\"Understanding ARIA and Authoring Practices (APG)\",\"datePublished\":\"2025-07-09T07:00:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\"},\"wordCount\":234,\"publisher\":{\"@id\":\"https:\/\/elementor.com\/help\/#organization\"},\"articleSection\":[\"Ally - Web Accessibility\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\",\"url\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\",\"name\":\"Understanding ARIA and Authoring Practices (APG) | Elementor\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/help\/#website\"},\"datePublished\":\"2025-07-09T07:00:11+00:00\",\"description\":\"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor's Knowledge Base. Get Elementor tips & more.\",\"breadcrumb\":{\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Help Center\",\"item\":\"https:\/\/elementor.com\/help\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Plugins by Elementor\",\"item\":\"https:\/\/elementor.com\/help\/plugins-by-elementor\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Ally - Web Accessibility\",\"item\":\"https:\/\/elementor.com\/help\/plugins-by-elementor\/web-accessibility\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Understanding ARIA and Authoring Practices (APG)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/elementor.com\/help\/#website\",\"url\":\"https:\/\/elementor.com\/help\/\",\"name\":\"Elementor\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/elementor.com\/help\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/elementor.com\/help\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/elementor.com\/help\/#organization\",\"name\":\"Elementor\",\"url\":\"https:\/\/elementor.com\/help\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png\",\"contentUrl\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png\",\"width\":225,\"height\":225,\"caption\":\"Elementor\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/65dd358743d24ed396d4712d9a202727\",\"name\":\"rebeccaf\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6ff18bb42e24357444c8a154005b39919ea1a5078f8103605a2498825fe44b73?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6ff18bb42e24357444c8a154005b39919ea1a5078f8103605a2498825fe44b73?s=96&d=mm&r=g\",\"caption\":\"rebeccaf\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Understanding ARIA and Authoring Practices (APG) | Elementor","description":"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor's Knowledge Base. Get Elementor tips & more.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/","og_locale":"en_US","og_type":"article","og_title":"Understanding ARIA and Authoring Practices (APG) | Elementor","og_description":"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor's Knowledge Base. Get Elementor tips & more.","og_url":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/","og_site_name":"Help","article_published_time":"2025-07-09T07:00:11+00:00","author":"rebeccaf","twitter_card":"summary_large_image","twitter_misc":{"Written by":"rebeccaf","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/"},"author":{"name":"rebeccaf","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/65dd358743d24ed396d4712d9a202727"},"headline":"Understanding ARIA and Authoring Practices (APG)","datePublished":"2025-07-09T07:00:11+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/"},"wordCount":234,"publisher":{"@id":"https:\/\/elementor.com\/help\/#organization"},"articleSection":["Ally - Web Accessibility"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/","url":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/","name":"Understanding ARIA and Authoring Practices (APG) | Elementor","isPartOf":{"@id":"https:\/\/elementor.com\/help\/#website"},"datePublished":"2025-07-09T07:00:11+00:00","description":"Learn everything about Understanding ARIA and Authoring Practices (APG) in this article from Elementor's Knowledge Base. Get Elementor tips & more.","breadcrumb":{"@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/help\/understanding-aria-and-authoring-practices-apg\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Help Center","item":"https:\/\/elementor.com\/help\/"},{"@type":"ListItem","position":2,"name":"Plugins by Elementor","item":"https:\/\/elementor.com\/help\/plugins-by-elementor\/"},{"@type":"ListItem","position":3,"name":"Ally - Web Accessibility","item":"https:\/\/elementor.com\/help\/plugins-by-elementor\/web-accessibility\/"},{"@type":"ListItem","position":4,"name":"Understanding ARIA and Authoring Practices (APG)"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/help\/#website","url":"https:\/\/elementor.com\/help\/","name":"Elementor","description":"","publisher":{"@id":"https:\/\/elementor.com\/help\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/help\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/help\/#organization","name":"Elementor","url":"https:\/\/elementor.com\/help\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png","contentUrl":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png","width":225,"height":225,"caption":"Elementor"},"image":{"@id":"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/65dd358743d24ed396d4712d9a202727","name":"rebeccaf","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6ff18bb42e24357444c8a154005b39919ea1a5078f8103605a2498825fe44b73?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6ff18bb42e24357444c8a154005b39919ea1a5078f8103605a2498825fe44b73?s=96&d=mm&r=g","caption":"rebeccaf"}}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/68725","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/users\/58"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/comments?post=68725"}],"version-history":[{"count":1,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/68725\/revisions"}],"predecessor-version":[{"id":68726,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/68725\/revisions\/68726"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/media?parent=68725"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/categories?post=68725"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/tags?post=68725"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}