#31 Improve Docs Experience - Add text to speech and what's new button
Opened 2 years ago by joewest24. Modified 2 years ago
fedora-docs/ joewest24/pages master  into  master

@@ -1,110 +1,5 @@ 

- = Fedora Documentation

- :page-layout: homepage

+ position: relative;

+ width: 1440px;

+ height: 1024px;

  

- ++++

- <div class="homepage-page">

-     <div class="homepage-section homepage-section-user-docs">

-         <h2>User Documentation</h2>

-             <div class="homepage-section-container">

-             <a href="../fedora/f35/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;Linux&nbsp;35</h3>

-                 <p>Documentation covering the most recent release, Fedora Linux 35.</p>

-             </a>

- 

-             <a href="../fedora/f34/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;Linux&nbsp;34</h3>

-                 <p>Documentation covering the Fedora Linux 34 release.</p>

-             </a>

- 

-             <a href="../quick-docs/" class="homepage-link homepage-link-primary">

-                 <h3>Quick Docs</h3>

-                 <p>How tos and tutorials for using and configuring Fedora Linux.</p>

-             </a>

-         </div>

-         <div class="homepage-section-container">

-             <a href="../fedora-server/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;Server</h3>

-                 <p>Are you using Fedora Linux on a server? This section is for you.</p>

-             </a>

-             <a href="../iot/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;IoT</h3>

-                 <p>Strong foundation for IoT projects at home, industrial gateways, smart cities or analytics with AI/ML.</p>

-             </a>

-             <a href="../fedora-silverblue/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;Silverblue</h3>

-                 <p>Immutable desktop variant of Fedora Workstation and an excellent platform for container-focused workflows.</p>

-             </a>

-         </div>

-         <div class="homepage-section-container">

-             <a href="../fedora-coreos/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;CoreOS</h3>

-                 <p>Fedora CoreOS is a minimal, container-focused operating system, designed for clusters but also operable standalone.</p>

-             </a>

-             <a href="../epel/" class="homepage-link homepage-link-primary">

-                 <h3>EPEL</h3>

-                 <p>Documentation for the Extra Packages for Enterprise Linux (EPEL) project.</p>

-             </a>

-             <a href="../fedora-kinoite/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora&nbsp;Kinoite</h3>

-                 <p>Immutable desktop variant of Fedora featuring the KDE Plasma desktop and container-focused workflows.</p>

-             </a>

-         </div>

-         <div class="homepage-section-container">

-             <a href="../fedora/rawhide/" class="homepage-link homepage-link-secondary">

-                 <h3>Fedora&nbsp;Linux&nbsp;Rawhide</h3>

-                 <p>Draft documentation targeting future Fedora Linux releases.</p>

-             </a>

-             <a href="../Fedora/26/html/Release_Notes/index.html" class="homepage-link homepage-link-secondary">

-                 <h3>Older releases</h3>

-                 <p>Older Fedora Linux user documentation.</p>

-             </a>

-         </div>

-     </div>

- 

-     <div class="homepage-section homepage-section-project-docs">

-         <h2>Fedora Project &amp; Community</h2>

-         <div class="homepage-section-container">

-             <a href="../project/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora Project</h3>

-                 <p>Learn how the Fedora Project works.</p>

-             </a>

-             <a href="../council/" class="homepage-link homepage-link-primary">

-                 <h3>Fedora Council</h3>

-                 <p>Learn about the Fedora Project governance.</p>

-             </a>

-         </div>

-         <div class="homepage-section-container">

-             <a href="../engineering/" class="homepage-link homepage-link-primary">

-                 <h3>Engineering Teams</h3>

-                 <p>Learn about FESCo and Engineering subprojects, SIGs, Work Groups, and teams.</p>

-             </a>

-             <a href="../mindshare/" class="homepage-link homepage-link-primary">

-                 <h3>Mindshare Teams</h3>

-                 <p>Learn about Mindshare and its subprojects and teams.</p>

-             </a>

-             <a href="../diversity-inclusion/" class="homepage-link homepage-link-primary">

-                 <h3>Diversity & Inclusion</h3>

-                 <p>The goal of this initiative is to help foster diversity and inclusion in Fedora community.</p>

-             </a>

-             <a href="../program_management/" class="homepage-link homepage-link-primary">

-                 <h3>Program Management</h3>

-                 <p>Release planning, scheduling, and status tracking.</p>

-             </a>

-         </div>

-         <div class="homepage-section-container">

-             <a href="../packaging-guidelines/" class="homepage-link homepage-link-secondary">

-                 <h3>Fedora Packaging Guidelines</h3>

-                 <p>Learn about packaging for Fedora Linux — from both a policy and a technical perspective.</p>

-             </a>

-             <a href="https://fedoraproject.org/wiki/Outreachy/2017" class="homepage-link homepage-link-secondary">

-                 <h3><i class="fas fa-external-link-alt"></i> Fedora's Outreachy Docs</h3>

-                 <p>Outreachy is an internship program for people from group underrepresented in free and open source software.</p>

-             </a>

-             <a href="../mentored-projects/gsoc/2021/" class="homepage-link homepage-link-secondary">

-                 <h3>Fedora's Google Project Participation</h3>

-                 <p>Information about Google Summer of Code (GSoC), Google Code In (GCI), and Google Season of Docs (GSoD).</p>

-             </a>

-         </div>

-     </div>

- </div>

- ++++

+ background: #FFFFFF;

I tried to research and look for ways by which the fedora docs site could be more accessible to people with disabilities or difficulty in exploring and using the web. After much deliberation, I decided that a good option would be to add a "text to speech" button right there on the website, which would be available on all pages.

"Text to speech" would enable people with disabilities like dyslexia (a common learning difficulty that mainly causes problems with reading, writing, and spelling) to be able to access the data on each page of the fedora docs site easily.

I also thought it'd be great to add a "what's new" button at the top right of the site to enable users easily access information on new updates, new developments, upcoming events, and the latest fedora software.
Below is a link to an interactive prototype page showing the "speech to text" and "what's new" interactions

https://www.figma.com/proto/opx3qcXcFYIPzaift58Pl7/Fedora-proposed-front-page?node-id=169%3A643&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=169%3A643&show-proto-sidebar=1

To be able to interact with the page;
- hover on the "what's new" icon at the top right corner
- Click on the "text to speech" icon at the top right corner to open the options and click anywhere on the screen to exit the options.

Metadata