User talk:Aichon/Sandbox/Demo13

Rationale

First off, I realized that without putting the links at the top and stretching them out horizontally, there really was no way to make them all visible to a person visiting the page. So, instead of trying to force the issue of making them visible, I focused on our original goal, which was to make players aware of them. Towards that end, I put them in a single-file column that is immediately visible when the page loads. As a result, while not all of the links are immediately visible, a visitor to the page would easily understand that there are additional helpful links below the ones they can already see.

Second, I felt like we were missing an opportunity to group some other content. Game news, wiki news, and UD History are all about events that are happening or have happened, so it makes sense to group them together, that way people can tell at a glance what all is going on. Unfortunately, all three of those have content of variable sizes, which means that we need to group them vertically, rather than horizontally. As a result, the only place to put them is opposite the column of links, so I placed them on the right and the links on the left since it's both closer to what we have now and just generally felt better visually.

Third, I still needed to address low res screens, and with columns on both sides, that gets a bit tricky. To try and handle that, what I did was set up the Community Projects and Featured Article sections to automatically try and rearrange themselves so as to best make use of the space available, thus minimizing the amount of awkward whitespace. At low resolutions, they either rearrange themselves into a single column or else move down the page to places where there is more space available.

It's definitely not perfect, however. For instance, to try and make that rearranging stuff work as nicely as possible, I used a few paragraphs of fluff wording that is essentially just wasting space. I'd love to replace it with something that's actually useful. Also, the code for it is atrocious right now, since I wasn't cleaning up old stuff as I made changes and scrapped failed ideas. It needs to be cleaned up and templated out at a minimum, and that's assuming it's an acceptable design in the first place, of which even I am not convinced. Nonetheless though, I feel that it warrants a quick discussion. —Aichon— 05:05, 15 October 2012 (BST)

Quick note: the switch to having FA and CP above/below each other means that the fluff text is no longer necessary. Yay. Now, for bed! —Aichon— 08:33, 15 October 2012 (BST)

I like this. --Ross Less Ness ^{Enter Stranger...} 11:32, 15 October 2012 (BST)

A lot of the center text needs to go and this actually looks pretty gnarly on small screens because of the left hand menu column. —The preceding unsigned comment was added by Karek (talk • contribs) 02:44, 18 October 2012 (BST).

Is that rad/bodacious gnarly or tangled/difficult-to-use gnarly? As for the center text, feel free to edit and remove text (that goes for anyone reading this). Assuming I remember to, I'll remove most of it tomorrow and replace it with just a few lines of text probably. —Aichon— 04:29, 18 October 2012 (BST)

Its the tangled/difficult to read variety. FA is squished into a little box between the two groups of tables and CP is pushed down below everything and is 100% of the width of the page. Honestly, I'm resigned to the fact that Main Page is gonna look stupid on mobile screens no matter what is done.

One suggestion for the replacement text: Since it seems aimed at newbie wiki users, why no link to {{Welcomenewbie}} with text to the timbre of "If this is your first time using UDWiki, see see here for some helpful tips for getting started". Currently, you're being explicit with some information but in a very verbose way and some helpful tips for newbies is left out. ~ _{15:25, 18 October 2012 (UTC)}

Regarding FA and CP, most of what you described was intentionally designed that way. When the window is wide enough, FA and CP will both be in the middle. As the window gets smaller, first CP will be bumped down, then FA will be bumped down. If you feel that they are getting too squished before they get bumped down, however, that's something I can tweak (if you think they look squished here, you should see what they look like on the current main page :P). Right now, I have them set to get bumped down when they are squished to under 310px. I picked that number as a compromise between letting them get too narrow and bumping them down too early, but if you think a different number would be better, feel free to edit the page accordingly. Same thing for the welcomenewbie text you're suggesting. —Aichon— 16:58, 18 October 2012 (BST)

It's fine. Despite my initial misgivings about how the page looks at low screen res, I don't think we should spend a lot of effort trying to make a mobile friendly main page. If anything, perhaps a separate page like Main Page/Mobile that's more mobile friendly. I may have time to edit the text later if you don't get to it first. ~ _{18:05, 18 October 2012 (UTC)}

See if it's any better. I removed a lot of text and tweaked the way that FA and CP operate slightly, that way they drop down together, rather than orphaning one. It leaves whitespace on the page at certain resolutions, but it might be more consistent. —Aichon— 20:57, 19 October 2012 (BST)

I'm a fan. Only question: why is the Wiki a "secondary resource" as opposed to a "primary resource" (it's the biggest resource around) or just a "resource"? Bob Moncrief ^EBD•W! 21:01, 19 October 2012 (BST)

