Center-for-Digital-Narrative / elmcip

Electronic Literature as a Model of Creativity and Innovation in Practice (ELMCIP) is a collaborative research project funded by Humanities in the European Research Area (HERA) JRP for Creativity and Innovation built in Drupal
https://elmcip.net
4 stars 0 forks source link

Responsive Web Design #490

Open hannahackermans opened 1 year ago

hannahackermans commented 1 year ago

There are a number of WCAG failures that I expect to be fixed automatically when we migrate elmcip and it becomes responsive. I am listing them here, but I am holding off on creating individual issues for those here for now. @steinmb can you take a look at this list and indicate which issues are going to be fixed after the migration and which ones require their own issue?

WCAG Guidelines (this issue crosses several requirements)

Success Criterion 1.4.4 Resize text (Level AA) Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality.

Success Criterion 1.4.10 Reflow (Level AA) Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for: • Vertical scrolling content at a width equivalent to 320 CSS pixels; • Horizontal scrolling content at a height equivalent to 256 CSS pixels. Except for parts of the content which require two-dimensional layout for usage or meaning.

Success Criterion 1.4.12 Text Spacing (Level AA) In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property: • Line height (line spacing) to at least 1.5 times the font size; • Spacing following paragraphs to at least 2 times the font size; • Letter spacing (tracking) to at least 0.12 times the font size; • Word spacing to at least 0.16 times the font size. Exception: Human languages and scripts that do not make use of one or more of these text style properties in written text can conform using only the properties that exist for that combination of language and script.

Current State of ELMCIP

ELMCIP uses a narrow part of the screen. This means that the functionality is not lost when you start to resize the page. On my PC screen, I can go up to 200% as the 1.4.4 requires, but on my laptop only 120%. We have no reflow or horizontal scroll bar, so increasing beyond that point only shows the left side of the screen. Increasing text spacing works well in most cases, except for the text underneath “Publishers and Journals” and “Organizations” on the homepage.