Please can you post some screenshots. I am working on exactly the same resolution screen and dont see what you are saying

yes of course.
This is articles:new

this is menu edit

Every element size is bigger than any website average. But investigating I see it is coming from the "rem" unit.
Which makes it relative to a "browser base font size" unless a size is set for HTML.

Now when I check computed styling on form labels it says font-size is 16px.
In 3.9 admin template isis this is 13px.
13px is mostly the base font-size
Adding that to HTML element in Atum already makes it more relaxing to the eye and also reduces scrolling mileage.
But the input elements around it could be a little smaller too.

Current Atum is realy "screaming" into the eye. At least my eyes.
As there may be people that like it at "yelling" size, it may become a configurable setting?

Also the way the configuration pages are layed out, is causing a lot of mileage on scrolling.
ie. Article options has a wide variety of settings in 5 blocks. Each block 3 columns.
This is causing a lot of scrolling up and down. Everything becomes too big.

Also in 3.9 you need to scroll down, but at least it is in one column. Creating better overview also.

not to mention the "new module" tiles

There is no search and it becomes harder and harder in due time (more installed modules) to have a proper overview on what is available.

I can see the advantage when working on a tablet (touch) but working on desktop/laptop it is not convenient to the eyes and scrolling finger..

Also choice between list and grid could be an option?

When I work in Joomla 4 control panel - I feel like this

@pieter-groeneweg I have opened issue #29411 with a proposed solution for the rem issue. I'd appreciate your feedback there since the solution seems to be a bit more nuanced than just setting a base font size ?

Regarding the modules page... yeah. My eyes glazed over first time I saw it so I hit the forward slash to initiate the browser's in-page search and typed the partial name of the module I was looking for. This got me thinking. It'd be possible to do a JavaScript powered search which limits the number of items displayed on that page. For example if I type "custom" it will filter out only the cards which contain the word "custom" in the title or description. This is do-able (I have seen my wife implement it) but we'd have to file a new issue about it. If you're interested let me know and I will at least file the issue with the proposed solution.

The design of that page was inspired by the work in the alternative proposal. They had a search box. It needs a search box. I had hoped that other people would look at the work in that alternative proposal and look to adapt the good stuff. My mistake at thinking others would do that.

@brianteeman Yeah, I have come to the conclusion that the answer to the question "If not me, then who?" is typically "Nobody". So, which one of us should open an issue about it? ?

@nikosdion I am burnt out. Spending 4-5 hours almost evryday working with the bereaved during covid19 takes it out of you.

Oh! I'm so sorry! Please do take a break. I will make a comment on the other issue but you don't need to respond to it. I will file a new issue about the search in the modules page.

Thanks @nikosdion, I will check your new created issue and see where I can add my two, three, four cents to it.

@nikosdion

Regarding the modules page... yeah. My eyes glazed over first time I saw it so I hit the forward slash to initiate the browser's in-page search and typed the partial name of the module I was looking for. This got me thinking. It'd be possible to do a JavaScript powered search which limits the number of items displayed on that page. For example if I type "custom" it will filter out only the cards which contain the word "custom" in the title or description. This is do-able (I have seen my wife implement it) but we'd have to file a new issue about it. If you're interested let me know and I will at least file the issue with the proposed solution.

Please do. I have opposed to this new display but was not listened to because it is "nice looking"...

Feature proposal for the Modules page: #29415

Fix-it proposal for the font size issue: #29411

Thank you in advance for your comments.

@nikosdion
As my feedback is more than just the modules I will put it here.

Basic neurobiology for interface design

That is exactly what it is. Though I would refer to it as common human behaviour and intuition.

The modules page sort of looks like a shopping page.
But I am not shopping. I am selecting an already available module.

Let's me explain what we as humans are used to.

When we look for a book we don't have yet, we go to a book store.
The book store presents all nice and currently new and popular books with the front cover exposed. Nice looking images, book titles in big fonts and luring images to attract our attention.
(this is what we find in 3.9 web app install feature, and that is ok as we expect a "shop")

When we look for a book we already own, we go to our book shelves.
Our book shelves show all our owned books with the spines of the books facing us.
In a way this is just a 90 degrees twisted list of the books we have.
And we may have sorted them by alphabet, writer, topic, maybe size and on.
(this is what a new modules should look like in 4 and already sort of does in 3.9. Only thing to add is the filter)

This is how our ancient brains are working at its best.
"neurobiology" it is called in science. I tend to look at human behaviour and what works best.

