GithubHelp home page GithubHelp logo

wai-eval-overview's Introduction

Netlify Status

wai-eval-overview's People

Contributors

hidde avatar remibetin avatar shawna-slh avatar stevealee avatar yatil avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

wai-eval-overview's Issues

[translations] [med] add French VTTs and update all

Note: {lang} = French in this issue. I'm leaving it so we can use this for future lang updates. :-)

  • translators synch vtt and transcript tables in:
    • Eval Overview
    • Planning and Policy Overview
    • Involving Users in Eval
    • (n/a for now) Involving Users in Projects
    • (n/a for now) Easy Checks
    • Conformance Overview
    • Eval Tools Overview
  • upload 5 to YouTube
  • upload 5 to Eval Overview repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Involving Users in Eval repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Involving Users in Projects repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • (n/a for now) add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Planning and Policy Overview repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Conformance Overview repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Eval Tools Overview repo
    • in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • add to changelog
      • inform existing translators to update (or update other translations ourselves)
  • upload 1 to Easy Checks repo
    • (n/a for now) in {lang} add to code, change default, update transcript table, update 2 dates
    • in EN, add to code, update 2 dates
    • (n/a for now) add to changelog
      • (n/a for now) inform existing translators to update (or update other translations ourselves)

[es] update needed

Hi @rumoroso

We will be promoting translations the week of 17 May, along with Global Accessibility Awareness Day (GAAD).

Would you be able to update this translation? Or, should we ask someone else to update it?

https://raw.githubusercontent.com/w3c/wai-eval-overview/master/content/index.es.md

I added the new text in English:

We have someone translating the subtitle file -- which is the same as the first column in the table. So you could use that when it's done. :-) Let me know what questions you have.

videos - thumbnails & posters

Proposal for static screen & "poster" & "thumbnails":

  1. Resources Overview
    video-thumb-resources-overview

  2. Easy Checks
    (with better contrast of lightbulb - update from new video with contrast fixed)
    video-thumb-easy-checks

  3. Tools
    (except with the tools not black - update from new video with contrast fixed)
    video-thumb-tools

  4. Conformance
    video-thumb-conformance

  5. Involving Users
    video-thumb-involving-users

videos - links to alternative video & descriptive transcript

What:

  • link to alternative version on the W3C sever (for those who cannot get YouTube)
  • link to descriptive transcript

Proposal for Eval Overview page:

  • Under the video, there is a link:

Alternatives for Video Introduction - Resources Overview

  • It goes to h2 at end of page #alternatives
  • above that h2 is an hr (to separate it from the main content of the page)
  • h2 #alternatives is:

Alternatives for Video Introduction - Resources Overview

  • It is ex-col - collapsed by default (and expanded if you follow a link to it)
  • Right under the h2 is a plain paragraph:

Video Introduction - Resources Overview on a W3C server (file format: MP4, file size: 28MB)

  • Under that is h3:

Text Transcript with Description of Visuals for Video Introduction - Resources Overview


Proposal for Tools Overview page & Conformance Overview page:

  • Under the video, there is a link:

Alternatives for Video Overview

  • It goes to h2 at end of page #alternatives
  • above that h2 is an hr (to separate it from the main content of the page)
  • h2 #alternatives is:

Alternatives for Video Overview

  • It is ex-col - collapsed by default (and expanded if you follow a link to it)
  • Right under the h2 is a plain paragraph:

Video Overview on a W3C server (file format: MP4, file size: 28MB)

  • Under that is h3:

Text Transcript with Description of Visuals for VideoOverview

Videos only load on demand

Maybe for future iteration, the videos are not shown by default and there is a big, clear button to show them? That is, they are not loaded at all unless the user asks for them.

Pros:

  • Would decrease page load

Cons:

  • would add more UI for everyone
  • a little more user interaction needed to see the videos
  • videos not as apparent, could be missed

Add evaluation videos

This describes the work (done and to do) for deploying the evaluation videos to the WAI website.

Some of the work is done in other repositories, keeping track of it in this issue for sanity.

Add videos to evaluation overview page (in w3c/wai-eval-overview)

