Main Page redesign

[taosin]

Sorry, needed some time to well, shop for Christmas   :)

Some stuff first!
• New news weekly article up. Can we standardise on "Featured at the Paragon Market" as the general way we describe the routine weekly stuff? Unless something truly uber is in it maybe? Just for consistency but feedback!
Edited http://paragonwiki.com/wiki/Weekly_Strike_Target/pairs to show level ranges, so they show on the front page when copied and pasted. I think this works, and is useful so folks don't need to click through and check stuff? (esp as the duals often mismatch in level range). Added VIP as a requirement to the last two.
• Added one extra sentence in that section so it shows on front page for absolute newbies, explaining level ranges (I hope succinctly and usefully here). Is this worthwhile?
• Request: can an uber-admin-editor please add Known issues under Official NCsoft Site links in the left hand side of the main page?. Link is http://na.cityofheroes.com/en/news/known_issues/known_issues.php[/li][/list]
• Request: Is it possible for a bot or something to easily go through and change all occurrence in the wiki of "NCSoft" to "NCsoft" (note the s is lower case). I don't relish the thought of manually changing and would prefer the wiki to use the capitalisation that NCsoft iteself uses!
• And still slowly building a hero/villain working methodology for myself, and generating a list of pages I am spot checking, and mulling some posts here on Classification of tips. Will try some after Christmas. Noting the the concept of 'alignment neutral' keeps popping into my head as a shorthand. Will post anything sensible I get that may be useful here before I any swathe edits!

Main Page Stuff! Moar!

looking at http://na.cityofheroes.com/en/news/known_issues/known_issues.php and the recent posts in this thread and stuff:

• I would prefer to see the news column a fair bit narrower! To me it is too wide, generates white space, and so on. And the wider column seems harder to read.

Ideally, (again this is personal preference) no more than 2/3 to 3/4 of current width.

Noting in FFox 8 and IE9 the bottom of the columns never balance vertiucally at  bottom! I do not mind this!

The horizontal scroll bar disappears in FFox at around 1077 pixels. I would dearly like it to vanish at no more 1024 pixels (preferably 960 pixels, however). These two numbers are what I consider common minimums and the latter represents iPhone4 btw. But yes! horizontal scrolling way to go for smaller browser windows,  and very readable and usable at quite the small browser window size, love that.

-> I guess the above boils down to reducing the news column width so no horizontal scroll when the browser window is at 960 pixels? (but see futher down)

• I am working (mulling in Word atm) a merged sharper more focussed Welcome to the paragon Wiki and Helping out Article. Will post a draft here in this thread within a few days (if that is ok, or...?)

• Question, for the life of me I can't follow part of this thread, and it's not you it's me! 

So asking: In terms of space (not wiki construction!): if we had balanced columns, and all the first column was clear for news, and half the second column was also available: can news be made to magicwikily flow from all of column one to the allowed space on column 2? (i.e if agreed, can the page be constructed so it happens?)

The above if feasable and chosen to pursue more or less mandates an article merge of about and helping if that is to be done, I would think, before we go there?

[eabrace]

• Request: can an uber-admin-editor please add Known issues under Official NCsoft Site links in the left hand side of the main page?

Done!   :)

[Sekoia]

New news weekly article up. Can we standardise on "Featured at the Paragon Market" as the general way we describe the routine weekly stuff? Unless something truly uber is in it maybe? Just for consistency but feedback!

I have no objection to this.

• Request: Is it possible for a bot or something to easily go through and change all occurrence in the wiki of "NCSoft" to "NCsoft" (note the s is lower case). I don't relish the thought of manually changing and would prefer the wiki to use the capitalisation that NCsoft iteself uses!

Sure. SekoiaBot just fixed all 38 pages in the main namespace that suffered from this issue.

• I would prefer to see the news column a fair bit narrower! To me it is too wide, generates white space, and so on. And the wider column seems harder to read.

Ideally, (again this is personal preference) no more than 2/3 to 3/4 of current width.

What size screen resolution are you viewing it at?

Especially if we further revise and condense the content in the left column (as you suggested), I really don't see why we'd want to make it wider? That just means it'd have even less vertical fill.

Noting in FFox 8 and IE9 the bottom of the columns never balance vertiucally at  bottom! I do not mind this!

No, the bottoms of the columns won't line up. I didn't think it was valuable padding the shorter column with extra vertical whitespace to make its last box extend down.

The horizontal scroll bar disappears in FFox at around 1077 pixels. I would dearly like it to vanish at no more 1024 pixels (preferably 960 pixels, however). These two numbers are what I consider common minimums and the latter represents iPhone4 btw. But yes! horizontal scrolling way to go for smaller browser windows,  and very readable and usable at quite the small browser window size, love that.

