Skip to content
Snippets Groups Projects
Commit ae0f8b76 authored by HouTeng Chan's avatar HouTeng Chan
Browse files

Update file inclusivity.html

parent 3325f4a6
No related branches found
No related tags found
No related merge requests found
......@@ -152,9 +152,20 @@
<li>Font Switch Feature: We introduced a <b>font-switching option</b> that allows users to toggle between standard fonts and dyslexia-friendly fonts like Dyslexie and OpenDyslexic. These fonts are designed with heavier bottom weights and distinct character shapes, making it easier for dyslexic users to differentiate between letters.<li>
<li>Avoiding Italics and Underlining: In the body text, we avoided using italics and underlining—both of which can distort the visual form of words—following guidelines from the British Dyslexia Association. Instead, we relied on bold formatting to highlight important text.<li>
<li>Letter Spacing: We ensured that text had <b>larger letters</b>, which makes it easier for dyslexic users to track lines of text without losing their place. This design choice was based on recommendations from accessibility experts in the International Dyslexia Journal.<li>
<ul>
<div class="image-container" style="display: flex; justify-content: center;">
<img src="https://static.igem.wiki/teams/5187/wiki-inclusivity-fig/pic18.png" alt="ibd_figure" class="shadowed-image" style="width: 50%; max-width: 500px;">
</div>
<h4>3. High Contrast and Readability for Low Vision and Color Blindness/h4>
<h5>Why We Focused on This?</h5>
<p>Individuals with low vision or color blindness face challenges in distinguishing between colors and reading small, low-contrast text. According to the World Blind Union and research on low-vision accessibility, high-contrast color schemes and adjustable text sizes are critical for making digital content readable.</p>
<h5>How We Implemented It?</h5>
<ul>
<li>Clean Design: We used a <b>minimalistic design</b>, ensuring that each page was free from distracting elements like unnecessary images, animations, or banners. This helps users focus on the core content without being sidetracked.<li>
<li>Clear Headings: Each section of the wiki was broken down into <b>concise, clearly labeled headings</b>, making it easier for users to skim and locate the information they need. This approach is supported by research from the Journal of Attention Disorders.<li>
<ul>
<div class="image-container" style="display: flex; justify-content: center;">
<img src="https://static.igem.wiki/teams/5187/wiki-inclusivity-fig/pic18.png" alt="ibd_figure" class="shadowed-image" style="width: 50%; max-width: 500px;">
<img src="https://static.igem.wiki/teams/5187/wiki-inclusivity-fig/pic9.png" alt="ibd_figure" class="shadowed-image" style="width: 60%; max-width: 600px;">
</div>
</div>
</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment