Calling different styles on the same page(s) for accessibility reasons

RapidWeaver Classic
1

I have been asked to build a site for a local association for the blind with accessibilty front and centre.

I am comfortable (having read this post) adding custom CSS via the resources in RW however I’m not sure how to make the site present it’s default styles on first load and then only load alternative versions via a link, as in this site https://www.camsight.org.uk/ (hover over ‘accessibility’ top right)

I am assuming also that the site would need to place cookies to remember the users choice on subsequent visits?

Any help would be much appreciated

Thank you!

2

Hi Mark, since I’m not a programmer I would handle this with the RWML stack. This is in fact a stack that lets you choose a language and reminds your choice via a cookie. In stead of showing a different language you show a different style.
RWML works with containers per language. You can fill these with whatever you like. So basically you make your website in colour 1 in a first container, copy this container in a second and adapt the style etc.
I don’t use templates, but this perfectly doable in a framework such as Foundry.

It’s just an idea.

Hans

3

Are you using a template, template + stacks or a framework to build the site?

4

Thanks Hans, that look interesting! Do you have to create separate pages for the different versions?

5

Hi Paul, I will be using Foundation 6

6

Hi Mark,
no you don’t create different pages. If you are using Foundation6, you shouldn’t have any problems. The project should look a bit like this:

Screen Shot 2021-11-26 at 10.24.02
Screen Shot 2021-11-26 at 10.24.02939×1073 99.4 KB

Instead of changing a language, you change content in the different RWML Wrappers. Take a look at this multi language site and imagine the language option buttons to be ‘view option’ and the different languages as different styles.
So, you make a complete webpage in a container and place this in a RWMLWrapper (normal view), then copy this container in a RWMLWrapper (dark view) and so on per view.

I hope I explain it well, but it’s quite simple.

Hans

7

Thanks Hans, that looks straightforward enough. So, effectively there are 3 versions of each page in the project, each with different styles/languages and the links enable you to point to the different ones.

My only query would be if Google may see the page as having duplicate content (in my case, as the style is the only thing that changes) and if there are lots of pictures, it would add to the page weight fairly significantly?

PS: I love your art!

8

You’re right, I make a lot of multi language sites whereas content differs per language. Sometimes I need to show different images per language and that adds to the page weight. I try to avoid this by placing the different Wrappers only where they are really needed.
It will take some preparation from your side. Maybe it’s enough to place transparent colours in different Wrappers. I’d say, experiment.
I use Foundry, if not I’d make a simple example for you in Foundation. Anyway…

Thanks for your nice compliment.

Hans

9

You’re welcome and thanks for pointing out RWML - I’m going to give it a try and play about with it.

Mark

1 Like
10

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.