I'm not sure it's possible to do this reliably without drastically overhauling the design. The easiest way to fix this would be to use shorter text in the popular destinations at the top. If you shrink the window, you'll see that the longest text entry in each of the four columns limits its minimum width (and thus the minimum width of the News column). If we shortened those, the minimum width would get narrower too. Conversely, if we make them longer, the minimum width would get wider. Thus, the minimum width will vary as the popular destinations change over time.

I'll think on it, but I'm at loss for a workable solution, and I personally think it's acceptable to have some level of scrolling at 1024.

• I am working (mulling in Word atm) a merged sharper more focussed Welcome to the paragon Wiki and Helping out Article. Will post a draft here in this thread within a few days (if that is ok, or...?)

It'd be better to post your draft on the wiki, under your personal user page or something.

I support changing the Welcome/Helping section, but I don't think it bears any substantial impact on the redesign I'm proposing, and I'd rather not hold that up for this.

So asking: In terms of space (not wiki construction!): if we had balanced columns, and all the first column was clear for news, and half the second column was also available: can news be made to magicwikily flow from all of column one to the allowed space on column 2? (i.e if agreed, can the page be constructed so it happens?)

No. This is not realistically possible.


At this point, I think there's only two points you're objecting to the current design on. Everything else in your post was tangential. The two points being:
- You feel the page should have a lower minimum width, so that horizontal isn't required at 1024 width (pref. 960)
- You feel that the News column should have a smaller minimum width, so that at higher resolutions some of the excess space goes into the right column.
I'll ponder these but I'm at a loss at the moment for any easy solutions.

[Sekoia]

Okay, here's two minor variants on the design:

Original, with right column at a fixed width
Revised, with left column at 65% and right at 35%

Which do people prefer?

Note that, due to the minimum width constraint, you won't see much of a difference between them until you hit around 1280px width and higher.


EDIT: I think I also have an idea on the other issue. Right now, the Quick Reference boxes are displayed as one row with four columns. With some Javascript, I think I can engineer it so that when the browser width falls below a certain threshold, it turns them into two columns and two rows. That will make the Quick Reference bar consume more vertical space, but less horizontal. So the question is, which is more important:
- Keep the News higher/more visible even if it means making the page wider
- Better eliminate scrolling at lower resolutions even if it means pushing the News down some

[eabrace]

i think I like the look of Main_Page_Three better.  The right column seems a bit cramped in the other mockup.

[GuyPerfect]

What on earth is "most recent"?

[taosin]

Sek: What size screen resolution are you viewing it at?
Especially if we further revise and condense the content in the left column (as you suggested), I really don't see why we'd want to make it wider? That just means it'd have even less vertical fill.

I thought *panic* i said "I would prefer to see the news column a fair bit narrower!"  Not wider! Screen resolution is 1920x1080 and the main page I looked at was too wide at that display compared to ... all (?) the other websites I usually access in work and social? (too wide the diplay with no horizontal scroll, I meant); and the news column sisproportionate, of course this is what this redesign is aimed at! Murphy's choise, maybe. Screen rez. no bearing on browser width should not be relevant here!

Sek: I didn't think it was valuable padding the shorter column with extra vertical whitespace to make its last box extend down.

Agreed! Don't mind it at all, like I said, was just an aside.

Sek: I'll think on it, but I'm at loss for a workable solution, and I personally think it's acceptable to have some level of scrolling at 1024.

It's not a deal breaker, but reducing the news column width would likely bring it back to 1024 width or less.

Another way to look at this is to open a new browser window (any browser) and open in tabs (say) https://secure.ncsoft.com/cgi-bin/accountManagement.pl?language=en  and also in a second tab http://na.cityofheroes.com/en/ . now Set make the browser window wide enough to display all the conent.

Then in a third tab open http://paragonwiki.com/wiki/User:Sekoia/Sandbox/Main_Page . What is people's experience when doing that?

For me I get the horizontal scroll bars (and no dealbreaker!) and all of news and some of right column. But right column is cropped. (That is, information is not shown).

It's here where I was suggesting that this not occur, by reducing the width of the left column a few pixels in the page design. So that when when a user at typical browser widths opens the page it is all there at a glance without a drag-acrss to see all.

Sek: [re revised welcome et al] [revised welcome et al] It'd be better to post your draft on the wiki, under your personal user page or something.

Wilco! Thank-you, wasn't sure best way to approach that!

Sek: [bal. columns and flow ] No. This is not realistically possible.

Good to know. Sorry, just wished to clarify.

Sek:You feel the page should have a lower minimum width, so that horizontal isn't required at 1024 width (pref. 960)

Not exactly. The minimum width is very small! I meant the width at which horizontal scrolling vanishes, not quite the same thing!

Sek: Original, with right column at a fixed width
Revised, with left column at 65% and right at 35%Which do people prefer?

