General Design review

[thibaultamartin]

Now that we have actual data in production, we can see that some pages don't really work with the design they have. We need a design review to potentially change fundamentally how some pages display information.

• Global
  • Make sure everything is on brand
  • General accessibility review: link colours, border colours, layouts without borders, etc
• Navbar
  • On very wide screens, the text in the black header looks very off center
  • The navbar is quite crowded, which makes responsiveness difficult to handle (the navbar collapses into a hamburger
    menu too early)
• Footer
  • The footer is pretty but not very practical. Something closer to what element.io does (major titles and links to subsections)
• Front page
  • We removed the sponsors page for lack of sponsors in the platinum tier, we will hopefully add it back at some point. We need a proper design for it
• About page
  • Doesn't use the black header as the rest of pages
  • Need to define what the page is for: Matrix, the Foundation, both? What do other websites and organisations usually do?
• Blog
  • Looks very "engineer design"
  • The previews are rather large, and difficult to browse
• Blog Post
  • The column is off center
  • The title sizes are inconsistent (especially in the quotes)
  • TWIM posts look very messy
  • The ToC has inconsistent link colour (it looks like normal text until you hover it)
  • Redesign of the YouTube Player placeholder
• Documentation
  • Docs are not searchable (but could be)
  • When scrolling through the docs you don't see in the ToC where you're at
  • Ideally having proper styling of the code depending on the language à la starlight
• Ecosystem
  • All the subsections are inconsistent
  • The cards layout doesn't really work with the density of information we want to display
  • It's impossible to navigate back to the parent category when you are looking at a project (How to navigate back from ecosystem member pages? #2212)
• Donate & membership
  • Difference between Foundation membership and donations isn't quite clear #2208
  • Make the membership fees of the Silver tier more obviously #2184
• Try Matrix
  • Do a full review of a user journey to see if it makes sense

[MTRNord]

Idea for the sponsors:

What if we instead of having them under "Donate" put them under Ecosystem?

Meaning we would populate https://matrix.org/ecosystem, make the link in the menu clickable (though we need to rethink the mobile menu then) and have a flow like this on it:

1. These are the big players in the community: Lists Sponsors
2. These are all the things the whole community is working on and proud to show: Linking off to clients, servers, etc.

imho it feels natural to consider the sponsors as part of the matrix ecosystem 🤔

[MTRNord]

For discoverability, #1115 (dark mode) is another design related wish by people.