Reformat methods

explainer/index.html

@@ -161,7 +161,7 @@ <h3>Structure of these guidelines</h3>
 				<p>Some of these sections are in this document. You can find others in links within the sections.</p>
 			</details>
 			<figure id="guidelines-structure-diagram" aria-labelledby="guidelines-structure-description" class="figure-float">
-				<img src="../guidelines/img/structure-core.svg" />
+				<img alt="" src="../guidelines/img/structure-core.svg" />
 				<figcaption>Core Structure</figcaption>
 			</figure>
 			<p><a href="#guidelines-structure-diagram">Figure 1</a> shows <span id="guidelines-structure-description">the core structure of WCAG 3.0. WCAG 3.0 has three levels of content with associated documentation. Guidelines form the top level. Each guideline contains multiple outcomes, with associated critical errors and outcomes scoring. Each outcome contains multiple methods, with an associated description and examples, tests, and test scoring.</span></p>
@@ -199,7 +199,7 @@ <h4>Outcome rating</h4>
 				<section>
 					<h3>Methods structure</h3>
 					<figure id="method_screenshot" aria-labelledby="method_screenshot_description" class="figure-float screenshot">
-						<img src="../guidelines/img/method.png" />
+						<img alt="" src="../guidelines/img/method.png" />
 							<figcaption>Screenshot of a Method for Structured Content</figcaption>
 					</figure>
 					<p>Each outcome has one or more <a href="#methods-structure">methods</a>. There are three types of methods:</p>
@@ -252,14 +252,14 @@ <h4>Additional Documentation and Scoring Information</h4>
 
 		<p>The core structure has inter-relationships with supporting documents and the scoring process. <span id="guidelines--full-structure-description"> Functional needs inform both outcomes and functional categories. The tests within methods are used to inform the scores for each outcome. Then outcome scores are aggregated to create scores by functional category and an overall score. These then result in a bronze rating.  Silver and gold ratings build on the bronze rating to demonstrate improved accessibility. General information about guidelines is available in How To documents. </span></p>
 			<figure id="guidelines-full-structure-diagram" aria-labelledby="guidelines--full-structure-description" class="figure-full">
-				<img src="../guidelines/img/structure-scoring.svg" />
+				<img alt="" src="../guidelines/img/structure-scoring.svg" />
 				<figcaption>Documentation and Scoring Structure</figcaption>
 			</figure>
 				<section>
 					<h3>How tos</h3>
 					<p>The <a>How-To</a> content provides explanatory material for each guideline that applies across technologies. This guidance explains how to apply the concepts presented in the guidelines for non-technical readers. This plain language resource includes information on getting started, who the guideline helps and how, as well information for project managers, designers and developers.  </p>
 					<figure id="howTo_screenshot" aria-labelledby="howTo_screenshot_description" class="figure-float screenshot">
-						<img src="../guidelines/img/how-to.png" />
+						<img alt="" src="../guidelines/img/how-to.png" />
 							<figcaption>Example screenshot of a How-To for Structured Content</figcaption>
 					</figure>
 					<p id="howTo_screenshot_description">The example of a How-To for Structured Content provides basic information organized by tabs to help people get started with accessibility for structured content, plan for implementing accessible structured content across a project, design accessible structured content, and basics for developers new to accessibility of structured content. It also includes information on examples, the outcomes for meeting the guideline, and resources.</p>

methods/audio-metadata/index.html

@@ -10,11 +10,11 @@ <h1>Provides visual equivalent of speech and non-speech audio metadata</h1>
 		<main>
 		<!-- This list is for editorial convenience and will be converted to tabs by the generator -->
 		<ul>
-			<li><a href="intro.html">Introduction</a></li>
 			<li><a href="description.html">Description</a></li>
+			<li><a href="background.html">Background</a></li>
 			<li><a href="examples.html">Examples</a></li>
 			<li><a href="tests.html">Tests</a></li>
-			<li><a href="resources.html">Resources</a></li>
+			<li><a href="glossary.html">Glossary</a></li>
 		</ul>
 		</main>
 		<footer>

methods/caption-reflow/resources.html → methods/caption-reflow/background.html

@@ -24,6 +24,18 @@ <h2>Non-W3C Resources</h2>
 					<li><a href="https://www.bbc.co.uk/rd/blog/2014-10-tvx2014-short-paper-enhancing-subtitles">Enhancing Subtitles - BBC</a></li>
 				</ul>
 			</section>
