FamilySearch Wiki:WCAG Required Changes to Wikitext Code: Difference between revisions

From FamilySearch Wiki
VisualWikitext
(summary)
(Created page with "==Changes to Wiki Pages== As a result of the European Union requirment to implement changes to all website to improve accessibility, the Research Wiki has gone under massive changes to comply and provide a better experience to those that use accessibility readers. ==Contributing to the Wiki== Certain wikitext coding used for articles in the past can no longer be used. Some of these changes include: *'''Headings.''' Wiki pages now require a heading 2 before any free text...")
(21 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{breadcrumb
| link1=[[FamilySearch Wiki:Manual of Style|Wiki Manual of Style]]
| link2=
| link3=
| link4=
| link5=[[FamilySearch Wiki:WCAG Required Changes to Wikitext Code|WCAG Required Changes to Wikitext Code]]
}}
==Changes to Wiki Pages==
==Changes to Wiki Pages==
As a result of the European Union requirement to implement changes to all websites to improve accessibility, the Research Wiki has made changes to comply and provide a better experience to those that use accessibility readers. For more information, visit the [https://www.w3.org/TR/WCAG21/ Web Content Accessibility Guidelines (WCAG) 2.1] website.
As a result of the European Union requirment to implement changes to all website to improve accessibility, the Research Wiki has gone under massive changes to comply and provide a better experience to those that use accessibility readers.
*See [[FamilySearch Wiki:WCAG Checklist|WCAG Checklist]] for a quick review of necessary changes.
==Summary of New Requirements==
Certain wikitext coding previously used for Wiki articles can no longer be used and must be changed. Some of these changes include:


===Checked by Lighthouse===
==Contributing to the Wiki==
Certain wikitext coding used for articles in the past can no longer be used. Some of these changes include:
*'''Headings.''' Wiki pages now require a heading 2 before any free text on a Wiki page. (breadcrumbs and SEO paragraphs do not count).  
*'''Headings.''' Wiki pages now require a heading 2 before any free text on a Wiki page. (breadcrumbs and SEO paragraphs do not count).  
**Example: Replace all Heading 3s found as the first heading on a Wiki page to Heading 2.
<br><br>
*'''Use of indention on a Wiki page.''' Wiki pages can no longer with a colon to indent (i.e., <nowiki>:*</nowiki> or <nowiki>::</nowiki> on a Wiki page. This also includes indenting a bullet. The use of a indent template is required. For more information go to: [[Template:Block indent]].
 
**Example: <nowiki>**</nowiki> used to indent an asterisk. We can no longer use <nowiki>:* </nowiki> or <nowiki>::* </nowiki>
Example: Replace all Heading 3s found as the first heading on a Wiki page.
**Example: Proper use of template to indent text:<nowiki>{{Block indent|Clerk of the Senate}}</nowiki>
<br><br>
*'''Font Color.''' Font on a page should be either black (text) or blue (URL links). All other colors of font interfere with contrast ratio and will not pass.
**'''Red links.''' Any red links on a Wiki page bring up the error: "Background and foreground colors do not have a sufficient contrast ratio." The goal is to remove all red links.
*'''Alt Text.''' All images are to include alt text within the link of the image describing what the image.
**Example: <nowiki>[[Image:Akershus-Norway.jpg|thumb|200px|alt=Akershus locator map]]</nowiki>
*'''Navigation boxes.''' Although used heavily in the beginning of the Wiki, navigation boxes present difficultly in providing enough space between links to allow ease in clicking on the link. They do not pass WCAG guidelines. Thus, all navigation boxes will be removed from Wiki pages.
*'''<nowiki><ul></nowiki> lists.''' Any Wiki page that uses <nowiki><ul></nowiki> class must to be checked to make sure it is correct.*'''Update Tables.''' All tables must be updated to the correct wikitext coding to display the content. These changes include:
**'''Title of Table.''' All tables should have a title to help explain the purpose of the table. It can be added to the table using <nowiki>|+ </nowiki> directly below the class of the table. Or can be a heading or text directly above the table.
***Example: [[FamilySearch Wiki:Manual of Style-Tables#Wikitext|Wikitext of a wikitable]]
**'''Colors of cells in tables.''' Colors can enhance the readability of a table. However, the color must have a proper contrast for those with color blindness. Hyperlinks (blue text) must also pass the contrast test in addition to the black text. See [[FamilySearch Wiki:WCAG Acceptable Table Colors|WCAG Acceptable Table Colors]] for more information.
**'''Identify columns and rows.''' Additional code must be added to a table to identify to the screen reader column headings and row headings.
***Example: Below is a sample of a table with the correct wikitext code for column and row headings:
<nowiki>{| class="wikitable"</nowiki>
<nowiki>|+ Main Characters of Star Trek: The Original Series</nowiki>
<nowiki>|-</nowiki>
<nowiki>! scope="col" | Rating</nowiki>
<nowiki>! scope="col" | Rank</nowiki>
<nowiki>! scope="col" | Name</nowiki>
<nowiki>! scope="col" | Actor</nowiki>
<nowiki>|-</nowiki>
<nowiki>! scope="row" | Captain</nowiki>
<nowiki>| Captain || Kirk, James T || William Shatner</nowiki>
<nowiki>|-</nowiki>
<nowiki>! scope="row" | First Officer</nowiki>
<nowiki>| Commander || Spock || Leonard Nimoy</nowiki>
<nowiki>|-</nowiki>
<nowiki>! scope="row" | Chief Medical Officer </nowiki>
<nowiki>| Lt Commander || Leonard McCoy || DeForest Kelley</nowiki>
<nowiki>|-</nowiki>
<nowiki>! scope="row" | Chief Engineer</nowiki>
<nowiki>| Lt Commander || Montgomery Scott || James Doohan</nowiki>
<nowiki>|}</nowiki><br>


===Lighthouse Does Not Check - Do Manually===
*'''Use language template.''' To signify to a screen reader that the word it is reading is in a different language, a template must be added around each foreign language word.
*'''Use of color on a table to indicate information.''' Because of the limitations of a screen reader, color cannot be distinguished to the user. Thus, there is no communication of what the color represents. The table should be revamped to add text to convey the information.
<br><br>
**Example: incorrect=[[England_Church_Records#Major_Resources|England Church Records table]]
Example: ''We do not have a template in the Wiki to support this endeavor. For now it is on hold.''  
*'''Wikitable Class.''' All tables should be changed to wiki wikitable class. Additional guidance can be found on [[FamilySearch_Wiki:Manual_of_Style-Tables|Manual of Style-Tables]].
<br><br>
**Examples: <nowiki>class="wikitable"</nowiki>; <nowiki>class="wikitable sortable"</nowiki>
*'''ON HOLD UNTIL TEMPLATE CREATED! Use language template.''' To signify to a screen reader that the word it is reading is in a different language, code must be added around each foreign language word to indict language.  
**Example: ''We do not have a template in the Wiki to support this endeavor. For now it is on hold.''  
*'''"Click here" or "Link".''' All links in the Wiki must identify where the link is going. Do not use "click here" or "Link" as the label of a link.


===Not Passing in Lighthouse:===
*'''<nowiki><ul></nowiki> lists.''' There is incorrect wikitext code on Wiki pages incorrectly using the <nowiki><ul></nowiki> class.
*'''Internal Links.''' Blue internal links are not passing because of "Links rely on color to be distinguishable." However, after extensive research and testing, it was determined MediaWiki makes all internal links underlined when hovering over the link. Screen readers recognize this as a link and inform the users. No action required.
<br><br>
<br>
*'''Update Tables.''' All tables must be updated to the correct wikitext coding to display the content. These changes include:
<br>
**
**'''Identify columns and rows.''' Additional code must be added to a table to identify to the reader column headings and row headings.
<br><br>
Example: Below is a sample of a table with the correct wikitext code for column and row headings:
<nowiki>{| class="wikitable"</nowiki><br>
<nowiki>|+ Main Characters of Star Trek: The Original Series</nowiki><br>
<nowiki>|-</nowiki><br>
<nowiki>! scope="col" | Rating</nowiki><br>
<nowiki>! scope="col" | Rank</nowiki><br>
<nowiki>! scope="col" | Name</nowiki><br>
<nowiki>! scope="col" | Actor</nowiki><br>
<nowiki>|-</nowiki><br>
<nowiki>! scope="row" | Captain</nowiki><br>
<nowiki>| Captain || Kirk, James T || William Shatner</nowiki><br>
<nowiki>|-</nowiki><br>
<nowiki>! scope="row" | First Officer</nowiki><br>
<nowiki>| Commander || Spock || Leonard Nimoy</nowiki><br>
<nowiki>|-</nowiki><br>
<nowiki>! scope="row" | Chief Medical Officer </nowiki><br>
<nowiki>| Lt Commander || Leonard McCoy || DeForest Kelley</nowiki><br>
<nowiki>|-</nowiki><br>
<nowiki>! scope="row" | Chief Engineer</nowiki><br>
<nowiki>| Lt Commander || Montgomery Scott || James Doohan</nowiki><br>
<nowiki>|}</nowiki><br>


<br><br>
**'''Use of color on a table to indicate information.''' Because of the limitations of a screen reader, color cannot be distinguished to the user. Thus, there is no communication of what the color represents.
<br><br>
Example: [[England_Church_Records#Major_Resources|England Church Records table]]
<br><br>


[[Category:Wiki Administration]]
*'''Use of indention on a Wiki page.''' Wiki pages can no longer with a colon to indent on a Wiki page. This also includes indenting a bullet. The use of a indent template is required. For more information go to: [[Template:Block indent]].
<br><br>
Example: <nowiki> ** </nowiki> used to indent an asterisk.
Example: Proper use of template to indent text:<nowiki>{{Block indent|Clerk of the Senate}}</nowiki>
<br><br>

Revision as of 15:10, 11 August 2025

Changes to Wiki Pages[edit | edit source]

As a result of the European Union requirment to implement changes to all website to improve accessibility, the Research Wiki has gone under massive changes to comply and provide a better experience to those that use accessibility readers.

Contributing to the Wiki[edit | edit source]

Certain wikitext coding used for articles in the past can no longer be used. Some of these changes include:

  • Headings. Wiki pages now require a heading 2 before any free text on a Wiki page. (breadcrumbs and SEO paragraphs do not count).



Example: Replace all Heading 3s found as the first heading on a Wiki page.

  • Use language template. To signify to a screen reader that the word it is reading is in a different language, a template must be added around each foreign language word.



Example: We do not have a template in the Wiki to support this endeavor. For now it is on hold.

  • <ul> lists. There is incorrect wikitext code on Wiki pages incorrectly using the <ul> class.



  • Update Tables. All tables must be updated to the correct wikitext coding to display the content. These changes include:
    • Identify columns and rows. Additional code must be added to a table to identify to the reader column headings and row headings.



Example: Below is a sample of a table with the correct wikitext code for column and row headings: {| class="wikitable"
|+ Main Characters of Star Trek: The Original Series
|-
! scope="col" | Rating
! scope="col" | Rank
! scope="col" | Name
! scope="col" | Actor
|-
! scope="row" | Captain
| Captain || Kirk, James T || William Shatner
|-
! scope="row" | First Officer
| Commander || Spock || Leonard Nimoy
|-
! scope="row" | Chief Medical Officer
| Lt Commander || Leonard McCoy || DeForest Kelley
|-
! scope="row" | Chief Engineer
| Lt Commander || Montgomery Scott || James Doohan
|}



    • Use of color on a table to indicate information. Because of the limitations of a screen reader, color cannot be distinguished to the user. Thus, there is no communication of what the color represents.



Example: England Church Records table

  • Use of indention on a Wiki page. Wiki pages can no longer with a colon to indent on a Wiki page. This also includes indenting a bullet. The use of a indent template is required. For more information go to: Template:Block indent.



Example: ** used to indent an asterisk. Example: Proper use of template to indent text:{{Block indent|Clerk of the Senate}}

Retrieved from "https://integration-ru.familysearch.org/en/wiki/index.php?title=FamilySearch_Wiki:WCAG_Required_Changes_to_Wikitext_Code&oldid=6384103"