|
- <?xml version="1.0" encoding="UTF-8" ?>
- <rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
- <channel><title>My fancy blog</title><link>http://example.com/blog/index.html</link>
- <description>A blog about turtles and carrots</description><language>en</language>
- <lastBuildDate>Mon, 13 Sep 2021 17:31:02 +0100</lastBuildDate>
- <pubDate>Mon, 13 Sep 2021 17:31:02 +0100</pubDate>
- <atom:link href="http://example.com/blog/feed.rss" rel="self" type="application/rss+xml" />
- <item><title>
- Updates: Interface and accessibility
- </title><description><![CDATA[
-
- <p>Hello everyone! Throughout the past year there has been a lot of work in creating a polished, modern looking UI.
- This update has been in the works for a long time… Many considerations had to be done, and given the current state of
- modern browsers (and their over-reliance in JS) many more surfaced, leading to further testing and fixes.</p>
-
- <p>We hope you like it!</p>
-
- <h3>The prime directive</h3>
-
- <blockquote><p>Modern looking, consistent and accessible UI across all browsers.
- Non-JS version as the primary focus, <strong>JS is optional</strong> and should be regarded as such.</p></blockquote>
-
- <p>The Web is 95% typography, the art and technique of arranging type to make text more readable and pleasing.
- To achieve this, a textual hierarchy is fundamental, text should present a clear, readable structure to the reader.
- In much of the same fashion, the way we perceive Web pages relies upon the same fundamentals. As such, by focusing on the
- markup, we hope to achieve an accessible, fast and polished structure by which any browser and screen reader relies upon.</p>
-
- <h3>Features</h3>
-
- <ul>
- <li>Accessible
-
- <ul>
- <li>Easy to use keyboard only navigation
-
- <ul>
- <li>Feedback on focused elements</li>
- <li>Keyboard shortcuts to access main regions</li>
- <li>Vi-like shortcuts</li>
- </ul>
- </li>
- <li>Screen reader tested
-
- <ul>
- <li>Notifies the user when focusing on key elements, such as the feed, notes and actions</li>
- <li>Brief description of navigation links</li>
- <li>Using semantic HTML whenever possible</li>
- </ul>
- </li>
- <li>Special care given for styling solutions that could break accessibility</li>
- <li>Colors and type sizes in accordance to W3C contrast guidelines
-
- <ul>
- <li>Chosen specifically blue-ish and grey-ish hues for faster page loading perception</li>
- </ul>
- </li>
- </ul>
- </li>
- <li>Fast, the content provided to the user really is just markup and some CSS rules
-
- <ul>
- <li>Optionally there will be some small use cases where JS makes sense (it’s the only thing modern browsers understand e.e)
-
- <ul>
- <li>For example, cropping your avatar before uploading a new one.</li>
- <li>This is the only example until now.</li>
- </ul>
- </li>
- </ul>
- </li>
- <li>Dark and light default themes available (according to your system theme)</li>
- <li>Graceful degradation for unsupported HTML elements</li>
- <li>Achieving modern user interface patterns without JS</li>
- <li>Various layout engines tested and work as they should
-
- <ul>
- <li>Qt WebEngine (Qutebrowser, Falkon, Otter Browser, etc…)</li>
- <li>WebkitGTK (Epiphany, Midori, etc…)</li>
- <li>Gecko (Firefox and derivatives)</li>
- <li>Goanna (Palemoon, Basilisk, etc…)</li>
- <li>Internet Explorer</li>
- </ul>
- </li>
- </ul>
-
-
- <h3>Video</h3>
-
- <h4>Keyboard tests</h4>
-
- <iframe width="560" height="315" sandbox="allow-same-origin allow-scripts allow-popups" title="GNU social v3 Accessibility: Orca reading the Public feed" src="https://tube.tchncs.de/videos/embed/9a16e84c-4150-4849-ac63-019c9a3782d9" frameborder="0" allowfullscreen></iframe>
-
-
-
-
- <hr>
- ]]></description><link>http://example.com/blog/updates-interface-and-accessibility.html</link>
- <guid>http://example.com/blog/./updates-interface-and-accessibility.html</guid>
- <dc:creator>John Smith</dc:creator>
- <pubDate>Mon, 13 Sep 2021 17:30:12 +0100</pubDate></item>
- </channel></rss>
|