More or less, I was borrowing from an idea that already existed on the main page regarding the official FAQ being the primary resource and this wiki being something in addition to that, but I think you're right. Rephrased. —Aichon— 21:19, 19 October 2012 (BST)

Just a thought: nav links could go in the top UD header space. --  AHLGTG THE END IS NIGH! 01:18, 20 October 2012 (BST)

If we had Javascript, sure(think drop downs). Or just an absurdly cut down number of links. Normally you don't really want to go much beyond 6 for something like that. --Karek^{maps 2.0?!} 04:01, 20 October 2012 (BST)

After Karek and I talked a week or two ago, we realized this was actually possible by editing the site's CSS. I've put up an initial version using these new menus in place of the left-hand side navigation I used to have. The result is definitely less cluttered, but the menubar could use some snazzying up still. Even so, I wanted to get this up as quickly as possible so comments could start coming in on whether it works across a wide variety of browsers. The menu I borrowed is supposed to work as far back as IE7, but I may have made changes that broke backwards compatibility. —Aichon— 18:00, 29 October 2012 (UTC)

New Version

Hi Aichon! So the User:Aichon/Sandbox/Templates14 inclusion at the top is producing an eight-row list of alternating headers and squished-together links above the UrbanDead box at the top of the page. Is this intentional? I'm in Firefox if it's browser-dependent.

The rest looks great from here. Great job! Bob Moncrief ^EBD•W! 20:01, 29 October 2012 (UTC)

You need to do a "force refresh" (Ctrl+F5 in Firefox) before you'll see the changes, since I modified the site's CSS and you apparently don't have those changes yet. It should look like a menu that's centered at the top. —Aichon— 20:05, 29 October 2012 (UTC)

I'm on a Mac so all my Ctrl+Fs are different (Ctrl+F5 opens VoiceOver). I tried doing the full cache-clear but it still looks the same. Firefox 16.0.2 by the way. Bob Moncrief ^EBD•W! 20:10, 29 October 2012 (UTC)

I see a bunch of run-on and jumbled links as well. -MHSstaff 20:14, 29 October 2012 (UTC)

Ok, rather than answering it for everyone who asks, just go look up "force refresh" for your browser of choice and see how to do it. If you guys are seeing a jumbled mess, the problem is that your browser is still using an outdated version of the wiki's CSS file and you need to update it. Simple as that. It'll be obvious when you get it right. —Aichon— 20:23, 29 October 2012 (UTC)

Anyone gotten it working? Thoughts? —Aichon— 21:05, 29 October 2012 (UTC)

Still not working for me. I've tried everything the first few pages of google lists, and restarted my computer to boot. Are we sure there's nothing wrong with the CSS? Bob Moncrief ^EBD•W! 21:08, 29 October 2012 (UTC)

There may be problems with the CSS, sure (that's the point of testing things, after all), but you should be seeing something styled up regardless, since none of these changes were particularly odd or unusual (i.e. they're all very "safe" changes that should be compatible with pretty much everything from the last several years). If you're not seeing it, the only reason is that your browser's cache is still holding onto an outdated copy of the CSS for the site. Were this my own site, I could force a refresh from this end by simply changing a line of code, but it's not, and sysop abilities don't give me the access I need to do so.

I assume you've tried both force refreshing and actually manually emptying your cache, correct? —Aichon— 21:19, 29 October 2012 (UTC)

Yep, done both. I do want to reiterate that other than the stuff at the top, the rest looks fantastic. Bob Moncrief ^EBD•W! 21:23, 29 October 2012 (UTC)

Well, why not try popping it open in Safari and/or Chrome (i.e. anything else), that way I can get some feedback on how the new thing looks? We can figure out the technical stuff later, but for now we can at least get some feedback going on the design of it. —Aichon— 22:01, 29 October 2012 (UTC)