+			<section id="accsupport">
+                <h2>Accessibility Support</h2>
+                <p> to be written
+                </p>                
+            </section>
+            <section id="assumptions">
+                <h2>Assumptions</h2>
+                <ul>
+                    <li>To be written [assumptions]</li>
+                </ul>    
+            </section>
+
 		</main>
 	</body>
 </html>

methods/caption-reflow/description.html

@@ -9,28 +9,50 @@ <h1>Description</h1>
 		</header>
 		<main>
 			<section id="outcome">
-				<h2>Outcome and Functional Categories</h2>
+				<h2>Outcome</h2>
 				<p>This method supports the outcome <a href="https://www.w3.org/WAI/GL/WCAG3/2020/outcomes/conveys-information-about-the-sound">Conveys information about the sound</a>.</p>
 				<p>Applies to immersive environments that support text equivalents (such as captions or transcripts) of audio track. </p>
 			</section>
-			<section id="details">
-				<h2>Detailed description</h2>
-				<section>
-				<h3>Maintaining reflow context in XR for Captions</h3>
+			<section id="platform">
+				<h2>Platform</h2>
+				<ul>
+					<li>Media players</li>
+					<li>Immersive technology engines</li>
+				</ul>
+			</section>
+			<section id="technology">
+				<h2>Technology</h2>
+				<ul>
+					<li>Media</li>
+					<li>XR</li>
+				</ul>
+			</section>
+			<section id="input_aspects">
+                <h2>Input aspects for testing</h2>
+                <ul>
+                    <li>To be completed. [technical sources for input, such as DOM tree, Accessibility tree and CSS styling]</li>
+                </ul>
+            </section>
+			<section id="summary">
+				<h2>Summary</h2>
+				<p>Users with vision impairments may need to resize or reflow captions, 
+					subtitling or other text. It is important that caption, subtitling or text can reflow (in context) 
+					within an XR environment without loss of information, context or functionality.
+					</p>
 				<p>Content should not lose its context. This means that when captioning is related to speech they maintain their relationship with the source. If captioned text within the environment needs to be moved there is a persistent parent / child relationship between the related source and the related caption that enables either to be moved or other transformations to take place.</p>
 				<p>See <a href="https://github.com/w3c/silver/issues/139">https://github.com/w3c/silver/issues/139</a> for example of traditional content in XR environment</p>
-				</section>
-				<section>
-				<h3>Anti-Aliasing or use of vector graphics of Captions</h3>
 				<p>Depending on the environment - Captions should be resized without loss of quality. This may mean anti-aliasing options need to be available in XR or requiring the use of vector style graphics for captions and other text, which means they will resize more easily without loss of quality.</p>
 				</section>
 			</section>
-			<section id="dependencies">
-				<h2>Dependencies</h2>
+			<section id="user-need">
+				<h2>How it solves user need</h2>
+				<p>People can choose a font format or size of their choice or use a mechanism with accessible affordances. This will allow them to resize and reflow text without either hiding or obscuring the content or substantial loss of context. The means of choice can be via (choose at least one): </p>
 				<ul>
-					<li><p>None.</p> </li>
+					<li>user preference</li>
+					<li>personalization</li>
+					<li>other customisation setting</li>
 				</ul>
 			</section>
 		</main>
 	</body>
-</html>
+</html>

methods/caption-reflow/examples.html

@@ -8,15 +8,29 @@
 			<h1>Examples</h1>
 		</header>
 		<main>
-			<section class="example">
-				<h3>Example 1</h3>
+			<section id="passed">
+        <h2>Passed</h2>
+            <section class="example">
+                <h3>Example 1</h3>
 				<p>A conversation is taking place between a group of people at a virtual  meeting and a deaf user is tracking this discussion - there may be colour coding to distinguish the speakers and the caption colours may be related.</p>
 
 				<p>The deaf user may later wish to explore the environment or look at some thing - and therefore move focus from the speakers but dock the captions, or keep them in some bespoke view. Therefore the speaker source and ‘their’ captions relationship can be maintained.</p>
 
 				<p class="ednote">This relationship maybe as simple as a text saying ‘Speaker name: Lorraine’, ‘Speaker name: Ruairi’ or similar. Or could be provided in markup. Providing the association of ‘source/caption’  in markup would allow greater movement, and further potential transformations.</p>