Hmm, either arre substantially the same to most users at most tiumes as far as I can tell. they pack and unpack nicely, and at usual browser sizes both are fine to use.

on balance, Main Page Three.

Thanks for your patience with this.

[Sekoia]

Screen rez. no bearing on browser width should not be relevant here!

Yes and no. It's relevant in that having a sense for what resolution you're at allows me to better guess at trying to replicate on my screen what you might be looking at. But it's not relevant in that a user can always resize smaller, and we want it to work at a wide range of screen resolutions.


In any case... possibly good news! I had a "Eureka!" moment and I now have a new version to consider that may address the concern for lower resolutions:
http://paragonwiki.com/wiki/User:Sekoia/Sandbox/Main_Page_Two

If your browser width is above a threshold (currently 1024 pixels), the quick reference boxes are shown in a single row. If your browser is below that threshold, they are shown in two rows of two columns. The display automatically changes as you resize bigger/smaller as needed.

I dummied my screen down to 800x600 pixels and at that resolution, I can still see all four Quick Reference boxes, the Weekly Strike Targets box, the Patches box, and the headline and first two lines of text from the News box.

Note that I implemented this with JavaScript, which means you may need to refresh your cache to pick up the script; try that if it doesn't seem to be working. If JavaScript is disabled, then the user will be left with the single row of boxes.

Also note that the threshold isn't perfect. It won't be possible to make it perfect, since the widths of the quick reference boxes will change over time. The threshold value can be tweaked though if need be.