Preview of evaluation overview page

  • Add AblePlayer floated right, open, with underneath a link to text transcript that lives in an expand collapse, that is collapsed by default, at the bottom of this page
  • Include transcript from wiki
  • Shawn - Supply correct YouTube URL for Overview video (placeholder ones for now -- replace with news ones when get)
  • Include correct YouTube URL for Overview video (placeholder ones for now -- replace with news ones when get)
  • Link to video file on W3C server
  • Create new reusable ‘video card’ component: includes support for a HTML <video> with video and captions, plus a link to accessible version, floats right on larger screens, clears float via following h2 and aside
  • include poster image for later 4 using HTML5 video

Add right floated video players (<video>) with links to more accessible versions on underlying pages

screenshot of initial checks header and content with player floated on right

  • get (or convert) VTT files (instead of srt)
  • Initial Checks / Preliminary Evaluation to /WAI/test-evaluate/preliminary/, with video and captions http://media.w3.org/wai/evaluation-intros/easy-checks-accessibility-cc.srt and http://media.w3.org/wai/evaluation-intros/easy-checks-accessibility.mp4
  • Tools to /WAI/test-evaluate/tools/ with video http://media.w3.org/wai/evaluation-intros/tools-for-evaluating.mp4 and captions http://media.w3.org/wai/evaluation-intros/tools-for-evaluating-cc.srt
  • Conformance Evaluation to /WAI/test-evaluate/conformance/. with video http://media.w3.org/wai/evaluation-intros/conformance-evaluation.mp4 and captions http://media.w3.org/wai/evaluation-intros/conformance-evaluation-cc.srt
  • People to /WAI/test-evaluate/involving-users/ with video http://media.w3.org/wai/evaluation-intros/involving-users.mp4 and captions http://media.w3.org/wai/evaluation-intros/involving-users-cc.srt

Add videos to evaluation tools overview page (in w3c/wai-eval-tools-overview)

