search

joomla / joomla-cms

Home of the Joomla! Content Management System
https://www.joomla.org
GNU General Public License v2.0
4.77k stars 3.65k forks source link

[4.0] Atum does not specify a base font-size #29401

Closed nikosdion closed 4 years ago

nikosdion commented 4 years ago

What needs to be fixed

The Atum (backend) template, unlike Cassiopeia (frontend), does not specify a base font size for the root HTML element. Bootstrap 4 (BS4) uses relative font size (1 rem) for all elements under body.

By default, browsers use a based font size of 16px which is required to make their default, serif font legible on screen. However, BS4 uses a sans serif font which is perfectly legible at 14px. Moreover, since all padding and margins are set up with relative (rem) units the inherited, large base font size results in an interface that feels "too big" and doesn't even fit comfortably in a 15" laptop screen.

Why this should be fixed

There's a large number of people complaining about the interface being too big and unusable. Considering that some of them are disabled I reckon we don't just have able bodied people complaining but an actual accessibility problem.

Furthermore, I personally think it's absolutely silly that I cannot comfortably use J4 on my rather spacious 15" laptop display and I find myself in need of constantly switching to an external 27" monitor. This is inadvertently discriminating against users who are less well off and have to work with smaller screens. This doesn't mess well with Joomla's goal to be an inclusive project.

How would you fix it

Add html { font-size: 14px } to Atum's CSS. This is how Cassiopeia addresses this issue.

Side Effects expected

Joomla is erroneously using relative size arithmetics for bitmap images, such as the Joomla logo. This will make these images to appear blurry until the design team goes through the entire backend template and fixes these issues.

To be honest, after a day of using Atum with a 14px base font size the only place I could see fixing is required is the Joomla logo. Everything else seems to be using vectors e.g. icon fonts which scale correctly with relative sizes. I am not a frontend developer but I think that Joomla could maybe use a vector (SVG) logo file with a bitmap fallback?

marcodings commented 4 years ago

Visualising it

image

bembelimen commented 4 years ago

@joomla/joomla-accessibility-team-jat @angieradtke @coolcat-creations @brianteeman just in case ;)

infograf768 commented 4 years ago

As noted in https://github.com/joomla/joomla-cms/issues/29399, changing base font to 14px looks fine. Some rem sizes have though to be modified (generally increase) to be readable. Example: $font-size-vsm: .6rem; and as well some scss (logo for height, etc.)

ReLater commented 4 years ago

Add html { font-size: 14px } to Atum's CSS. This is how Cassiopeia addresses this issue

Going back to a font-size that is to small for me and others? I'm happy with 1rem (16px in most browsers). And I'm using several screen sizes.

Any browser has a zoom setting.

Add an option for html base font size in Atum configuration that can be set also to empty. Thus anybody can get rid of default 14px if this issue ends successfully. Or add an optional CSS file for corrections like this that can be loaded or not.

C-Lodder commented 4 years ago

Can I just point out that setting a font size for the <html> means that browser specific settings will no longer work.

E.g, in Firefox and Chrome (other browsers too most likely), I can set the global base font size from anything betwen 9px and 72px. Setting a font-size on the html tag will prevent this option from working.

So the template's rem values should be relative the browser's default value, not the html value. If the font size across Atum needs to be reduced, do NOT use:

html { font-size: 14px; }
brianteeman commented 4 years ago

Please read https://css-tricks.com/accessible-font-sizing-explained/

nikosdion commented 4 years ago

So, Cassiopeia does it wrong and Atum does it right. OK, I'm closing this issue and I will make a mental note that I need to tell all my clients and my sites' visitors that they need to change their browser settings.

brianteeman commented 4 years ago

That is not what is being said

C-Lodder commented 4 years ago

@nikosdion This is not what I'm saying at all. The font sizes still need adjusting in Atum, but not by setting a 14px value on the html element.

b2z commented 4 years ago

@C-Lodder so what would be the proper solution?

nikosdion commented 4 years ago