-
-			</section>
+            </section>
+        </section>
+        <section id="failed">
+        <h2>Failed</h2>
+            <section class="example">
+                <p>To be written</p>
+            </section>
+        </section>
+        <section id="inapplicable">
+        <h2>Inapplicable</h2>
+            <section class="example">
+                <p>To be written</p>
+            </section>
+		</section>
 		</main>
 	</body>
 </html>

methods/caption-reflow/glossary.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+	<head>
+		<title>Method - Glossary</title>
+	</head>
+	<body>
+		<header>
+			<h1>Glossary</h1>
+		</header>
+		<main>
+			<section id="[term]-def">
+				<h2>[term]</h2>
+				<p>[definition] To be completed. </p>
+			</section>
+		</main>
+	</body>
+</html>

methods/caption-reflow/index.html

@@ -10,11 +10,12 @@ <h1>Caption reflow</h1>
 		<main>
 		<!-- This list is for editorial convenience and will be converted to tabs by the generator -->
 		<ul>
-			<li><a href="intro.html">Introduction</a></li>
 			<li><a href="description.html">Description</a></li>
+			<li><a href="background.html">Background</a></li>
 			<li><a href="examples.html">Examples</a></li>
 			<li><a href="tests.html">Tests</a></li>
-			<li><a href="resources.html">Resources</a></li>
+			<li><a href="glossary.html">Glossary</a></li>
+
 		</ul>
 		</main>
 		<footer>
@@ -26,6 +27,7 @@ <h2>Status</h2>
 				<h2>Change Log</h2>
 				<ul>
 					<li>2020-09-10: Draft</li>
+					<li>2021-09-22: Reformatted to ACT Method design</li>
 				</ul>
 			</section>
 		</footer>

methods/caption-reflow/intro.html

@@ -8,6 +8,11 @@
 			<h1>Introduction</h1>
 		</header>
 		<main>
+			<section id="outcome">
+				<h2>Outcome and Functional Categories</h2>
+				<p>This method supports the outcome <a href="https://www.w3.org/WAI/GL/WCAG3/2020/outcomes/conveys-information-about-the-sound">Conveys information about the sound</a>.</p>
+				<p>Applies to immersive environments that support text equivalents (such as captions or transcripts) of audio track. </p>
+			</section>
 			<section id="platform">
 				<h2>Platform</h2>
 				<ul>
@@ -22,12 +27,22 @@ <h2>Technology</h2>
 					<li>XR</li>
 				</ul>
 			</section>
+			<section id="input_aspects">
+                <h2>Input aspects for testing</h2>
+                <ul>
+                    <li>To be completed. [technical sources for input, such as DOM tree, Accessibility tree and CSS styling]</li>
+                </ul>
+            </section>
 			<section id="summary">
 				<h2>Summary</h2>
 				<p>Users with vision impairments may need to resize or reflow captions, 
 					subtitling or other text. It is important that caption, subtitling or text can reflow (in context) 
 					within an XR environment without loss of information, context or functionality.
 					</p>
+				<p>Content should not lose its context. This means that when captioning is related to speech they maintain their relationship with the source. If captioned text within the environment needs to be moved there is a persistent parent / child relationship between the related source and the related caption that enables either to be moved or other transformations to take place.</p>
+				<p>See <a href="https://github.com/w3c/silver/issues/139">https://github.com/w3c/silver/issues/139</a> for example of traditional content in XR environment</p>
+				<p>Depending on the environment - Captions should be resized without loss of quality. This may mean anti-aliasing options need to be available in XR or requiring the use of vector style graphics for captions and other text, which means they will resize more easily without loss of quality.</p>
+				</section>
 			</section>
 			<section id="user-need">
 				<h2>How it solves user need</h2>

methods/caption-reflow/tests.html

@@ -8,22 +8,32 @@
 			<h1>Tests</h1>
 		</header>
 		<main>
