User talk:Zozart/category test

Now implemented

The third version of this two-column layout has now been implemented in Category:Level Design. --JeffLane 12:29, 10 Mar 2006 (PST)

Is it OK for us to extend it to other categories too? --TomEdwards 08:45, 13 Mar 2006 (PST)

Yes. The only thing to keep in mind is that this current set of templates requires 1 single cell on the left side, with 1 or more on the right. I just used two cells for Hammer Editor Documentation. --JeffLane 09:38, 13 Mar 2006 (PST)

General Feedback

Wow, it looks even better than I imagined! I'll try making some background icons. --TomEdwards 09:16, 21 Jan 2006 (PST)

Looks like the Wiki can't handle bg images. :-/ --TomEdwards 09:30, 21 Jan 2006 (PST)

Yes, it wraps an image tag around the image... However, if we could get the go-ahead from one of the administrators we could request for a background image to be uploaded for us to reference directly. `zozart ^.chat @ 10:02, 21 Jan 2006 (PST)

I'm not sure that the location of the file would make any difference...--TomEdwards 10:06, 21 Jan 2006 (PST)

Oh, yes, you're right. It strips out any tags or properties related to a background-image. However, my suggestion still stands, as an administrator could add the background image in the wiki .css file instead. `zozart ^.chat @ 12:45, 21 Jan 2006 (PST)

I like it a lot. I've just edited the Dystopia entry to use this new lay out: —Fuzzy ^(talk  )

I like it too, a lot more usable now. :) --Campaignjunkie ^(talk) 15:40, 21 Jan 2006 (PST)

Low-HTML versions

First of all, I think this is a good effort, and absolutely worth addressing. The category page has needed a bit of an overhaul as it is now much larger than the original design allowed. I just added another version on the bottom the page that is cleaner and uses significantly less HTML, though it is not all eliminated. The main advantage is that it's easier to read and edit the text. The main disadvantage is that the open and close <div> markups are harder to track. I also reorganized some of the links to more closely match the needs of beginning users.

There are some significant problems with creating formats using mixed HTML and Wiki markup simultaneously. The idea of the VDC is to keep formatting as simply as possible. The more HTML is involved, the more difficult it will be for many users to successfully follow basic formatting guidelines. This is true when they wish to edit that page, or when they go to create a brand new one with the same formatting. Regardless, please do not change the actual Category:Level Design page until we can discuss the issues with one of our interface designers next week. If the desire is that the formatting matches the Main Page, we may decide to simplify the front page instead of making all of the other pages more complex to edit. Finding a layout for this page that uses almost no HTML would be ideal. --JeffLane 17:56, 21 Jan 2006 (PST)

---

