jelâs how-to guide on finding and/or making accessible themes
So, youâre a blogger or a theme designer who cares about accessibility. Good - itâs a positive step forward. However, maybe youâre not exactly sure how to do that. Well, have no fear, as I, your local design major who took courses on User Experience, am here to help.Â
Iâm going to cover the biggest issues Iâve seen across many blog themes. If you are guilty of any of these, donât worry, weâre here to fix that. Iâm even guilty of some of these design sins.
This is easily the BIGGEST hinderance Iâve seen on this site in regards to accessible themes, especially in recent years. If you want your theme to be accessible, you HAVE to have decently sized and decently spaced font - this is completely non-debatable. My recommended font size tbh is 12 and above, with 1.15 spacing at the very least. You could maybe get away with 11px or 10px font, depending on the font type you pick, but anything below that and itâs pretty much guaranteed that anyone with visual impairments reading your blog is going to have a bad time.
Also, font type matters, especially for those with dyslexia. There is a font type that was specifically designed for dyslexics called OpenDyslexic, but if you wanna use a different font type, thatâs perfectly fine. Just donât use any cursive or all-caps font types, as those are MUCH harder for dyslexics to read. If you want further details on which font types are best, I would HIGHLY recommend you check out this link.
Look, I get it - maybe thereâs a certain colour scheme that you REALLY like, but not every colour scheme is going to help those with reading difficulties or visual impairments. Iâm gonna be talking more so on colour pairs than colour schemes, but in general, youâre better off using a darker background colour with a lighter font colour. This helps prevent eye strain, especially if you expect people to be looking through your blog for extended periods of time.
Thereâs plenty of sources online that can help you figure out which colours have the best contrast with each other, but hereâs a post that does a generally good job of giving a quick guide for people to use.Â
Except for white font on a yellow background. For the love of God, please DO NOT. Also I think this just might be me, but Iâm really not a fan of maroon font on a black or grey background, especially if the font type is thin.Â
3. Hyperlink Responsiveness
This one is more so on theme designers than bloggers, though I am BEGGING bloggers to please keep an eye out for this when youâre looking for themes. Hyperlink responsiveness simply means that when your cursor hovers over a hyperlink, such as tags, the reblog button, the like button and/or the next page button on your theme, it should have a clear visual change.Â
Maybe the hyperlink text and/or symbol grows or shrinks in size. Maybe it fades or darkens into a different colour when you hover over it. Hell, it could be a combination of both, but viewers should have SOME visible way to tell them that yes, that is a link that will bring you somewhere else than where you currently are and yes, that link works. Itâs such a simple thing, and trust me, I know itâs probably not the easiest thing to code, but it makes SUCH a big difference in the userâs experience I promise.
4. Obvious Symbology and/or Symbols with Supporting Text
Everyone knows that an image of a house means Home. Everyone knows that the image of two intertwined chains means links. Everyone knows that an arrow pointing to the right means next page and an arrow pointing to the left means previous page. These symbols are pretty much universal and can be left alone for people to look at and intuitively understand what theyâre seeing, no problem.
Obviously though, not all symbols are universal, and if thatâs the case, a symbol should either have accompanying text to explain it (either in immediate view or in a hover box), or should just be replaced with text all together. The symbol should also be very obvious and easy to spot. Lemme explain what I mean by using a theme designed by one of my favourite blog theme makers on this site, @seycheâ.
If I were to cover up the texts accompanying those symbols, Iâm pretty sure that the very least that people would get confused between the about page and the rules page. This is honestly my preferred style of links, but of course having just the words without the symbols would work just fine to.
All of this would be pointless if I didnât give my advice for bloggers and theme makers alike on who to check out or what to look for if youâre either looking for a theme to use or an example to help you better understand good design practices for themes. In general, if you see ANY themes that promote responsiveness, chances are it was designed with most if not all of the design principles I mentioned in mind.
As for who to check out specifically, I highly recommend @seycheâ and well as @eggdesignâ. Both of these designers have done FANTASTIC work in making themes that are both very much accessible and aesthetically pleasing. Thereâs likely more out there, but these two definitely are on the top of my list.