Insights from MODXpo Cologne

Back from MODXpo Cologne, I’d share some good ideas which I picked up there, concerning accessibility.

It catched us from behind: the insight that the MODX Manager is just a website, we can style it like any other website, applying all the good practices we already know.

Why not position the TVs in a configurable grid structure, so that your backend layout may represent the frontend layout? – That would be a UX goodie, one thing Typo3 does right.

Why not configure the colors in variables like in LESS/SASS, so that everybody may set their preferred color scheme, say a high contrast scheme? – That would be one good way to cater for persons with low vision. Another good way would be to allow for personal color schemes on OS or browser level. Just take care that no text and icons are in the background where they get extincted by a personal color scheme. See here how it is done: http://www.paciellogroup.com/blog/2010/01/high-contrast-proof-css-sprites/

Why not make the layout responsive to screen size? – That would cater for mobile users as well as for people with low vision who use low resolution or text enlargement.

We heard some great talks about responsive strategies, it is not only about layout but also bandwidth, with effect on images and scripting. What if your client wants to edit their website in the underground where connection is low? MODX should be able to login and submit even if JavaScript is not there. This means some extra work, as core functionality should be provided on the server as well as in the frontend. But this is old stuff, we can easily find the methods in the old php-based web apps.

From the point of accessibility, mobile web is a fortune, as there are some similar restrictions and requirements. What you would perhaps not do for accessibility, you easily do it for mobile. And some old-fashioned virtues, like progressive enhancement, come back into place.

I love these thoughts and look forward to seeing them shape up the next few releases. In 2.3 sass is being used for the manager, so specific high-contrast themes or custom colours are totally possible! Baby steps

Some great points indeed...also hits home personally as I am legally blind and utilize a high contrast color scheme of black background and white text.

Please let me know if I can help in any way with regards to accessibility.

Dan

Quote from: BrigitteB at Nov 02, 2013, 11:18 PM

It catched us from behind: the insight that the MODX Manager is just a website, we can style it like any other website, applying all the good practices we already know.

As long as I've used MODX I have found it a bit ironic that there is so much creative freedom and flexibility when creating websites, but there are certain pain points when trying to customize or create experiences in the Manager. It is true that a lot can be done currently, but lessening the learning curve is something we are striving for.

Quote from: BrigitteB at Nov 02, 2013, 11:18 PM

Why not configure the colors in variables like in LESS/SASS, so that everybody may set their preferred color scheme, say a high contrast scheme?

In 2.3 we've switched to Grunt based Sass workflow, and all the colors and variables are in fact in one file.
https://github.com/modxcms/revolution/blob/develop/_build/templates/default/sass/_colors-and-vars.scss

I'm also working on a grunt-init template that serves as a boilerplate for creating custom Manager themes. Idea is you create a new folder for your theme, run the command, it asks you a few questions on how you'd like to configure your theme, and then builds it to your specifications. This is still a work in progress, as the 2.3 default theme is still evolving but it can be found here:
https://github.com/jpdevries/modx-manager-theme

If grunt-init seems like something you may be interested in I've also released a more abstract one meant for creating any static front end site. It allows you to choose from workflows like Sass, Less, Bootstrap, Foundation 4 and more.
https://github.com/jpdevries/neat-pages

Quote from: BrigitteB at Nov 02, 2013, 11:18 PM

Why not make the layout responsive to screen size? – That would cater for mobile users as well as for people with low vision who use low resolution or text enlargement.

This is absolutely essential, however will require breaking changes and thus isn't on the roadmap until 3.0. That said, luckily we Handyman by Mark Hamstra for now.

Quote from: BrigitteB at Nov 02, 2013, 11:18 PM

What if your client wants to edit their website in the underground where connection is low? MODX should be able to login and submit even if JavaScript is not there.

I agree. To me, this isn't even so much about the obvious, supporting no-js users and improving accessibility. It is also about simply building for the web in the correct order. If you do not build HTML first you are putting the cart before the horse and asking for trouble and will likely add unnecessary complexity similar to if you build a site for the desktop first and then try to 'mobilize' it.

I know much of the industry is hoping into bed with JavaScript and acting like raw HTML support is a thing of the past (cough, AngularJS) but to me that is no different than building a fullscreen Flash site without an HTML layer underneath.

Quote from: cookie_monster_az at Nov 03, 2013, 03:03 AM

I am legally blind and utilize a high contrast color scheme of black background and white text.

Oh yes, and how are you doing with MODX manager?

Quote from: cookie_monster_az at Nov 03, 2013, 03:03 AM

Please let me know if I can help in any way with regards to accessibility.

I'm sure you can add couple'f requirements, if you bother writing down the drawbacks with your daily work.

Quote from: dinocorn at Nov 03, 2013, 10:32 AM

In 2.3 we've switched to Grunt based Sass workflow, and all the colors and variables are in fact in one file.
https://github.com/modxcms/revolution/blob/develop/_build/templates/default/sass/_colors-and-vars.scss

I'm also working on a grunt-init template that serves as a boilerplate for creating custom Manager themes.

This looks very promising. I heard about 2.3 in Cologne, but could not imagine it has come that far already.

Quote from: dinocorn at Nov 03, 2013, 10:32 AM

If you do not build HTML first you are putting the cart before the horse and asking for trouble and will likely add unnecessary complexity

Well said

Quote from: cookie_monster_az at Nov 03, 2013, 03:03 AM

Some great points indeed...also hits home personally as I am legally blind and utilize a high contrast color scheme of black background and white text.

Please let me know if I can help in any way with regards to accessibility.

Dan

I need to get started on a non-default Manager theme to test the new grunt-init workflow so this would be a great one to do. You could help by testing and giving us feedback on how it works for you when ready.

The grunt-init is actually rather far along. However I recently learned that themes don't need to have copies of all the default files, only ones that override the defaults so I'm going to work on some options to remove unnecessary duplications.

+1 on the high contrast theme - it's a great idea indeed!

New thread "High Contrast Theme"
http://forums.modx.com/thread/87473/high-contrast-theme#dis-post-481806

Any new comments on high contrast go here please.

Quote from: BrigitteB at Nov 04, 2013, 01:05 AM

Quote from: cookie_monster_az at Nov 03, 2013, 03:03 AM

I am legally blind and utilize a high contrast color scheme of black background and white text.

Oh yes, and how are you doing with MODX manager?

Quote from: cookie_monster_az at Nov 03, 2013, 03:03 AM

Please let me know if I can help in any way with regards to accessibility.

I'm sure you can add couple'f requirements, if you bother writing down the drawbacks with your daily work.

I think I have everything answered in the High Contrast thread. Please let me know if you need anything else.