Changes to the page header

[auge8472]

First change is to replace the h3 in header with p. There are for me two arguments. First is, that one should not skip heading levels (that would cause a change from h1 followed by h3 to h1 followed by h2) and second (and IMHO more important), the information, stored in the h3, are no headings in itself. We can format the content also in paragraphs eye-catching if wished.

---

One additional issue. I made testing pages for several contents to be able to understand the desired HTML structure (i.e. loops here and there and the table structure especially of the manager_package_list.html with it's many rowspans and colspans in the table header). Doing so, I came across the menu structure and the order of the main blocks (page header, menu, content). So I played around and came up with a first draft of a menu in a list structure (see therefore this Gist). During the tests I changed the order of the HTML-source from menu=>header=>content to header=>menu=>content. See therefore the creenshot and ignore the "Presented by BaNaNaS".

If I want to change the order also in the code, I have to alter the position of {% block header %}{% endblock %} in the base.html, havn't I (file name should have been order.html)?

Is this desirable at all? If so, I would like to add this small additional change to this PR.

[frosch123]

I don't get why you would want to put the headline over the navigation. That would be like browsers from 10 years ago, when the tabs were below the navigation bar. Somewhen they noticed that was weird, and put the tabs on top, so the URL is inside the tab.
The navigation bar is like the tabs, and the headline is like the URL.

Anyway, the h -> p change in this PR is fine. Do have more to add?
Also, are you aware of this branch: https://github.com/frosch123/bananas-frontend-web/tree/static
It skips the API part and fills the templates with test data.
That should make testing of layouts easy.

[auge8472]

I don't get why you would want to put the headline over the navigation.

This was only an experiment. I might be a bit oldschool, but because the document has a title (a h1), the nav should have a heading (a h2) and it is (or was) uncommon to place a h2 (of the nav) before the documents title (h1) I reordered the elements for testing. On the other hand it's nowadays not uncommon to make an exception from the above rule for the nav.

So this is all for this PR.

---

I'll check the static branch.

[TrueBrain]

I have to say, currently I am much more interested in having this website styled, than <p> vs <h3> following <h1> conversations :D This sounds more like an educational discovery ;)

But as frosch said he is fine with this, who am I to complain :)

[andythenorth]

A typical page should have 2 h1 tags:

• one titling the site or application
• one titling the page

This is aimed at AT users and is evidence-based. The evidence has not been updated since 2009, but nor has it been over-turned afaict. https://webaim.org/projects/screenreadersurvey3/#headings

This approach is also consistent with search algorithms and html5 spec.