At this point, we now have five options. I am interested to know which of the five people prefer:
Option 1: Original Main Page
Option 2: Revised, with fixed-width right column
Option 3: Revised, with columns at 65%/35%
Option 4: Revised, with columns at 65%/35% and with quick reference automatically changing between 1x4 and 2x2 layout
Option 5: (No example to show) Revised, with fixed-width right column (as in #2) and with quick reference automatically changing between 1x4 and 2x2 (as in #4)

Barring any additional major concerns, I'd like to pick one of these and implement it (provided consensus prefers something other than #1). Once we have the new design in place, other non-layout considerations can be discussed separately.

EDIT: Actually, another option occurred to me. Instead of going from 1x4 to 2x2, we could just drop one or two of the quick reference boxes if the screen is too narrow (ie. change to 1x3 or 1x2). That would keep it at one row, while allowing it to shrink better. If there's strong interest in this, I can put up a demo of it. Consider this an "Option 6".

[Sekoia]

Hmm... Just thought of yet another option!
http://paragonwiki.com/wiki/User:Sekoia/Sandbox/Main_Page_Four

This time, if the threshold falls below 1024, the quick reference boxes use the full width and push the right column down below them. If that's not clear, just test it out and you'll see what I mean. (Again, a cache refresh may be necessary.)

Revised option list:

Option 1: Original Main Page
Option 2: Revised, with fixed-width right column
Option 3: Revised, with columns at 65%/35%
Option 4: Revised, with columns at 65%/35% and with quick reference automatically changing between 1x4 and 2x2 layout
Option 5: (No example to show) Revised, with fixed-width right column (as in #2) and with quick reference automatically changing between 1x4 and 2x2 (as in #4)
Option 6: (No example to show) Revised, with either columns at 65%/35% or with fixed-width right column, and with quick reference dropping boxes as the screen narrows
Option 7: Revised, with columns at 65%/35% and with quick reference automatically changing between using just the right column or using the full width

[taosin]

I'd prefer to see quickref. using full width all the time, personally. Seems to heads the page nice that way, and as right of page will always be less verticaly full than left...  though I'd assume you'd get white pace i that happened, true.

However! I also personally dislike the way the boxes go form 1x4 to 2.2, it jars at me when the main page of a well-used site jumps like that, I expect such to be faitrly stable.

So.. preference/vote here to dismiss any page with a 2x2 jump of quick ref in it.

Leaves 1, 2, 3, 6, 7.

Six I like, as is based on 3 (which I like) and with quck ref dropping of page too narrow

... erm... no point putting the quickrefs in right column and not across top? Seems almost to be the space there?

Thinking also it is holidays an mad time, maybe folks need a few days longert to  review and so on, I'm in no rish, anyway!

Again, awesome Sek, amazed how this stuff (demo pages) just whims up in an instant

[Aggelakis]

I like #7. That's very cool.

[GuyPerfect]

Still wondering what Most Recent is...

[Sekoia]

Still wondering what Most Recent is...

Surely you're smart enough to infer what it's intended to be, and your point is that the title isn't entirely accurate for that box's contents? If so, I agree with you. Unfortunately, when I noticed that same point, I couldn't think of a better title that was still appropriately concise--and I suspect that's why it was put that way in the first place. If you have some better ideas for the heading name, please do share them.

Since the heading is in both the original and my revisions, and since it can easily be renamed to something else without having any substantive impact on the proposed redesigns, I wasn't going to worry about it right now. After all, I started this thread to primarily focus on layout, not content.

[GuyPerfect]

Surely you're smart enough to infer what it's intended to be, and your point is that the title isn't entirely accurate for that box's contents?

Tisk tisk. I haven't the foggiest what it's intended to be. Most recent edits? No, that's not it. News posts? Hrm, not that either. Based on the contents it seems to be Paragon Market-related, but the most recent in that are, like the news shows, the Winter Holiday Pack and a discount for character slots, so I'm grasping at straws here.

If it is supposed to be the Market features and is just out of date, then I'd pitch "On the Market" as the heading.

[eabrace]

Unless the intent is either "most recently added articles" or "most recently edited articles", I'd have to agree that I don't know what the intended purpose of that section is.  It's never really hit me that the articles that show up there don't really seem to fit either of those since I rarely visit the main page.

[Sekoia]

Well, I suppose if you want an authoritative answer on what it's original intent was, we'll have to prod Agge on it since she's the one who originated it. I always took it to mean something along the lines of "most recently added articles of note". *shrug*

[Derek Icelord]

As an "average joe" user, I think the most recent revision of the main page in Sekoia's sandbox space is the most appealing for both aesthetics and function.

As for the "Most Recent" column, whatever it's supposed to be I would suggest "Recently Edited" or "Recent Edits", "Recently Added", or "Recently Visited", whichever one fits the category.

[taosin]

Adding to the mix, while I think of it and this topic is up:

Is it worth considering a two line new box in one of the column spaces (low?), that shows the following or something like it? (and if we did does it break what the wiki is about etc).

Current world times:
4:00AM PST•7:00AM EST•12:00Pm GMT•1:00PM CET

Why?

Not all players are US based or in the main timezones supported by NCSoft. Such an at-a-glance small discrete real-time display would be incredibly handy (at least for some!) when working out when the d**n servers are going down for maintenance for updates. (every thursday 11PM for me atm, plus many tuesday PM too, sigh). And it takes up tiny real estate.

For example: we see "The Live European and North American City of Heroes servers will be taken offline for a Publish on Thursday, December 15, 2011. Start Time: 4:00 a.m. PDT /7:00 a.m. EDT / 12:00 p.m. GMT/ 13:00 CET Expected Duration: 4 hours..."

I think if you wanted to the times can be pulled from services available at timeanddate.com; my own world clock I keep handy, to work with other players, is at http://www.timeanddate.com/worldclock/personal.html?cities=240,224,179,24,220,136 by the way.

Just a thought!

[Sekoia]

There isn't a strong consensus but I get the impression that this option has the broadest appeal: http://paragonwiki.com/wiki/User:Sekoia/Sandbox/Main_Page_Four
And nobody sounds like they'll be overly upset by it. So unless there are any strong objections, I'll plan to update the Main Page with this within the new few days.

There are still other suggestions pending, such as overhauling the About section and possibly adding other things. These changes can always be applied in subsequent updates.

Is it worth considering a two line new box in one of the column spaces (low?), that shows the following or something like it? (and if we did does it break what the wiki is about etc).

We can easily do this using pure wiki code (using the #time parser function). Here's a demo page:
http://paragonwiki.com/wiki/User:Sekoia/Sandbox/Time
Unfortunately, it won't update in real time. It shows the time on page load only. I don't like that. If we do it, it should update in real time.

Updating in real time requires JavaScript, which is additional bloat on the main page. It can be done. If it's decided we want to do this, I can look into making it happen.

However... I honestly don't see a need for this. If I want to know what the world times are, I can go to timeanddate.com. This feels like it's outside of the scope of what ParagonWiki is about. No doubt some of our users would find it useful. No doubt we'd also have users who'd find it helpful to have a calculator there, or the server statuses, or any number of other utilities. None of that information is wiki-centric, though. I'd prefer not to include it.

[taosin]

Sek: I'll plan to update the Main Page with this (main page Four) within the new few days.

Cool and luverly! And ty for the time on this.

Sek: Updating in real time requires JavaScript, which is additional bloat on the main page. It can be done. If it's decided we want to do this, I can look into making it happen. ...However... I honestly don't see a need for this.

Yep. agree, after seeing the reasoning and also greatly wanting the main page to be slim taut and terrific (with a defined six pack? :) ). If it's adding bloat not a good idea at all. Can it!?!

Sek: There are still other suggestions pending, such as overhauling the About section and possibly adding other things. These changes can always be applied in subsequent updates.

Agree absolutely. Increments are fine and having a visual of the new live main page will help me greatly. I'll have something within a day or two and will should it in a new topic for clarity?

(rushed reply at work, apologies for any perceived terseness!)