From 436255fb8127fa260b610fe7c130954f2b0dc964 Mon Sep 17 00:00:00 2001 From: Ari Stathopoulos Date: Mon, 11 Dec 2023 09:55:21 +0200 Subject: [PATCH 1/5] Split default rules to separate file --- accessibility-checker.php | 464 +------------------------------------- includes/rules.php | 303 +++++++++++++++++++++++++ 2 files changed, 304 insertions(+), 463 deletions(-) create mode 100644 includes/rules.php diff --git a/accessibility-checker.php b/accessibility-checker.php index cfbb5a1f..071b07ab 100644 --- a/accessibility-checker.php +++ b/accessibility-checker.php @@ -266,469 +266,7 @@ function edac_update_database() { * @return array */ function edac_register_rules() { - $rules = array(); - - array_push( - $rules, - array( - 'title' => 'Image Missing Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1927', - 'slug' => 'img_alt_missing', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Image Missing Alternative Text error means that your image does not have an alt attribute (alt="") contained in the image tag () at all. To fix an Image Missing Alternative Text error, you will need to add an alt tag to the image with appropriate text describing the purpose of the image in the page. If the image is decorative, the alt attribute can be empty, but the HTML alt="" tag still needs to be present.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Image Empty Alternative Text', - 'info_url' => 'https://a11ychecker.com/help4991', - 'slug' => 'img_alt_empty', - 'rule_type' => 'warning', - 'summary' => esc_html( 'An Image Empty Alternative Text warning appears if you have an image with an alt attribute (alt="") that is empty. Alternative text tells people who cannot see what the images is and adds additional context to the post or page. It is only correct for alternative text to be empty if the image is purely decorative, like a border or decorative icon. To fix an Image Empty Alternative Text warning, you need to determine if the image is decorative or if adds something meaningful to the page. If it is not decorative, you need to add appropriate alternative text to describe the image\'s purpose. If the image is decorative, then you would leave the alternative text blank and “Ignore” the warning.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Low-quality Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1977', - 'slug' => 'img_alt_invalid', - 'rule_type' => 'warning', - 'summary' => esc_html( 'A Low-quality Alternative Text warning appears when the alternative text on an image contains keywords that are unnecessary in alternative text (such as "image" or "graphic"), a file extension (such as .JPG), that may be describing a decorative image (such as "spacer" or "arrow"). To fix this warning, you will need to rewrite the alternative text for any images that flagged the Low-Quality Alternative Text warning, ensuring the alternative text is accurate, unique, contextually appropriate, and does not contain redundant or unnecessary descriptors. If the image is purely decorative, it is correct to leave the alternative text blank.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Linked Image Missing Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1930', - 'slug' => 'img_linked_alt_missing', - 'rule_type' => 'error', - 'summary' => esc_html( 'A Low-quality Alternative Text warning appears when the alternative text on an image contains keywords that are unnecessary in alternative text (such as "image" or "graphic"), a file extension (such as .JPG), that may be describing a decorative image (such as "spacer" or "arrow"). To fix this warning, you will need to rewrite the alternative text for any images that flagged the Low-Quality Alternative Text warning, ensuring the alternative text is accurate, unique, contextually appropriate, and does not contain redundant or unnecessary descriptors. If the image is purely decorative, it is correct to leave the alternative text blank.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Linked Image Empty Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1930', - 'slug' => 'img_linked_alt_empty', - 'rule_type' => 'error', - 'summary' => esc_html( 'A Linked Image Empty Alternative Text error appears when an image that is linked to a URL has an alt attribute (alt="") with nothing in it. Linked images must have accurate alternative text that describes where the link goes so that screen reader users know where the link is pointing. To resolve this error you need to add meaningful alt text to the image. Your alt text should describe the link purpose not what the image looks like.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Duplicate Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1976', - 'slug' => 'img_alt_redundant', - 'rule_type' => 'warning', - 'summary' => esc_html( '' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Incorrect Heading Order', - 'info_url' => 'https://a11ychecker.com/help1940', - 'slug' => 'incorrect_heading_order', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Incorrect Heading Order error means your heading structure has skipped over a level. For example, if your page structure has a level 3 heading (

) under a level 1 heading (

), an Incorrect Heading Order error will be flagged because there is no

tag between the H1 and H3. To fix incorrect heading order errors, you will need to either change the incorrect heading level to the correct heading level, or add content with the correct heading level in between the two already existing levels.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'iFrame Missing Title', - 'info_url' => 'https://a11ychecker.com/help1953', - 'slug' => 'iframe_missing_title', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Incorrect Heading Order error means your heading structure has skipped over a level. For example, if your page structure has a level 3 heading (

) under a level 1 heading (

), an Incorrect Heading Order error will be flagged because there is no

tag between the H1 and H2. To fix incorrect heading order errors, you will need to either change the incorrect heading level to the correct heading level, or add content with the correct heading level in between the two already existing levels.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Missing Subheadings', - 'info_url' => 'https://a11ychecker.com/help1967', - 'slug' => 'missing_headings', - 'rule_type' => 'warning', - 'summary' => esc_html( 'A warning about missing headings means that your post or page does not contain any heading elements (

) within the content of the post or page body section, which can make it especially difficult for screen reader users to navigate through the content on the page. To fix a page with no headings, you will need to add heading elements. At a minimum, every page should have one

tag, which is typically the page title. Add additional subheadings as appropriate for your content. If you have determined that headings are definitely not needed on the page, then you can “Ignore” the warning.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Text Justified', - 'info_url' => 'https://a11ychecker.com/help1980', - 'slug' => 'text_justified', - 'rule_type' => 'warning', - 'summary' => esc_html( 'A warning about missing headings means that your post or page does not contain any heading elements (

) within the content of the post or page body section, which can make it especially difficult for screen reader users to navigate through the content on the page. To fix a page with no headings, you will need to add heading elements. At a minimum, every page should have one

tag, which is typically the page title. Add additional subheadings as appropriate for your content. If you have determined that headings are definitely not needed on the page, then you can “Ignore” the warning.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Link Opens New Window or Tab', - 'info_url' => 'https://a11ychecker.com/help1982', - 'slug' => 'link_blank', - 'rule_type' => 'warning', - 'summary' => esc_html( 'A Link Opens New Window or Tab warning appears when there is a link on your website that has been set to open in a new tab or window when clicked. It is considered best practice to not open new tabs or windows with links. If links do open new tabs or windows, there must be a visual and auditory warning announcing that the link will open a new window or tab so that users will expect that behavior and know how to go back after clicking the link. To fix this warning, either change the link not to open in a new tab or ensure "opens new window" is included in the link text then "Ignore" the warning. To automatically add notices to all links on your site and dismiss all these warnings, install our free' ) . ' Accessibility New Window Warnings plugin. ', - ) - ); - - array_push( - $rules, - array( - 'title' => 'Image Map Missing Alternative Text', - 'info_url' => 'https://a11ychecker.com/help1938', - 'slug' => 'image_map_missing_alt_text', - 'rule_type' => 'error', - 'summary' => esc_html( 'The Image Map Missing Alternative Text error means that one of the elements within your image map does not have alternative text added in an alt="" attribute. To fix this error, you will need to add missing alt text to any area tags that do not have alt text. The alt text needs to describe the function of the link contained in the area, not necessarily describe what the area looks like.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Tab Order Modified', - 'info_url' => 'https://a11ychecker.com/help1974', - 'slug' => 'tab_order_modified', - 'rule_type' => 'warning', - 'summary' => esc_html( 'A Tab Order Modified Warning appears when the logical tab order on the page has been changed by adding an attribute for tabindex that is greater than 0 to an HTML element (for example, tabindex="1"). This can cause navigation issues for keyboard-only users. To resolve a Tab Order Modified warning you need to view the front end of your website on the page or post where the tab order has been modified and test to see if the modification is correct or not. If the tab order modification does not cause problems, then you can "Ignore" the warning. If the modified tab order causes information to be presented out of order, then you need to remove the tabindex attribute from the flagged element.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Empty Heading Tag', - 'info_url' => 'https://a11ychecker.com/help1957', - 'slug' => 'empty_heading_tag', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Empty Heading Tag error means that there is a heading tag present on your post or page that does not contain content. In code, this error would look like this:

. To fix an empty heading, you will need to add content to the heading tag that has flagged the Empty Heading Tag error or remove the empty tag if it is not needed on your page.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Empty Link', - 'info_url' => 'https://a11ychecker.com/help4108', - 'slug' => 'empty_link', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Empty Link error means that one of the links present on the web page is empty or contains no text describing where the link will go if clicked. This commonly occurs with links that contain webfonts, icon fonts, and SVGs, or when a link has accidentally been created in the content editor. To fix an empty link error, you will need to find the link that is being flagged and add descriptive text to it. You will need to either: add text content within an empty element or, if your link contains an SVG or Webfont icon, hide that element with aria-hidden="true" and add an aria-label attribute to the tag or screen reader text. The text or label you add should be descriptive of wherever the link points and not ambiguous.' ), - ) - ); - - array_push( - $rules, - array( - 'title' => 'Empty Button', - 'info_url' => 'https://a11ychecker.com/help1960', - 'slug' => 'empty_button', - 'rule_type' => 'error', - 'summary' => esc_html( 'An Empty Button error means that one of the buttons present on the web page is empty or contains no text describing the function of the button. Or, if it’s an image button, the image contained in the button is missing alternative text. To fix an empty button error, you will need to find the button that is being flagged and add descriptive text to it. You will need to either: add text content within an empty