thexerteproject / xerteonlinetoolkits

Xerte Online Toolkits
www.xerte.org.uk
Apache License 2.0
62 stars 61 forks source link

Bootstrap template - multiple h1 tags question #1264

Closed FayCross closed 6 months ago

FayCross commented 7 months ago

I've been asked a question about our headings in Bootstrap template & whether we should move to only use H1 for the page title (this seems to be best practice)

At the moment we have:

Page title: H1 Section titles: H1 Content block titles: H2 H3 onwards available in WYSIWYG

Ideally, we would move to: Page title: H1 Section titles: H2 Content block titles: H3 H3 onwards available in WYSIWYG - as H3 content block titles are often hidden this should be ok

I would need to change all bundled themes to make sure headings are styled correctly and it could also have implications for custom themes elsewhere. We have recently required changes to themes for XOT template so there is precedent for needing people to do this.

What are your thought? Go ahead and change or keep as it is? @ronm123 @torinfo

ronm123 commented 7 months ago

@FayCross As I'm sure we're all aware it's been this way and therefore incorrect for years. I know we've recently required changes to themes for the XOT template but from memory I think that was really only essential for new features or at least didn't immediately impact existing projects. I agree we should try to correct this in Bootstrap but ideally not in a way that impacts existing projects or custom themes. At the very least it should be part of the next release and documented what to look for and change if needed but perhaps we can combine that with an optional property or version=x or something like that? I'm thinking out loud really but I can imagine scenarios where the size and custom styling and therefore the look of section titles could automatically change dramatically in large numbers of existing projects?

torinfo commented 7 months ago

@FayCross @ronm123 It would be better as waht we do is a bit strange. I also think this is a much easier change than the previous one. I think it really depends how easy and transparent the fix will be, and also what happens if a theme is not 'fixed'.

Did you already did some inventarisation?

We did get surprisingly few negative feedback on the last changes that were required.

ronm123 commented 7 months ago

@FayCross @torinfo The trouble is "what happens if a theme is not 'fixed'" is not easy to assess in advance for themes that we haven't created or have access to. As you know some of the previous enforced changes did result in issues in a couple of the installations that I directly support and a large number of projects. I think we need to discuss and test this and obviously keep it in the develop code until we have a new release where we can document what to look for and what to change if needed. We have a dev meeting scheduled for the 13th Dec I think but happy to have a zoom to discuss before that if needed.

FayCross commented 7 months ago

Not checked all bundled themes yet, but in the default one the change is pretty subtle anyway if I just swap tags and don't make any CSS changes (left is new, right is old). Text just gets slightly smaller:

bs_h2

The advice would be to check custom themes and if h1 and h2 tags are used directly as selectors, to change these to target .page-header instead (there's no class on the content block titles at the moment but we can add one so they can be selected in a better way in the css). Let's talk about this in December though.

FayCross commented 6 months ago

@ronm123 @torinfo just committed a fix for this - try it out with your custom themes and see what you think. Thanks