I closed this issue because I do not thing it reflects the actual problem anymore, not because I got pissed off. Sorry if I gave the wrong impression.

I got the point about using rems instead of absolute px and I actually did run it with different browser font settings after I read your comment. Sure enough, if I set my browser to 14px it looks mostly¹ fine. If I set it to 20px it looks fine if I remove my glasses. In fact I need to change FEF so under J4 it uses a base font size of 1rem to make things consistent.

Even if we keep the 1rem (BS4 default) we still need to go through all Joomla-specified font sizes such as the text in the toolbar because it becomes tiny with a base font size of 14px whereas the rest of the itnerface is perfectly legible. It looks like someone defined these sizes "eyballing" it, with even less understanding than mine about relative font sizes.

The other solution I see is overriding BS4 to use a different base font size in the <body> element e.g. 0.87rem but this has two immediate drawbacks I can see. First, we are once again overriding Bootstrap in Joomla which has proven to be a bad idea. Second, it cannot be toggled on / off so users who found the default font size in Joomla 3 too small still have that problem despite their browsers defining a larger base font size by default.

So the correct solution seems to be one of educating users which is somewhere between a tall ask and impractical. I have no solution for that and it's a very different issue than the one I thought we had, therefore I am closing this issue – it's no longer a "here's how to fix this" but more of throwing ideas around. We can keep discussing alternative solutions but it's no longer a valid issue. If anyone comes up with a good enough solution they should file a new ticket and reference it here.

I think that makes more sense, right?

nikosdion commented 4 years ago

Another problem I see is that when you enable the "Increase Font Size" accessibility setting the applied class (a11y_font) is forcing the html element's font-size to be a hard-coded 18px. So, Joomla is doing it wrong by forcing a font size without respecting the user's setting. That is to say, the way to deal with accessibility in Atum is to disable Joomla's accessibility setting and use your browser's settings...? 🤯

@marcodings I am asking the Production Team for an official statement. Is Joomla 4 supposed to use RELATIVE or FIXED font sizes? Also, please point us to the relevant guideline followed during Atum's and Cassiopeia's development since I can't seem to be able to find it in this repository here. Thank you in advance.

C-Lodder commented 4 years ago

That is to say, the way to deal with accessibility in Atum is to disable Joomla's accessibility setting and use your browser's settings...

Apparently they're there for a reason

