Theme Boost: Improve design / dimensions of page header

Theme Boost: Improve design / dimensions of page header

by Kathrin Osswald -
Number of replies: 0

We came up with this issue especially because on small screens the page header takes so much space whilst it contains very few information.

So, we thought of adding media queries to make the dimensions at least on mobile devices smaller.

However, I would propose to improve the page header in general.

Status quo

  • The page header displays the user's name and his avatar on many sites (e.g. dashboard, private files, user profile)
  • Especially the user's avatar picture blows up the size of the header
  • My login information is redundant on these sites as they are also displayed in the navbar that always stays in the sight because it is fixied to the top.

Improvement proposal

  • Because I know who I am and I can always check my login status in the fixed to top navbar, I would remove user's information in the header entirely.
  • The page header cards could get a heading displaying the last breadcrumb title which is the most specific page a user is visiting currently

Advantages

  • This would shrink the dimensions of the page header on all screen sizes, which means that there are no special media queries necessary for small screens.
  • Users would not see their name and avatar so often as they know who they are
  • Users get the information which page they are visiting currently with a quick view

Mock ups

Following some Mockups displaying the status quo and the result of the proposed solution:


Status quo Proposal
Dashboard
Profile page
 Private files    

See also the Tracker issue: https://tracker.moodle.org/browse/MDL-60701


I'll post this issue also here in this forum as I'm interested in opinions about our proposal. What do you think about this?

Best, Kathrin

Average of ratings: -