Preview of Tools Overview Page

  • Add AblePlayer floated right, open, with underneath a link to text transcript that lives in an expand collapse, that is collapsed by default, at the bottom of this page (as described in #19)
  • [maintenance] add Netlify to wai-eval-tools-overview repository, fix the build
  • Use correct YouTube URL -- replace when we get them

Add videos to conformance overview page (in w3c/wai-conformance-eval-overview)

Preview of Conformance Overview Page

  • Add AblePlayer floated right, open, with underneath a link to text transcript that lives in an expand collapse, that is collapsed by default, at the bottom of this page (as described in #19)
  • [maintenance] add Netlify to wai-conformance-eval-overview repository, fix the build
  • Use correct YouTube URL -- replace when we get them

Add videos to sub pages

On sub pages, the video will display under the first heading, in an expand collapse, labelled: Video: [name of video].

Screenshot 2020-03-05 at 11 12 40

It is closed by default.

Inside the collapsing part, there is:

  • AblePlayer instance with video hosted on YouTube
  • Expand collapse with a text transcript taken from wiki

Video: “Preliminary Evaluation” / Easy Checks / Initial Checks

Prepare:

List on pages:

  • Easy Checks
  • Ensure this uses final versions of: YouTube ID, link to video on W3C server, link to captions, transcript and thumbnail image

Video: “Selecting and Using Tools” / Tools

Prepare:

  • Create thumbnail
  • Upload to W3C media server
  • Upload to YouTube, URL: @@
  • Upload caption
  • Upload text transcript

List on pages:

  • Selecting Tools
  • Ensure this uses final versions of: YouTube ID, link to video on W3C server, link to captions, transcript and thumbnail image

Video: “Comprehensive Evaluation” / Conformance evaluation

Prepare:

  • Create thumbnail
  • Upload to W3C media server
  • Upload to YouTube, URL: @@
  • Upload caption
  • Upload text transcript

List on pages:

Video: “Involving Users”

Prepare:

  • Create thumbnail
  • Upload to W3C media server
  • Upload to YouTube, URL: @@
  • Upload caption
  • Upload text transcript

List on pages:

Update and add related info

  • update footer on all pages
  • add Ack page

Preparations for Redesign

👋 The redesign is coming to this repository soon. (Hooray! 🎉) We need to check off several steps before we can link your content to the redesign repository. I marked some of the steps with RM meaning Resource Manager. Others are marked with @yatil, and I’ll do/help you through the technical parts.

In addition to this issue, you might find other issues in your repository that are labeled with wai-redesign-before that should be addressed/resolved before the redesign. That might mean to postpone working on it until after the redesign (use the label wai-redesign-after for those issues).

  • Content is updated and ready to be put into the new design. (RM)
    • The best case scenario would be that the content is ready before doing step three below. However, that might not be feasible in every case, so @yatil might do the next step before the content is ready and just port the content that is available to him.
    • Once done, add label wai-redesign-content-done.
  • Tech Create branch/repository with the new structure (@yatil)
    • For simple resources (separate pages/pages that don’t need a left navigation), you will find the documents in the root directory of the repository.
    • For more complicated resources, @yatil creates a Jekyll collection which adds the left sidebar navigation amongst other things. You will then find your files in a folder called _resource_name.
    • Documentation should be available in the w3c/wai-website wiki soon.
    • Once done, add label wai-redesign-repo-done.
  • Content Use current content and port it to the new design (@yatil)
    • Once this is done, all previews will be in the new design.
    • Once done, add label wai-redesign-content-ported.
  • Content Check if content renders well, make changes as needed/wanted. (documentation) (RM)
    • Once done, add label wai-redesign-content-checked.
  • Tech Link this repository to the w3c/wai-website repository (@yatil)
    • Once done, add label wai-redesign-repo-linked.
  • When all checkpoints above are checked, close this issue.

[ED] please add ACT Rules repository

Ref: https://w3c.github.io/wcag-act-rules/

In the "conformance evaluation" section, after WCAG-EM, please add the link above as:

[Accessibility Conformance Testing (ACT) Rules Repository] - collection of commonly agreed on testing "rules", to help you develop evaluation tools and manual evaluation methodologies more effectively. (Currently in development)

Eval Videos on website - options

After processing the input from the 21 Feb EOWG telecon, I think below is the situation, options, issues, and questions.

Note:

  • Specific Pages — The videos will be available on/from the Evaluation Overview pages, as well as specific pages. For example, Video 2 will be on the Easy Checks page
  • Use Case A — User is on the Eval Overview page and wants to watch all of the videos.
  • Use Case Note B — With the Perspectives videos and the Intro video, we wanted people share links to them, show them in presentations, etc. This is not nearly as big an expectation/goal for these videos.
  • Implementation limitation — We use AblePlayer. It doesn't work well to have multiple instances on one page.

Provide each video on a separate web page

Note: We probably also want to provide the videos directly on the pages, with one of the options below.

Pros:

  • Lots of flexibility for providing interactive transcripts, descriptive transcripts, link to version on W3C server (for those not able to get YouTube), etc.
  • Easy to implement.
  • [minor] Easy URI pointer for sharing.

Cons for doing only separate pages:

  • Poor user experience having to go to separate pages – especially for the Use Case A above: users would go from Overview page, to separate video page, then back to Overview page, then to separate video page, then to back Overview page, etc. - 5 times.

Option 1: Videos in modal dialog box

Notes:

  • We can choose not to enable AblePlayer’s interactive transcript in the modal to avoid that complication.
  • example accessible modal

Pros:

  • This option provides the best user experience in the opinion of several participants.
  • Would work well on Eval Overview page and on the specific pages.

Cons:

  • Modal dialog boxes not preferred by at least one participant, primarily because of the coding complexity.
  • [potential deal breaker] Might be more complex coding than we want to deal with – especially to get implemented before CSUN.

Option 2: Videos on page not with AblePlayer

Notes:

  • Would also link to more robust version on separate page.
  • Some EOWG participants thought this would be acceptable if the player on the main page provided basic accessibility.

Open issue:

  • [potential deal breaker] Can we do this easily with a sufficiently-accessible player? If we use simple HTML5 video, are the default browser players enough? input on YouTube player accessibility

Option 2a: Videos under expand-collapse (used throughout WAI website)

Pros:

  • Easy to do with existing WAI site code.
  • Decent UI for Use Case A.

Cons:

  • [minor] Not common UI for getting videos.

Option 2b: Videos displayed in small player

rough prototype of 2b – which includes link to version with more accessibility features

  • Would need to decide on placement and size. Prototype has them right aligned.

Pros:

  • For Use Case A, a good user experience.

Cons:

  • Doesn’t work well for the specific pages (because frequent/repeat users of the page don't want to have to scroll page the video all the time).

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.