Page MenuHomePhabricator

Wikimedia.org page redesign
Closed, ResolvedPublic

Assigned To
Authored By
cmadeo
Aug 23 2024, 2:54 PM
Referenced Files
F58493862: image.png
Feb 25 2025, 9:25 PM
F58489944: Design Review.png
Feb 25 2025, 2:23 PM
F58489596: Mobile.png
Feb 25 2025, 1:59 PM
F58489594: Desktop.png
Feb 25 2025, 1:59 PM
F58369449: clipboard_2025-02-07_11-01.png
Feb 7 2025, 3:02 AM
F58340402: image.png
Feb 3 2025, 8:56 PM
F58304454: grafik.png
Jan 29 2025, 1:23 AM
F58304446: grafik.png
Jan 29 2025, 1:23 AM

Description

The wikimedia.org page contains outdated information and design.

For example:
WMF identity needs to be more prominent/separated from the projects it administrates.
Missing header

The recently updated desktop footer on wikipedia is now being redirected to wikimediafoundation.org until this can be fixed.

Before

grafik.png (1×3 px, 832 KB)

Designs

Figma file

DesktopMobile
Desktop.png (2×1 px, 304 KB)
Mobile.png (2×320 px, 228 KB)

In the designs, the following was added:

  • Additional text/copy
    • Copy landing page: Welcome! The Wikimedia movement is a global community of people, projects, and activities working together to create and share knowledge freely. Join us in making all knowledge available to everyone, everywhere.
    • Copy "Our Projects": Our projects are the core of the Wikimedia movement. All major projects are operated by the Wikimedia Foundation, and the content is collaboratively developed by over 260,000 users worldwide using the MediaWiki Software.

The Wikimedia Foundation is the non-profit organization that hosts all Wikimedia projects and supports communities all over the world who create and curate freely accessible content.

    • Copy for donate section: Your donation protects the human right to free and open knowledge for everyone.
    • ‘Donate now’ button - opens the donation flow
    • Copy for contact section: Questions about the Wikimedia Foundation or Wikimedia projects? Get in touch.
    • Contact - opens the https://wikimediafoundation.org/about/contact/
    • List of 14 projects divided into sections "Reference", "Collections", "Technology", "Guides", "Collaboration"
  • Supports dark/light mode.
  • A language switcher is technically not feasible at the moment but should be added in the future.

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

Looked into it, apparently CSS support is defined in https://gerrit.wikimedia.org/r/plugins/gitiles/wikimedia/portals/+/refs/heads/master/gulpfile.js/postcss.js
It has IE6-8 support since 2016 (067ca2bcce7e16f2e829bf86ce33c4b7065a25d4, result of T125566). Pretty sure only IE 10+ can even open Wikipedia pages for a while now. Not directly related to this task, but seems like something to look into. The full string is [ 'last 5 versions', 'ie 6-8', 'Firefox >= 3.5', 'iOS >= 4', 'Android >= 2.3' ], unchanged since 2016. Grade C support does not include most of these.

Change #1114339 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] [WIP] wikimedia.org: Add dark mode support

https://gerrit.wikimedia.org/r/1114339

Change #1113078 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Fix extra scrolling and responsiveness

https://gerrit.wikimedia.org/r/1113078

Change #1114816 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] wikimedia.org: Implement final design changes

https://gerrit.wikimedia.org/r/1114816

Change #1114816 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Implement final design changes

https://gerrit.wikimedia.org/r/1114816

Change #1114339 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Add dark mode support

https://gerrit.wikimedia.org/r/1114339

Change #1115349 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[operations/mediawiki-config@master] Bump portal to HEAD

https://gerrit.wikimedia.org/r/1115349

Change #1115349 merged by jenkins-bot:

[operations/mediawiki-config@master] Bump portal to HEAD

https://gerrit.wikimedia.org/r/1115349