People read stories from left to right (or rtl in some) and scavange lists from top to bottom.
What we see also needs to fit the angle of view..
Meaning that when a font has a certain size, the length of the line should not exceed a certain width. Ideal is somewhere between 45 and 75 characters (including spaces) per line.
Device we work with also determine how we "see and search".
Working with a mouse, we tend to search from top to bottom and up again. The move of pointer and click is the triggered action.
Working with touch devices humans are not only swiping top to bottom but also left to right. The usual "click" is coming from a thick finger instead of a precise mouse pointer/click.

In the current Atum sizes are too big, elements spread as wide as possible, items shown in grid instead of list views.. It is very hard for an average human to work concentrated for more than 10 minutes.
It can do ok on tablets and such, but becomes terrible on desktop... I know the adagium in web design is mobile first. But here the desktop is forgotten.

Another modules related comment. I cannot see why modules are now positioned under "content".
I always liked the philosophy of having a site completely configured and setup. Including design and style (modules in positions included).
Authors just working content and not having to worry about style and design. (also not able to break the sites appearance).
If modules are considered content, then what are the other components?

Another modules related comment. I cannot see why modules are now positioned under "content".

Not saying I agree or disagree but this acknowledging the reality that very many people are building the sites with more modules than before and that they are no longer just "static" resources that you set up and forget.

@brianteeman true, when toggling ACL settings it looks like it is only a cosmetic change of location in the navigation. Then it is just a matter of preference and my odd minds logic.

But since modules also have menu assignments I can foresee issues when modules really become a content item.

I guess nothing is going to happen here now and this should be closed. Not my call though

Is there a reason this is still open?

Yeah. It's never been addressed. The solution is dead simple. You can have a simple system plugin which injects a one line CSS rule to set the base size of the HTML element. It can be set, for example, to 0.9rem and the problem is fixed. I have done that for my size because Joomla 4 is completely unusable on a 13" laptop with the default macOS resolution.

Or you use a user.css for atum and define a smaller font-size.

The default should be 0.9rem which is used in 99.9% of websites out there

Being a stats geek I went looking for something to back up this claim and this is what I found together with info I bookmarjed some time ago regrding styleguides.

I studied the fonts of the top 1000 websites.

CMS

wordpress.org 16px
drupal.org 13px
wix.com 16px

Gov CMS

U.S. Web Design System (USWDS)

GOV.UK Design System

Publications office of the EU

Operating Systems

Apple Human Interface Guidelines

Microsoft User Interface Text UX Guide

Non fact based comment

I wonder if there is something in mac os that is making things look bigger. I know for example on windows that with some displays and some resolutions windows puts an automatic text-size increase that yu have to find and turn off.

Also asking google the question "why is the text on my mac so big" gives more hits than a windows equivalent despite its lower usage. So maybe there really is something about the os or the retina screen. I dont have a modern mac so I'm just guessing. In a few weeks we can put two laptops next to each other.

oh and I personally couldnt care less what the font size is

@brianteeman You have only tested on your one computer and one monitor and one operating system. Your sample size is unrepresentative. Further to that, you never did any comparison.

I love facts more than you do. I actually spend a lot of money on hardware to be able to collect MORE facts than all of you do collectively. Here is what I have tested on:

• macOS Big Sur and Monterey, M2 13" built-in display, Safari
• macOS Big Sur and Monterey, M2 13" built-in display, Microsoft Edge
• macOS Big Sur and Monterey, M2 13" built-in display, Chrome
• macOS Big Sur and Monterey, M2 13" built-in display, Opera
• macOS Big Sur and Monterey, M2 13" built-in display, Brace
• macOS Big Sur and Monterey, M2 13" built-in display, Firefox
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Safari
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Microsoft Edge
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Chrome
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Opera
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Brace
• macOS Big Sur and Monterey, Intel i9 and i7 15" built-in display, Firefox
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Safari
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", 13" built-in display, Microsoft Edge
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", 13" built-in display, Chrome
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", 13" built-in display, Opera
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", 13" built-in display, Brace
• macOS Big Sur and Monterey, M1 Mac mini on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", 13" built-in display, Firefox
• Ubuntu 20.04, 20.10, 21.04, 21.10, 22.04 on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Firefox
• Ubuntu 20.04, 20.10, 21.04, 21.10, 22.04 on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Edge
• Ubuntu 20.04, 20.10, 21.04, 21.10, 22.04 on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Chrome
• Ubuntu 20.04, 20.10, 21.04, 21.10, 22.04 on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Brave
• Ubuntu 20.04, 20.10, 21.04, 21.10, 22.04 on Apple LCD Display, BenQ 27" display, LG 27" display and EveDevices 27", Opera
• Windows 10, built-in 13" HD display, Apple LCD Display, BenQ 27" display and EveDevices 27", Edge
• Windows 10, built-in 13" HD display, Apple LCD Display, BenQ 27" display and EveDevices 27", Chrome
• Windows 10, built-in 13" HD display, Apple LCD Display, BenQ 27" display and EveDevices 27", Brave
• Windows 10, built-in 13" HD display, Apple LCD Display, BenQ 27" display and EveDevices 27", Opera
• Windows 10, built-in 13" HD display, Apple LCD Display, BenQ 27" display and EveDevices 27", Safari
• Windows 11, BenQ 27" display and EveDevices 27", Edge
• Windows 11, BenQ 27" display and EveDevices 27", Chrome
• Windows 11, BenQ 27" display and EveDevices 27", Opera
• Windows 11, BenQ 27" display and EveDevices 27", Brave
• Windows 11, BenQ 27" display and EveDevices 27", Safari

