Viewpoint: Memory game website

[nils73]

Congratulations to everybody who made CMS made simple 0.11.1 as great as it is. It took me only 8 hours to set up the CMS, code the HTML & CSS templates and get them up and running with CMSMS. The most time consuming part was to fill in the content and assign the header-metatags to each page. It is completely tableless, kind of accessible and uses some interaction.

Curious? Go to http://www.ansichtssache.cc/ and see for yourself. It's all about a memory-game.

What did I use?
-------------------------------------
- CMS made simple 0.11.1
- bulletmenu
- two user-defined tags (for contact- and order-form)
- clean URLs
- only 4 templates (including pop-up)
- unobtrusive JavaScript pop-ups

However, it is not as accessible as the NatKo project that I did before. But I am pretty interested what you think.

Regards,
Nils

[westis]

Quite nice, Nils.

However, I'm more interested in the NatKo project site, that I hadn't seen before. That site is REALLY nice! And I am very interested in accessability, reading a lot about that currently to make my sites accessible.

I read in the thread you linked to that you had made some modifications to a couple of the modules.

• What did you change in the Bookmarks module? Could you post the modified code? Did you also add the a to z list navigation to the Bookmarks module?
• What changes did you do to the Calendar module to make its code accessible?
• Then you are using a cool way of having an arror image before external links. How do you add rel="external", rel="internal" and rel="top" to those links? Manually in the HTML code?
• The acronym tags, are you also adding them manually in the code or using a module for it?
• What search module are you using? Is that pisearch?

Sorry for all those questions, but I got quite excited about that site!

Thanks!

[nils73]

Quite nice, Nils.

Thanks, westis. I really appreciate your feedback ... though it is for the NatKo website.

However, I'm more interested in the NatKo project site, that I hadn't seen before. That site is REALLY nice! And I am very interested in accessability, reading a lot about that currently to make my sites accessible.

At present this is one of our key competences. We put a lot of effort into making natko.de as accessible as possible using CMSMS.

What did you change in the Bookmarks module?
Almost everything. We started with the Bookmarks module but then it turned out to be quite buggy. So we switched and had a programmer create a new one.

Could you post the modified code?
I can email it to you.

Did you also add the a to z list navigation to the Bookmarks module?
Yes. Along with skip-links to bypass navigation-lists.

What changes did you do to the Calendar module to make its code accessible?
Difficult to recall. But I guess it was all of the HTML-output that had to be re-arranged. The NatKo-calendar module goes with definition lists. That was the major change. Some minor fixes had to be inserted as well.

Then you are using a cool way of having an arror image before external links. How do you add rel="external", rel="internal" and rel="top" to those links? Manually in the HTML code?
Since I am using a modified version of widgEditor, I use this cool tool to insert the link-relations as well. Then all you need is some additional CSS for modern browsers like Opera or Firefox.

The acronym tags, are you also adding them manually in the code or using a module for it?
Manually. First we had plans for automatic replacement. But then there was this difficulty when you have two abbreveations with different meanings. I had no clue so it had to go this way.

What search module are you using? Is that pisearch?
No. It's handmade but it is well documented in the forum. Look here.

Sorry for all those questions, but I got quite excited about that site!

At least someone who likes it. Except for me. But then I coded it. Hm.

Regards,
Nils

[westis]

What did you change in the Bookmarks module?
Almost everything. We started with the Bookmarks module but then it turned out to be quite buggy. So we switched and had a programmer create a new one.

Could you post the modified code?
I can email it to you.

Thanks a lot! I'll look at it tonight. Would you mind if it is also shared with the rest of the community? If it's changed a lot maybe as a new project in the forge with a zip file for download?

What changes did you do to the Calendar module to make its code accessible?
Difficult to recall. But I guess it was all of the HTML-output that had to be re-arranged. The NatKo-calendar module goes with definition lists. That was the major change. Some minor fixes had to be inserted as well.

So it's basically the templates you have changed? Or the code in the module file too?

Then you are using a cool way of having an arror image before external links. How do you add rel="external", rel="internal" and rel="top" to those links? Manually in the HTML code?
Since I am using a modified version of widgEditor, I use this cool tool to insert the link-relations as well. Then all you need is some additional CSS for modern browsers like Opera or Firefox.