Mentioned in SAL (#wikimedia-operations) [2025-01-30T11:16:59Z] <ladsgroup@deploy2002> Synchronized portals/wikipedia.org/assets: Bump portals (T368221 and T373204) (duration: 02m 57s)

https://wikimedia.org/?cachebusting \o/

We can now switch the footer link + add the link to mobile.

This probably could use User-notice (tech news entry)

Also obviously, there are probably a lot of minor polishing needed but I leave that to anyone who feels strongly about them to make the patches.

Most of the stuff in T373204#10477439 wasn’t fixed and (3) and (5) (and to the lesser extent (4)) represent pretty big accessibility problems with new design :-/

I admit I actually forgot. I will see what I can do.

Change #1115810 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] wkimedia.org: Spacing and a11y fixes

https://gerrit.wikimedia.org/r/1115810

Change #1115810 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Spacing and a11y fixes

https://gerrit.wikimedia.org/r/1115810

@Ladsgroup this is what I see on the localized version

image.png (211×1 px, 43 KB)

I will take a look. It's a bit weird since other i18n strings in other portals do have html in them too, probably that specific one needs an extra class or something.

Change #1117247 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] [WIP] wikimedia.org: Fix the escaped i18n only in places that have links

https://gerrit.wikimedia.org/r/1117247

Change #1117247 abandoned by Ladsgroup:

[wikimedia/portals@master] [WIP] wikimedia.org: Fix the escaped i18n only in places that have links

Reason:

Not the way

https://gerrit.wikimedia.org/r/1117247

Change #1117250 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] Excempt two l10n messages that require raw HTML

https://gerrit.wikimedia.org/r/1117250

Change #1117250 merged by jenkins-bot:

[wikimedia/portals@master] Excempt two l10n messages that require raw HTML

https://gerrit.wikimedia.org/r/1117250

Mentioned in SAL (#wikimedia-operations) [2025-02-04T22:32:37Z] <ladsgroup@deploy2002> Synchronized portals/wikipedia.org/assets: Bump portals to HEAD (T368221 T373204) (duration: 09m 30s)

@Nemoralis Hi, can you check if the escaping is fixed now? https://wikimedia.org/?cache123

Yes! Everything is fine now.

@Ladsgroup The "Contact" field is broken in Chinese. It shouldn't have a hardcoded width:

clipboard_2025-02-07_11-01.png (356×976 px, 29 KB)

Change #1118132 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] wikimedia.org: Remove width from contact title

https://gerrit.wikimedia.org/r/1118132

@Ladsgroup The "Contact" field is broken in Chinese. It shouldn't have a hardcoded width:

clipboard_2025-02-07_11-01.png (356×976 px, 29 KB)

Thanks. The above patch should fix it. I'm sorry about this. Figma export just hard codes every width and height. I had to remove so many of them but some fell through cracks.

Change #1118132 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Remove width from contact title

https://gerrit.wikimedia.org/r/1118132

A quick design update: While the page is up and running, it is in the design review stage for desktop/mobile. Some UI elements (mainly alignment and spacing on mobile) will still be updated.

design review: current
Design Review.png (4×1 px, 1 MB)

For the purposes of task management, if the work here isn’t yet complete, should this task be re-opened? (Alternatively, should another task be opened to track the design review?)

For the purposes of task management, if the work here isn’t yet complete, should this task be re-opened? (Alternatively, should another task be opened to track the design review?)

Agree, thanks for checking and re-opening until design is complete!

relatedly @Ladsgroup wondering if we can open a new task to redirect the footer on wikipedia.org to this page now that it is largely complete?

image.png (318×1 px, 40 KB)

relatedly @Ladsgroup wondering if we can open a new task to redirect the footer on wikipedia.org to this page now that it is largely complete?

image.png (318×1 px, 40 KB)

T387573: Switch link of footer from wikimediafoundation.org to wikimedia.org IMHO, we should bundle the deployment of the footer link change with T373208: Update Minerva to include footer banners

Change #1126548 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[operations/mediawiki-config@master] Switch the footer link to wikimedia.org

https://gerrit.wikimedia.org/r/1126548

Shall we switch the footer link and continue polishing or we need to wait until everything is fully done?

Change #1121673 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] wikimedia.org: Some further design changes

https://gerrit.wikimedia.org/r/1121673

Change #1121673 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Some further design changes

https://gerrit.wikimedia.org/r/1121673

Mentioned in SAL (#wikimedia-operations) [2025-03-17T18:20:01Z] <ladsgroup@deploy2002> Synchronized portals/wikipedia.org/assets: wikimedia.org updates (T373204) (duration: 12m 38s)

Mentioned in SAL (#wikimedia-operations) [2025-03-17T18:22:41Z] <ladsgroup@deploy2002> Synchronized portals: wikimedia.org updates (T373204) (duration: 02m 38s)

Change #1129508 had a related patch set uploaded (by Ladsgroup; author: Amir Sarabadani):

[wikimedia/portals@master] wikimedia.org: Minor polishing for mobile

https://gerrit.wikimedia.org/r/1129508

Based on the feedback from @OTichonova these change ^ should be the last ones. Small minor corrections here and there

Change #1129508 merged by jenkins-bot:

[wikimedia/portals@master] wikimedia.org: Minor polishing for mobile

https://gerrit.wikimedia.org/r/1129508

Mentioned in SAL (#wikimedia-operations) [2025-03-24T12:22:02Z] <ladsgroup@deploy1003> Synchronized portals/wikipedia.org/assets: Minor wikimedia.org mobile fixes (T373204) (duration: 11m 37s)

Mentioned in SAL (#wikimedia-operations) [2025-03-24T12:24:52Z] <ladsgroup@deploy1003> Synchronized portals: Minor wikimedia.org mobile fixes (T373204) (duration: 02m 48s)

Change #1126548 merged by jenkins-bot:

[operations/mediawiki-config@master] Switch the footer link to wikimedia.org

https://gerrit.wikimedia.org/r/1126548

Mentioned in SAL (#wikimedia-operations) [2025-03-24T12:29:21Z] <ladsgroup@deploy1003> Started scap sync-world: Backport for [[gerrit:1126548|Switch the footer link to wikimedia.org (T387573 T373204)]]

Mentioned in SAL (#wikimedia-operations) [2025-03-24T12:33:52Z] <ladsgroup@deploy1003> ladsgroup: Backport for [[gerrit:1126548|Switch the footer link to wikimedia.org (T387573 T373204)]] synced to the testservers (https://wikitech.wikimedia.org/wiki/Mwdebug)

Mentioned in SAL (#wikimedia-operations) [2025-03-24T12:41:46Z] <ladsgroup@deploy1003> Finished scap sync-world: Backport for [[gerrit:1126548|Switch the footer link to wikimedia.org (T387573 T373204)]] (duration: 12m 25s)

I applied @OTichonova's final design changes (tiny stuff in mobile) and now it's fully done \o/

@Ladsgroup

I applied @OTichonova's final design changes (tiny stuff in mobile) and now it's fully done \o/

Thank you so much!