User:Derik/designStandards

CSS

Printing

MediaWiki has a built-in "noprint" class... but we aren't applying it to our templates.

Maintenence templates (example: "we need pics!") should not print. Templates like "this is a stub" and "spoilers ho" (?) *should* print... as that's something that's relevant to... being... a... spoiler.. thing.

Syndication

Propose a class called "nosyndicate" to be applied like "noprint" so syndicators can hide templates that make no sense for them to have. (The boxart page on Botch's site being the prototypical example.)

Syndicate.css

A standard "syndicator" css file that includes the "starter set" of css. (A lot of our essential template css is mixed in with everything else as it stands right now, making it a nightmare for someone to figure out what code is required for template "X" to display correctly.)

Flatten?

Is there a script (Javascript?) to "flatten" a page displayed using action=render so that no external css files are required? Flatten just certain objects? (I'm not writing it, but if it exists it'd be nice to point people to.)

Syndication script

• Find that beta syndication script that DOESN'T hammer our server, but archives locally.

Template Classifications

Some standard classifications for all templates like "maintenance", "info" "meta", "utility", "layout"... that will also be classes attached ot them. (Allowing syndicators to hide them by class easily.)

Design

Some general thoughts on design.

Disambigs

I really dig the RAH wiki's brown border and bottom-margin on their disambigs. (seen here)

I worry that between the disambigs, the faction icons, the continuity notes, and any special templates (like "suite") that "live" above the main photo... our articles are becoming incredibly crowded. Breathing room is a plus.

Infoboxes

Not for characters... but for episodes & stuff. The RAH Wiki (above) has a very basic design I like. (Ours is too busy.) I also like the sleekness of the Marvel wiki's infoboxes especially those little "i" tags with information about what this parameter means and how it should be used. (Good for the reader and editor!) And their use of line-weight to divide information instead of color is nice... yet the whole thing doesn't feel "simple," its spacing and layout are... good?

Coding

Future templates should be semantically-accurate. That means enabling the tag-extension to enable certain blocked HTML tags.

Examples: <legend>, <quote>

Accessibility

Javascript and CSS can only do so much. How do we fare on a screenreader? (Is there an online or free screenreader we can try?) I worry our templates... mean the order-of-content would create a pain to navigate that way.

Transformers is a visual medium, so I don't think the fanbase has a huge blind following, but it's the principle of the thing.

Also-- disabled users who navigate using keystrokes will hate us to death for using javascript-based navigation. And that is a real concern. (As is the simple fact machines can't see the navigation... but I think a lot of that is created by javascript anyway?)

What is the 10% of work we can do to make our site 80-90% more accessible? -Derik 13:31, 23 January 2010 (EST)