The Australian Government coat of Arms

Communities of practice

Home page template


#1

Hi community,

We have updated the uikit-starter with the main navigation component. This allows you to create a home page and basic page template with all the necessary components.

Templates are our next milestone, however for them to be published on the design system website we need to create a versioning pipeline.

Cheers,

Christopher


#2

I’m really looking forward to seeing those templates go live. Can’t wait :smiley: Keep it up, Design System :rocket:


#3

I’ve looked at the first template and it is great to have something like this – putting all these components together. I know it is not the final “product” of this effort, but anyway I do have few notes (as usuall :slight_smile:).

  • H1 tag is in unusual place (header of the site) – it should follow more standard pattern – a title of the page with tighter connection to the content
  • Page heading structure is not logical:
    • the H2 Responsibilities is set as the top level side menu item. Should be something lower like H4 at least.
    • H3 is at top of the Content Community – should be H2
    • H3 is the text in the Banner. “Understand user needs. Research to develop a deep knowledge of the users and their context for using the service.” Should be split between H1 + H2?
  • Is there a reason (accessibility or similar) why the side navigation is first in the HTML structure aka not using content first?

All these changes will have minimal impact on the visual as all the styling is done via classes. Only on the mobile the side navigation will be shifted bellow the content (solvable by flex rodering etc. with a small sacrifice for compatibility).


#4

Thanks @petrillek there is still some work to be done on these templates and all of your points are extremely useful.

In terms of order of navigation or content that comes down to usability testing and what is more important. Some sites it is more important for the user to quickly know where they are and the context of the information architecture. Others the content is more important.

This template needs a lot more polish so please continue to provide feedback it’s super useful!