Open afercia opened 5 days ago
afercia
commented
5 days ago Additionally: Why the 'Blocks' and 'Additional CSS' descriptions are placed before the navigation buttons? This seems inconsistent with the vast majority of cases where descriptions in the editor are placed after the related control.
Also, for better accessibility, these descriptions should be associated with their related controls via aria-describedby.
t-hamano
commented
3 days ago do you know why this is rendered only after some adidtional CSS has been set?
It seems related to #47266.
I too would expect Additional CSS button to always be rendered. This functionality has been present in the Customizer for a long time and I don't think it should be hidden by default:
afercia
commented
3 days ago @t-hamano thanks for pointing to https://github.com/WordPress/gutenberg/issues/47266
It appears the two points in that issues are:
Move the Additional CSS access point to the Global Styles ellipsis menu Only if there is additional CSS present, add the Additional CSS component top-level to Global Styles (like it is currently)
i disagree with both points. To me, initially burying down a feature into a barely noticeable ellipsis menu is a perfect way to hide that feature. The fact the navigation button appeaers only when there is some additional CSS set may be smart at first but it;s confusing for users. I can't support this kind of design approach where, in the name of aiming to make the UI 'less cluttered', features and content get removed or hidden.
I only share the point that Additional CSS shouldn't be much prominent. It's sort of an advanced feature but it still needs to be discoverable. I'd think the best option is to just place the navigation button after the 'Blocks' one, with no special prominence.
afercia
commented
3 days ago It's worth mentioning that based on https://github.com/WordPress/gutenberg/pull/63243#issuecomment-2422638895 and https://github.com/WordPress/gutenberg/issues/66307 the Revisions button is candiate to be moved to the main panel as well. So taht there would be 3 navigation buttons always shown, with no special prominence:
afercia
commented
3 days ago Looking into this, I just noticed a different beheavior when accessing the Additional CSS that I'd consider a functional bug.
p {background: red; }
Description
Noticed on a screenshot provided by @jameskoster on https://github.com/WordPress/gutenberg/issues/66307#issuecomment-2428946377
Looking at that screenshot, I was wondering why I didn't see any 'Additional CSS' button in my Styles panel.
Turns out that seems intentional, as the navigation button is rendered based on a condition that also checks whether some additional CSS is already set.
I had to figure out how to navigate to the Additional CSS panel and ultimately found it in the 'More' ellipsis button at the top of the Styles panel.
To me, this seems to be a perfect way to hide features and make them less discoverable from users. I'd appreciate to know why the navigation button is rendered conditionally and whether this makes the UI more usable in any way.
I'd like to propose to make things simple and just not implement behaviors that may look smart at first but ultimately are arguable ad likely confusing for users.
@WordPress/gutenberg-design do you know why this is rendered only after some adidtional CSS has been set?
Also, the feature description:
Add your own CSS to customize the appearance and layout of your site.is completely missing at first and only shown after the feature has been used. It's arguably usable to provide a description only after the feature it relates too has been used.Step-by-step reproduction instructions
Screenshots, screen recording, code snippet
No response
Environment info
No response
Please confirm that you have searched existing issues in the repo.
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Please confirm which theme type you used for testing.