Same exact issue (appearance identical) in Safari and Chrome, even after clearing the cache of both of those. (And I'm pretty sure I've never accessed UD or UDWiki in Chrome before, so the cache-clearing shouldn't even have been necessary.) Bob Moncrief ^EBD•W! 22:41, 29 October 2012 (UTC)

Ditto. Maybe the stress of becoming a Bureaucrat has finally caught up to you? How about posting a screenshot of what it should look like, and that way you can get some feedback while waiting to be committed to the asylum?-MHSstaff 22:54, 29 October 2012 (UTC)

I was actually about to ask for screenshots from you guys. :P I don't have time to post a screenshot atm, but it should basically look like one of the boxes on the right side, but stretched thin and with no links inside of it, and the green bar where the title is in those right-side boxes has four drop-down menus as you hover over them. —Aichon— 22:55, 29 October 2012 (UTC)

File:FirefoxSS4Aichon.jpg. It's the same in all three browsers I use. Sorry for the low image quality, but I'm terrible at using Grab. Bob Moncrief ^EBD•W! 23:08, 29 October 2012 (UTC)

The problem isn't caching. The problem is that common.css was borked when K updated the wiki software back in April '11. Nobody has been able to (or perhaps hasn't tried) to fix it since then. For those that are having problems with display, try changing your skin in you user preferences on the appearance tab. I use Urban Dead 3 skin. Monobook is a good alternative. ~ _{00:01, 30 October 2012 (UTC)}

Someone make this man a sysop. That fixed it for me. That said, most people are going to be using the default skin anyways (or may not know to switch) which sorta makes this a deal breaker IMO. -MHSstaff 00:07, 30 October 2012 (UTC)

Well Aichon could fix the CSS issues since a) he seems to know what he's doing and b) he seems to like responsibilities. And yeah, after the update, we had similar issues. The biggest hurdle was the changes to allowed number of characters in signatures. Dozens of sigs broke. I'm surprised it hasn't been an ongoing problem. See Help:Wiki Update for more info. ~ _{00:15, 30 October 2012 (UTC)}

*grumbles about the wiki issues* Well, if it doesn't work in the default theme, I'm not sure what I can realistically do then, since I agree that it's a non-starter if it doesn't work in the default theme. Nor am I aware of any ways around it, unless one of you guys can point me somewhere that I can edit the CSS that will appear in the default theme. —Aichon— 00:28, 30 October 2012 (UTC)

Yeah idunno. I was hoping you'd like already know what I had failed learn on my own back then. You'd think it would be a MediaWiki:UrbanDead.css similar to MediaWiki:Monobook.css but noooo, that would be too simple. K could easily disable that skin I think or make another skin the default. Maybe he could be convinced. That skin is really quite hideous. ~ _{01:12, 30 October 2012 (UTC)}

Yeah, if he made UD2 the default and rolled all UD users over to UD2 while disabling UD, that'd fix the issue instantly (and solve a number of others too, I think). I'm actually curious what would happen if I made MediaWiki:UrbanDead.css. I think I'll try... —Aichon— 01:18, 30 October 2012 (UTC)

Only other idea I have so far is that I could hide the links by default and rig it to instead have a notice directing people to their preferences if they had an incompatible skin selected. —Aichon— 01:33, 30 October 2012 (UTC)

Looks bloody awesome Aichon :D A ZOMBIE ANT 00:12, 30 October 2012 (UTC)

It is supposed to look like this, right? i dig. A ZOMBIE ANT 00:20, 30 October 2012 (UTC)

Yep, for now, that's what it looks like on my side. —Aichon— 00:28, 30 October 2012 (UTC)

Eh

Why are we putting links at the top? It was looking so spiffy. --Ross Less Ness ^{Enter Stranger...} 23:47, 29 October 2012 (UTC)

[this iteration seems better in almost every way. --Ross Less Ness ^{Enter Stranger...} 23:49, 29 October 2012 (UTC)

Yeah, it looks kinda awkward and out-of-place, especially in contrast to the big banner right below it. -MHSstaff 00:08, 30 October 2012 (UTC)

Also that version fitted all the important stuff on my screen without the need to scroll, which is nice. --Ross Less Ness ^{Enter Stranger...} 00:10, 30 October 2012 (UTC)

This new one adds roughly 30px to the top of the screen, but it's MUCH more versatile, since we can now add numerous additional links without taking up any extra space on the screen. That completely eliminates all of the issues we used to have with link boxes pushing each other around and being awkward. Another reason to go for this instead of what I had before is that my old design had a lot of awkward whitespace when you viewed it at a number of different resolutions, which DDR pointed out back on A/PT. This new design effectively eliminates that problem (seriously, a three-column layout on this wiki just doesn't work unless you're willing to throw the low-res users under the bus, of which we apparently have a decent number). In response to your edit note about it not even being useful links, they're the exact same links I had in the version you linked as being better. The only one that changed was that I moved the Suburb link since I couldn't have nested menus with this current design. —Aichon— 00:37, 30 October 2012 (UTC)

That's just a style issue. I agree that it looks quite awkward as it is right now, which is actually why I stopped where I did to get some feedback before I went any further. One thought was to simply re-add some of the links Karek and I had removed from the front page, maybe making it 5 or 6 menus instead of 4. An alternative is to simply stretch it horizontally and maybe do away with the double border thing, instead going for a more traditional looking menu bar. Yet another option would be to simply left-align it and make it sit on top of the header like a set of tabs. I'm very open to suggested alternatives, but I think an approach along these lines is the right way to go, assuming we can get the issue related to themes figured out. —Aichon— 00:37, 30 October 2012 (UTC)

I like it. As long as we get the skin issue sorted out. ~ _{02:28, 30 October 2012 (UTC)}

Hrm. Assuming that the links should be clickable. They aren't clickable on touchscreen. I can touch to expand the menus but then trying to select a link collapses the menu again. ~ _{02:32, 30 October 2012 (UTC)}

Really? Dangit. The CSS I borrowed said it could handle an iPad, but it's possible they were wrong or that my changes may have broken that aspect of it. —Aichon— 03:23, 30 October 2012 (UTC)

Both my tablet and phone are Android. Maybe its only compatible with iOS or maybe its the browser. The market will soon be flooded with touchscreen devices since Windows 8 came out this weekend. Might be something to consider. ~ _{03:45, 30 October 2012 (UTC)}

Just tested on my iPad and it doesn't work for me either. I can't even expand the lists from what I saw. As for touchscreens, while I have no doubt at all that they'll become a lot more pervasive as we get past this holiday season (and should thus be taken into account), I doubt that the Surface will be making up much of that. Its launch this week has been pretty lackluster, and I saw a survey today that said over half of Americans weren't even aware of Windows 8, and of the people that were, 2/3 were planning to skip it. I expect the Nexus 7, Kindle Fire, and iPad line to sell well this holiday. The Surface? Fourth place, unless they can really up their game. In the meantime though, I've seen a lot of scathing reviews that are turning away customers, and my own experience with Windows 8 was horrific enough that I won't be installing it at home over my Windows 7 copy, despite the fact that I have quite a few already-paid-for licenses I can use for myself. —Aichon— 04:04, 30 October 2012 (UTC)

Give a bro a license? ;) A ZOMBIE ANT 09:47, 30 October 2012 (UTC)

wiki news pushing things down

This has sort of become a problem already. I've been thinking of logistics of moving one of the boxes under it to a widened box under the community stuff... The only realistic option in that regard is putting game news in the widened left column instead (as the 'this day in urban dead' wouldn't work as a wide one I think). Gotta be honest, for this reason I really like yours better Aichon though I see why this one is logistically neater, I just can't get past the wiki news problem.

