jetty / jetty.website

Antora-based jetty.org website.
https://jetty.org
Eclipse Public License 2.0
1 stars 2 forks source link

Select entries for topbar nav #2

Closed mojavelinux closed 8 months ago

mojavelinux commented 9 months ago

The topbar nav in the Antora default UI is the fixed bar at the top of the page. This element provides an area to organize global links that are always available when browsing the site. The purpose of this issue is to select the entries to put in that element.

topbar-nav

The topbar nav is partitioned into two columns. Typically, the left column contains the logo that serves as a link back "home" and the right column contains the bulk of the global links to navigate the site.

To start, we need to decide what goes in the left column. There are two options:

Next, we direct our attention to what goes in the right column. This is a bigger decision. The right column supports a list of top-level items succeeded by an optional button. The top-level items can be links with an optional dropdown, or they can be textual categories with a dropdown.

Only one level of dropdown is supported. The dropdown can be a flat list of links or it can be partitioned using thematic breaks (horizontal rules) with optional headings. The headings effectively provide another level of nesting. Each entry in the dropdown can have an optional label to provide more context.

The optional button at the end can be a link or it can be replaced by an icon and serve as its own dropdown.

Each link in the topbar nav can point to a page within the site or it can point to an external location.

The Asciidoctor docs site provides the best example of the topnav in action since it uses all of these features.

asciidoctor-topbar-nav

When trying to decide what links belong in the topbar nav, you can consult the gallery of Antora sites to see how others have made use of it. Keep in mind that you're analyzing the entries on those sites, not the design.

jmcc0nn3ll commented 8 months ago

Again, some of this is bound up in the eventual landing page for docs (/documentation (ewe) | /docs or docs.jetty.org) on which option we choose.

We should certainly have the jetty:// logo link page to https://jetty.org

We need to sort out the proper search mechanism to use. Are we integrating with Google Search or doing something different? We certainly need appropriately placed Search elements.

Fundamentally, all of the Eclipse links on the current page can completely go away, and I don't care about any of that bunk on a page hosted at jetty.org; the only reason it is there now is that it is boilerplate in their PHP goop.

As for elements on the top nav, the only content we have to work with for the site is the stuff next to the jetty:// logo on the current site, both the grey box and the related links content.

The current related links were purely to call attention to common links, and with a proper nav bar, we shouldn't have to worry about a separate section.

I like the simplicity of Camel's categories: Blog | Documentation | Community | Download | Security

They are all direct links to pages with no dropdowns.

What if we go with something like this:

Documentation | Community | Support | Download | Security

We'll have to massage and author new content for each of those pages, but I think we could handle all existing content in their respective pages.

jetty.org home could contain About, a Blog element from #6, 'Enter Bug' link, Call to Action punch list, etc

Documentation would contain Contribute Guide, etc etc

Community could contain content from Get Involved, Tools

Download could content content from Download, Source code

Support would be the Open Source and Professional page, links to mailing list, etc, Enter Bug

Security would be updated to look snazzier but the same content as current reports page

@sbordet thoughts?

mojavelinux commented 8 months ago

What if we go with something like this:

Documentation | Community | Support | Download | Security

Can you clarify that you do not want any dropdown menus in the topbar nav? And also clarify that you don't want a physical button for Download, but rather make it a regular link.

As for the content of those pages, that's a separate issue. But I will put stubs for those pages in so that the links will resolve.

mojavelinux commented 8 months ago

We need to sort out the proper search mechanism to use. Are we integrating with Google Search or doing something different? We certainly need appropriately placed Search elements.

The search mechanism itself is a separate issue, but we can ensure when setting up the topbar nav that there is a slot for the search field (the Antora default UI already provides this, so we just have to preserve it).

We can offer to add the Antora Lunr extension as is, without any modifications. Anything beyond that would need to be done in a contract extension as it was not accounted for in the scoped work (and we don't want it to sidetrack or hinder progress on the tasks agreed upon).

jmcc0nn3ll commented 8 months ago

What if we go with something like this: Documentation | Community | Support | Download | Security

Can you clarify that you do not want any dropdown menus in the topbar nav? And also clarify that you don't want a physical button for Download, but rather make it a regular link.

While I like the button, I think buttons should provoke an action, like downloading the latest distribution. What I think we need is a link to a page that details what the available options are for the user to download, versions, what java requirements, what EE versions, etc.

So yes, I don't know that we need to do dropdowns in the topbar. I think the resulting 5 pages should be able to contain everything we need to present on the site.

Order I think should be: Documentation | Support | Community | Security | Download

Since you mentioned you were contracted to bring across the content, you could simply pull content across and put them into drop downs so we can get a feel for the content categories for each of the 5 bullets, and then I can work on reworking and rewriting content.

good?