We could use templates for the div's, e.g. {{Start Category}} and {{End Category}}? That would eliminate alot of the repeating clutter. It would also make it slightly easier to track where the div's start and end, since they'd be named (e.g. matching up {{Start Category Section}} with {{End Category Section}} -- the Section would be the identifier). Finally, this would eliminate all the visible HTML on the page, leaving only templates with friendly names. On the downside, there would still be at least two start/end's to match up (we could compress two of the div start/end's into one template, as they are directly nested), but templates would certainly make them more manageable.

To example, this:

== Tutorials ==
<div class='capsule'>
<div class='captop'><div></div></div>
<div class='capcontent' style='text-align: left'>
=== Beginner ===
<div class='categoryboxout' id='beginner' {{CategoryBox}}>
==== General ====
* [[Getting_Started|Building your first room in Hammer]]
* etc...

Would become this:

== Tutorials ==
{{Start Category}}
=== Beginner ===
{{Start Category Section|beginner}}
==== General ====
* [[Getting_Started|Building your first room in Hammer]]
* etc...

In this case, if the user clicks 'Edit' on a single category box, then they'll only be shown two, aptly named, template markups. `zozart ^.chat @ 02:04, 22 Jan 2006 (PST)

This would be a good way to go if the page uses many divs. Templates can be tricky though, because they're not standard markup, so new users can have difficulty finding and using them. --JeffLane 20:09, 23 Jan 2006 (PST)

Alternate simplified designs

I added a couple more suggestions to the page that use only Wiki markup. I also removed a number of the headers that were in the original design that did not seem particularly necessary, but added visual noise and excess edit links.

I discussed some of the issues raised on this page with our internal UI and design pro, and he agrees that HTML and complex code should be avoided in standard designs if we can. That's one of the trade-offs of Wiki markup -- you gain simplicty of editing at the cost of some visual flexibilty. This is not written in stone, however. That's what is great about the Wiki concept. --JeffLane 20:09, 23 Jan 2006 (PST)

I vote for the third option. It's relatively simple and the sections are more clearly defined than in the second version. --TomEdwards 01:01, 24 Jan 2006 (PST)

I added some colours from the original version. What's the general feeling on the lower/higher contrasts? --TomEdwards 01:06, 24 Jan 2006 (PST)

Agreement with the third option, especially with the new colours. I like the subtle colour difference between the left and right column. The focus on wiki-markup is also a plus; it's not so much a minefield to edit now. Templating the table markup is a good idea, and thanks to the versatile nature of templates it'd be easy to change the colours on the fly, e.g. {{Category|background=#f5f5f5|border=lightgray}} `zozart ^.chat 04:13, 24 Jan 2006 (PST)

Were you thinking of something like this?

{{category header}}

{{category newcolumn|rowspan=6|background=#f5f5f5|border=lightgray}}

{{category cell|rowspan=1|background=#f5f5f5|border=lightgray}}

{{category newcolumn|rowspan=1|background=#FBF7EA|border=lightgray}}

{{category cell|rowspan=1|background=#f5f5f5|border=lightgray}}

...

{{category end}}

That would allow for different configurations of cells, yet keep the basic design more centralized. The {{category end}} isn't strictly necessary, since it would always be a |}, but it might make more sense to someone less familiar with the templates. --JeffLane 10:32, 24 Jan 2006 (PST)

Aye, this works well. It allows for sufficent customisation without alienating those new to wikipedia or causing too much confusion. `zozart ^.chat 09:55, 25 Jan 2006 (PST)

Added category templates

I added some basic category templates as discussed above. They are as follows:

• {{category header|background-color|border-color}}

Used at the top of the category to start the table.

• {{category newcolumn|rowspan|width|background-color|border-color}}

Used every time a new column is needed, one is always needed right after the header.

• {{category cell|width|background-color|border-color}}

Used every time a new cell is wanted within a column.

• {{category end}}

Closes the table.

These are very basic right now, with simple parameters. I updated the 3rd design to utilize these templates. --JeffLane 15:44, 26 Jan 2006 (PST)

That looks great. It's simple yet retains a good amount of customisation. `zozart ^.chat 10:54, 27 Jan 2006 (PST)

Dual-table design

I've added a fourth design which uses two nested tables in order to allow sectioning for both columns (previously it was only the right column). I also brightened the colours slightly from TomEdwards' third design and alternated white and light grey backgrounds between sections. HTML usage is still at a minimum, and this also eliminates the need for the rowspan attribute. However, the two columns no longer seamlessly connect, as one can be larger than the other. `zozart ^.chat 05:01, 24 Jan 2006 (PST)

Not so keen on having two tables, it seems less organised. It isn't so bad to have only one cell on the left, seeing as we're going to want continuity between each table instance anyway. If push came to shove there could be a sub-table within the left cell, too. --TomEdwards 05:34, 24 Jan 2006 (PST)

I'm not thrilled about the rowspan attribute that I had to use in the third design, either. I tested some designs like this without it and I found the same problem with the design looking uneven. I think it would only work with a borderless design. --JeffLane 10:10, 24 Jan 2006 (PST)

I've fixed the remaining problems. All it needs now is conversion into templates and official approval. This has been dead in the water far too long. --TomEdwards 02:17, 14 Feb 2006 (PST)

Decent solution. It does has several issues, however. Firstly, it does not line up vertically (look at the top section heads). You can add a valign attribute, but I believe it will still be difficult to get it to line up correctly on the bottom (due to the different padding of the left and right columns). Secondly, due to the different padding and cells of the two sides, as well as the required </div> tags, it looks fairly difficult to make simple templates. I made a quick attempt at making templates and discovered the number of templates, as well as the number of parameters in each template, would have to be higher than I think is practical. There could be something I'm missing though, so if you want to make some test templates, go ahead and give it a try. --JeffLane 16:09, 14 Feb 2006 (PST)

So what's the current consensus / decision on the whole category test in general? I think this category redesign is pretty important - there's so much information on this wiki, but it's difficult for newcomers to find it, or even regular users to find it. I'm not very well-versed in all this template-stuff, so I'm just going to whine until someone else figures it out. ;) --Campaignjunkie ^(talk) 22:57, 9 Mar 2006 (PST)

We are preparing to implement this. This is not far off. --JeffLane 00:04, 10 Mar 2006 (PST)

Edit links test

I removed some Edit-links of the first design, by replacing Wiki-headline codes with HTML-tags. --King2500 12:55, 26 Jan 2006 (PST)

I've reverted my changes, because wiki has a bug with HTML headline-tags placed by the user. Sorry. --King2500 13:01, 26 Jan 2006 (PST)