Maybe we could even make a new wiki news bar on the left column under the community section. In fact, it might be quite at home there. It could be widened and neatened up and that way there'd be no issue with it being too long or too short and ruining the rest of the page.... A ZOMBIE ANT 00:17, 30 October 2012 (UTC)

Yeah, that's part of the reason I updated the wiki news template: I wanted to demonstrate what happens when we have a lot of news, but the fact that wiki news can get large is exactly why I designed it this way in the first place, since it pushes down stuff that most people don't need to see. And, as I just mentioned up above, a three-column layout, while it can look great at higher resolution, just isn't as functional at lower ones, and we do have some users with lower resolutions, so we don't want to completely abandon them on something like the main page of the site. Honestly, having lots of news is a temporary problem that generally alleviates itself after two weeks, and the only things it pushes down are the Game News (which virtually never updates) and the UD History (which only updates once a month). Also, for your sidebar idea to work, we'd have to put a template in the Sidebar to give general users access. I can see bad things coming out of that if someone felt malicious. They could effectively make the entire wiki go blank with just one edit. —Aichon— 00:46, 30 October 2012 (UTC)

Hmm. That does sound troubling. Although I'm not sure we're on the same wavelengths. I didn't mean the sidebar of the wiki (though I'm not sure if you did either)... I just mean stretch the Wiki News template out to be wider and stylistically similar to the "feautred article" and "community project" boxes and then place it below them- for all intents and purposes it's the same template, just placed elsewhere. It'd be at the bottom so wouldn't affect any other templates if it got longer. A ZOMBIE ANT 02:11, 30 October 2012 (UTC)

Gotcha. Well, I still wouldn't move the wiki news, to be honest, since that's something that you don't want off the front page, and on low resolutions, it would be pushed off by FA and CP stuff. I could always bump the widths up on the right column, or else knock the font sizes down a bit. —Aichon— 03:25, 30 October 2012 (UTC)