Reading/Web/Desktop Improvements/Fifth prototype testing/Feedback

Username:Coldbolt

 * Menus — Option 4, black trigger, black items
 * Borders and backgrounds — Option 1, minimalist
 * Active section in the table of contents — Option 1, minimalist
 * Logo in the header — Option 1, Rectangle logo left. Logo 2 takes too much space in the new design.
 * Link colors — Proposed colors
 * Font size — Current, Please no, 16px is way too big. Makes you scroll too much, makes it very unclear, just too much. If you do change however, please make it an option. Not everyone has bad eyes (if you have bad eyes I can understand you would want a bigger font as a default). Edit: the more I look at the big font the worse it gets, I'm begging you to make it an option or keep the 14px.

Username:RaresMateovich

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear . Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * I prefer option #3 black trigger, blue items, as to distinguish menus from links. I expect a link to have an instant action, whereas menus obviously have tiered actions.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra . Which option do you prefer and why?
 * I prefer option 8 (although it seems buggy when scrolling a bit), but options 4 and 5 look good too (I would certainly prefer a combination of these two, kinda like option 4 but without the right article border). I think a reading based approach is the best, so going with a minimalistic style will help (but not overly minimalistic, some contrast between the article and the rest of the page is preferable for me).
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter . Which option do you prefer and why?
 * Option 4 looks the best, but perhaps will make the page look unbalanced (too many colors on the left side compared to the right).
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda . Which option do you prefer and why?
 * The first 3 look excellent, but perhaps the first one fits the best (the third one seems a bit odd, but good nonetheless).
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon . Is there any additional work you think needs to be done before we make this change?
 * The proposed colors look cleaner, but I don't think the contrast works better than the current design.
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird ). Do you have any concerns with the proposed font size?
 * Definitely the proposed font.

Username:Askeuhd

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * I prefer option #3 black trigger, blue items, as to distinguish menus from links. I expect a link to have an instant action, whereas menus obviously have tiered actions.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * I prefer option 9, alternatively option 8. Visually I feel it is much easier to focus when there is a clear division between background and content, which has been especially challenging with these more recent layouts that have very large amounts of blank space on high resolution monitors.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * To me, option 4 allows me to find the active item faster than any other option, which is what I find most important in this context.
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * Option 1, as it seems to be the most compact and clean option.
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * To my eyes the contrast of the current colors appear higher and more easily read.
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * I support the change as long as the page width is increased as in the example

Username:Ilovemydoodle

 * 1) Menus — 3
 * 2) Borders and backgrounds — None of these, I prefer the current design.
 * 3) Active section in the table of contents — None of these, I prefer the current design.
 * 4) Logo in the header — 2
 * 5) Link colors — Keep current.
 * 1) Logo in the header — 2
 * 2) Link colors — Keep current.
 * 1) Link colors — Keep current.
 * 1) Link colors — Keep current.

Username:Johnson524
I do really like the way Wikipedia looks currently, and I don't really think anything needs to be changed. If I had to pick one of the options though:


 * 1) Menus — 3 and bolded.
 * 2) Borders and backgrounds — Strong 4
 * 3) Active section in the table of contents — 5
 * 4) Logo in the header — 1 or 2, both look good but the menu on them blocks the table of content.
 * 5) Link colors — Strong current, it's so much easier to read.
 * 6) Font size — Strong current 14px

Username:Phoenix1494

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * 3 - I don't have a strong opinion on the trigger color I prefer black though. For the menu items, they should be blue because they are links.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * 4 - It separates the sections that move and don't move while not taking up too much space.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * 5 - The line only existing for subsections nicely shows that all those are associated better than a simple indent. The line extending all the way removes the usefulness of the line.
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * 1 - It is very standard amongst all websites to put the logo in the top left and that logo will take you to the home page. The square ones take up too much space in my opinion
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * I think the change is fine. I have no strong opinions on this.
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * I strongly support this. I always zoom in on Wikipedia now and I won't have to with this change.