I may check out widgEditor more at some point. But I missed the possibility to easily insert images from a thumbnail list. Silmarillion is currently working on a module for the Xinha WYSIWYG that looks great so far. But I don't think link relations can be added using Xinha apart from directly in the HTML.

What search module are you using? Is that pisearch?
No. It's handmade but it is well documented in the forum. Look here.

Cool. I'm using pisearch on one of my sites, it's working quite well. I'll check out your search tag too. And there will be an integrated search feature in CMSMS 1.0.

Sorry for all those questions, but I got quite excited about that site!

At least someone who likes it. Except for me. But then I coded it. Hm.

Yeah, it's a great site indeed and especially as you have worked so much with accessability it's very useful to learn more about that!

I think we either should start a forum for Accessability & Usability (+ SEO perhaps) or start a thread in the Layout & Design forum about that. To start with there could be a list of useful links to sites about accessability and usability. I think that will become more and more important.

Keep up the good work!

[nils73]

Thanks a lot! I'll look at it tonight. Would you mind if it is also shared with the rest of the community? If it's changed a lot maybe as a new project in the forge with a zip file for download?

Hm ... I don't think it's a big deal. Maybe you find a solution to have a clean URL with the modules as well, that would indeed make me happy. But you can just do whatever you like with the code. Hey - this is open source, isn't it?

So it's basically the templates you have changed? Or the code in the module file too?

Both. I just had a quick look and found some modifications. Maybe I should just email a zipped version of the whole code but that would mean just more questions then ...

By the way: Xinha is great - so was / is HTMLArea. Over at Typo3 they integrated it as a great module and got both link-engine and image-repository to cooperate with the editor. Would be nice for CMSMS as well.

Cool. I'm using pisearch on one of my sites, it's working quite well. I'll check out your search tag too. And there will be an integrated search feature in CMSMS 1.0.

That is indeed good news! Can't wait to see 1.0!!!

Yeah, it's a great site indeed and especially as you have worked so much with accessability it's very useful to learn more about that!

Thanks for the praise. But since I am just a coder for HTML and CSS the praise goes back to those who made CMSMS such a good tool. And to the community-members who come up with great solutions and workarounds. You guys and grils rock!

I think we either should start a forum for Accessability & Usability (+ SEO perhaps)

Drop the SEO part. There must be a thread around here where I discussed this issue with piratos. Have you ever heard about ATAG (Authoring Tools Accessibility Guidelines)? They are maintained by the W3C (just like the WCAG are) but there is not a single tool on the internet (i.e. a CMS) that conforms to these guidelines. CMSMS could easily achive that. But there has to be the will to do that.

Keep up the good work!

You are the one who should keep up the good work. Thank you for making CMSMS even better.

Regards,
Nils

[westis]

So it's basically the templates you have changed? Or the code in the module file too?

Both. I just had a quick look and found some modifications. Maybe I should just email a zipped version of the whole code but that would mean just more questions then ...

lol Yeah, the risk with sharing something with me is that you'll get more questions... But the thing is that accessability is one thing that the dev team wants to put more and more priority on. SjG is the main guy to make the admin panel conform to accessability standards and the more modules that conform to that the better.

But I can look at Calendar at some point. Shouldn't be too difficult to change the HTML output of most modules to become more accessible. You're not interested in working a bit on making modules accessible?

By the way: Xinha is great - so was / is HTMLArea. Over at Typo3 they integrated it as a great module and got both link-engine and image-repository to cooperate with the editor. Would be nice for CMSMS as well.

Yeah, the Image Manager that CMSMS is using is from HTMLArea. The Image Manager for Xinha is very similar, the main difference being that thumbnails are not saved in the same directory, but in a specific thumbnails directory. We'll see what happens once the Xinha module has been fully developed.

I think we either should start a forum for Accessability & Usability (+ SEO perhaps)

Drop the SEO part. There must be a thread around here where I discussed this issue with piratos. Have you ever heard about ATAG (Authoring Tools Accessibility Guidelines)? They are maintained by the W3C (just like the WCAG are) but there is not a single tool on the internet (i.e. a CMS) that conforms to these guidelines. CMSMS could easily achive that. But there has to be the will to do that.