@nikosdion - As for the development of Cassiopeia (formerlly known as Aurora), I was the one who originally added it (https://github.com/joomla/joomla-cms/pull/14864). If I rightly remember, it was more or less a port from BS2 to BS4 and a change in the module position naming conventions, so there weren't any guidelines. Since then, I don't think much work has been done on it.

nikosdion commented 4 years ago

Let me see if I get this straight. Joomla can set an absolute pixel size when you select an option and this is OK because unspecified reasons. However, if we set an absolute pixel size by default it's wrong. Except when we do that in the front-end because... who knows?

This is a joke, right?

C-Lodder commented 4 years ago

Except when we do that in the front-end because... who knows

If the FE template is setting a base font size, then that's my bad.

As for setting an absolute pizel size by default, this is up to Joomla. I would suggest not doing so for reasons stated above. Either way, both templates should obide by the same rules and support browser based settings. I've moaned about the a11y settings for too long to care anymore

nikosdion commented 4 years ago

I am reopening this issue because I have a better idea on how to address this issue.

TL;DR: Modify com_users accessibility settings, adding a "Base font size" option with the options Browser Default, 8px, 9px, ..., 72px. IMHO the default should be 14px but I'm open to having it set to "Browser Default". This would replace the a11y_font setting. If set to anything other than Browser Default we would add a class a11-font-WHATEVER (e.g. a11-font-14) which would set the html font-size to the specified pixel size _in the same way the current a11text setting works.

Here is why I think this is a better idea than modifying core Bootstrap to set a different body size.

First of all, it's not just a quick search and replace. Bootstrap has a plethora of font sizes, padding and margin settings spread out into several files. Trying to "scale down" the interface would take an extraordinary amount of time. Then we have the problem that we actually modified Bootstrap yet again which we have already established was a bad thing to do in J3.

Even if we magically changed Bootstrap's default font size from 1 rem to, say, 0.87 rem it would still be the wrong approach for some people since we are forcing a default other than their browser preference. Not doing anything is equally wrong because for most users the base font size of 16px is ridiculously big and leads to comical side effects (try viewing the Update Sites page on a 13" MacBook Pro – this is NOT what anyone would call a decent UI).

Allowing the users to set their preferred base font size per user profile is a universally acceptable solution. If you want to follow your browser settings, like J4 beta 1 does, you can. If you want a smaller or bigger size to accommodate your preferences and / or disabilities, you can. Better yet, if you do that you will get a consistent experience no matter which browser and which computer you are using.

I would still need feedback from @marcodings @wilsonge and @HLeithner at the very least before I start writing code.

pedro-olaia commented 4 years ago

https://github.com/joomla/joomla-cms/issues/29399#issuecomment-637999247

Thank you for your feedback, we can use and value also YOUR perspective and contribution.

Joomla has an accessibility team that deals with ensuring Joomla is accessible. I do not want to get your hopes up that anything significant can / will change on short term as we are in Beta now and our goal is to get Joomla4 released asap.

Accessibility is an extremely complex topic and design is very personal, Joomla has been working on this back-end template for multiple years and has been open for contribution and feedback. I would definitely not characterize this as elitist irrespective of the fact that we can not accommodate everybody.

Please contribute and help joomla better contact Carlos Cámara through here Joomla accessibility team and read more about what our Joomla volunteers portal

Hope we can see you there soon

I don't know what people with accessibility issues will do with Joomla after joomla die... And Joomla will die because common users are in a mass abandonment of the project. Clear and simple. You have the numbers! This is not an issue to talk with Carlos Cámara, that's an issue to talk with the strategy leader! Also I didn't find the Design team, can you help me on that?!

"and design is very personal"... no it's not! Design is very technical, a solving problems oriented methodology that involves strategy. You might be confusing Design with looks or aesthetic that is a very wrong assumption similar to confuse CSS with computer programming. I kinda can understand now why there is no Design department in Joomla volunteers portal, and why the new J4 have such a bad usability.... Good Design is all about functionality and can be extremely good when it looks bad. For me and my clients what we need is something easy to work around, simple to find things and execute fast. The look and feel of the platform can help a lot on that as it can and should orient the eye for the main tasks and help people to identify better, inside the app, where are they placed on. But the issue is not the looks, its the usability of J4, its the visual confusion for the eye and the mind, it's the time lost in scrolling and scrolling, clicking and clicking again, making large movements with the mouse from one box to another!

The main issue here is not the complexity of the accessibility topic. Is the survival of Joomla. And project leaders not willing to understand and accept that there is a problem is the major problem! Impossible to change or fix anything when one is not willing to accept that there is a problem!

In my opinion, Joomla 4, like it is, should never come out... putting it asap out there may become one more nail for the coffin. I hope you leaders have at list the sensibility to understand the need to keep joomla 3 alive until Joomla 5 is out!

brianteeman commented 4 years ago

As well as being off topic (hint the topic is about the base font size) your long comment says nothing more than "I dont like it". Without concrete statements (which all should be in their own issue) nothing can be changed as no one knows what you want to change. In another issue you mentioned not being able to find the save button - but that is in the exact same position as before. So please stick to facts and not vague opinions. We can act on facts we can't act on vague opinions.

nikosdion commented 4 years ago

@pedro-olaia The notion that if it's not going to be perfect it shouldn't even be attempted is nihilistic. I'd rather see Joomla moving forward in stumbles than sitting still, waiting to rot dead, as it has been doing for the last 7 years.

On the subject of giving up, it's very easy and I could have just as well done so 6 hours ago. Instead, I asked myself two questions. First, if not me then who? Second, am I being the change I want to see? So I spent more of the time I don't really have to try and come up with a technical solution.

If you want to be constructive I will be more than happy to hear your assessment of my solution and whether you feel something more or different can be done. If, however, you can only channel defeatism then I will have to respectfully ask you to force yourself to remain silent so we can work without the mental noise. Thank you for your understanding.

pedro-olaia commented 4 years ago

Nikosdion, I totaly agree with you... and the main reason why J4 is stoped for 7 years is because people like brianteeman that keeps kicking out common users and their needs from the Joomla development...

People just give up to participate or contribute, among them great people with great ideas and a great will to put their hands and participate in this big effort!

pedro-olaia commented 4 years ago

I am new to this.

Nikosdion. I can tell immediately from the first post I read from you that you are very concerned with Joomla, joomla development... and not with ur ego. THANK YOU! The first time I did suggest something for Joomla was the repeatable custom fields for J3, now very well improved in J4. But when I did it I got a really bad response from developers. And I have been seeing that this is the main way of dealing with the community, there are some who are superior and others that must be plebeians. My harsh words are for the ones who are fucking harsh and have that big ego who assumes any suggestion as a criticism... so be it! That's the language they understand.

The tunel vision around accessibility is not fixing an issue, is creating an issue! its to much energy putted in an obsession that is going to destroy Joomla. The best solution is not correct font size, is a user profile plugin to allow users to select an accessibility mode and let all the other people who wants to use Joomla as a software and a practical, usefull and usable production tool to just have that. Maybe there will be 1 or 2 persons in the world that will use the accessibility mode!

I bet that all the volunteers that put a lot of effort and time in this project will not like to see it die just because there is not enough disabled people that cares about Joomla and the ones who cares are seeing their needs putted aside. Programmers that are working on this have a huge heart and willpower, I am sure they care about finishing tasks and they do their best to accomplish the tasks they are committed to. They just have no time to be committed to strategy or and user needs! A leadership in strategy must exist or else is tons of hard work jeopardized in bushtit.

What we need is simple workflow improvements like:

etc etc etc

nikosdion commented 4 years ago

Unfortunately this issue has been taken over by someone who doesn't get the subtle and not so subtle hints that he's off-topic and actively hindering the resolution of this issue. Past experience has shown that off-topic bitching is the fastest way for am issue to be ignored and the underlying issue never fixed. This is too important an issue to allow this to happen so I am closing this issue here. Those whose participation is productive have already been alerted to how we proceed next.

nikosdion commented 4 years ago

Also here's a quick list on all the ways you are not just off topic but haven't really thought things out.

Have a direct access to modules

You do. Content > Site Modules to list them. You can edit modules directly from the frontend. You can embed them in articles. What else do you want?

Have Categories for Modules

HELL NO. Modules are not articles. Modules are display viewports. In fact, modules per se are an anachronism dating back to Mambo. We should really be using HMVC to display multiple components on a page but that's a massive departure from the development model of Joomla extensions and definitely not something from Joomla 4 or even Joomla 5 – or possibly ever.

One different content type from Articles, so we can use custom fields to create a free style content type.

That was what the UCM promised but Custom Fields delivered. Joomla 5 is planned with that in mind anyway. Meanwhile you can use custom fields. That's why I insisted Joomla needed custom fields.

If you think about how WordPress is managing custom taxonomies you'll see that it's basically custom fields but it requires you to write custom code. The only downside to J managing custom fields is that the interface to custom fields is problematic... unless you use backend view template overrides. I've seen my wife designing a compelling backend experience for some VERY custom content types using Joomla! 3.9. It's possible, you just need to put some work into it – still much less work than with WordPress.

Let custom fields be set differently for Categories and subcategories

You can if you plan it correctly. At worst you may have to create a parent category with no fields to act as a container.

Place an edit button on Articles category to edit the category and let the title of the category open the articles list instead of opening the category edition.

That would be inconsistent with the rest of the CMS, therefore wrong from a UX point of view. You can, however, filter by one or more categories very easily in Joomla 4.

Also note that when you are editing an item in Joomla it's checked out. You should never have a direct link outside of that area. If you go to a different page without saving or cancelling the item remains checked out and other users can't edit it. It's been the case since J 1.5.0.

Also place a button inside the category edition to open the articles list of that category.

The category list already has links to the published, unpublished and trashed articles in each category in Joomla 4. Maybe you should spend more time using it and less time complaining about it...?

In the articles list, place a always visible "search for Categories".

We have already discussed this circa Joomla 3.3. The gist is that each search field is potentially a "must have" for someone. If you want to satisfy everyone at the same level you either have to show all filters or hide them all when they are not in use. Joomla chose the latter to prevent interface cluttering which is actually a good thing. As someone whose software shows all filters I can attest to that.

Early J4 alphas had an obnoxious filter interface with a dropdown popover for the filters that was unusable as sin. At least that was fixed.

I don't like excessive clicking either but having seen – and maintained the code for – extensions showing all filters all the time I have to begrudgingly accept that Joomla's solution is the only reasonable one. Besides, it's not like Joomla invented this UX pattern. Thank Google and Apple for it.

Give the ability to add a photo to the users list.

This is called "avatars". There are several reasons Joomla doesn't and shouldn't. Avatars only really make sense for users if they don't have to set them for each and every site separately. So you need something like Gravatar – but that promotes WordPress which is self-defeating. Using Facebook etc requires implementing social login which comes with a lot of disadvantages as I can tell you from the experiencing of maintaining Akeeba SocialLogin. Storing them on your server is not just obnoxious for the user but also comes with the cost of storage and associated security risks – there are 3PD solutions for that.

This is one of the problems you can't have a good solution. No matter what you do people WILL complain and you will not even cover the majority of your users' use cases. So it's best left to 3PDs to implement.

The best solution is not correct font size, is a user profile plugin to allow users to select an accessibility mode and let all the other people who wants to use Joomla as a software and a practical, usefull and usable production tool to just have that. Maybe there will be 1 or 2 persons in the world that will use the accessibility mode!

That's exactly what I proposed. However, what you propose is technically impossible to implement. I explained how it can be implemented.

Also note that I EXTREMELY STRONGLY disagree that accessibility is an afterthought. Disabilities are not always obvious. Dyslexia is invisible and so are the various modes of colour perception disabilities (calling it colour blindness is wrong because it only refers to one of the seven or so colour perception disabilities). Disabilities which restrict fine motor skills are a thing and mostly invisible. Carpal tunnel too. Arthritis is a disability which can make it problematic using an interface without adequate padding. Any sort of autoimmune disease that causes tremors belongs to the same category. Old age comes with diminishing eyesight. Some of us have a problem with high intensity colours or certain colour combinations. Speaking of which, epilepsy is also a disability. Some disabilities can be temporary e.g. having a broken finger, severe neck pain etc. If you add these all up you will see that this is a very important proportion of the people using a Joomla site every day and most definitely not "two people" in the world.

Please check your privilege, especially if you call yourself a designer. If you make exclusionary designs you are doing a disservice to your clients and the world at large.

pedro-olaia commented 4 years ago

Thank you for your time and patience to answer this Nikosdion! I fully appreciated all your answers. Even when u meant to put me in my place, all ur answers have foundation and I could learn from it, Thank you!

As I said before I am new to this. I understand now I should had put my questions in a wider discussion forum, not here! I thought the continuation of the issue that I opened before was closed and passed to this one... Sorry for that.

If you have the time to read this I will appreciate maybe you can help me in order to give my best contribution to help in anything! But still it's out of this issue.

My personal understanding is that any CMS project only grows with new people joining, and I believe that bring new people to Joomla at this moment it's capital. I am quite new to Joomla too, I started to work with it in 2017. But I am quite used to operate with many different types of software so I can operate under any confusing interface, but my clients not, and it's for them that I am concerned about the overall workflow of Joomla backhand...

What I want from a CSS for my own productivity is the less clicks and scrolling possible to perform the tasks I need to perform. My clients in other hand need an intuitive solution so they don't feel lost, dumb and find it difficult. and who better to point out what's not easy or intuitive then non experienced people like our clients who usually use computers in a very basic level ? Those are the ones I have to try to convince to use a CMS... and this is why Agencies and Designers are choosing other solutions over Joomla. It's not that the others are better, is that Joomla is often considered difficult to understand and operate for the majority of the end users. Time spend to execute things is the kee here.

My feedback is the feedback of my clients, any new client is often a person that never seen Joomla in their life. Their feedback and complains are diamonds about what should be done in Joomla to make it more attractive and so bring more people to join in.

The ones who can give the best feedback about Joomla´s user experience issues is new people right? Makes no sense to kick them off. This is one of the biggest complains I hear and read about Joomla, if you are not a programmer expert u will feel the despise of the community!

About Accessibility I have retinopathy and did lost peripheral vision, because the sight focus is placed in a smaller area, people with this condition deals better with an UI where the elements are closer together. This is just one example to illustrate how accessibility is truly very complex, because when we give one accessibility factor to one person we may be taking it off from another! I didn't said that accessibility is not important. it is very important. I Just don't think the main focus for the release of Joomla4 should be the Accessibility aspect as it is a tremendous work in order to be well done and its taking out focus over the main issue that makes people turn their back to Joomla. Which I think it should be, at this time, Joomla's biggest concern. Bring people to join in by making Joomla a much better experience for the user!... then with much more people on board committed to the development of Joomla, Joomla 5 would be a world example regarding to web Accessibility aspects.

When I say that maybe 2 people in the world would switch for the accessibility mode, is because I feel that the presented solution is far from meeting disabled people expectations and is at risk to don't meet no one expectations. Expectations about the UE and UI were set to high. I wanted to give this alert because I believe we are still in time to do something about this. But before I posted the issue on githu I was reading many other issues and understood that there is no room to admit that the backend is not ok. Anyone who came with critics or presented alternatives were just treated poorly!

Don't get me wrong. People that takes time to point out issues are much more useful than the ones who don't say nothing and simply walk away from Joomla. If I do this is because I also took the time and because I care about Joomla!

About the Ideas I pointed out:

I have clients with many Categories and many Articles. When they want to look for all the articles inside a specific category they find it easier to go directly to "Categories" find the category on that list and click over the number of published icons, they prefer to do this instead of: open the tab "Articles" then click "Filter Options" then click "Select Category" then look for the category in a huge tiny list of categories and subcategories that may get unreadable if the category titles are to long. But what happen is that many times they intuitive click by mistake on the category title even knowing that is not the place to click... that minor incident happens a lot. Makes them have to cancel go back and do it again Its true that my suggestion it may seem inconsistent to the rest of the CMS, therefore wrong from a UX point of view. But putting it to practice, clients intuition says that the list of categories work like folders when u click on them it open the folder, not the folder proprieties. They complain that they do this mistake over and over even when they know that is not the place to click. So this is the problem my clients face many times... what could be the solution? Maybe a link on a folder icon placed close to the title on the categories list would lead the client intuition to the action he wants to perform.

As far as my knowledge goes I think ur solution for the issue opened here will work perfectly, hope it can be implemented.

About Design, I do it for 20 years as a Business, not as an hobby. Good Design fallows function. Solutions for clients depends on what is the problem the client needs to solve, what are their commercial or market goals, and what is the budget they have for the project! I care as much for sustainability as Accessibility but within a business perspective I have to deliver the solutions my clients are asking, expecting and paying for... or else, they go somewhere else!

Hope u understood some of the issues reported by my clients and how come this can also be an issue for others. Certainly this is not the place to discuss ideas I already got that... I will look for the right place to do it.

Thank you very much for your time, sorry for my bad use of Github. Will not happen again

Quy commented 4 years ago

Have a direct access to modules

29401