<?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>DEV Community: RETINITIS PIGMENTOSA TREATMENT CENTER</title>
    <description>The latest articles on DEV Community by RETINITIS PIGMENTOSA TREATMENT CENTER (@retinitis_pigmentosatrea).</description>
    <link>https://dev.to/retinitis_pigmentosatrea</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4244472%2F1acd1f12-b612-445c-8014-283a89b58f3b.png</url>
      <title>DEV Community: RETINITIS PIGMENTOSA TREATMENT CENTER</title>
      <link>https://dev.to/retinitis_pigmentosatrea</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/retinitis_pigmentosatrea"/>
    <language>en</language>
    <item>
      <title>Designing Web Content for People with Vision Loss: Lessons from a Retinitis Pigmentosa Info Site</title>
      <dc:creator>RETINITIS PIGMENTOSA TREATMENT CENTER</dc:creator>
      <pubDate>Sat, 14 Nov 2026 12:43:39 +0000</pubDate>
      <link>https://dev.to/retinitis_pigmentosatrea/designing-web-content-for-people-with-vision-loss-lessons-from-a-retinitis-pigmentosa-info-site-4590</link>
      <guid>https://dev.to/retinitis_pigmentosatrea/designing-web-content-for-people-with-vision-loss-lessons-from-a-retinitis-pigmentosa-info-site-4590</guid>
      <description>&lt;p&gt;Retinitis Pigmentosa (RP) is a group of genetic eye conditions that gradually reduce peripheral vision and night vision. Many people with RP, and their families, rely on the web to understand symptoms and treatment options. That makes accessibility a core requirement for any site serving them, not an extra.&lt;/p&gt;

&lt;p&gt;I work on &lt;a href="https://retinitis-pigmentosa.co.in/" rel="noopener noreferrer"&gt;retinitis-pigmentosa.co.in&lt;/a&gt;, an information site about RP and its treatment options in India. Here are some design principles that matter for audiences with low vision or tunnel vision.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. High contrast and scalable text
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Use a contrast ratio of at least 4.5:1 for body text (WCAG AA).&lt;/li&gt;
&lt;li&gt;Use relative units (&lt;code&gt;rem&lt;/code&gt;, &lt;code&gt;em&lt;/code&gt;) so text scales with browser settings.&lt;/li&gt;
&lt;li&gt;Avoid light grey text on white. It looks clean but is hard to read.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  2. Simple, linear layouts
&lt;/h2&gt;

&lt;p&gt;Tunnel vision makes busy multi-column layouts tiring to scan.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Prefer a single main content column.&lt;/li&gt;
&lt;li&gt;Keep related information close together.&lt;/li&gt;
&lt;li&gt;Use clear headings so content can be skimmed and navigated by screen reader.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  3. Screen reader friendliness
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Use semantic HTML (&lt;code&gt;&amp;lt;nav&amp;gt;&lt;/code&gt;, &lt;code&gt;&amp;lt;main&amp;gt;&lt;/code&gt;, &lt;code&gt;&amp;lt;article&amp;gt;&lt;/code&gt;, proper heading order).&lt;/li&gt;
&lt;li&gt;Write meaningful &lt;code&gt;alt&lt;/code&gt; text for images.&lt;/li&gt;
&lt;li&gt;Make sure every interactive element is keyboard-accessible with a visible focus state.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  4. Plain language for medical content
&lt;/h2&gt;

&lt;p&gt;Medical content is often written for clinicians. Short sentences, defined terms, and a consistent structure (what it is, symptoms, options, next steps) help patients understand it.&lt;/p&gt;

&lt;h2&gt;
  
  
  5. Dark mode and user preferences
&lt;/h2&gt;

&lt;p&gt;Many people with night blindness or light sensitivity prefer dark themes. Respect the system setting:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="k"&gt;@media&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nt"&gt;prefers-color-scheme&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nt"&gt;dark&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="n"&gt;body&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nl"&gt;background&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mh"&gt;#121212&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nl"&gt;color&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mh"&gt;#f2f2f2&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Over to you
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;What accessibility tools or checklists do you use for content-heavy sites?&lt;/li&gt;
&lt;li&gt;Has anyone built for users with low vision and found something that surprised you?&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I'd also welcome feedback on the site itself: &lt;a href="https://retinitis-pigmentosa.co.in/" rel="noopener noreferrer"&gt;retinitis-pigmentosa.co.in&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>a11y</category>
      <category>frontend</category>
      <category>ux</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