Username:Alduin2000

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * 1 or 4: individual links within dropdowns should be blue to cohere with design of links on pages, but dropdowns themselves need not necessarily be blue too
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * 4 or 5: in my opinion, these provide the best compromise between minimalism/simplicity and sectioning out the article from other sections of the page
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * 2 or 4: I found these to be the easiest to navigate with. 1 makes the current section too hard to identify as it's still quite similar to the blue links and 5 works against the goal of simplicity of design.
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * I feel 1 is the most simple; it keeps the logo constrained to one section (the header) rather than straggling between two sections (header and sidebar as in 2/4). I also prefer it to 3 as I feel that the search bar should be placed in a position of prominence so that users are directed to it more easily/immediately - the search bar is the more useful element to be directed towards.
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * Whilst the link colours now have appropriate contrast with surrounding text, their contrast with the background is worse, making the links harder to read. Therefore, I would say additional work is needed to make link colours simultaneously have a good contrast with the surrounding text and the white background. Perhaps the body text and link text could both be darkened to retain the contrast between them whilst also increasing their contrasts with the white background?
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * I see nothing wrong with increasing font size as suggested

Username:Urban Versis 32

 * 1) Menus — Option 1, with bold enabled. Honestly, the blue-on-blue looks the most conventional for people reading the wikis, and the bold helps emphasize that it is a menu. I also noticed that when looking at the language menu my laptop rendered it like this:
 * 1) Borders and backgrounds — Option 7. I really liked the header with the gradient. It just made the overall page look very modernistic.
 * 2) Active section in the table of contents — Option 4. I liked how you could scroll the ToC separately from the rest of the page if you needed to. Plus, the way it looked was the nicest of them all.
 * 3) Logo in the header — Option 1. The way the logo was styled looked the best. DEFINITELY not option 4, as it makes it very difficult to actually see the logo.
 * 4) Link colors — Keep it. The proposed colors make it way harder to see on the page.
 * 5) Font size — I like both of them the same. Keep both, and have an option at the top to change it.
 * 1) Logo in the header — Option 1. The way the logo was styled looked the best. DEFINITELY not option 4, as it makes it very difficult to actually see the logo.
 * 2) Link colors — Keep it. The proposed colors make it way harder to see on the page.
 * 3) Font size — I like both of them the same. Keep both, and have an option at the top to change it.
 * 1) Font size — I like both of them the same. Keep both, and have an option at the top to change it.
 * 1) Font size — I like both of them the same. Keep both, and have an option at the top to change it.

Username:Bebiezaza

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * No opinion on this for now
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * Option 9 (outside article background (solid)) because there is a visual separation between content zone and peripheral zone, and no gradient is easier for interface documentation eg. w:th:วิกิพีเดีย:สคริปต์ผู้ใช้ (Revision ID 9348715 if the section happens to change in the future) demonstration picture has gradient; it feels low quality and kind of lower the perceived resolution.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * Option 2 (Bold), I just like it. :)
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * Either option 1 or 2.
 * Option 1 (Rectangle logo left) - not as evasive and looks clean
 * Option 2 (Square logo left) - feels more at home to me (feels more similar to Legacy Vector), does not look really evasive, and maintaining the cleanliness
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * No opinion on this for now
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * I would like it to be in the original font size because it is the same size as usually typed on paper and more info could be placed in a screen. 16px feels too large. This is also a complaint I have for Fandom (as in FandomDesktop skin they created).
 * Maybe create a preference option for selecting between 14px and 16px font size.

Username:NGC 54
I also still have the suggestions that I have written at Reading/Web/Desktop Improvements/Fourth prototype testing/Feedback -- NGC 54  ( talk |  contribs ) 15:41, 9 June 2022 (UTC)
 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * "1) blue (menu triggers), blue (menu items)" with "Bold (menu triggers)" checked.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * "9) outside article background (solid)", because the boundary between the article and the allways-shown elements is clearer.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * "2) bold".
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * "2) square, left", because the Wikipedia logo is beautiful; there is no need to hide it. I also think that a "W" should be shown in the left corner of the sticky header.
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * "Proposed colors".
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * "16px (proposed)". But changing the font could lead to technical issues, as Dexxor said; in this case, I would say "14px (current)".

