Latest comment: 1 year ago2 comments2 people in discussion
So if I place my mouse cursor near (specifically, a little below) the search box and then type a result in and press enter, instead of going to the main topic / main result or whatever, it goes straight to the item my mouse cursor was over on. This is quite annoying, as I have been brought to the wrong result numerous times this way, and I have to be careful and put my mouse cursor significantly away from the search box for it to not interfere.
Make it so that when the user is only using keyboard to use the search box, no matter where you put the mouse cursor, e.g. over the second result, it always goes to the main result for the terms entered. Additionally, even if you hover over a search item with the mouse cursor, pressing enter on the keyboard should still result in the search going to the main topic and not over what the mouse cursor was hovered on. Keyboard and mouse navigation should be made separate, and should not interfere with each other.
Latest comment: 1 year ago11 comments3 people in discussion
All pages with a full Norwegian translation are missing a Norwegian translation according to the language dropdown. Norwegian has two variants, including on Wikipedia, Bokmål (common) and Nynorsk (rare), there's no other thing when both variants are covered.
I have a guess. Can you open a developer/javascript console of your browser and write mw.uls.getFrequentLanguageList() in there, press enter and paste the output here.
I also wonder why I have the microlanguage Davvisámegiella (se) in that array, I only clicked on it after I wondered what the hell it was. However, I am interested in Swedish articles, and read them all the time, so that seems like an additional bug that should also be fixed.
Latest comment: 1 year ago2 comments1 person in discussion
Currently, on Vector 2022, the top right corner shows the button "Create Account", as well as a symbol of three dots. The log in button is hidden behind these three buttons. Why is that? This means that users need unnecessary amount of clicks to log in. The corner has plenty of empty space, so the log in button would fit well next to the "Create Account" button.
If the white space in the top right corner is for some reason important, why isn't the log in button visible and account creation behind the three dots symbol? After all, users usually only need to create an account once, but they need to log in many times. Valtaisa varpunen (talk) 12:34, 21 January 2023 (UTC)Reply
I am writing to make a suggestion/feedback about the language options in the new UI of English language Wikipedia. While I appreciate the aesthetics, and believe things look nice, slick, and up-to-date, I would like to suggest a more straightforward way to lay out the languages options (e.g., English, 中文，日本語, etc). In the old UI, languages are laid out on the bottom left side of the page, if you need to switch between languages, the options are 1) visible, 2) only one click away. As a bilingual user of Wikipedia who need to switch between languages, I find it very helpful. The new version of UI still allows switching between languages, but it is not as easy: you will need to click on the langauge menu to see if there is a Chinese version of the entry. If yes, you click one more time to get to the page, but if no, you just wasted a click that could have been saved. I am not saying rolling back the old UI, it is just that the old language module was more friendly to users who actually use it frequently and I wish the up-to-date UI can perserve that. 146.151.105.18405:55, 14 February 2023 (UTC)Reply
Latest comment: 1 year ago1 comment1 person in discussion
Oh come on Wikimedia, you know better than that! What was wrong with the old layout? What problem did you solve?
For me, everything was right! It was clear, it worked in old browsers, and it allowed me to quickly switch between languages by a simple click.
Is someone suffering from "new is always better" syndrome over at Wikimedia? ;) There was no better way to spend the money I send you every year? If we all sent you less, would such "upgrades" be out-of-budget in the future? :)
I fear that Wikimedia got infected by Parkinson's Law, project managers looking for some raison d'etre, wasting resources. I hope I'm wrong.
If you must have this new "better" layout, please, at least give people an easy way to go back to the one they prefer. Without logging in of course - such nonsense! Write a flag in a cookie, problem solved.
Latest comment: 1 year ago11 comments5 people in discussion
See, e.g., en:WP:RELATED: the first line of text visible reads "intended to link to topics that are simply...". In other skins, the first line of text visible is the section title: "Linking to articles that are related to the topic". Fgnievinski (talk) 03:00, 14 September 2022 (UTC)Reply
Hi @Fgnievinski, I unfortunately can't replicate - I checked on two browsers (Chrome and Firefox) and three widths (full, which is 2,5k px, ~1000 px, and ~400 px, and every time, the section title is the first line of visible text for me. What browser and display resolution do you use? Do you use any additional browser zoom? SGrabarczuk (WMF) (talk) 14:44, 14 September 2022 (UTC)Reply
I can replicate the Problem, though my first line is "Disambiguation...". I sometimes have the same Problem while using the new TOC. It seems to have something to do with the sticky Header. At first the Heading is visible for a blink of an eye, than the sticky Header pops up and the Text is blocked. HirnSpuk (talk) 07:10, 22 September 2022 (UTC)Reply
@OVasileva (WMF), I'm sorry, I don't remember anymore. Might have probably been Desktop-Firefox under Linux which I use mostly. I just tested in Win/Edge. The Problem is there. Standard Configuration, no zoom, middle font. Tested in Chrome, standard-configuration, problem is there. When clicking the given Link, the heading is there for a split second, than the "sticky-header" kicks in and moves over the heading. HirnSpuk (talk) 15:06, 15 December 2022 (UTC)Reply
I am getting this too. Any time a redirect points to a section, the sticky header bar obscures the first line or two of text at the target page, so one has to scroll up to see if it is the right place (uncover the header). It looks like the page is opened at the right place, and then the sticky header is opened on top of it, covering the top text. This must be compensated somehow to correct for the reduced space at the top of the page for visible content but it is nor immediately obvious how it should be done. I am using Firefox latest version on windows 10 on desktop, and windows 11 on laptop. Effect seems to be consistent and repeatable. I notice that this effect does not occur when using the ToC, so it should be fixable by using a similar procedure. I would guess that for the ToC case, the content frame (whatever it is called), is already defined taking the presence of the sticky header frame into account, so the content is rendered after the header is already in place, so the top is not obscured.Pbsouthwood (talk) 05:52, 10 January 2023 (UTC)Reply
Confusing: I just tried a second time logged in, with full-width and hidden tools-menu, and it worked for once. Then I popped open the tools menu and switched back to narrow view... After that I logged out. Now it works in every case... Maybe I'll try again and will keep you posted in which configurations it works and in which it doesn't. HirnSpuk (talk) 16:01, 17 February 2023 (UTC)Reply
Latest comment: 1 year ago3 comments2 people in discussion
doesn't do what it probably should for me. Too big a font and the sections are not discernable enough. I was hoping that this would help the new menu structure, but it doesn't for me.
This page (here, the talk page) is the perfect example for everything I see wrong with the new menu: It's simply a bunch of too narrow text, which is not helpful at all! The "Main Menu" blocks the TOC initially (or is hidden), most of the TOC-Headings have line breaks and show additional information (which seems to be a total overload), scroll bars are partly out of bounds, one doesn't know where the mouse wheel is working right now.
I really doubt, that the usability of the new menu is better than in legacy vector. It doesn't look better (at least not for me), it needs more klicks, it needs more time for reading, everything is gliding/changing/sliding/hiding/autohiding with no distinguishable idea.
Yes I know, all this is probably not a thing while displaying and/or reading encyclopedic content. I think nothing mentioned here is a bug, because I think everything is intended. I just don't see why. Regards HirnSpuk (talk) 15:42, 16 February 2023 (UTC)Reply
PS: As a side note: I just tried to see if I'm liking it better when playing with page zoom and browser-font-size. Spoiler: I don't :-D. I was hoping "just the text" will get smaller (hence at least mitigate the page-break problem), but the whole website did. Well not everything... I don't get it. HirnSpuk (talk) 15:55, 16 February 2023 (UTC)Reply
Keyboard shortcut needed to 'User contributions' in Tools menu
I would add that now the 'Tools' menu is to be found in one of two optional positions, and also of variable length across different pages, I find the lack of a keyboard shortcut to view another User's Contributions is most frustrating. It should be a simple fix. For active editors, being able to easily view another users' edits is often more important than seeing one's own. We do have a shortcut for that, and many other less well-used Tools. I also agree with other commenters above that the order of Tool links been very bad for a long time. Not only that, but the lack of visual difference between both the 'Actions' and 'General' headings and the actual Tools links themselves makes the experience of using the tools menu much worse than it needs to be. Nick Moyes (talk) 12:42, 17 February 2023 (UTC)Reply
Is it possible to change the default skin for a wiki if the community wants to?
Latest comment: 1 year ago4 comments3 people in discussion
Hi! Recently I was reading a Village pump discussion in Armenian Wikipedia and the community wanted to change the default skin for Armenian Wikipedia. Is it even possible assuming we create a separate discussion/poll and there is an overwhelming support for the change? Ashot (talk) 06:46, 14 February 2023 (UTC)Reply
HI @Patafisik (WMF). The discussion is here: Special:PermaLink/8613606#Վիքիպեդիայի_էջերի_նոր_ձևավորում. It wasn't actually about changing the default design but rather a general survey if people like it. 23artashes asked if it is even possible to change it and I couldn't answer the question :). If it is possible, we will open a new discussion and probably a poll. If the change isn't possible in a Wikimedia project, I would rather avoid the trouble because I'm sure there will be a lot of disagreement :) Ashot (talk) 07:57, 15 February 2023 (UTC)Reply
Hi @Ashot, thank you for letting us know. I think in less than two weeks we'll be able to start a discussion with your community on your wiki. In general, we'd like to learn what's not working for those who join the discussion, and why. Perhaps something could be fixed or clarified. Restoring the old skin is not the first option we would like to discuss (of course, we'll give our arguments why). I'm sorry that I wrote "in less than two weeks" - we're working a bit more slowly right now. SGrabarczuk (WMF) (talk) 02:26, 18 February 2023 (UTC)Reply
Latest comment: 1 year ago7 comments3 people in discussion
Everything was fine in the beginning, but now I'm considering returning to the old vector. Please, PLEASE STOP FIXING THINGS THAT AREN'T BROKEN. Bageense (talk) 03:26, 15 February 2023 (UTC)Reply
That's it. I quit. I was a big fan of the new vector. I was one of only TWO editors [sic] who where using it in the Portuguese Wikipedia. I was there since the very beginning, but now I quit. Bageense (talk) 03:32, 15 February 2023 (UTC)Reply
@Bageense: I've got a quick JavaScript hack that I'm hopefully going to be working on over the weekend. To get this to work you'll want to do the following steps:
On your home wiki, open your common.js page and insert the following lines of JavaScript
:$(function(){:vartoolsBar=document.getElementById("vector-page-tools");// first grab the tools bar by ID:varfloatingToC=document.getElementById("vector-toc");// then grab the floating TOC by ID:floatingToC.appendChild(toolsBar);// and finally append the tools bar to the floating ToC:});:
Save the page and go to an article or talk page that has a table of contents
If your Tools menu is currently on the right hand side of the page, click the Hide button on it
And that's it, your tools menu should now appear immediately below the floating table of contents
Couple of important things to note.
This might only work on enwiki at the moment if the CSS IDs that the JavaScript relies on is localised on each wiki. If that's the case, reach out to me at home wiki talk page, and I'll try and make it work for your wiki.
Right now it also only works on pages that have a table of contents. If you open a page, like the edit view, which does not have a table of contents, the tools bar will return to the tools menu dropdown near the top of the page. I'm hopefully going to work on this over the weekend as I've got an idea that should make it appear on any page, but I've not had the time to make the change yet.
Any scrolling in a page's main content area, which causes the floating table of contents to jump to the current section you are reading as you scroll up or down through the main content area, will cause the tools menu to move back to the bottom of the floating area on the left side of the page. This is also something I'm going to try and work on over the weekend, if I can figure out the bit of JavaScript that's causing it to do this and figure out how to disable it without breaking everything else.
At the moment this is super basic, and just five lines you add to your common.js file. Once I've worked out the major bugs I'll figure out how to make it work with mw.loader.load or importScript so that I can share and update it if it breaks more easily for anyone who wants it.
P.S. @Zapipedia (WMF): If the WMF want to take my solution once I get the bugs fixed, and maybe roll it into Vector2022 as a customisable user option, I'm totally down for that. Reach out to me at my home wiki talk page, Discord, or my enwiki email address and I'll happy chat about what I'm doing and what issues I've run into while making it :) Sideswipe9th (talk) 05:25, 18 February 2023 (UTC)Reply
@Sideswipe9th: Thanks. But the problem is that the new skin is being constantly modified, so that code can be rendered useless eventually. Once I could disable the sticky header with a code; later, I was no longer able to do that, and I was forced to stick with the header. Bageense (talk) 07:54, 18 February 2023 (UTC)Reply
@Bageense: Perhaps, however I also cannot stand the Tools menu on the right hand side of the page while still otherwise generally liking Vector2022. So I will be maintaining a version of this on my home wiki for as long as I can, as any time that a breaking change happens to the HTML or CSS, I'll be fixing it for at least my own sanity and editing convenience. Sideswipe9th (talk) 19:31, 18 February 2023 (UTC)Reply
Latest comment: 1 year ago3 comments2 people in discussion
The worst aspect of this new front page is having to click to open the search box before you can use it. Apart from being a bleeding nuisance, if we assume that the vast majority of users need it when they join the site, consider the bandwidth involved in thousands of unnecessary clicks. 12:17, 12 February 2023 (UTC) — Preceding unsigned comment added by Chevin (talk • contribs) 12:17, 12 February 2023 (UTC)Reply
Hello @Chevin. The Search box is ready to type-in. Only when the window is under 1000px wide, the Search box is collapsed into a magnifying glass icon that need to be clicked to unfold. Zapipedia (WMF) (talk) 21:50, 19 February 2023 (UTC)Reply
Hello @Jidanni. Are you still experiencing this? When I go to Commons and use Vector 2022, I see the "Uploads" link. If you don't, please add ?safemode=1 to your URL and then check, and if it's not there, tell me what browser and operating system you're using. SGrabarczuk (WMF) (talk) 23:36, 8 February 2023 (UTC)Reply
Hi @Nehaoua, when the Tool menu is closed, you can open it under the Language button (article pages), on the right of the watchlist icon (the star) see below:
Hi @Nehaoua, sorry for not naming links in Arabic last time. I updated the screenshots, now they may be more clear. S'il y a quelques choses que je peux faire encore n'hésitez pas à me notifier. Patafisik (WMF) (talk) 09:42, 20 February 2023 (UTC)Reply
When a page doesn't have a toc or the main menu on the left, you have the arrow when hovering the title with the mouse, so you have to left-click, hold and move the cursor to mark the title.
When there is something on the left, like the toc or the expanded main menu you have the I-beam pointer, so you can just triple-click to mark the whole title.
Please fix this so users can still quickly copy and paste page titles.
Latest comment: 1 year ago10 comments5 people in discussion
I've been encountering a problem that I think may be caused by New Vector. When I click on the table of contents links at a long page, the place it scrolls to often isn't exactly the thread I clicked on, but rather one or two above or below. Is this a known issue? {{u|Sdkb}}talk22:36, 9 January 2023 (UTC)Reply
I'm not yet able to reproduce this on w:WP:VPR. What section are you clicking on, and what section is appearing on your screen? Can you provide links to other pages you're seeing this issue on? Also can you provide other potentially relevant details (operating system, browser, browser width, etc.). Also can you check if you can reproduce this in an incognito/private window (append ?useskin=vector-2022 to the URL). Thanks, AHollender (WMF) (talk) 05:06, 11 January 2023 (UTC)Reply
I tried to replicate it in an Incognito window with Vector and couldn't, so maybe it's an extension I'm using. I'll do some further testing and see if I can isolate the issue. {{u|Sdkb}}talk16:37, 11 January 2023 (UTC)Reply
Having paid attention for a few days, the issue seems to occur when I click on notifications from conversations I'm subscribed to, not when I click on a table of contents. I'll follow up with the talk pages project. {{u|Sdkb}}talk16:32, 16 January 2023 (UTC)Reply
I don't know what exactly is causing this for you (I can't reproduce), but I looked into problems with links to sections in Vector 2022 in general, and figured out why they happen and proposed a fix at T330108. Matma Rex (talk) 02:58, 21 February 2023 (UTC)Reply
Latest comment: 1 year ago5 comments2 people in discussion
This is about Tewiki
The User menu drop down has the following issues:
When page is not scrolled, when the mouse hovers on Contributions menu item, a sub-menu list appears with three links - contribs, translations, uploaded media. When I move the mouse to click any of these three sub-menus, the mouse moves over the tool tip (User menu) and this sub-menu list disappears. It is impossible to click these three sub-menus. When I move the mouse around the tool tip, then, the sub-menu list does not disappear.
In the sticky drop down (when the page scrolled down), the sub-menu is not shown at all.
Hi @Grimes2, what wiki are you trying to edit? On the English Wikipedia, the edit button is available on the sticky header which appears when you scroll down the page, you just have to click on the pencil icon to edit the wikicode. Patafisik (WMF) (talk) 09:52, 23 February 2023 (UTC)Reply
Latest comment: 1 year ago6 comments3 people in discussion
The header for logged in users on the Konkani Wikipedia is two lines to accomodate two scripts. When you scroll down, the sticky header is not tall enough for two lines. Should we fix this by modifying the height of the header locally in the css, or should it be fixed globally in the software skin? The Discoverer (talk) 07:22, 14 January 2023 (UTC)Reply
@AHollender (WMF), It only happens on the main page, because the main page is the only one that is explicitly formatted to be on two lines. On all other pages the headings are shortened using ellipses (...) and do not wrap. The Discoverer (talk) 15:52, 16 January 2023 (UTC)Reply
Latest comment: 1 year ago3 comments1 person in discussion
When I'm finished typing something in the search bar and hit enter, I expect the top result to show up, not the page where my cursor currently rests. If I want to click on a page that's not at the top, I'll just use my mouse or touchpad's left click because that's closer to my fingers. This is a big problem for me as I often use keyboard shortcuts and therefore have to physically move the cursor away in order to search properly. ~~lol1VNIO🧧🐈 (I made a mistake? talk to me) (talk) 20:35, 18 January 2023 (UTC)Reply
Hi @Grimes2, what are you calling "top bar", do you mean the sticky header? By clicking "beginning" on the ToC you should scroll back to the top of the page. Did you try with the keyboard shortcut (e.g. CTRL + Home, or Command + up-arrow key, or similar)? I also have keyboard keys Begin and End on my keyboard, but I know not all keyboards have. A lot of browser allow an extension like Scroll to Top too. Patafisik (WMF) (talk) 13:40, 27 February 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
It's been said from some dicussers here already (if you search the discussion arhives related to this
discussion) here in this discussion and i want to stress that this is my point of view, too !
I like switching between articles in German, English, Croatian - and sometimes i want to surprise myself by clicking at an unknown language. Switching with your new created language switch tool is a horror and takes me - an un unregistered user - a very lot longer, compared to the 2010 interface, to find myself the language i want to switch to.
Well I haven't, an I don't think others have (some might, of course) THAT geographic knowledge to guess what language is located in which region. Knowing how a language name is spelled is a very easy thing for me. If I know the alphabet and if I search Croatian, i look at the top of an alphabetical drop-down-list, if i search German, i will look more in the middle of the list, if i search English i scroll from Croation a little more farther down. This is an easy thing. So why did you create these regional blocks ?
So please: Do unlogged users a favour and give them a chance to choose a language list option, that gives them a sorted list as from a to z. Thanks - that would be a great thing ! 188.174.249.25017:19, 19 January 2023 (UTC)Reply
the list in alphabetical order for logged out users
the selection of user interface language is only available for logged-in users, who can disable it in their Preferences (at the end of the page, uncheck "Use a compact language list, with languages relevant to you."). For English Wikipedia, the input method contextual menu is disabled by default. Logged-out or anonymous users have already the list in alphabetical order, can you confirm please? When searching, you can just type the Language codes (e.g. de, en or hr) and the language will be suggested by the functionality. For more information about the Universal Language Selector please visit the FAQ page. Patafisik (WMF) (talk) 08:31, 28 February 2023 (UTC)Reply
Search bar doesn't work at the top on Amazon Kindle
Hi @80.6.36.48, it is still happening? To be sure to exclude some causes: this answer helps you? If you are already filling the search box with a text and nothing happens: can you give us more details and describe your configuration (browser, browser version, OS) with an example of text you are searching for, and in what wiki it is happening, please? This is happening also when adding ?safemode=1 at the end of the URL? This may be useful to reproduce the bug. Patafisik (WMF) (talk) 12:29, 27 February 2023 (UTC) modified--Patafisik (WMF) (talk) 08:54, 28 February 2023 (UTC)Reply
Custom CSS is not working for the Vector 2022 skin.
Latest comment: 1 year ago4 comments3 people in discussion
Hello. I know that this isn't exactly an issue of skin, but I don't know better place to ask, so: it is possible to turn off a "Reply" button in User talk pages? Once it was seen as default to reply on interlocutor page bcs of notifications, now many new users just click reply on their own talk without even a ping. It disturbs a fluent discussion between editors. --Wojsław Brożyna (talk) 08:05, 21 February 2023 (UTC)Reply
It isn't possible to turn it off for other users on your comments. Instead, I would suggest turning on "Automatically subscribe to topics" ("Automatycznie subskrybuj wątki"), so that you will get notifications about replies to your comments even if the other user doesn't add a ping. Or if you really want, you can turn off "Enable quick replying" on the same preferences page, but this will only change how the pages look like to yourself. You can read more about these features at Help:DiscussionTools. Matma Rex (talk) 17:59, 27 February 2023 (UTC)Reply
Hi @Атомный трамвай, thanks for your feedback. First of all and to be sure to exclude some causes: this answer helps you? If you are already filling the search box with a text and nothing happens: can you give us more details about your configuration (operating system, browser and browser version, screen resolution), and an example of text you are searching for to reproduce the bug, please? This is happening also when adding ?safemode=1 at the end of the URL? Patafisik (WMF) (talk) 08:45, 28 February 2023 (UTC)Reply
Thank you for attention.
The issue you've mentioned doesn't help me at all, because a user there experienced replacing search field with button, and I don't.
Firefox 110.0, macOS High Sierra, 1280×800. Also, you can check out it by yourself — https://jantanoo.info, if it reproduced at your env (I sure, it does).
Whatever I type in search field, I ain't see a suggestion menu. As it should be shown regardless any text one type, so, I think, no need to mention any specific text I tried to type. And this issue is just about modern Vector — in classic Vector, in Minerva Neue, in all built-in skins there is the dropdown suggestion menu. I wouldn't be surprised if it is because of some incorrect setup — I am not so experienced admin and, for example, I've got a concept of MW's Gadgets just recently (and one of damaged gadget made a huge mess for my wiki and I haven't found a problem too long). And I remember, before I upgraded from MW 1.34.1, there was no this dropdown menu in classic Vector, too. On the other hand, I've made a serious re-install of MW and now it works on classic Vector… Атомный трамвай (talk) 12:39, 28 February 2023 (UTC)Reply
I can reproduce it (Firefox version 110, Windows 10). When I type "т" in the search form on the top, suggestions do not appear. But if I click on the button "search" ("Найти") I arrive on this page. However, using the second search form under "Search results" ("Результаты поиска"), typing "т" I have the search suggest drop-down list. I report this issue and waiting for an answer. The new search functionality is described here. Patafisik (WMF) (talk) 14:59, 28 February 2023 (UTC)Reply
On the desktop I use firefox as a webbrowser with a zoom of 120% for all Wikimedia projects.
When you scroll inside the text (not the toc) between the section of two headlines, it is like that: the toc highlighting switches, when the section of a headline is at the lower border of that new dynamic bar at the top.
But when you zoom with firefox, it does not match.
Native implemented font size changing would do the trick I guess.
Hi @KleinerKorrektor, thanks for your feedback. OVasileva (WMF)'s answer: "In the near future, we're hoping to explore some of this in the new skin - specifically allowing users to configure their font size for the site". A task for increasing the base font-size for article text from 14px to 16px is open too.
Hi @KleinerKorrektor, are you still experimenting the mismatch between the text title and the table of content title when you zoom? If yes, can you give us an example of page where it is happening? Thank you! Patafisik (WMF) (talk) 08:00, 3 March 2023 (UTC)Reply
Latest comment: 1 year ago6 comments6 people in discussion
There are many things about the new 2022 interface that made me a bit uncomfortable on first using it, but in my experience so far the designers have made only one game changer, deal breaker change, by removing a feature I can't give up, so I will stay with the 2010 interface forever if they don't bring that feature back, at least as a user appearance preference. That's their removal of the old inline TOC at the top of the article, of course. The new pop-up sidebar TOC with its floating button is not a static TOC, it's a different feature entirely, innovative and useful in its own way (although the way its floating button always blocks the upper left corner of the page is very visually annoying, and you cannot get it out of the way no matter what you do by repositioning the page). But no matter -- that's not the deal-breaker. The pop-up sidebar TOC, whether you like it or not, isn't a TOC at the beginning of the article, which has been the signature appearance of every Wikipedia article since time immemorial.
When you open a Wikipedia article you expect to see a lede (like the abstract of a research article), followed by a table of contents showing the structure and organization of the article, giving you an instant idea of whether this article is 1 or 100 pages long, and how developed it is. As you refer to the article again and again over time, you will probably depart from that TOC to places you have discovered within the article again and again, your body developing a kind of muscle memory for the way the space inside the article branches out from the top. Your mind is learning the geometry of part of the vast space that is Wikipedia. The TOC at the top of every article illustrates one local part of that space. The TOC is the article editors' best attempt to choose a geometry for that subject that makes sense. It is editor-written content, artistry, not merely a generated index or search results; in fact it is the most important content in the article, after the lede. Sometimes it's all you read of an article (the lede and the TOC), and it tells you that you don't need to know any more. It can be collapsed or expanded, as suits your personal need of it, but surely it should not be entirely hidden in an always-collapsed pop-up sidebar.
The designers should fix this flaw in the new interface by simply bringing back the static TOC exactly as it is in the 2010 interface. The pop-up sidebar displaying the TOC can remain too, just don't display its floating button until the display is scrolled down to below the static TOC. It would also be a diplomatic policy decision (a no-brainer, really) to provide a user appearance preference for a static TOC, a pop-up TOC, or both. Dc.samizdat (talk) 21:35, 20 January 2023 (UTC)Reply
Yeah I agree, I like the static Table of Contents at the top of the article, I don't want to have to start scrolling to find the TOC so I can skip to the particular section of an article that I want to read. B 897 (talk) 04:28, 21 January 2023 (UTC)Reply
I spent many minutes trying to figure out why the article I was editing had no TOC -- I went as far as asking on the Discord why the article was broken, trying to add a template, etc. Could have instead used that time to contribute. I agree that the old ToC takes up a lot of space but the new treatment is too radical a change. Mrflip (talk) 20:53, 6 March 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
As the subject says. I managed to spot a table of contents once with the new layout, but now I can't find it any more.
I wanted to share a link to a section, but I can't even do that, because the only links provided directly at section headers are edit links. GunChleoc (talk) 10:54, 7 March 2023 (UTC)Reply
Hello @GunChleoc. Thank you for letting us know about this issue. How wide is your screen? I mean the resolution. If it's large enough, you'll see the ToC on the left side (option 1). If it's narrower, it's a button at the upper left corner of the screen (option 2). It may also be in the header if it's pinned (option 3).
Latest comment: 1 year ago3 comments2 people in discussion
I would have expected, that the look is consistent between Legacy and V22. It seems not to be. The pages all look different, depending, if you are logged in/out, which "project" you are on and what "dynamic buttons" you have clicked (width, hide, pin...). Is this really intended behaviour? The biggest issue I'm startled by is the different behaviour of the same skin while logged in and out (different menu, different font-size, different behaviour, different spacing). HirnSpuk (talk) 16:11, 17 February 2023 (UTC)Reply
Hello @HirnSpuk. Some of this is intended. For example, right now, logged-out users don't see the sticky header or the page tools menu. But I think font-size or spacing isn't intended. Perhaps what you saw was caused by cache, and not our intended design. Would you be able to give specific examples of differences you didn't expect? SGrabarczuk (WMF) (talk) 15:48, 10 March 2023 (UTC)Reply
@SGrabarczuk (WMF), sorry, Special:Diff/5778578/5779099, expecially Special:Diff/5779099/next and last but not least Special:Diff/5816368/5817068. I think the looks should be consistent at least in one project. The look (AND the feel as well) depend on window-width, screen-resolution, login-state, button-clicks, hover-buttons, personal configurations... I'm not able to give examples, it's the whole page. Just play with the window-size on different resolutions in wpen logged in and out and you'll hopefully get it. I'd recommend using a FHD-Display with standard-configuration. Use case: I often resize the window regarding the task I'm doing, I regularly log on and off on different projects, I use different resolution monitors... Regards HirnSpuk (talk) 16:41, 10 March 2023 (UTC)Reply
Latest comment: 1 year ago5 comments3 people in discussion
Noticed this in Tewiki - the link to add inter-language links disappeared. The drop down list has only two links- "Translate this page" and "Open language settings". __Chaduvari (talk) 01:58, 19 February 2023 (UTC)Reply
You can see this issue on సిపాయి సుబ్రమణ్యం page. The issue is also noticed in Wikipedia:, Template:, Module: and Category: namepaces too (didn't check the other namespaces). In these namespace pages, only "Open language settings" link is there; "Translate this page" link is not shown. The adjacent screenshot shows the Main space page. Thanks. __Chaduvari (talk) 05:06, 21 February 2023 (UTC)Reply
Hello @Chaduvari. Thank you. I think there are more than one issue here. Regarding the link to add interwiki links appears now, but perhaps it wasn't appearing temporarily? We've been working on the styling of this link. Anyway, for me now, it shows up in the "General" menu. Do you still experience this issue?
Regarding the "Translate this page" link in non-content namespaces such as Template or Module, it's by design, because the tool inviting to translate the page is only designed to translate content. But there may be some bugs about it. For details, see phab:T316559#8523433.
Latest comment: 1 year ago3 comments3 people in discussion
I tried giving Vector 2022 a shot, but the lack of any kind of border or even a change in the background colour between the text and the whitespace to the left of it is a big problem for me. It is difficult to explain, but I felt something similar to strong sense of vertigo when I started reading text after a certain point.
I identified the cause as the emptiness in the left space after you scroll far enough down. It is alright at the top, since the off-colour background of the sidebar serves the role as a border, however, there's nothing in that space once you scroll further down. This issue isn't present in Vector 2010 because it has an explicit border in addition to a different background colour beyond said border.
Oddly, the feeling of vertigo is greatly reduced with the narrow mode, likely due to the whitespace being balanced on the right side, and there being an eventual change in the background colour. However, I highly dislike the narrow mode, so I wouldn't want to use that even without the vertigo. JAK0723 (talk) 05:18, 19 January 2023 (UTC)Reply
I completely agree, expanding the view and collapsing the floating menus (because i 1. dont want the TOC on my screen at all times since it creates unnecessary visual noise, 2. am not an active editor so i dont need that tools section), looks like a barren css-less html webpage, no borders, no consistent spacing, the lines between headers starting and ending in random places... vertigo is exactly how i would describe it. looking back and forth from monobook to this mess, monobook feels way more defined and grounded, you can always find where the page begins, estimate the indentation by eye... this is autism speaking but its true. 147.32.90.10301:44, 6 February 2023 (UTC)Reply
Yes, I completely agree! I'm sad-but-glad to read that it's not just me that finds this a very real and very significant irritation. I had already commented about this exact problem in an earlier discussion further up the page, but just repeating here again to add to the comment/vote count: From an accessibility perspective the biggest loss for me is the lack of that good contrast and vertical line separator between the left hand menu and the main content area: now all just an endless sea of indistinguishable searing white, and, when I am reading, without those subtle but essential separation cues (and with an excess of horizontal whitespace that doesn't have the needed tight margins to even remotely work as a "newspaper column" substitute), my eye is irreversibly drawn to the left hand edge of the window at the end of Every Single Line, causing a real 'low level' brain 'glitch' in trying to read. Ugh! --Davecykl (talk) 22:40, 14 March 2023 (UTC)Reply
Nowy prototyp. Wizualne oddzielenie części interfejsu
Latest comment: 1 year ago9 comments7 people in discussion
Cześć wszystkim!
Analizowaliśmy opinie edytorów na temat układu strony. Przeczytaliśmy komentarze, którymi wolontariusze podzielili się tutaj, jak również na RfC na angielskiej Wikipedii, w Kawiarenkach, na innych stronach wiki, Phabricatorze, jak również na spotkaniach online. Oto nasze aktualizacje dotyczące tej pracy. Chcieliśmy rozpocząć rozmowę na temat dalszej poprawy układu.
Informacje zwrotne na temat białych pól
Obecnie w Vectorze 2022 jest dużo białych pól służących oddzieleniu różnych części interfejsu. Do tego tło strony (poza obszarem z treścią) jest białe. Podzieliliście się dwojakimi wątpliwościami:
uwagami dotyczącymi wyraźniejszego wizualnego oddzielenia części interfejsu. Zastanawialiście się, czy poprawiłoby to czytelność. Głównie dałoby to:
większe skupienie/uwagę na treści strony (zamiast patrzenia na interfejs jako na całość, a następnie skupiania się na treści)
ułatwienie skupienia się na treści podczas czytania, ponieważ obszar treści byłby lepiej zdefiniowany (niektórzy z was zgłaszali, że podczas czytania rozpraszał ich spis treści);
uwagami dotyczącymi zmiany koloru tła poza obszarem treści na szary. Zastanawialiście się, czy zmniejszyłoby to zmęczenie oczu, którego niektórzy doświadczają z powodu dużego białego obszaru na większych ekranach.
Wielu z was zgłaszało, że biała przestrzeń ma zbyt wysoki kontrast i że dodanie ciemniejszego odcienia, takiego jak szary, zmniejszy to obciążenie.
Prototyp – proponowane zmiany i wady tych rozwiązań
Na podstawie tego, jak również informacji dotyczących kolejnych wersji skórki, przygotowaliśmy ten prototyp. (T259240) Jest to propozycja potencjalnych zmian. Zmiany prezentowane w prototypie to:
dodanie ramek zarówno wokół obszaru treści, jak i spisu treści (a także innych menu). Naszą hipotezą jest to, że ramki mogą pomóc w zrozumieniu struktury interfejsu. Ułatwiłyby również skupienie się na treści (zarówno przy pierwszym załadowaniu strony, jak i podczas czytania). Zauważ, że możesz przypiąć menu Narzędzia (Tools) za pomocą rozwijanej listy po prawej stronie,
zmiana koloru tła strony na szary. Nasza hipoteza jest taka, że powinno to pomóc zmniejszyć zmęczenie oczu, którego niektórzy doświadczają. Sprawi to też, że obszar treści i spis treści będą bardziej przyciągały uwagę.
Skłaniamy się ku konfiguracji, która zawiera białe tło nagłówka, obramowania, a także obramowane menu.
Jednak wiąże się to z pewnymi wadami. Ta konfiguracja wpływa na szerokość treści. Konkretnie:
zmniejsza szerokość treści w porównaniu do obecnej wersji w przypadku, gdy otwarte jest menu narzędzi strony (to po prawej),
zwiększa szerokość treści, gdy menu narzędzi strony jest zamknięte, w porównaniu z bieżącą szerokością.
Nasi designerzy pracują nad ograniczeniem skutków tego zjawiska. Dostosowują niektóre odstępy, co w najbliższych dniach znajdzie odzwierciedlenie w prototypie.
Testowanie
Na kolejnym etapie chcielibyśmy zaproponować eksperyment lub serię eksperymentów, które mogą potwierdzić powyższe hipotezy. Naszym celem jest określenie, czy aktualizacja układu w ten sposób poprawi doświadczenia czytelników i edytorów. Mamy kilka różnych możliwości w tym zakresie. Na razie rozważamy następujące:
Badania jakościowe – przeprowadzenie testów użytkowników poprzez wywiady z czytelnikami i edytorami. Testy te miałyby na celu określenie, czy łatwiej jest skupić się na treści i czy nowe tło zmniejsza zmęczenie oczu,
Testy A/B – przeprowadzenie testu A/B na zalogowanych użytkownikach, gdzie przeanalizowalibyśmy kluczowe wskaźniki projektu, porównując obecny układ z poprzednim. W szczególności: odsetek rezygnacji ze skórki, liczbę odsłon, edycji, długości sesji, wykorzystania spisu treści i przewijania strony. Ze względu na ograniczenia techniczne i ochronę prywatności nie możemy przeprowadzić testów A/B na użytkownikach niezalogowanych. Oznacza to, że będziemy używać zachowania zalogowanych użytkowników jako czegoś podobnego do zachowania wszystkich użytkowników. Jeśli zostanie wybrany nowy układ, porównamy kluczowe wskaźniki (przed i po zmianie) wśród wszystkich użytkowników.
Niektórzy z was wspomnieli o zrobieniu ankiety, w której zapytalibyśmy użytkowników o to, który układ wolą. Badania opinii mogą być przydatne, ale nie sądzimy, żeby były najlepszym narzędziem do oceny użyteczności. Nie uważamy, aby tego typu ankieta dała nam informacje, których potrzebujemy, aby potwierdzić lub odrzucić dwie główne hipotezy zaprezentowane powyżej.
Nasze pytania do was
Jesteśmy ciekawi, czy uważacie, że powyższa lista brzmi sensownie. Jeśli nie – czy macie jakieś inne pomysły na ewaluację? Szukamy pomysłów na zmierzenie, czy nowy układ pomaga w oddzielenia treści od reszty interfejsu i zmniejszeniu zmęczenia oczu.
Poza oceną wspomnianą powyżej, opinie naszych społeczności również odgrywają dużą rolę w ustalaniu, jakie zmiany są najlepsze. Co sądzicie o prototypie?
Podoba mi się nowy prototyp, znacznie bardziej niż obecny wygląd Vectora 22. Moim zdaniem strona jest znacznie bardziej czytelna i przejrzysta niż obecnie.
Zdecydowanie popieram opcję Framed menus – poza możliwością skupienia się na treści, ułatwione jest z nią także znalezienie odpowiedniego narzędzia (najpierw kierujemy kursor nad wyraźną ramkę, dopiero potem skupiamy się na szczegółach). Całość – moim zdaniem – wygląda bardziej schludnie i elegancko (zarówno przy przypiętym jak i odpiętym prawym polu Narzędzia): Wyraźnie widać odstęp od górnego paska, równy dla wszystkich elementów. Delikatnie ciemniejszy kolor linii wyraźnie rozgranicza treść i narzędzia od tła – choć uważam, że jeszcze większe grono zwolenników zyskałby wariant z tą linią w błękitnym kolorze ze starego Vectora (albo może wokół treści błękit, a przy innych polach – szarość?).
Jednym słowem – jest to skórka, którą ustawiłbym jako domyślną (czego nie mogę powiedzieć o obecnym wyglądzie V22).
Nie wiem tylko, jak miałoby wyglądać pole edycji (kod!). Zakładam, że byłoby po prostu polem edycji wyświetlonym w miejscu treści artykułu (i takie rozwiązanie wydaje mi się najlepsze).
Nie wiem czy celowo zniknęły poziome linie pod tytułami sekcji (?) (u mnie ich w każdym razie nie widać) – uważam, że dobrze wygląda jak są w tamtym miejscu. Tak samo „rozjeżdża mi się” formatowanie obrazków, zakładam że zostałyby w takiej formie jak teraz.
Myślę, że w celu zaoszczędzenia miejsca można zmniejszyć nieco szerokość spisu treści (podobnie jak dzieje się na tej stronie po kliknięciu przycisku w prawym dolnym rogu).
Zaznaczam, że nie czytałem wszystkich komentarzy w anglojęzycznej wersji dyskusji, więc nie wiem czy nie powielam czyichś opinii.
Jeśli chodzi o sam wygląd, to szary naokoło oczywiście pomaga w skupieniu i zmniejsza natężenie białego... No i oczywiście wolę taką wersję. Oczywiście, bo takiej wersji z szarym używam od roku jak pewnie wiesz Szymonie :-) w:pl:Wikipedysta:Nux/Fixed top bar.css.
Ostatnio zacząłem się zastanawiać nad tym czy narzędzia i spis treści powinny mieć białe tło. W tej chwili mam duży, biały spis treści z boku i w sumie to trochę mi przeszkadza... Powoli dochodzę do wniosku, że może za bardzo odciąga mój wzrok ten biały. Nux (talk) 09:20, 11 March 2023 (UTC)Reply
Podoba mi się, że domyślnie menu są poukrywane (przy małej rozdzielczości, której używam). (Szare) Ramki - spis treści oraz sam artykuł (bez widocznych menu) "ładniej" wygląda z ramkami (ale to może być przyzwyczajenie do starej skórki wektor). Z przypiętym menu Tools brak ramek wokół artykułu (i menu Tools) już tak mocno mnie nie razi. MarMi wiki (talk) 12:35, 11 March 2023 (UTC)Reply
Mnie interesuje czy będzie opcja scalenia lewego i prawego menu w jedno. Obecnie w pl.wikt zarówno w lewym jak i w prawym mam często używane opcje (w lewym np. ostatnie zmmiany, w prawym np. wkład użytkownika albo linkujące) więc nie mogę tych menu schować ale jednocześnie ponieważ są po przeciwległych stronach ekranu muszę co chwila wykonywać długie posunięcia kursorem na touchpadzie. Jest to szalenie nieergonomiczne. Poza tym obecna implementacja prawego menu jest (przynajmniej w pl.wikt) kolidująca z układem stron np. tutaj https://i.postimg.cc/GtXxR7Kz/Screenshot-2023-03-05-04-34-05.png albo tutaj https://i.postimg.cc/Wp8BtsfY/Screenshot-2023-03-05-04-43-30.png - wygląda to fatalnie. Proszę o sprawdzenie czy w dyskutowanej tu nowej odsłonie będzie tak nadal. KaMan (talk) 18:46, 14 March 2023 (UTC)Reply
@KaMan tak, ten podział zostanie już tak jak jest. Podział na menu główne i menu narzędziowe jest celowy. Z nielicznymi wyjątkami menu po prawej powinno dotyczyć bieżącej strony, a menu głównej ma funkcje dotyczące całej witryny.
Co do tych zrzutów, to właściwie jest problem z treścią. Jeden z wielu problemów z szablonami i tabelkami, które są za duże na wąskim ekranie. Jak używasz skórki V'22 na wąskim ekranie, to lepiej mieć schowane przynajmniej jedno z menu (lewe lub prawe menu), albo w ogóle oba. Mi się na laptopie wygodnie pracuje ze zwiniętą lewą stroną (zwijam menu i spis treści).
@Nux: skórka Timeless automatycznie zwija szerokie tabelki z użyciem JS, tj. nadaje im poziomy scroll ([1]). Czy jest szansa, by domyślnie Vector 2022 też miał taką możliwość? Peter Bowman (talk) 23:01, 14 March 2023 (UTC)Reply
@Peter Bowman O, ciekawe. Trochę hack, ale wygląda na to, że skuteczne. Myślę, że można by na phabie zgłosić coś takiego. Nie żebym znał wszystkie zgłoszenia, ale nie kojarzę, żeby coś takiego było omawiane. Ten konkretny przypadek KaMana działa całkiem przyzwoicie Timeless: Słownik z szablonem z literkami, Wiktionary (testowałem na Firefox, CTRL+SHIFT+M).
W sumie to że oba menu przeskakują na lewo na wąskim ekranie, to też wygląda na dobry pomysł... Myślę, że jest szansa, że po zrobieniu docelowej Zebry #9 będzie łatwiej coś takiego zrobić (o ile będzie zachowany układ z prototypu)... Nux (talk) 23:20, 14 March 2023 (UTC)Reply
Latest comment: 1 year ago3 comments3 people in discussion
I was just looking for a link to special pages on another wiki and noticed it was in the page's tools menu. My mind has already shifted to the idea that the right side is for page specific tools and the left (main) menu is for general, site wide links.
There are currently two default links that are in the wrong place (at least in my mind):
Upload file.
Special pages.
I think these links should go to the main menu. Alternatively, you could also create a new section in the tools menu. But that would break the division into page and general actions.
The (un)logical division of menu's is a known problem and on the todo list, but as these menu's are shared between all the skins, splitting them up and making them more logical without breaking other skins is a complex operation that will take some time. There is a ticket about this somewhere.... —TheDJ (Not WMF) (talk • contribs) 10:36, 14 March 2023 (UTC)Reply
Sitewide. I've had to delete it because it wasn't working. How do I get this CSS script working?
::/* All CSS here will be loaded for users of the Vector 2022 skin */::#firstHeading{::font:30px'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::.mw-body-contenth2{::font:24px'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::.mw-body-contenth3{::font:18px'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::.mw-body-contenth4{::font:16px'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::.mw-body-contenth5{::font:inherit'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::.mw-body-contenth6{::font:inherit'Comic Sans MS','Chalkboard','Chalkboard SE',cursive;::}::/* Background colour */::@mediascreen{::#mw-page-base{::background-image:linear-gradient(#FFFFFF45%,rgba(36,255,0,0)100%);::background-color:transparent;::}::body{::background-color:papayawhip;::}::}::div.topicon{::position:absolute;::z-index:10;::top:-55px;::right:10px;::display:block!important;::}::/* Border colour */::.mw-body{border:1pxsolidwheat;}::div.vectorTabs,div.vectorTabsspan,div#mw-headdiv.vectorMenuh3{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAuCAIAA...);}::
Latest comment: 1 year ago6 comments3 people in discussion
Greetings,
When I visit commons:User talk:Elizium23 I see the page title listed as "User talk: Elizium23". That is, a space is inserted after the namespace and before my username. This is not part of the page title, and it will mess you up if you copy-paste it. If I "View history" on the same page, no space is inserted. Other wikis, no space. Safe mode, still a space.
This may have occurred on other pages, because I recall being surprised by a copy-paste failure; it's subtle, so I'll have to continue watching for it. Elizium23 (talk) 13:53, 19 February 2023 (UTC)Reply
@Ammarpad: so are you saying that turning the title into something that cannot be copy-pasted is somehow supposed to be seen as a feature, not a bug? (If replying please ping me, I don't have a watchlist on this wiki.) - Jmabel (talk) 04:28, 15 March 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
Ich habe schon mehrfach auf die neue Benutzeroberfläche umgeschaltet, musste aber regelmäßig wieder zur Vorgängerversion zurückkehren, da nach einiger Zeit der Button "Quelltext bearbeiten" (nur dieser!) nicht mehr reagierte. Ist das Problem bekannt und gibt es eine Lösung hierfür?@Der wilde berndDer wilde bernd (talk) 17:39, 8 March 2023 (UTC)Reply
This screenshot illustrates a bug in the German interface.
I have a problem with a truncated text in the German user interface in connection with this theme. The entry "Edit interlanguage links" in the tools navigation is cut off at the front due to an invisible edit-icon.
Latest comment: 1 year ago2 comments2 people in discussion
The Finnish WP is mentioned in the timeline for discussions in January, but no discussion has yet been had there. Are there plans on when it might be happening in the Finnish WP? There have been a couple of discussions among users about the new layout, and I'd be interested to know if the "official" discussion is coming (or not coming) any time soon. kyykaarme (talk) 13:06, 19 March 2023 (UTC)Reply
Latest comment: 1 year ago1 comment1 person in discussion
Xin chào,
Chúng tôi đã phân tích những phản hồi của các bạn về bố cục trang. Chúng tôi đã đọc các bình luận mà các bạn đã chia sẻ ở đây cũng như trên RfC trên Wikipedia tiếng Anh, các trang Thảo luận chung, các trang wiki khác, Phabricator, cũng như tại các cuộc họp. Dưới đây là những cập nhật của chúng tôi về việc này. Chúng tôi muốn bắt đầu một cuộc trò chuyện xoay quanh các bước tiếp theo để cải thiện bố cục giao diện hơn nữa.
Phản hồi về những khoảng trắng
Hiện tại Vector 2022 sử dụng khoảng trắng để ngăn cách các vùng khác nhau của giao diện. Nó cũng có nền trang màu trắng (bên ngoài khu vực nội dung). Có hai mối lo ngại chính về điều này:
Các nhận xét về việc bổ sung thêm một phương thức giúp tách biệt trực quan giữa các khu vực của giao diện. Bạn đang tự hỏi liệu điều này có cải thiện trải nghiệm đọc hay không. Chủ yếu bằng cách:
Thu hút sự tập trung/chú ý nhiều hơn vào nội dung khi truy cập vào trang (thay vì toàn bộ giao diện đập vào mắt trước, sau đó mới tập trung vào nội dung)
Giúp bạn dễ dàng tập trung vào nội dung trong khi đọc hơn vì khu vực nội dung sẽ được xác định rõ hơn (một số người dùng cho rằng họ bị phân tâm bởi phần mục lục trong khi đang đọc)
Các nhận xét về việc nên thêm phần nền màu xám bên ngoài khu vực nội dung. Bạn đang tự hỏi liệu điều này có giúp 'giảm hiện tượng mỏi mắt mà một số người đang gặp phải do có quá nhiều vùng trắng (khiến "bị chói lóa") trên màn hình lớn hơn hay không.
Nhiều người dùng cho rằng khoảng trắng có độ tương phản quá cao và việc thêm màu tối hơn chẳng hạn như màu xám sẽ làm giảm việc khiến mắt căng thẳng.
Nguyên mẫu – đề xuất những thay đổi và sự đánh đổi
Dựa trên những điều trên cũng như những phản hồi về các bản thử, chúng tôi đã chuẩn bị nguyên mẫu này. (T259240) Đây là một đề xuất cho những thay đổi có thể xảy ra. Nguyên mẫu tập trung vào việc:
Thêm một ranh giới xung quanh cả khu vực nội dung và mục lục (cũng như các menu khác). Giả thuyết của chúng tôi là ranh giới này có thể giúp cấu trúc thêm và làm rõ giao diện hơn. Nó cũng giúp bạn tập trung vào nội dung dễ dàng hơn (cả khi tải trang lần đầu và khi bạn đang đọc). Lưu ý rằng bạn có thể ghim menu Công cụ bằng menu thả xuống ở bên phải.
Làm cho nền trang có màu xám. Giả thuyết của chúng tôi là điều này sẽ giúp giảm chứng mỏi mắt mà một số người đang gặp phải. Nó cũng sẽ giúp người đọc tập trung hơn nữa vào khu vực nội dung và mục lục.
Chúng tôi đang nghiêng về cấu hình bao gồm nền tiêu đề màu trắng, đường viền cũng như các menu được đóng khung.
Nhưng điều này đi kèm với một số sự đánh đổi. Cấu hình này ảnh hưởng đến chiều rộng của nội dung. Đặc biệt:
Nó làm giảm chiều rộng của nội dung khi so sánh với phiên bản hiện tại trong trường hợp menu công cụ trang (cái bên phải trên ảnh chụp màn hình) đang mở.
Nó làm tăng chiều rộng của nội dung khi menu công cụ trang đang đóng, khi so sánh với chiều rộng hiện tại.
Các nhà thiết kế của chúng tôi đang tìm cách để hạn chế tác động của việc này. Họ đang điều chỉnh một số phần đệm và lề, điều này sẽ được phản ánh trên nguyên mẫu trong những ngày tới.
Thử nghiệm
Bước tiếp theo, chúng tôi muốn đề xuất một thí nghiệm hoặc một loạt thí nghiệm có thể xác nhận các giả thuyết trên. Mục tiêu của chúng tôi là xác định xem việc cập nhật bố cục theo cách này có cải thiện trải nghiệm của người đọc và biên tập viên hay không. Chúng tôi có một vài lựa chọn khác nhau cho việc này. Hiện tại, chúng tôi đang xem xét những điều sau:
Thử nghiệm định tính - chạy thử nghiệm người dùng thông qua việc phỏng vấn người đọc và biên tập viên. Những điều này sẽ nhằm mục đích ước tính xem có dễ tập trung vào nội dung hơn không và liệu nền mới có làm giảm việc mỏi mắt hay không.
Thử nghiệm A/B - chạy 'thử nghiệm A/B trên người dùng đã đăng nhập, xem xét các chỉ số chính của dự án, so sánh bố cục hiện tại với bố cục trước đó. Cụ thể: tỷ lệ chuyển sang dùng giao diện khác, số lần xem trang, chỉnh sửa, thời lượng phiên, việc sử dụng mục lục và thao tác cuộn. Do các hạn chế kỹ thuật và lo ngại về quyền riêng tư, chúng tôi không thể thực hiện thử nghiệm A/B đối với người dùng đã đăng xuất. Điều này có nghĩa là chúng tôi sẽ sử dụng hành vi của người dùng đã đăng nhập làm đại diện cho tất cả người dùng. Nếu bố cục mới được chọn, chúng tôi sẽ so sánh các chỉ số chính (trước và sau khi thay đổi) trên tất cả người dùng.
Một số người đã đề cập đến việc xây dựng một cuộc khảo sát hỏi người dùng xem họ thích bố cục nào hơn. Khảo sát cảm tính có thể hữu ích, nhưng chúng tôi không nghĩ rằng chúng là công cụ tốt nhất để đánh giá khả năng sử dụng. Lý do là vì chúng tôi không nghĩ rằng loại khảo sát này sẽ cung cấp cho chúng tôi thông tin cần thiết để xác nhận hoặc bác bỏ hai giả thuyết chính ở trên.
Câu hỏi của chúng tôi tới bạn
Chúng tôi muốn biết liệu danh sách trên có phù hợp để đánh giá tính năng hay không. Nếu không - bạn có bất kỳ ý tưởng nào khác về việc đánh giá không? Chúng tôi đang tìm kiếm các ý tưởng để đo lường xem liệu bố cục mới có giúp phân tách nội dung hay chứng mỏi mắt hay không.
Ngoài sự đánh giá được đề cập ở trên, ý kiến của cộng đồng cũng đóng một vai trò quan trọng trong việc tìm ra những thay đổi nào là tốt nhất. Các bạn nghĩ sao về nguyên mẫu?
Latest comment: 1 year ago3 comments1 person in discussion
Ciao,
abbiamo analizzanto il feedback che ci avete dato sul layout della pagina. Abbiamo letto sia i commenti che ci avete lasciato qui che quelli nella Request for Comments (RFC) sulla Wikipedia in inglese, nei bar e nelle pagine di discussione, in altre pagine wiki, su Phabricator, o ancora durante i nostri incontri on line. Ecco il nostro aggiornamento sul lavoro svolto. Ci piacerebbe iniziare una conversazione sui prossimi passi da fare per migliorare ulteriormente il layout.
Feedback relativo allo spazio bianco
Attualmente Vector 2022 usa lo spazio bianco per separare le varie aree dell'interfaccia. Ha anche uno sfondo della pagina bianco (al di fuori dell'area del contenuto). Ci sono due aspetti che destano perplessità:
Commenti relativi all'evidenziare maggiormente la separazione grafica tra le aree dell'interfaccia. Vi siete chiesti se questo migliorerebbe l'esperienza di lettura. Principalmente:
Permettendo di focalizzare l'attenzione/dando maggiore risalto al contenuto fin da subito, quando si arriva sulla pagina (anziché focalizzarsi sull'interfaccia nel suo insieme, e poi sul contenuto)
Rendendo più facile concentrarsi sul contenuto mentre si legge, perché l'area del contenuto sarebbe meglio definita (alcuni di voi hanno riportato che l'indice li distraeva durante la lettura)
Commenti relativi all'aggiungere uno sfondo grigio al di fuori dell'area del contenuto. Vi siete chiesti se questo ridurrebbe il senso di affaticamento della vista che alcuni utenti sperimentano per via della grande area bianca (tipo “abbagliamento”) su un monitor grande.
Molti di voi hanno riportato che lo spazio bianco è troppo contrastato e che l'aggiunta di una tonalità più scura come il grigio diminuirebbe questo affaticamento.
Prototipo – cambiamenti proposti e compromessi
Sulla base di questo e del feedback sulle iterazioni successive, abbiamo preparato questo prototipo. (T259240) Questa è una proposta per dei potenziali cambiamenti. Il prototipo si focalizza su:
L'aggiunta di una linea di demarcazione sia intorno all'area del contenuto che intorno al sommario (e agli altri menu). La nostra ipotesi è che questo limite grafico possa aiutare a strutturare e chiarire ulteriormente l'interfaccia. Renderebbe anche più facile concentrarsi sul contenuto (sia quando si carica la pagina che durante la lettura). Tieni conto che puoi fissare il menu degli Strumenti della pagina utilizzando il menu a tendina sulla destra.
Rendere grigio lo sfondo della pagina. La nostra ipotesi è che questo possa andare incontro alle esigenze di chi sta provando un affaticamento oculare. Inoltre ci si focalizzerebbe maggiormente sull'area del contenuto e dell'indice.
Noi propendiamo per la configurazione che comprende lo sfondo bianco dell'intestazione, i bordi e i menu incorniciati.
Ma questa scelta richiede di accettare alcuni compromessi. Questa configurazione ha delle ripercussioni sulla larghezza del contenuto. Nello specifico:
riduce la larghezza del contenuto rispetto alla versione attuale quando il menu degli Strumenti della pagina (quello a destra nello screenshot) è aperto.
aumenta la larghezza del contenuto rispetto alla versione attuale quando il menu degli Strumenti della pagina è chiuso.
I nostri designer sono al lavoro per limitare questi effetti. A livello grafico stanno aggiustando alcuni margini esterni e interni (padding) che saranno visibili sul prototipo nei prossimi giorni.
Test
Come passo successivo ci piacerebbe proporre un esperimento o una serie di esperimenti per convalidare le ipotesi di cui sopra. Il nostro proposito è quello di capire se, aggiornando il layout in questo modo, l'esperienza dei lettori e dei contributori sia migliore.
Per questo abbiamo pensato a un paio di opzioni. Per il momento, stiamo prendendo in considerazione quanto segue:
Test qualitativi – condurre test di usabilità attraverso interviste con lettori e contributori, per valutare se sia più facile concentrarsi sul contenuto e se il nuovo sfondo riduca l'affaticamento oculare.
Test A/B – condurre un test A/B sugli utenti loggati, che analizzi le metriche chiave del progetto, confrontando il layout attuale con quello precedente. Nello specifico: i tassi di abbandono (opt-out), visualizzazioni della pagina, edit, durata della sessione, uso del sommario, e scorrimento della pagina. A causa di limitazioni tecniche e problemi di privacy, non siamo nelle condizioni di condurre test A/B sugli utenti non connessi. Questo significa che useremo il comportamento degli utenti registrati come indicatore del comportamento di tutti gli utenti. Se il nuovo layout è selezionato, compareremo le metriche chiave (prima e dopo il cambiamento) per tutti gli utenti.
Alcuni di voi hanno menzionato la preparazione di un sondaggio che chieda agli utenti quale layout preferiscano. I sondaggi sul gradimento (sentiment surveys) possono essere utili, ma non riteniamo che siano lo strumento migliore per valutare l'usabilità. Questo perché non riteniamo che questo tipo di sondaggi possa fornirci le informazioni necessarie per confermare o confutare le due ipotesi principali di cui sopra.
Cosa ti stiamo chiedendo
Siamo curiosi di sapere se l'elenco qui sopra ti sembri adeguato per la valutazione delle caratteristiche.
Se la risposta è no – hai un'altra idea da proporre per la valutazione? Stiamo cercando idee per misurare se il nuovo layout aiuti a separare i contenuti o con l'affaticamento oculare.
Oltre alla valutazione di cui sopra, anche le opinioni delle nostre comunità giocano un ruolo fondamentale nel capire quali cambiamenti siano i migliori. Voi cosa ne pensate del prototipo?
Latest comment: 1 year ago8 comments7 people in discussion
Bonjour à toutes et à tous,
Nous avons analysé vos remarques sur la mise en page. Nous avons lu les commentaires que vous avez partagés ici, ou dans la
Requests For Comments (RFC) sur la Wikipédia en anglais, aux Bistros et sur d'autres pages wiki, sur Phabricator ou encore pendant les rencontres en ligne. Ci-dessous notre mise à jour par rapport à ce travail. Nous aimerons entamer une conversation autour des prochaines étapes de l'amélioration de la mise en page.
Retour sur l'espace blanc
Actuellement, Vector 2022 utilise l'espace blanc pour separer les différents éléments du gabarit de l'interface. Le fond de la page de l'habillage s'affiche en blanc (en dehors de la région du contenu). Deux sujets de préoccupation ont émergé par rapport à ceci :
Certains commentaires concernaient l'ajout d'une majeure séparation visuelle entre les régions de l'interface. Vous vous êtes demandé si cela améliorerait l'expérience de lecture. Surtout :
en attirant davantage l'attention sur le contenu dès l'arrivée sur la page (plutôt que de considérer l'interface dans son ensemble, pour se concentrer sur le contenu ensuite).
en facilitant la concentration sur le contenu pendant la lecture, puisque la région du contenu serait mieux définie (certains d'entre vous ont signalé que le sommaire les distrayait durant la lecture)
D'autres commentaires concernaient l'ajout d'un fond de couleur grise en dehors de la zone de contenu. Vous vous êtes demandé si cela pourrait réduire la fatigue oculaire que certaines personnes ressentent à cause de la grande surface blanche (une sorte d'éblouissement) sur les écrans de grande taille.
Beaucoup d'entre vous ont signalé que l'espace blanc était trop contrasté, et que l'utilisation d'une teinte plus foncée, comme le gris, diminuait cette tension.
Prototype – changements et solutions de compromis proposés
À partir de ces éléments et des commentaires sur les itérations successives, nous avons préparé ce prototype. (T259240) Il s'agit d'une proposition de changements potentiels. Le prototype se focalise sur :
L'ajout d'une ligne de démarcation autour de la zone du contenu et du sommaire (ainsi que d'autres menus). Notre hypothèse est que ce contour permettrait de structurer et de clarifier davantage l'interface. Il permettrait également de se concentrer davantage sur le contenu (à la fois lors du chargement initial de la page et pendant la lecture). Notez que vous pouvez épingler le menu Outils à l'aide du menu déroulant sur la droite.
Le fond de la page en couleur grise. Notre hypothèse est que cela devrait contribuer à réduire la fatigue oculaire dont souffrent certaines personnes. Cela permettrait également de mettre davantage en évidence la zone de contenu et le sommaire.
Dans ce contexte, nous penchons pour la proposition avec le fond blanc de l'en-tête, les contours et les menus encadrés. Mais cela implique quelques compromis. Cette configuration affecte la largeur du contenu. Notamment :
Cela réduit la largeur du contenu par rapport à la version actuelle quand le menu des Outils de la page (celui de droite dans la capture d'écrans) est ouvert.
Cela augmente la largeur du contenu par rapport à la largeur actuelle quand le menu est fermé.
Nos designers sont au travail pour limiter ces effets. Ils sont en train d'ajuster certains éléments graphiques tels que les marges intérieures (« padding ») et extérieurs qui seront affichés sur le prototype dans les prochains jours.
Phase de test
Comme étape suivante, nous aimerions proposer une expérience ou une série d'expériences permettant de valider les hypothèses ci-dessus. Nous cherchons à déterminer si une telle mise en page améliorerait l'expérience des lecteurs et des éditeurs. Pour ce faire, nous disposons de plusieurs options. Actuellement, nous envisageons les options suivantes :
Tests qualitatifs - effectuer des tests utilisateurs en réalisant des interviews de lecteurs et de rédacteurs. Ces tests viseraient à déterminer si le contenu est plus facile à focaliser et si le nouvel arrière-plan réduit la fatigue oculaire.
Tests A/B - effectuer des tests A/B avec les utilisateurs connectés, examiner les indicateurs clés du projet en comparant la mise en page actuelle avec la précédente. Plus précisément : taux de retrait (opt-out rate), pages vues, modifications, durée de la session, utilisation du sommaire et défilement de la page. En raison de nos restrictions techniques et de nos contraintes en matière de protection de la vie privée, nous ne sommes pas en mesure d'effectuer des tests A/B sur les utilisateurs déconnectés. Cela signifie que nous utiliserons le comportement des utilisateurs connectés comme indicateur pour tous les utilisateurs. Si la nouvelle mise en page est choisie, nous comparerons les indicateurs clés (avant et après le changement) pour tous les utilisateurs.
Certains d'entre vous ont mentionné l'élaboration d'une enquête demandant aux utilisateurs quelle mise en page ils préfèrent. Les enquêtes de satisfaction (sentiment surveys) peuvent être utiles, mais nous ne pensons pas qu'elles soient le meilleur outil pour évaluer l'utilisabilité. En effet, nous ne pensons pas que ce type d'enquête nous fournirait les informations dont nous avons besoin pour confirmer ou rejeter les deux principales hypothèses ci-dessus.
Ce que nous vous demandons
Nous sommes curieux de savoir si la liste ci-dessus vous convient pour l'évaluation des caractéristiques. Si ce n'est pas le cas, avez-vous d'autres idées pour l'évaluation ? Nous cherchons des idées pour mesurer la fatigue oculaire ou si la nouvelle mise en page permet de mieux séparer les contenus.
En plus de l'évaluation mentionnée ci-dessus, les opinions de nos communautés jouent également un rôle important dans la détermination des meilleurs changements à apporter. Que pensez-vous du prototype ?
Personnellement, j'apprécie beaucoup la séparation des régions et le fond contrasté : on n'a plus ce sentiment de "fourre-tout" où l'on ne distingue pas bien ce qui concerne l'article et ce qui est plus général.
Hi. If the menu split should put current page related links in the Tools menu, and all pages related links in the Main menu, why the Special pages link is in the Tools menu? IKhitron (talk) 21:03, 22 March 2023 (UTC)Reply
It is clearly arranged and flexible, I really love it!
Here are my recommendations:
The buttons for "Your alerts" and "Your notices" should be in that bar too, that pops up, when you scroll down. At least in that user menu.
There should be an opt-in for having all the subentries in the table of content (toc) fold out by default.
Also I noticed, that when you hover the mouse in the toc and scroll to the top or the bottom of it, it will begin to scroll the text on the right (article for example) and the toc will reset to the position that matches the position in the text. That is really annoying.
Hello @KleinerKorrektor. Thank you for your ideas. I've documented your request to add the icons in the sticky header, as we call it. We're also figuring out how to build this functionality to force all the headings to be shown. Regarding the third issue, are you still experiencing this? I'm not sure what you'd expect instead. Sorry, perhaps I just don't quite understand what you mean. Thanks! SGrabarczuk (WMF) (talk) 17:57, 30 March 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
When scrolled down the page with the left side toolbar hidden, it becomes impossible to set to show without going back to the top menu as the tools menu is not in the sticky header. This is annoying and a bit of a time-waster.
Also, the right sidebar is wastefully wide and the scroll bar is inset unnecessarily far from the page edge. Due to vision problems I often zoom in a bit to make the body text more legible while editing and with the side by side preview I cannot afford the wasted space on the right.
I really like the live-ish preview, but it should show what I have last edited, not require me to scroll around in what can be a very large piece of content until I find it or use the page search function. Try editing a references section with about 200 list formatted references to see what I mean. Cheers, Pbsouthwood (talk) 09:38, 14 March 2023 (UTC)Reply
Hello @Pbsouthwood. I've taken the liberty to split your comment into three different paragraphs. Would you agree with how I've done that?
Regarding the first part, I think the simplest follow-up is – what prevents you from pinning the menu when you're about to use it more often, and unpinning it when you need to have a wide view to enjoy the Real Time Preview? What practical disadvantages does this method have in your case?
Regarding the second part, could you share a screenshot with too wide areas marked? This will help us understand what you see. Thank you!
@SGrabarczuk (WMF): @OVasileva (WMF): @AHollender (WMF): Could you respond to my proposal for external link colors made in a comment in the Wikipedia RFC thread? If the proposal is doable can we implement it? If not, why not and what solution would you suggest for addressing the lack of distinction between internal and external links that the Vector 2022 link color change has caused? (The reasons for the need for this distinction are explained in another comment.)
My understanding, based on an earlier post in this thread I came across that linked to a blog post that explains the problem, is that the WCAG 2.0 AA requirements are so excessively strict that they leave a very limited amount of colors that can be used. However, while less than ideal, if we insist on meeting the AA standard, the same blog post links to a few other options that we can use. –Noha307 (talk) 18:44, 19 March 2023 (UTC)Reply
@SGrabarczuk (WMF): Thanks for following up on this. I particularly appreciate the effort to document decisions. The WCAG standards are complicated – both in terms of the multiple levels of compliance (e.g. A, AA, AAA) and the different standards for different types of text (e.g. link text versus body text color and body text versus background color) – so trying to parse them out was confusing. The Link Colors section on the Visual Refinements page does not mention any of the standards by name and only internal link colors are discussed, so it was difficult to determine what the self-imposed requirements were.
Also, I realized the wording of my comment and use of multiple pings might have seemed a bit aggressive, so I apologize if it appears that way. –Noha307 (talk) 16:47, 31 March 2023 (UTC)Reply
Latest comment: 1 year ago3 comments2 people in discussion
When I select some text that is at the top of the screen the page rapidly scrolls upwards, making me lose control of navigation and I end up selecting a bunch of text. So selecting any text if it is at the top of the screen is damn near impossible, I have to scroll the text toward the middle and then make my selection. I absolutely hate websites that mess with anything to do with scrolling, it makes me dizzy.
On another note I quite like the new design, good job. The toggle limited content width button seems useless though. Hrs70 (talk) 22:22, 31 March 2023 (UTC)Reply
Hello @Hrs70. Thanks for coming here. Are you experiencing this on desktop/laptop? By the text that is at the top of the screen you mean page content only, not the interface, right? SGrabarczuk (WMF) (talk) 23:23, 31 March 2023 (UTC)Reply
Yeah I just mean the text in some article. Say I have scrolled to the middle of some article, then selecting the text at either of the first 4 lines of text causes the page to scroll rapidly.
I went through a bit of debugging and it seems this event listener is being called which causes the scrolling,
// Handle autocomplete position on scroll
window.addEventListener('scroll', function() {
if (!kpxc.settings.autoCompleteUsernames) {
return;
}
kpxcUserAutocomplete.updatePosition();
kpxcTOTPAutocomplete.updatePosition();
});
although updatePosition() returns immediately the scrolling happens sometime after, seems to be in handle_scroll(), but not sure, I don't really have the time to debug this now. EDIT: Forgot to mention, I am running on a desktop PC with linux and Firefox v.109
Latest comment: 1 year ago2 comments2 people in discussion
Hola,
Hemos analizado los mensajes que nos habéis hecho llegar sobre el diseño de la página aquí, así como en el RfC (Request for comments) en la Wikipedia en inglés, los Cafés o Village Pumps, otras páginas wiki, Phabricator, así como en reuniones. A continuación, compartimos nuestras actualizaciones sobre este trabajo. Nos gustaría iniciar una conversación sobre los próximos pasos para seguir mejorando el diseño.
Opiniones sobre el espacio blanco
En la actualidad, Vector 2022 utiliza espacio blanco para separar las diferentes regiones de la interfaz. También tiene un fondo de página blanco (fuera del área de contenido). Hay dos cuestiones acerca de esto:
Comentarios sobre añadir más separación visual entre regiones de la interfaz. Se ha preguntado si esto mejoraría la experiencia de lectura. Principalmente por:
Centrar más la atención en el contenido al entrar en la página (en lugar de ver primero la interfaz en su conjunto y luego centrarse en el contenido).
Facilitaría la concentración en el contenido mientras se lee, ya que el área de contenido estaría mejor definida (algunas personas han informado de que se distraen con el índice de contenidos mientras leen).
Comentarios sobre añadir un fondo gris fuera del área de contenido. Se ha preguntado si esto reduciría la fatiga visual que algunas personas están experimentando debido a la gran área blanca (es decir, deslumbramiento) en pantallas más grandes.
Muchas personas han informado de que el espacio en blanco tiene un contraste demasiado alto y que añadir un tono más oscuro, como un gris, disminuiría esta tensión.
Prototipo - cambios propuestos y alternativas
Basándonos en esto, así como en los comentarios sobre iteraciones posteriores, hemos preparado este prototipo. (T259240) Se trata de una propuesta de posibles cambios. El prototipo se centra en:
Añadir un marco alrededor del área de contenido y del índice (así como de otros menús). Nuestra hipótesis es que este marco puede ayudar a estructurar y clarificar la interfaz. También haría más fácil centrarse en el contenido (tanto cuando la página se carga por primera vez, como durante la lectura). Ten en cuenta que puedes fijar el menú Herramientas utilizando el desplegable de la derecha.
Hacer que el fondo de la página sea gris. Nuestra hipótesis es que esto debería ayudar a reducir la fatiga visual que algunas personas están experimentando. También añadiría más atención al área de contenido y a la tabla de contenidos.
Nos inclinamos por la configuración que incluye el fondo blanco de la cabecera, los bordes y los menús enmarcados.
Pero esto tiene algunas desventajas. Esta configuración afecta a la anchura del contenido. Específicamente:
Reduce el ancho del contenido en comparación con la versión actual en el caso de que el menú de herramientas de página (el de la derecha en la captura de pantalla) esté abierto.
"Aumenta el ancho del contenido cuando el menú de herramientas de página está cerrado, en comparación con el ancho actual.
Nuestro equipo de diseño está trabajando para limitar sus efectos. Están ajustando parte del relleno y los márgenes, lo que se reflejará en el prototipo en los próximos días.
Testing
Como siguiente paso, nos gustaría proponer un experimento o una serie de experimentos que puedan validar las hipótesis anteriores. Nuestro objetivo es determinar si esta actualización del diseño mejoraría la experiencia de lectura y edición. Tenemos un par de opciones diferentes para ello. Por ahora, estamos considerando las siguientes:
Pruebas A/B: realizar una prueba A/B con usuarios registrados que analice las métricas clave del proyecto, comparando el diseño actual con el anterior. En concreto: tasas de abandono, páginas vistas, ediciones, duración de la sesión, uso del índice y desplazamiento. Debido a nuestras restricciones técnicas y a cuestiones de privacidad, no podemos realizar pruebas A/B con personas que hayan cerrado la sesión. Esto significa que utilizaremos el comportamiento de quienes hayan iniciado sesión como aproximación para el resto las personas usuarias. Si se selecciona el nuevo diseño, compararemos las métricas clave (antes y después del cambio) entre todos los usuarios.
Hay quienes han mencionado la elaboración de una encuesta en la que se pregunte a las personas qué diseño prefieren. Las encuestas de sentimiento pueden ser útiles, pero no creemos que sean la mejor herramienta para evaluar la usabilidad. La razón es que no creemos que este tipo de encuesta nos proporcione la información que necesitamos para confirmar o rechazar las dos hipótesis principales anteriores.
Nuestras preguntas para ti
Tenemos curiosidad por saber si lo que hemos enumerado más arriba te parece adecuado para la evaluación de las características. Si no es así, ¿tienes alguna otra idea para la evaluación? Estamos buscando ideas para medir si el nuevo diseño ayuda en la separación de contenidos o la fatiga visual.
Además de la evaluación mencionada, las opiniones de nuestras comunidades también desempeñan un papel importante a la hora de decidir qué cambios son los mejores. ¿Qué os parece el prototipo?
Gracias por escuchar los comentarios y proponer este nuevo prototipo. Desde mi perspectiva, enmarcar el contenido y añadir un fondo gris mejora bastante los problemas que genera la nueva interfaz. Sin embargo, me parece que el diseño sería más limpio si solo el contenido (columna central) estuviera enmarcado; los menús deberían permanecer con fondo gris, tal como se puede visualizar en el prototipo desmarcando la opción framed menus.
De igual manera, me parece que la tabla de contenidos debería permanecer fija en la columna izquierda. Al seleccionar hide, la tabla de contenidos se oculta en una posición poco intuitiva; volverla a su lugar requiere encontrar el botón, y hacer dos clics consecutivos, lo cual me parece un esfuerzo absurdo considerando que ocultarla no aporta ventaja alguna. En caso de mantener la opción de ocultar la tabla de contenidos, por favor consideren reemplazar el enlace [ocultar] (con corchetes) por una flecha u otro ícono.
Finalmente, me parece que los menús desplegables estilo pop-up son inconsistentes con la estética minimalista propuesta. Particularmente el menú principal impresiona que está sobrando, porque no queda bien ni como pop-up ni fijo en la barra lateral, desplazando a la tabla de contenidos. Una posible solución sería desplegar los enlaces (Portal de la comunidad, Actualidad, etc.) de forma horizontal entre la cabecera y el contenido al hacer clic en el botón de sándwich, y permitir ocultarlos con el mismo botón. DEGA MD (talk) 04:04, 1 April 2023 (UTC)Reply
Новый прототип. Визуальные различия между интерфейсами
Latest comment: 1 year ago5 comments4 people in discussion
Всем привет,
Мы проанализировали ваши отзывы о макете страницы. Мы ознакомились комментариями, которыми вы поделились здесь, а также на RfC (страница для комментариев) в Английской Википедии, на форуме, на других страницах Вики, в Фабрикаторе, а также на встречах. Вот обновления по этой работе. Мы хотели начать дискуссию о следующих шагах по дальнейшему улучшению макета.
Отзывы о пустом пространстве
На данный момент «Векторная 2022» использует пустые пространства для разделения различных областей интерфейса. Оно также имеет белый фон страницы (за пределами области контента). В связи с этим есть две области, вызывающие вопросы:
Комментарии насчёт добавления дополнительного визуального различия между оюластями интерфейса. Вам было интересно, улучшит ли это процесс чтения. Главным образом, за счёт:
Привлечения большего внимания/фокуса к контенту при переходе на страницу (вместо того, чтобы сначала рассматривать интерфейс в целом, а затем сфокусироваться на контент).
Чтобы было легче сосредоточиться на контенте во время чтения, поскольку область контента была бы более чётко определена (некоторые из вас сообщали, что отвлекались на содержание во время чтения)
Комментарии по поводу добавления серого фона за пределами области контента. Вам было интересно, уменьшит ли это нагрузку на глаза, которую испытывают некоторые люди из-за большой пустой области на больших экранах.
Многие из вас сообщали, что пустое пространство слишком контрастно и что добавление более темного оттенка, такого как серый, уменьшает это нагрузку.
Прототип – предлагаемые изменения и компромиссы
Основываясь на этом, а также на отзывах о дальнейших итерациях, мы подготовили этот прототип. (T259240) Это предложение о потенциальных изменениях. Прототип основывается на:
Добавление границ как вокруг области контента, так и вокруг содержания (а также других меню). Наша гипотеза заключается в том, что эта грань может помочь в дальнейшем структурировании и уточнении интерфейса. Это также облегчило бы фокус на контенте (как при первой загрузке страницы, так и во время чтения). Обратите внимание, что вы можете закрепить меню «Инструменты», используя выпадающий список справа.
Сделать задний фон страницы серым. Наша гипотеза заключается в том, что это должно помочь уменьшить напряжение на глаза, которое испытывают некоторые люди. Это также придало бы дополнительный акцент области контента и содержания.
Мы изучаем конфигурацию, которая будет включать в себя белый фон заглавления, границы, а также меню в рамке.
Но это сопряжено с некоторыми компромиссами. Эта конфигурация влияет на ширину контента. Конкретно:
Это уменьшает ширину контента по сравнению с текущей версией в случае, когда меню инструментов страницы (справа на скриншоте) открыто.
Это увеличивает ширину контента при закрытом меню «Инструменты страницы» по сравнению с текущей шириной.
Тестирование
В качестве следующего шага мы хотели бы предложить вам эксперимент или серию экспериментов, которые могут подтвердить вышеприведённые наши гипотезы. Мы стремимся определить, улучшит ли обновление макета таким образом впечатления на читателей и редакторов. У нас есть несколько различных вариантов для этого. На данный момент мы рассматриваем следующее:
Качественное тестирование — провести тестирование пользователей с помощью интервью с читателями и редакторами. Это будет направлено на то, чтобы приблизительно определить, легче ли сосредоточиться на контенте и снижает ли новый фон нагрузку на глаза
A/B тестирование — запустить A/B тест для вошедших в систему пользователей, который проверяет ключевые показатели проекта, сравнивая текущий макет с предыдущим макетом. В частности: количество отказов, просмотры страниц, правки, продолжительность сеанса, использование содержания и прокрутка. Из-за наших технических ограничений и соображений конфиденциальности мы не можем выполнять A/B тестирование для вышедших из системы пользователей. Это означает, что мы будем использовать поведение для вошедших в систему пользователей в качестве прокси для всех пользователей. Если выбран новый макет, мы сравним ключевые показатели (до и после изменения) у всех пользователей.
Некоторые из вас предложили создание опроса, в котором пользователей спрашивают о том, какой интерфейс они предпочитают. Опросы могут быть полезны, но мы не думаем, что они являются лучшим инструментом для оценки удобства использования. Причина этого в том, что мы не думаем, что этот тип опроса даст нам информацию, необходимую для подтверждения или опровержения двух основных гипотез, приведенных выше.
Наши вопросы для вас
Нам интересно, подходит ли привёденный выше список для оценки функций. Если нет — есть ли у вас какие-либо другие идеи по оценке? Мы ищем идеи по измерению того, помогает ли новый макет различию контента и снижает ли нагрузку на глаза.
Помимо оценки, упомянутой выше, мнения наших сообществ также играют большую роль в определении того, какие изменения являются наилучшими. Что вы все думаете о новом прототипе?
Мы пригласим больше добровольцев и сообществ к этому обсуждению. Мы хотели бы пригласить некоторых из вас, представляющих разные сообщества, в качестве первой группы заинтересованных редакторов:
Не увидел разницы. Пришлось изучить скриншот в гимпе, чтобы обнаружить бледно-серые границы. Вариант с серым заполнением полей был удачнее. Что же до сомнений в "уменьшает ширину" - помилуйте, даже в вашем скриншоте слева и справа от колонок с меню по целой ладони белого поля. Сдвиньте колонки меню к краям экрана, вот и место для текста освободится. Retired electrician (talk) 08:04, 21 March 2023 (UTC)Reply
(In English for simplicity) As I’ve said many times before, I would prefer frameless menu because this is a more visually appealing design (no opinion on header because it’s not as distracting/concerning). Thankfully, most of the people who have commented here seem to agree. Not sure if this will make the new Vector team to proceed in the better direction, though, since framed menus were, from our discussions, by the insistence of AHollender. stjn[ru]23:18, 2 April 2023 (UTC)Reply
Bonjour @Reptilien.19831209BE1, je voudrais être sûre de bien comprendre votre commentaire. Aimerez-vous le sommaire masqué sous l'icône par défault ? ou au contraire le sommaire présent sur la gauche mais avec toutes les sections cachées ? ou les sections présentes, mais avec les sous-sections fermées par défault ? Pouvez-vous m'en dire plus, sur votre motivation aussi ? Dans le premier cas, je vous informe que vous pouvez réplier le sommaire une seule fois et le masquage sera persistant d'une page à l'autre durant la navigation. Cordialement, Patafisik (WMF) (talk) 10:19, 31 March 2023 (UTC)Reply
Une image valant mieux qu'un long discours, voyez celle-ci. Il y a deux pages : à gauche fr:w:Bruce Willis, à droite fr:w:Bruxelles. Pour je ne sais quelle raison, à l'ouverture de ces pages, le sommaire (de l'article) à gauche est ouvert alors que celui de droite est fermé. Je souhaiterais que le sommaire soit toujours replié (comme à droite), peu importe si j'ai déjà visité la page. Comment puis-je faire ? Reptilien.19831209BE1 (talk) 12:50, 1 April 2023 (UTC)Reply
Merci @Patafisik (WMF) d'avoir ouvert cette tâche sur Phabricator. Vous avez écrit dans celle-ci « user would like to see sections always closed ». C'est vrai que c'est personnellement ce que je souhaiterais, mais peut-être que d'autres préféreraient que le sommaire soit toujours déplié. À mon avis, c'est quelque chose qui devrait être paramétrable (dans ses paramètres personnels). Je précise ici mais c'est peut-être une information qu'il faudrait faire remonter sur Phabricator, non ? Reptilien.19831209BE1 (talk) 09:32, 3 April 2023 (UTC)Reply
Latest comment: 1 year ago1 comment1 person in discussion
Regarding the 2022 skin... I don't like it, firmly. Having been using it since it became the default skin, unmodified and without any user scripts, I find that I much prefer the left-side links (article TOC not sharing the same space), user top links, Preference page section tabs, and other things, as they were prior to the 2022 skin. I've been assuming that the 2022 and ongoing changes were implemented to bridge the gap between desktop and mobile viewers, and improve performance on the latest hardware. I had left my skin preference at the default setting after Wikipedia switched to the 2022 skin, because as an editor, I felt it was important to see the same display as logged-out Wikipedia viewers would. The new skin lacks the accessibility and backward compatibility I've come to appreciate, and so I have switched back to the Vector Legacy skin. — CJDOS, Sheridan, OR (talk) 03:18, 7 April 2023 (UTC)Reply
The future of Vector 2022 and software decision-making. A meeting with Selena Deckelmann
Latest comment: 1 year ago1 comment1 person in discussion
Let's talk about how the process of deploying and changing Vector 2022 has gone, what the current plan is, and what may be the future of software decision-making!
I'm gonna refer to English Wikipedia, but the topic is universal, really.
For over two weeks, we (the Foundation) and English Wikipedians have been having a discussion about the steps after the closure of the Rollback of Vector 2022 RfC. I think you may be interested in the latest response from our team posted on April 6. We invite you to that discussion, but also to a meeting with Selena Deckelmann, Chief Product & Technology Officer at the Wikimedia Foundation.
We want to hear and talk about
Your thoughts around the deployment of Vector 2022 on English Wikipedia and other wikis
What the current plan is (we would like to go over our current prototype)
What are the options for the future of software decision-making (a discussion about the format of RfCs in this context)
I'm using the new layout for quite some time now and I like it. Great work, thanks!
One thing I absolutely hate, though: In the left-side nav bar, all the links seem to cover the full width of the bar, even if the link text is much smaller. So e.g. if there is a table of contents with the two chapters "Some very long text" and "Short", the white space right of "Short" will link to the "Short" chapter as well. It's effectively a link like "Short _____________", where the underscore line is invisible, but anyway linked. While I personally don't see any usecase for this (if I want to open the link, I would click on the link text and not just somewhere around it, would I?), I see a disadavantage of this multiple times every day: When I want to scroll through a long page, I habitually middle-mouse click some white space on the page to enter the browser's fast scroll mode. Works in any browser and almost all websites (the only common exception: ads), just on Wikipedia I now have to be very careful where to do this, and frequently end up in opening a new background tab instead of scrolling. Karotte Zwo (talk) 09:13, 22 February 2023 (UTC)Reply
The mouse cursor here points to the link "15. März", not to plain whitespace, as expected by me
Yes, German Wikipedia is right, but I also see the same on e.g. English Wikipedia, on Commons or here. Not OS or browser dependant, seeing it on both Chrome and Firefox, and also both on Windows and Android (though on Android I don't scroll by clicking white space, so not an issue for me there).
It mostly affects pages with a table of contents that is long but not exceeding the screen, and where most topics have short names. A good example is de:WP:Auskunft, a village pump where topics are sorted by day. See the screenshot: A good part of the whitespace visible in it is linked with the table of contents. If I middle-click where my cursor is in this, I don't enter free scrolling mode as expected, but open a new tab with the same page again. Karotte Zwo (talk) 15:48, 21 March 2023 (UTC)Reply
Actually, I find that this design with a large "overshoot" area makes navigation easier and more comfortable. The TOC behaves like a menu with invisible buttons of consistent width. When the user moves the pointer into the TOC area, they can navigate to different sections by simply moving the pointer up and down (or scrolling the TOC vertically) without worrying to hit the text.
For this reason, I wouldn't consider the TOC area (and other menus) as "white space".
I saw that an interface with "boxed" TOC and menus (bounded with a border or with a different background) is being tested. I think this is a good idea, as this would more clearly delimit them as part of the interface (rather than empty space). --Lion-hearted85 (talk) 12:24, 8 April 2023 (UTC)Reply
Latest comment: 1 year ago33 comments28 people in discussion
Hi everyone,
We have been analyzing your feedback on the page layout. We have read the comments you have shared here as well as on the RfC on English Wikipedia, Village Pumps, other wiki pages, Phabricator, as well as at meetings. Here are our updates on this work. We wanted to begin a conversation around next steps on further improving the layout.
Feedback about the white space
Currently Vector 2022 uses whitespace to separate the various regions of the interface. It also has a white page background (outside of the content area). There are two areas of concern about this:
Comments about adding more visual separation between regions of the interface. You have been wondering if this would improve the reading experience. Mainly by:
Drawing more focus/attention to the content when landing on the page (rather than taking in the interface as a whole first, then focusing on the content)
Making it easier to stay focused on the content while reading, because the content area would be more well defined (some of you have reported getting distracted by the table of contents while reading)
Comments about adding a gray background outside of the content area. You have been wondering if this would reduce eye strain some people are experiencing from the large white area (i.e. “glare”) on larger screens.
Many of you have reported that the white space is too high in contrast and that adding a darker hue such as a gray decreases this strain.
Prototype – proposed changes and tradeoffs
Based on this as well as feedback on further iterations, we have prepared this prototype. (T259240) This is a proposal for potential changes. The prototype focuses on:
Adding a boundary around both the content area and the table of contents (as well as other menus). Our hypothesis is that this boundary can help to further structure and clarify the interface. It would also make it easier to focus on the content (both when the page first loads, and while you are reading). Note that you can pin the Tools menu using the dropdown on the right.
Making the page background gray. Our hypothesis is that this should help reduce the eye strain some people are experiencing. It would also add further focus to the content area and the table of contents.
We are leaning towards the configuration which includes the white header background, borders, as well as framed menus.
But this comes with some tradeoffs. This configuration affects the width of the content. Specifically:
It reduces the width of the content when compared to the current version in the case where the page tools menu (the right one on the screenshot) is open.
It increases the width of the content when the page tools menu is closed, when compared to the current width.
Our designers are working on limiting the effects of this. They are adjusting some of the padding and margins, which will be reflected on the prototype in the coming days.
Testing
As a next step, we would like to propose an experiment or series of experiments which can validate the hypotheses above. We aim at identifying whether updating the layout in this way would improve reader and editor experiences. We have a couple of different options for this. For right now, we are considering the following:
Qualitative testing - run user testing through interviews with readers and editors. These would aim at approximating whether the content is easier to focus on, and whether the new background reduces eye strain
A/B testing - run an A/B test on logged-in users, which looks at the key metrics of the project, comparing the current layout to the previous layout. Specifically: opt-out rates, pageviews, edits, session length, usage of the table of contents, and scrolling. Due to our technical restrictions and privacy concerns, we are unable to perform A/B tests on logged-out users. This means that we will use the behavior for logged-in users as a proxy for all users. If the new layout is selected, we will compare key metrics (before and after the change) across all users.
Some of you have mentioned building out a survey that asks users about which layout they prefer. Sentiment surveys can be useful, but we don’t think they are the best tool for evaluations of usability. The reason for this is that we don’t think this type of survey will give us the information we need to confirm or reject the two main hypotheses above.
Our questions to you
We’re curious if the list above sounds good for the feature evaluation. If not - do you have any other ideas on evaluation? We are looking for ideas on measuring whether the new layout helps in content separation or eye strain.
Beyond the evaluation mentioned above, the opinions of our communities also play a big part in figuring out what changes are best. What do you all think of the prototype?
We will invite more volunteers and communities to this discussion. We wanted to ping some of you coming from different communities as the first group of interested editors:
Hi. I just got the ping. I don't think I'm the right person to answer on this particular question, because I think that the unpinning to two opening lists is a very good decision, and so I do not use at all the pinned sidebars. Especially after yesterday's deployment of my phab task, which unpins the TOC. So sorry, it isn't a question to me. IKhitron (talk) 01:27, 9 March 2023 (UTC)Reply
I think my involvement in the Discord meetings and phab makes my position fairly clear :) I'm a big fan of the current "Zebra #9" prototype, with borders and framed menus. It looks like since my last phab comment, the prototype has been updated to remove the border option (Now always on) and the header background option (Off without framed menus, on with.). While not absolutely required, I still prefer the framed menus myself, but with the central page content framed, that's more preference than need. If framed menus were a preference the user could select, that's probably be nice. Ferret (talk) 01:27, 9 March 2023 (UTC)Reply
Hi and thanks for this write up. In A/B tests I would definitely want to see how many clicks are there in left an right sidebar in various variants. Some questions come to mind though (don't know the answers):
What does it mean to use the table of contents during reading?
What does it mean to use the main menu (left sidebar)?
What does it mean to use the tools menu (right sidebar)?
Are users distracted or do they want to do some task (do they want to read or do they want to e.g. explore linked articles)... I don't think that this can be deduced from A/B tests alone, but if you have measured clicks on various actions in A/B tests, it could be a good material for preparing tests in the form of interviews. And as a helpful side effect - statistics on the use of various actions in the tool and main menu could also help communities decide to maybe remove or move some links/actions. Nux (talk) 02:06, 9 March 2023 (UTC)Reply
Hi @Nux - thanks for your feedback! I've added clicks to the tools menus to the measurement plan (will post the updated plan in the next few days). In terms of your wider questions, I agree that it would be difficult to establish what the ToC and menus are used for only from A/B testing. We're hoping to cover this part through the user testing. Right now, the plan is to recreate a session by the testers - for example, asking them to read a paragraph, navigate to a different section, and then read another paragraph. This should hopefully give them enough exposure to both designs to be able to measure the hypotheses of reading focus and reading comfort/eye strain. OVasileva (WMF) (talk) 15:13, 17 March 2023 (UTC)Reply
The new prototype looks great and really easy on the eye, especially the framed menus. However:
The TOC makes an impression that it is too tightly packed: its padding is relatively small (4px0 / 20px10px20px4px) comparing to #content's (30px50px).
This is how the three boxes interact, as I see them:
Is it possible for logged-in users to set their preferred width on a computer-specific basis? Cookies, maybe?
Is it possible to do what you did with V2022 and include different screen sizes? The image you have is good but it's what it would look like on a wide
What has actually changed? Like, functionally? Is it just the border color?
What about the width that was mentioned so much in the RfC?
I also have a few suggestions.
Test using enwiki-wide banners, fully randomly. To avoid canvassing, and to limit bias. I don't know how technically possible it is to do it for all (most) wikis, but as many as possible.
Opt-in A/B testing, again fully random.
Define right now a threshold of success for the qualitative testing/AB testing, and make sure users know about it.
Define right now what you mean when you say we would like to propose an experiment or series of experiments which can validate the hypotheses above.
The prototype does not have a sticky header anymore. Is this intentional? I would really miss it.
As a rather early (mid-2021) adopter of vector-2022, it appears to me that the skin has become much more cluttered and complicated after the enwiki RfC due to all the requests that have been made there. While some requests are clearly legit and some new functionality is indeed great, I find this concerning.
I personally prefer the prototype without backgound color—it simply looks dated with background. Particularly the thin 1px border contributes to this impression.
What is okay, though, is the current setup here at Mediawiki.org with a gray background left and right to the viewport, but with no gray background visible between ToC/main menu/tools menu/article boxes.
Hi @MisterSynergy - sorry for the late reply and thank you for your feedback! Introducing additional clutter is something we're looking out for as well. Just wanted to confirm that the sticky header is only unavailable in the prototype - we don't have any plans on removing it. OVasileva (WMF) (talk) 20:09, 27 March 2023 (UTC)Reply
Looks great! But a small question the prototype doesn't seem to work without JScript(which is sad) or maybe it's me. Also the prototype seems to not find out about my browser language choice and doesn't suggest it at top of language choice list. Greatder (talk) 11:24, 9 March 2023 (UTC)Reply
I am sorry but I don't like it. It is only slightly better than the deployed version. The ToC and user's menus should go back to the way they were in V2010, according to the views expressed by many English Wikipedia editors here and here, and by many others in the discussions above: the ToC inside the article under the lede; the user's menus in the left side column. Æo (talk) 12:09, 9 March 2023 (UTC)Reply
Thanks for the invitation.
For testing, I would suggest to look at experienced editors, new editors and readers that do not (yet) edit as separate groups and try to use samples that represent all internet users and avoid over-representation of US and EU.
It would be interesting to see after say 1 or 2 months what have become the options they actually prefer to use. It took me some time to get used to the new layout, but after that it became my preferred skin.
The way the sidebars are used, shown and hidden, feels more natural in this new version. To me, this is a substantial improvement. In the present version I often confuse the vertical slidebar of the Tools with the window slidebar.
I personally like the gray background, probably because it is more reminiscent of the traditional Wikipedia look. But if readers and new editors clearly don't share my preference, I could easily do without it. Especially as there seems to be a dark mode in the works too.
I share the impression and concerns of @MisterSynergy about clutter.
Thanks for the ping and the work. I'm sorry, I think I don't want to be involved in the process anymore. I personally arrived at a stage where I'm waiting for the process to be finally finished, so that we can finally judge what work will follow for the communities. Imho the current state with the contradictions in user interface is a bad idea and no viable starting point for further work. Also I don't like if functionality is lost (like with the new toc). Best of luck with your work. I'm sorry, regards HirnSpuk (talk) 19:37, 9 March 2023 (UTC)Reply
I very much support this demo. I think it looks much better than the current skin.
For me, gray background outside of the content area allows to focus on the content, provided that frameless menus are used (the "Framed menus" option is disabled):
The frames and white background of the menu cause the eye to run over the resulting gray sections around several windows, which distracts me.
In addition, I would like to refer to many voices in the discussion of the new vector and the argument that the old vector works better on wide and high-resolution monitors, because... it spilled text all over the window. On the contrary, the old vector was ok for narrow monitors and small resolutions. With increasing resolutions (for the old vector), the lines of text became longer and longer, which made it extremely difficult to read and made using Wikipedia (as a reader) less and less comfortable. I do not agree with the voices to remove the white areas to gain more width for the content - that would be a return to long lines that make it difficult to read comfortably. Zdzislaw (talk) 10:53, 11 March 2023 (UTC)Reply
This would be greatly appreciated. While I would personally prefer the frameless variant, either prototype variant helps bring Wikipedia back in line with WCAG supplemental guidance - specifically Make the Site Hierarchy Easy to Understand and Navigate and Use a Clear and Understandable Structure. The table of contents, while still available as a useful navigational aid, is differentiated from the page itself through more than just a bit of whitespace and is rightly no longer treated as if it is equally important to focus on as the page content. While this will not be as easy to read and navigate as the old skin - hierarchy could still use work, mostly with regard to menu structure - it will be a major improvement accessibility-wise (at least for me) compared to currently existing Vector 2022.
One suggestion: for any testing, please keep the goals of this change in mind, not just the overall goals for the project. Decreased use of the table of contents compared to current Vector 2022 may well be something you'll have to live with for accessibility; making it less obtrusive and easier to not focus on is rather the point. 24.246.2.24403:45, 16 March 2023 (UTC)Reply
At least on my PC it has less "white"(cause it has grey boarders left and right) space than the normal desktop current site.
I recognize (too) much white space as highly (aggravating) distracting, so i even like linked current prototype (di-content-separation.web.app) more than actual desktop current, because it is wider.
I prefer unframed as i like dark mode more in general but both options are ok. Framed mode shouldn't move any content around so, which the prototype still does.
I think (as i have written in another discussion where it got deleted -.-) that the idea of a width limit (especially the current one) to ease reading is fine, but only for text. So taking the moss site as an example, i would suggest using whites pace on the right for things like this overview card and pictures, as well as for things like the tool toolbar. For now pinning the toolbar moves the whole content instead of it just being put into white space (which is wide enough for it).
Another option still would be to have the maxed setting as default, which honestly looks the best so far for me, but it obviously makes it a bit harder to read, but doesn't anger me because of too much white space.
This is all on a 1920px and a second 1680px width screen in maximized browser mode.
Now when i partition it and use half a screen which is pretty nice to use 2 files (like an opened pdf and a text file) the prototype compared to desktop current is more narrow both with current or Zebra #9 settings, which it does not need to be. Hope it will get better with the newer margins.
So overall i'm a) confused why current prototype(di-content-separation.web.app) is different than current desktop, b) i like the idea of darker areas (which makes big white spaces more bearable) and i still would prefer a bigger width limit which truly reduce white space and not just visually makes it more bearable. Pinned Tools should also be put into white space if it is big enough and not shrinking the actual content and still leaving white space on the right which now has 0 validity, as the toolbox itself is not longer than current max width.
Limited max width makes sense for each single element you need to recognizance but not a combination of multiple elements like a separate toolbar.
I still would hope to see a general ("sentiment") survey for all wiki users (majority is probably not logged in or even registered) between designs.
In this regard i think it is pretty important to give any kind of participants in studies the option between different (st least 2) designs. Telling someone if Option A or B is "better"(relative comparison?), is a lot more easy to do than rating how good one Option is. YaphitsBrother (talk) 11:03, 17 March 2023 (UTC)Reply
Personally, I like the grey background because it is much easier to tell apart the page content from the rest of the wiki. However, pinning the tools menu reduces the width even more, and this is not a good thing, as the unlogged-in readers do not have the tools menu pinned, and as such, the width seen by the editor would be different than the width seen by the reader. --NGC 54 (talk | contribs) 11:42, 9 March 2023 (UTC)Reply
This is simply not relevant. There are a lot of people who read Wikipedia on desktop, and ensuring a good layout for desktop is important. --NGC 54 (talk | contribs) 12:53, 10 March 2023 (UTC)Reply
@NGC 54 this is relevant and in fact very important. Even on desktop there are many resolutions out there. On a 13 inch laptop/netbook (e.g. in school) your experience will be completely different then on 15 inch laptop (gaming/work laptop) and different on 22.5 inch monitor (as my own). You should always design content so that it can be useful in different resolutions, it might seem hard, but it mostly just works on Wikipedia (unless you use weird templates or too specific html). If you don't know the term RWD, you might want to read about w:en:Responsive web design. In fact, in practice, you should never design a page for a specific width. Nux (talk) 19:39, 10 March 2023 (UTC)Reply
I like the gray background and borders, which of course exists here on the MediaWiki site (I guess I am still using Vector 2010 here) and are very helpful. The fundamental problems of excessive white space and padding are still present (for me) on that Moss demo page, however. My browser window is 1228 pixels wide; on en.WP in Vector 2022, I have managed to remove a lot of the whitespace and end up with 835 pixels of usable width for content with the TOC and Tools menu pinned to the side. On my screen, the demo Moss page has only 635 pixels of horizontal space for content, which feels very constrained. Many display elements like tables and multiple columns that work now will either overflow, scroll, or be single columns in this new layout. Image "sandwiching" will be a significant problem, and there will be editing disputes about modifying pages to accommodate this overly narrow width (editors using larger monitors or skins with reasonable padding will not see a problem and will object to the wikitext changes).
Since the rollout of Vector 2022 to all readers, I have submitted many bug reports about excessive whitespace and padding. A few of them have been fixed, but there is much more work to do.
One other thing: If I pin the TOC and the Tools menu on the demo Moss page, and then shrink the window horizontally, the TOC responsively collapses into a button, but the Tools menu persists, shrinking the content column. I suspect that this is not the desired behavior. Jonesey95 (talk) 14:51, 9 March 2023 (UTC)Reply
I didn't mind the all-white-bg design (loved it!), but if we're gonna have gray sides, better make the menus frameless. Too many misaligned framed boxes look&feel messy. Add sitenotice boxes (weird positioning! anyone thought of that?), infoboxes, image boxes, each of their own widths and the whole page is painful to look at. Also, page elements (boxes) should not jump as toolbars on the left or right are added, especially so when switching between namespaces. Reserve enough margin on the left and right for those menus and have the central (article) panel neatly centered. I loved and supported the new skin from the start, but this has turned into a jumping mess. Still using V2022 as I've not lost all hope, but it's an everyday hide/show/pin NS0/NS>0 struggle (I like to keep the main menu closed for articles, so the TOC is on top of the page, but as a sysop I want the menu, thus shorter text lines in other namespaces and on special pages). And, oh, did I mention ~double line spacing in those menus – why should one need to scroll the page to reach the bottom of a 15-item list?
ponor (talk) 15:59, 23 March 2023 (UTC)Reply
A definite improvement, thanks and keep it up. Still too much whitespace: between the header and the top of the body; between the outer edge of the menus and the edge of the page (the open/close caret could line up with the burger-menu icon, rather than the latter lining up w/ the edge of the box); the main menu is much too wide; the tools menu could be slightly less wide. Still confusing font/kerning choices: It would be better to keep menu text smaller, and line height proportionally smaller, and to lightly bold the menu section-headings. That saves space, reduces scrollsing, avoids confusion with body text, and helps the eye more easily peruse a long menu. Sj (talk) 21:31, 28 March 2023 (UTC)Reply
Hi everyone,
Thank you all so much for your feedback on the prototype and proposed measurement plan. Based on this feedback, we will proceed as follows:
User testing: we will set up user testing with readers. In this testing, participants will be presented with either the current layout or the proposed layout and encouraged to explore an article with both layouts and interact with the different menus. Afterwards, participants will be asked questions about their experience. The goals of the test will be:
Understand if the visual separation makes it easier for users to focus on content.
Understand if the visual separation makes for a more comfortable reading experience.
Understand if the visual separation makes it easier for people to navigate the article.
Identify any potential improvements that could be made to enhance the reading experience.
Gauge user preferences between current Vector 2022 and the new prototype.
A/B testing: We also want to ensure that the new layout does not negatively affect any current high-level metrics for the project, which will be determined via an A/B test. Due to privacy and technical restrictions, we are only able to run this test with logged-in users. We will be able to filter the results by the number of edits a given user has, and can potentially proxy logged-out users via logged-in users with 0 edits. We will be looking for no statistically significant decreases in the following:
Pageviews
Edit rate
ToC usage
Scrolling
Page tools usage
Feature review: A few of you have mentioned that there are some layout inconsistencies in the prototype related to spacing and alignment. We are currently reviewing these and will update with any changes.
Thank you all once again. We’re looking forward to your thoughts on this updated measurement plan. We plan on starting the user testing portion later this week, and the A/B testing portion within a couple of weeks. For those interested in tracking progress in phabricator, most of the work is tracked as subtasks of this ticket. OVasileva (WMF) (talk) 16:48, 29 March 2023 (UTC)Reply
@OVasileva (WMF), aesthetically, I think I could come to like the gray. The screen width would certainly be a tradeoff, though, given that there were already concerns about it being too narrow.
You wrote It increases the width of the content when the page tools menu is closed, when compared to the current width, which is not what I'm seeing in the prototype. It looks to me like the width for the gray design with page tools closed is narrower than for the white design with page tools closed. Could you clarify on that? The appearance with page tools closed is what I care most about, since virtually all readers (and many editors, including myself) are going to prefer that.
One way to create more space might be to not have a border to the left of the table of contents. I'm curious what that would look like. Cheers, {{u|Sdkb}}talk15:49, 4 April 2023 (UTC)Reply
I really prefer the current deployed version over the prototype. The separation wastes quite a lot of space, and the gray+white combo looks strangely formal compared to the plain white version. DFlhb (talk) 17:58, 8 April 2023 (UTC)Reply
Latest comment: 1 year ago5 comments2 people in discussion
For some reason—only when I am logged in—article layouts display incorrectly (i.e. text is shoved into a tiny column, and image boxes are broken). However, when I view the same articles when logged out of my Wikipedia account, everything displays as intended. What might the problem be, and how can I fix it?
For reference:
This is what I see when logged in.And this is what I see when logged out.
I've tried hiding the menu and tools, but that does not seem to help.
Thanks for your reply! Adding ?safemode=1 makes the layout even stranger. It makes the infobox larger and pushes all article text to begin after the infobox. Armadillopteryx (talk) 20:23, 10 April 2023 (UTC)Reply
Hey @Armadillopteryx. The part about the infobox is expected – it's because ?safemode=1 disables local styles, and it means the infobox will look different. What about the text width below, though? It isn't as narrow as it is without ?safemode=1, I presume? SGrabarczuk (WMF) (talk) 13:58, 11 April 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
Some situations are arising that could be solved, or mitigated, through the provision of a magic word, built-in, or a property testable by parser function or otherwise. Something like "{{CURRENTSKIN}}" would be nice. An example where this may be occurring is this discussion, concerning the en-wiki template Template:Compact TOC's use of __NOTOC__ which has consensus (developed while Vector 2010 was the default), but with the advent of Vector 2022 results in the suppression of the ToC from the left sidebar, which is an undesirable result according to one user. (Note: regardless whether it is determined that this example is or isn't something directly related to changes in ToC handling by Vector 2022, I'm sure there will be other examples where a testable property would be helpful.) Mathglot (talk) 06:55, 25 March 2023 (UTC) updated by Mathglot (talk) 20:57, 26 March 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
This way, the position would be similar to the old version, and it's the one most people commonly associate with Wikipedia. It also allows to better research the way the encyclopedia works and find new topics, both necessary steps to understand how the project works, how most thing people find on the page are human-made or human-conducted, and it's in general more trasparent on how Wikipedia works and what guarantes and accuracy it can give 37.103.218.18919:57, 26 March 2023 (UTC)Reply
Hi @37.103.218.189: , thank you for your feedback. The Page tools menu has been moved to the right side intentionally, for splitting the sidebar into two menus and making it easier to distinguish which tools are for the individual page and which are for the entire website. Moving the page tools to the far side of the page, now they are near the other page tools (History, Edit, Move, etc.). More details here. Patafisik (WMF) (talk) 14:51, 20 April 2023 (UTC)Reply
Latest comment: 1 year ago1 comment1 person in discussion
As a Wikipedian with 17 years of experience, I am unable to work in the new (2022) look. It is unacceptable to me. Fortunately, you can go back to the old look. And so I did.
I went back to the "2010" look.. Radek68(dyskusja)07:04, 27 April 2023 (UTC)Reply
Hi @SGrabarczuk (WMF)I'm using mediawiki 1.39 with Vector 2022 template.
On all pages of my MediaWiki, the TOC goes to the left sidebar except for the Main Page where it stays on the content page and dosen't even have the hide link. I would like to behave the same way on the main page as well, with the TOC on the left sidebar, is it possible? Salv70 (talk) 16:33, 11 April 2023 (UTC)Reply
I have the same question. The TOC isn't even rendering nicely on the Main Page, it has no styling whatsoever. It would be nice to have it render on the sidebar like all other pages, or at least render nicely with the correct styling. Lwangaman (talk) 22:07, 23 April 2023 (UTC)Reply
Latest comment: 1 year ago2 comments2 people in discussion
I was very surprised today to learn that anonymous users can't see the sticky header in Vector 2022.
The updates, posted by the team in late 2021 and early 2022, included prototypes of the sticky header for both logged-in and logged-out users. The research indicated that it was important for users (from both groups) to be presented with a page title and an option to go to the search. [2][3]
What's more, in a study conducted among logged-in users (and thus with strong habits about the page layout), a 15% decrease in the number of page scrolls was observed. [4] It seems reasonable to think that among readers who read more than 1-2 pages, the trend could be repeated. Since the floating header itself has been implemented and deployed, it would seem logical to prepare a version for non-loggers (even if changed only slightly). It's noteworthy to mention that it's typical for various websites to provide a search bar (or at least button to invoke search) not only at the top. People are already accustomed to such a feature. And, as can be found in the Wikimania presentation, there were 30% more search sessions with the new search. [5]
Even if the header contained only the search engine icon and the page title, it would be a big step forward, in my opinion. And the space on the right could be occupied by the login and account creation buttons (as in the header at the top of the page). I prepared a variant form of the header for logged out: [6]
Reading the news from the Web team, one could get an impression that the implementation of a sticky header for anons was planned (perhaps to be done later than for logged-in). Now that Vector 2022 is the default on many wikis, including many large wikis, and the team is working on visual refinements, the question arises: what happened to the floating header for anonymous users?
In my opinion, not deploying the header for anons deprives them of some of the really good innovations in the new skin. An example would be the search engine, that would available anywhere on the site.
I'd like to hear from the team what's the fate of sticky header for anons. Whether and when can we expect it being deployed? And if not, what was the reason to abandon the idea? Msz2001 (talk) 17:28, 27 April 2023 (UTC)Reply
someone had a decree of the Ministry of Health of the United Kingdom on reducing the brightness of monitors. I can't find the link. The savings were measured in hundreds of millions of F (reduction of electricity consumption, equipment resource, treatment of eye diseases, payment of sick leave, ...). It's time for Wiki to listen to this. Seregadushka (talk) 00:26, 8 November 2022 (UTC)Reply
Native dark mode is necessary for global environmental friendliness and for a better experience.
It reduces power consumption when using OLED displays.
In short, we are not going to do that as part of this project. At the beginning of the project, we would even say that it's not possible. It has become technically possible recently, though, and someone at the Foundation could work on that.
Perhaps you would consider taking part in the Community Wishlist Survey and voting for dark mode? This is an easy way for editors to ask for a specific technical change. The period for making proposals will be in January, and voting would be around late January - early February. (See the Wishlist's FAQ to learn how to take part.) Thank you! SGrabarczuk (WMF) (talk) 22:55, 9 November 2022 (UTC)Reply
I can't figure out how to participate in the survey. Where is the choice of questions ? 4 periods are specified, but there are no actual tasks of this survey. Prudently. On the topic -- now absolutely all operating systems of mobile phones and computers have "Dark Mode". Stop hanging around in the past, when there was nothing but a white Apple. If the design is only white? My eyes hurt from the work of your designers ! Seregadushka (talk) 03:27, 16 December 2022 (UTC)Reply
Hey @Seregadushka. We also believe having the dark mode would help. As I wrote, this mode has only been made possible recently, as a consequence of this project. (The Survey hasn't started yet - the first phase will start in January.) SGrabarczuk (WMF) (talk) 16:11, 16 December 2022 (UTC)Reply
And my eyes hurt when I try to read bright text on dark background. Also you seem to be (deliberately?) forgetting that even Apple I had white text against black background (as did Apple II and MS-DOS) - I'd say there's a reason we moved away from that. 2A02:A312:C539:8D80:78DE:760D:452F:23E219:58, 19 January 2023 (UTC)Reply
Talk:Reading/Web/Desktop Improvements|I see you don't even mention these reasons, because there is no reasonable explanation for this. What you don't know how to do working with CSS styles is not the reason. The whole world is striving for green technologies. But you don't understand (intentionally?) that millions of monitors operating in the mode of maximum energy consumption disrupt the general movement of humanity to reduce the impact on the environment. Hire other programmers who understand CSS. Seregadushka (talk) 23:26, 19 January 2023 (UTC)Reply
"At the beginning of the project, we would even say that it's not possible."
This is a completely false statement. From a programmer's point of view I can guarantee everything that such a change is extremely easy. But on a LARGER NOTE -- the Wikipedia Android Mobile App has had dark mode for quite some time. And the time is far overdue for the web interface to catch up and stop being both a drain on electricity and a strain on eyes. ClimbAll (talk) 09:34, 21 January 2023 (UTC)Reply
I wouldn't call dark mode easy, or impossible. Somewhere in the middle. There are dozens of CSS elements you never think about or notice until dark mode messes them up.
I have been using Skin:Citizen for quite some time on my wiki with very few problems. It has an excellent dark mode that automatically engages when user browser preference is set. I think WMF should make it available for logged in users. Flounder ceo (talk) 16:18, 31 January 2023 (UTC)Reply
Hello from a fellow programmer. I have tried making a dark mode of the legacy Vector skin. It's horrible. You are very much wrong when you say that it is extremely easy. It seems like you have very little experience in this field. Building a system with both light and dark modes from scratch, isn't so bad. Wikipedia wasn't built for that, and the articles written since were styled for a bright interface.
I also use the mobile app, and in a dark style. I like it. But you can't escape from the fact that the mobile app was built almost from scratch, and that there's several visual problems with it.
> At the beginning of the project, we would even say that it's not possible. It has become technically possible recently, though
This is an insane thing for you to have to say. If the redesign made darkmode impossible and it has only recently allowed for it for be done very difficultly, you should consider whether the redesign is any good at all. 81.100.55.9600:15, 31 January 2023 (UTC)Reply
Hello! Let me clarify, I meant this project has just recently made it possible to build the dark mode. Before that, with the previous skins and in the early stages of the project, it wasn't possible. SGrabarczuk (WMF) (talk) 02:01, 28 February 2023 (UTC)Reply
Tbh I don't see how it would be technically impossible to create an additional dark-mode. Leave vector2022.css to handle all the display elements, but you can easily set a separate theme css files to handle things background colors, border colors, text colors, etc.
Since Wikipedia allows the use of custom CSS anyway seems to be time to go trawling through the default vector2022 css file's in an dev tool and adapt a dark theme from that.
Would it be perfect? No, I know CSS3 can perform hue and saturation shifts, on images, but it would effectively change how they're viewed, outside perhaps having a change to how images are displayed. Same perhaps with some other display elements.
But impossible? I don't buy that reasoning. I was beginning to do a dark theme for the old Vector theme but that remained unfinished. 82.43.217.21822:00, 28 April 2023 (UTC)Reply
Please read the rest of the discussion. Lots of things are possible in the triangle of time, cost, quality. So whenever people say 'impossible' they rarely mean actual impossible, they refer to feasibility within those constraints. MediaWiki is VERY old. It's code is scattered and inconsistent. Now it is more consistent and uses LESS and more consistently uses variables for colors instead of hardcoded values. The TRUE difficulty of MW theming is and will always be in the user generated content, where everyone and their grandmother can specify whatever color they want.
Now if all the highly qualified developers here, would please become contributors instead of shouting half informed comments from the sidelines, this all would go a lot faster :) —TheDJ (Not WMF) (talk • contribs) 13:27, 29 April 2023 (UTC)Reply
There are several dozen applications for Windows browsers, that have the conditional name "Dark Mode". One change the display for ANY site. And they are practically not mistaken. I.e. they have a universal mechanism of operation for all Internet sites. And you can't make a "Dark Mode" specifically for Wikipedia, when you don't have to guess, all the properties are known.
Almost always people make decisions (and answer questions and suggestions) who understand little in questions asked.
I'm not a programmer, I haven't sold a single website, I'm not paid to know CSS, it's a hobby for me. As the programmer ClimbAll (talk) has already said , this is extremely easy to do:
.dark_mode {background-color:black; color:white}
And that 's all !
Currently, the whole Wikipedia works on the same CSS style, only the properties are swapped (even if you use PHP, it won't be much more difficult).
You only need to provide switching .dark_mode and .white_mode
Of course, you can choose different colors for texts of different purposes, different degrees of "grayness" of the background of the pages. But these are conventions. I assure you, the entire amount of work will not go beyond 10 KB :) Seregadushka (talk) 17:36, 24 January 2023 (UTC)Reply
The Wikipedia App has already two different dark modes and a sepia one. On the desktop I always use the firefox add-on Dark Background and Light Text by Mikhail Khvoinitsky with the option "Stylesheet processor", but sadly not everything is displayed correct at Wikimedia-Projects. Links are all blue for example. Also it takes more cpu usage instead of loading a native darkmode site. --KleinerKorrektor (talk) 19:34, 18 February 2023 (UTC)Reply
Hello @NGC 54. I think we have talked about this before, but can't quite remember the conclusions. Because I know you're skilled technically, I'd like to double-check before I ask the engineers for their attention – are you sure this isn't a local matter that could be solved on the community side? SGrabarczuk (WMF) (talk) 15:54, 30 March 2023 (UTC)Reply
Latest comment: 1 year ago7 comments4 people in discussion
Forgive me if this has been discussed. I did look!
I just noticed that the new skin seems to force references set to be in two columns into one. See the references at the foot of en:Don Bradman. Is this deliberate? If so, I can't understand why it's considered a good idea. --Dweller (talk) 15:03, 22 March 2023 (UTC)Reply
Hello @Dweller. Thanks for coming here with your question. I think what you're referring to is a consequence of Vector 2022 having different width settings than legacy Vector. With V22, by pinning or unpining side menus, you may choose between one, two, and three columns, and the content area is only one of them. If the width of your screen is below a certain threshold, the content area gets narrower because the columns on both sides don't. So even though above some threshold, there are two columns of references, below it, there may be one. Is this helpful? SGrabarczuk (WMF) (talk) 14:08, 23 March 2023 (UTC)Reply
I have discussed something similar regarding w:Template:Reflist not displaying in columns when it should, and was told to change my browser zoom from 100% to 90%. As a temporary measure, this fixed my display problem. I have been having issues with the triple-bar hidden menu in the top-left corner being horizontally squished, locked in place, and entirely unusable. As an option, you could try going to your Preferences and switching back to the Vector Legacy skin. — CJDOS, Sheridan, OR (talk) 03:41, 7 April 2023 (UTC)Reply
Hi @Dweller, I'm doing some tests about your concern. Are you experiencing this on desktop/laptop? In the article of your example (en:Don Bradman) I see more then one column, with open and/or closed menus and with different browsers, don't you? Using {{Reflist}} and <references/>, I tried to search differences between Vector and Vector 2022, but I can't find them (examples with Vector and with Vector 2022). Meanwhile, I notice that in articles a single wider column is shown when there are only few notes, both with Vector and Vector 2022. But I'm not sure it is corresponding to your report. If you want to force two columns manually, consider using Reflist, instructions here. Patafisik (WMF) (talk) 18:03, 17 April 2023 (UTC)Reply
Tool menu is pinned
Tool menu is open
Tool menu is closed
par défault ? ou au contraire le sommaire présent sur la gauche mais avec toutes les sections cachées ? ou les sections présentes, mais avec les sous-sections fermées par défault ? Pouvez-vous m'en dire plus, sur votre motivation aussi ? Dans le premier cas, je vous informe que vous pouvez réplier le sommaire une seule fois et le masquage sera persistant d'une page à l'autre durant la navigation. Cordialement, Patafisik (WMF) (talk) 10:19, 31 March 2023 (UTC)
