writing accessibility CSS code for the color blind

Not being able to see the differences between colors is a bit trouble some. Imagine yourself looking at the traffic light and not seeing and red color. These people will see yellowish brown color instead of the red color. Red-green color blind is also called Protanopia, people that are less sensitive to red light and Deuteranopia for people who are less sensitive to the green light.  Some study determined that about 10% of the male population are color blind. I am happy I do not belong to those 10%.

That is why link urls should stay underlined to help people with color blindness see it immediately. since we are not able to adjust CSS being used on the website we browse, we will just instead use our own CSS page by specifying it on our browser. if you are color blind, this page will help you a lot. If you are not color blind, i don't recommend you using it because it would be weird.

First lets create our own CSS file and specify it via our browser settings later.


* {
  color: #000 !important;
  background: #fff !important;
}

a {
  text-decoration: underline !important;
  color: #fff !important;
  background: #000 !important;
}


the !important specifier must be present on your CSS codes to tell the browser its important and must override the other CSS codes.

Using Internet Explorer navigate to 

• Tools -> Internet Options
• Click on the Accessibility button
• Place a check on the 'Format documents using my style sheet' option
• Browse to the location where you saved your CSS file above.
• then click OK

If you are using Firefox go to your profile folder and edit your userCrome.css file of your userContent.css file. just copy-paste the CSS code above to the bottom portion of the file.