Last modified: 2013-04-27 06:32:55 UTC

Wikimedia Bugzilla is closed!

Wikimedia migrated from Bugzilla to Phabricator. Bug reports are handled in Wikimedia Phabricator.
This static website is read-only and for historical purposes. It is not possible to log in and except for displaying bug reports and their history, links might be broken. See T46333, the corresponding Phabricator task for complete and up-to-date bug report information.
Bug 44333 - Account creation interface doesn't handle resolutions between 980 and 1175px properly
Account creation interface doesn't handle resolutions between 980 and 1175px ...
Status: RESOLVED WONTFIX
Product: MediaWiki extensions
Classification: Unclassified
E3 Experiments (Other open bugs)
unspecified
All All
: Normal normal (vote)
: ---
Assigned To: Nobody - You can work on this!
https://en.wikipedia.org/w/index.php?...
:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2013-01-25 02:53 UTC by Isarra
Modified: 2013-04-27 06:32 UTC (History)
8 users (show)

See Also:
Web browser: ---
Mobile Platform: ---
Assignee Huggle Beta Tester: ---


Attachments

Description Isarra 2013-01-25 02:53:34 UTC
The interface looks terrible on small resolutions as a result.
Comment 1 Steven Walling 2013-01-25 03:35:53 UTC
This bug report is far too generic to be useful. Closing as WONTFIX. Next time specify something more constructive than "looks terrible".
Comment 2 Matthew Flaschen 2013-01-25 05:22:04 UTC
It does to some degree.  There are @media blocks with these queries

@media (min-width: 768px) and (max-width: 979px)

@media (max-width: 767px) {

which control certain classes.

See acux.css in the source.
Comment 3 spage 2013-01-25 05:47:39 UTC
Isarra, there's a somewhat permanent experiment on enwiki that presents a better UI to anonymous (logged-out) users creating an account.  If you see a big blue [Create account] button then you're seeing the experiment, and if you see a ton of verbiage and a CAPTCHA before the form then you're seeing the original. Which did you see?

As Matthew says the better UI is sort-of responsive (it doesn't list benefits on the right at low resolutions) and I find it somewhat usable on an Android screen; the biggest problem for me is the error tooltips appear to the right in space the vector skin thinks is available.

There's also a special signup form for mobile users in development, available if you opt in to the mobile beta.
Comment 4 Andre Klapper 2013-01-25 09:31:14 UTC
Isarra: https://www.mediawiki.org/wiki/How_to_report_a_bug could be worth a read for future bug reports so everybody saves some time in the long run (hopefully).
Comment 5 Isarra 2013-01-25 16:26:24 UTC
I'm sorry, I thought this bug would have been clear from the name. That the information on the right is not well-handled at low resolutions is a bug - responsive design would, at low resolutions, either make it fit if it is important or remove it entirely if it is not. Allowing it to simply be pushed under everything else is not only unhelpful, but potentially disruptive of the user when trying to create an account, as such information should be coming before they create an account, not after the call to action, which is just confusing.

From looking at it in chromium, however, it does appear that a more responsive design was attempted, as sometimes it does remove the content at particularly low resolutions... but there is a definite middle ground where the why stuff is still very much there and in a decidedly strange place.
Comment 6 Matthew Flaschen 2013-01-25 20:33:57 UTC
The bug still doesn't have enough information.  Please provide the width and height of the screen you're using, as well as the browser.

It would help if you make a concrete suggestion.

I believe the reason it doesn't come first is so they don't get distracted before they see the real form.
Comment 7 Isarra 2013-01-26 18:12:01 UTC
Okay, apparently it's between 980 and 1175px wide, browser inspecific (affects opera and chrome, at least), OS-inspecific (originally ran into it on a mac, hence why I have no bloody idea as to any of the details, thankyouverymuch).

Between these resolutions, the 'Why create an account?' is placed below the form itself. Especially given that it would still fit at these resolutions if formatted better, this seems quite odd, and is indeed distracting, especially if one happens to want more information, as the 'Why create an account?' does a very good job of camouflaging that link.

At less than 980px it goes away entirely, which is probably what it should be doing at the larger resolutions as well if it can't be made to fit on the right even in abbreviated format.

That said, if I say something looks bad, I would have thought the suggestion to fix it should be bloody obvious - make it not look bad. There are many ways to do this, and being generic leaves the matter open to anyone with an idea, which is important when those who tend to work with specifically this area of design would probably have a lot more of an idea how to handle this properly than I would.
Comment 8 Bartosz Dziewoński 2013-01-26 18:15:18 UTC
Confirming as seen on https://en.wikipedia.org/w/index.php?title=Special:UserLogin&type=signup , and reopening.
Comment 9 Bartosz Dziewoński 2013-01-26 18:37:11 UTC
Also, I am on Opera, and I think so is Isarra.

Here's a CSS snippet that fixes this for me, and is basically much saner than what is being done there right now. Of course this will have to be cleaned up when merged with current CSS, and the code for hiding the right panel on small resolutions will have to be adjusted (as this seems to break it).

.acux { display: table; }
.signupstart, .signupend { display: table-row; }
#userlogin, .acux-benefits-container { display: table-cell; float: none; }
.acux-benefits-container { margin-left: 0; padding-left: 50px; }
Comment 10 spage 2013-04-27 06:32:55 UTC
I'm closing this since the experiment is over.

However, the new vertical-format create account form that we're introducing[1] has a similar benefits column. This doesn't have media CSS to hide it, it is simply pushed down below the form if it doesn't fit to the right.  It's working OK for me but maybe some of the ideas here apply, especially Comment 9 .

[1] http://en.wikipedia.org/wiki/Special:UserLogin/signup?useNew=1

Note You need to log in before you can comment on or make changes to this bug.


Navigation
Links