Those are all very good questions.
What is your suggestion with the size of the navigation bar on the left side?
In general, the left side navigation bar should be less than the mobile width (typically anywhere between 250-320px - depends on the longest width of your text). In our Canvas template, the sidebar width is 285px.
Should it extend all the way to the bottom of the screen? Should it just end when the text ends?
For most portal/dashboard pages, the sidebar typically extends all the way to the bottom of the screen because there are usually multiple links. This format is also more scalable as it’s easier to add more links vertically vs. adding them horizontally in the top navigation menu bar (at some point, the horizontal menu will need to be hidden and users will have to click on a hamburger menu to view the menu options).
Another version of the sidebar you’ll see a lot is a sidebar that has no background. This layout is typically used when you have a lot of content on the page and want to make the page feel less busy. It might feel like the navigation bar ends where the text ends but in reality, the sidebar extends all the way to the bottom of the screen and only the right side is scrollable content.
Also, do you use a normal group for this? A floating group? Other?
Do you need the sidebar to always be accessible? If not, consider using a normal group for this.
Wikidpedia’s sidebar is not sticky.
If you do need the sidebar to always be accessible, then I would use a combination of normal group and floating group to get this effect:
You can check out the settings pages in our free Canvas: App Foundation template to see how we used a normal group and floating group to set up that UI.
Hope this help!
Canvas by AirDev