Yeah, I searched the forum and found those threads (both in English and German), which was before I even had heard about CMS Made Simple.... And the ATAG is indeed something that we should use as guidelines for the admin and all modules that are included in the core, as well as other of the most common modules.

I'm not sure how far SjG has come with that, but as accessability is on the roadmap we should somehow have a point to discuss it in the forums too.

And thanks for the German tutorial btw, it looks professional and gives many good ideas for the documentation in the writing.

[nils73]

You're not interested in working a bit on making modules accessible?

I will do my very best to help you guys. But then I am not really familiar with programming and I do not use IRC (where it seems most programmers hang out on a regular basis). However I am willing to contribute because I know what CMSMS can do. There are a lot of advantages but yet it is still a long way to go. Let me be a guide somewhere along the road ...

Yeah, I searched the forum and found those threads (both in English and German), which was before I even had heard about CMS Made Simple....

Why do I feel old and broken now??? Yes, it is quite some time since we had that discussion. But guess what: There is still no CMS around that has come up with ATAG conformance. Even WCAG conformance is still blunt. There are only two CMS out there who "could" come up with a solution. One of them is Drupal where they have already established a working-group for accessibility (both frontend and backend). We should have something similar. You say SjG is the developer "in charge" for that? Good to know!

And the ATAG is indeed something that we should use as guidelines for the admin and all modules that are included in the core, as well as other of the most common modules.

It is not that simple. ATAG means much more than just the technical basis. It's also about contextual help and usability. And of course it includes the WCAG for the backend. All of this is rather complicated on first sight but when you dig deeper it is just a checklist. But this checklist affects the core of each CMS and the way things are being handled. Writing this I think of quality management - nothing more and nothing less. By the way: That's the reason why I do accessibility. It's not about chartiy - it's commerce!

And thanks for the German tutorial btw, it looks professional and gives many good ideas for the documentation in the writing.

I would like to translate it but right now I have to rebuild a table-based website without tables ... *sigh*

Regards,
Nils

[westis]

Hi Nils,

We have now opened a forum for discussions about accessability and usability. I think it's both good and important to have somewhere to discuss such issues in the forums. It's found among the forums in the Development section, with direct link http://forum.cmsmadesimple.org/index.ph ... ,23.0.html

Thanks for offering to be a guide along the road! A working-group for accessability would indeed be a great thing. Right now us in the development team are rather stretched in our engagements, and more people helping out in different areas are most welcome!

The new forum is a start and if there are several people willing to help out on a regular basis we can establish a more formal working-group.

[sandberg]

Wow! This must be one of the best looking sites made with CMSMS. I would however prefer a brighter background color on the contents. It looks so dark.

[nils73]

Thanks sandberg! Usually I do not care about design-trends but it seems that darker colours are kind of fancy now. The gallery has been refactored today but it will only work properly with standards-compliant browsers (which does not include IE at the moment).

Regards,
Nils

[askme]

Great cool Site
tell us how to modify the menu and top and bottom headers and template. How to change the complete layout as you have done in your site.

Write some tutorials on it for new CMSMadeSimple users

[nils73]

askme,

thank you very miuch! It was not so hard to create different layouts ... you can define multiple templates in CMSMS. I use three templates for Viewpoint - one for the homepage and two different ones on the sub pages. The rest is CSS which is a bit more complex but still pretty easy to handle. There are a lot of tutorials around and some have already been mentioned around here on the forum (try searching for CSS framework) and they are far better then any tutorial I could ever write.

I wouldn't even need three different templates because you could use Smarty to assign variables to the template and have a dynamic approach. That is what I did with the NatKo website which is based on only one template.

Assigning variables is also pretty easy - just have a look here.

Hope this helps.
Nils

[NamantH]

Has anyone posted the source for the fixed bookmarks module?  I read that someone wanted to but i am not seeing it in this thread.

if someone could get me the code or something so I can use this module, I would be very happy

[nils73]

NamantH,

What do you mean by "fixed"? As far as I know the standard Bookmark module works ... at least it does in my current installs of CMSMS. Did you encounter any problems?

Regards,
Nils

[volcanoby]

Beautyful site!!
May I ask how you created your gallery? I've seen it a few other places as well and it looks really nice.