-			<section id="atomic">
-				<h2>Atomic Tests</h2>
+			<section id="get_started">
+                <h2>Get Started</h2>
+                <p>To be written</p>
+            </section>
+            <section id="summary">
+                <h2>Summary</h2>
+                <p>To be written [overview of the test]</p>
+            </section>
+            <section id="applicability">
+                <h2>Applicability</h2>
+                <p>To be written: This outcome applies to any [element names] element that is [condition] and for which one of the following is true:
+                <dl>
+                    <dt>{excluded, ignored, exception}</dt>
+                    <dd>[element]
+                </dl>
+            </section>
+            <section id="expectations">
+                <h2>Expectations</h2>
+                <p>To be written. [detail of the expectation] Tests from First Public Working Draft: </p>
 				<ul>
 					<li>Check that there is support for captioning and subtitling of multimedia content.</li>
 					<li>Check that there is support for reflow of captions and other text.</li>
 					<li>Check that a mechanism exists to reveal further text within the XR environment without the need to scroll.</li>
 					<li>Check that there are semantics present that define context and relationships between related captions, subtitles and their source.</li>
 					<li>Check that where captions and other text may be placed on a second screen, context and source information is maintained.</li>
 				</ul>
-			</section>
-			<section id="holistic">
-				<h2>Holistic Tests</h2>
-				<ul>
-					<li>Still to be developed. We will include this in a future working draft. </li>
-				</ul>
-			</section>
 		</main>
 	</body>
 </html>

methods/clear-words/index.html

@@ -10,11 +10,11 @@ <h1>Clear words</h1>
 		<main>
 		<!-- This list is for editorial convenience and will be converted to tabs by the generator -->
 		<ul>
-			<li><a href="intro.html">Introduction</a></li>
 			<li><a href="description.html">Description</a></li>
+			<li><a href="background.html">Background</a></li>
 			<li><a href="examples.html">Examples</a></li>
 			<li><a href="tests.html">Tests</a></li>
-			<li><a href="resources.html">Resources</a></li>
+			<li><a href="glossary.html">Glossary</a></li>
 		</ul>
 		</main>
 		<footer>

methods/clear-words/intro.html

@@ -1,13 +1,17 @@
 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml">
 	<head>
-		<title>Method - Introduction</title>
+		<title>Method - Description</title>
 	</head>
 	<body>
 		<header>
-			<h1>Introduction</h1>
+			<h1>Description</h1>
 		</header>
 		<main>
+			<section id="outcome">
+				<h2>Outcome</h2>
+				<p>This method supports the outcome: <a href="../../outcomes/common-clear-words.html" class="outcome-link">Common clear words</a></p>
+			</section>
 			<section id="platform">
 				<h2>Platform</h2>
 				<ul>
@@ -23,11 +27,26 @@ <h2>Technology</h2>
 			<section id="summary">
 				<h2>Summary</h2>
 				<p>Clear words help create more accessible content for people with cognitive and learning disabilities.  Use words or phrases that are most-frequently used for the current context, unless it will result in a loss of meaning or clarity. </p>
+
+				<p><strong>Clear and common words:</strong> Use words or phrases that are most-frequently used for the current context, unless it will result in a loss of meaning or clarity. This includes not using abbreviations, words, or phrases, unless they are the common form to refer to concepts for beginners. Where word frequencies are known for the context, they can be used. An example would be the <a href="https://learnersdictionary.com/3000-words">Merriam Webster 3000 Core English Vocabulary Words</a>. </p>
+				<p>Even languages with a small number of users have published lists of most-frequent words (such as Hebrew). If there is a natural language that does not have such a list, algorithms exist that calculate these lists for languages, or for specific contexts. Testing content against these word lists can be done manually. </p>
+				<p><strong>Define unusual words:</strong> It is best to define technical or jargon words in context so that the user does not have to navigate away from the text to a glossary in a different location. There are a variety of possible solutions for defining words in context, including the use of a pop-up definition. </p>
+				<p><strong>Provide a glossary:</strong> A glossary is typically an alphabetical list of terms related to a given set of content. </p>
 			</section>
 			<section id="user-need">
 				<h2>How it solves user need</h2>
 				<p>Using clear and common words makes content easier to read and to understand.  </p>
 			</section>
+			<section id="input_aspects">
+                <h2>Input aspects for testing</h2>
+                <ul>
+                    <li>Not written [technical sources for input, such as DOM tree, Accessibility tree and CSS styling]</li>
+                </ul>
+            </section>
+			<section id="when-to-use">
+				<h2>When to use</h2>
+				<p>Not written yet {when the method should or should not be used}</p>
+			</section>
 		</main>
 	</body>
 </html>