Username:Simeon

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * Option 3 because blue is already used for navigation (e.g., "View history" is blue and it's meant to take one to a particular page). The blue menu items are then also blue as they're used for navigation.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * Option 9 as it has clear lines and the sides are in a different colour which is nice when scrolling down to read the article. My second preference would be option 4 as all the lines are connected rather than relying on fades.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * Option 2 because it's clear at a glance. I like option 5 as well but for quick reference to the table of contents (while reading) I think option 2 works better.
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * Option 2 because, like in the current version, the logo should take up some space to highlight the project that the reader is viewing.
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * I would prefer a different colour for the visited links, as it's not that different from the normal links. Although this change is made to improve contrast, I think the current colours actually have more contrast between the normal and visited links.
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * I think 14px is fine. Perhaps it can be made an option for readers that prefer this? It might also be that 16px just takes time to get used to but, at first, it seems bigger than necessary.

Username:Dexxor

 * 1) Menus — No strong preference but the menu items in the search menu and the user menu must be black.
 * 2) Borders and backgrounds — 1 or 9
 * 3) Active section in the table of contents — 4. I like the line to the left. This is makes it more obvious why certain entries in the TOC are highlighted.
 * 4) Logo in the header — 1 or 3. 2 also looks nice but wastes space.
 * 5) Link colors — don't care.
 * 6) Font size — Please keep the current font size. Changing it leads to inconsistencies when templates use a manual font size. —Dexxor (talk) 15:54, 9 June 2022 (UTC)

Username:Iritscen

 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * My only concern with this iteration of Vector is that these proposed link colors are almost 100% indiscernible for me as someone with a fairly standard form of red-green colorblindness. The current blue link and visited link colors are discernible for me with only moderate difficulty because the visited link is "darker" than the unvisited blue link. With the proposed #3366cc and #795cb2, I will have absolutely no idea if I have visited a link. Around 1 in 24 people are colorblind in some way, so I know I must not be alone in having extreme difficulty with the proposed colors. I checked the contrast between the proposed link colors using the tool here and the contrast ratio is 1.0:1. Please take into consideration not just the contrast between link and non-link text but also between the two link colors, visited and unvisited. Thank you. --Iritscen (talk) 16:21, 9 June 2022 (UTC)

Username:(a)lizadoolittle

 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * I prefer option 2 because it seems to be most consistent with the rest of the page. The all blue text for the menu items seems unnecessary because it is clear that they are buttons/links.

Username:Geraki
Geraki (talk) 16:58, 9 June 2022 (UTC)
 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * Option 2: Blue is a standard for links and triggers.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * Options 7 better than 8 better than 9 better than 2 better than 5. Absolute no to 3.
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * Options 5 and 4 will probably stand better in monochrome screens and bad lighting.
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * Option 2, "traditional", makes the grayscale logos (such as the wikipedia logo) stand better. Also option 1 (consistent with mobile) is ok. Option 3 is like we're back in the '90s, 4 is not the logo.
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * You didn't give example for red links, but anyways the change is good, helps me distinguish links from normal text (checked also in a bad screen where I had such a problem).
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * Yes. I prefer the current font size which is better for long texts. If you do implement the proposed, keep the 960px max-width (changes to 1050px in the prototype).

Username:RH Swearengin
I like option 3 without bolding. With this option, the color coding seems to best reflect the difference in functionality. I like the contents navigation to the side. However, the font in the navigation should match the section header font. I like the minimalist option. The cleaner look draws the eye to the content of the article. I like option 2. The cleaner look is more readable. Again, I think the section headings in the side navigation should have the same font as in the article itself. Matching the fonts will convey the correspondence more clearly. I like option 4. I'm not sure why. It feels a bit more thoughtful in terms of design. I like the proposed color. It isn't so light as to give a blurry appearance, but it does make a big difference in contrast. Personally it doesn't make a difference for me. I zoom in and out a lot as I'm reading. The larger font, however, might be more user friendly for the average user -- especially new users. I'm a community college professor, and I know from experience that a lot of my students need glasses -- or need to wear the glasses that they already have.
 * 1) Menus — open prototype in a new tab: https://di-visual-design-menus.web.app/Brown_bear. Which option do you prefer and why? Please make sure to check the search menu, user menu, language menu, and tools menu.
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * 1) Borders and backgrounds — open prototype in a new tab: https://di-visual-design-borders-bgs.web.app/Zebra. Which option do you prefer and why?
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * 1) Active section in the table of contents — open prototype in a new tab: https://di-visual-design-toc-active.web.app/Otter. Which option do you prefer and why?
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * 1) Logo in the header — open prototype in a new tab: https://di-visual-design-header-logo.web.app/Panda. Which option do you prefer and why?
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * 1) Link colors — open prototype in a new tab: https://di-visual-design-link-colors.web.app/Salmon. Is there any additional work you think needs to be done before we make this change?
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?
 * 1) Font size — open prototype in a new tab: https://di-visual-design-font-size.web.app/Hummingbird). Do you have any concerns with the proposed font size?