The BenQ and Apple LCD Cinema displays are 1440px native. The EveDevices 27" is a 4K panel also operated at 1.5x (150%) zoom. The MacBook Pro M2, i5 and i7 built-in panels are retina (HiDPI). The Windows 10 device is a 2019 Asus ZenBook with an HD (1080px) display.

The 15" MBP i9 and the Windows 10 and 11 have also been tested with the same browsers and a 24" 4K display in 1.5x (150%) OS zoom level — therefore equivalent to 1440px. On THAT display Joomla 4 is comfortable but literally everything else, including the OS itself, is tiny and unusable. I would have to go for a 1.75x or 2x OS zoom level to use that display size comfortably, in which case Joomla 4 appears ginormous and unusable...

In ALL OF THE ABOVE CONFIGURATIONS the text size in the Joomla 4 backend IS FAR BIGGER than Joomla 3, WordPress and Drupal.

In ALL OF THE ABOVE CONFIGURATIONS the text size in Joomla 3, WordPress and Drupal looks just about the same.

The same findings are true when using an Android phone (Samsung Galaxy A23), iPhone 12 Pro, iPhone 13 Pro, iPhone SE 2020, iPad Pro 11" and iPad Pro 12.9".

Also keep in mind that there are two different things at play. On one hand you have the base font size of the document. On the other hand you have the initial-scale of the document AND the sizing of the text of various elements in rems. So, yes, Brian, you CAN have a base font size of 16px with an initial-scale of 0.9 OR with p {font-size: 0.9rem} which means that the effective font size is 0.916 = 14.4px. In fact, most sites use both for an effective body text font size of 0.90.9*16 = 12.96 pixels.

Here are some screenshots from the same machine. I don't have Drupal currently installed so let's just keep it to Joomla 3, Joomla 4 and WordPress — all fully updated as of yesterday morning.

Joomla 4:

Joomla 3:

WordPress 6:

Using the browser's dev tools we can see that the font size of the top level menu items in WordPress 6 is 14px, in Joomla 3 it is 15px top menu and 14px sidebar menu, Joomla 4 15.2px in the sidebar menu. Now, you might think that's close enough. Oh, my sweet summer child, how blind are you?

Submenu font size is 13px in WordPress 6, 13px in Joomla 3 and 15.2px in Joomla 4 — that's 17% bigger text in Joomla 4!

The main text (Joomla modules and WordPress widgets) font size is 13px in WordPress 6, 13px in Joomla 3 and 16px in Joomla 4 — that's 23% (TWENTY THREE PERCENT!) bigger main body text in Joomla 4 compared to its competition AND its previous versions.

I would say that 23% bigger text with obscene amounts of whitespace make for an unusable backend interface on anything but a 27" monitor. I sure as hell cannot use Joomla 4 on a 13" or even a 15" display. I cannot even comfortably use it on the 24" display if I want the OS interface to be at a size I can actually see and use comfortably.

Let me say this again.

JOOMLA 4 HAS 23% (TWENTY THREE PERCENT) BIGGER MAIN BODY TEXT THAN LITERALLY EVERY OTHER CMS OR EVEN ITS OWN PREVIOUS VERSIONS.

You speak of your own eyesight and experience and extrapolate that to the rest of the world without evidence and try to couch that in pseudo science while treating everyone else as stupid. No wonder no one is interested in changing this. Get back to your holiday.

So you are saying the browser dev tools lie and don’t reflect the real text size being rendered. So me, many others, and the browsers all don’t know what we’re saying but you do. Your subjective reality trumps objective facts. Okay, got it. You are a jackass.

And this, people, is exactly why Joomla is dead. Its leadership and co-founders are deaf and blind to fact, reason and feedback.

I spent over an hour to find a solution for "everything is too big in backend", with no success. Is there a solution yet? I tried user.css but I might be doing it wrong.

I think since no one is bothering about sizes in backend and the initial screenshots are also outdated, maybe we can close this issue? @Hackwar ?