Time for action-creating navigation structure
- Take out the papers we used to create intended outcomes and determine the size and scale of our site in Chapter 2. Review them.
- Take a fresh page and start creating possible navigation structure. We can follow a top-down hierarchical structure for our site by listing down sections, subsections, and pages from the site home page. List the main sections we need in our Yoga site.
- Now go through each section and span out subsections. For example, our Postures section may group yoga postures by age, problems, or sequences. We may also want to list them alphabetically. Similarly, our About Us section can have the company vision and team information.
- Expand further and rearrange until you are satisfied with the structure. It may look like the following.
- At this stage, we have our navigation structure ready. Now is a good time to see how a CMS can accommodate this navigation. Let's try it out with Joomla!
- Go back to www.opensourcecms.com and take the Joomla! demo. Make sure you have sufficient time before the demo is re-installed. A countdown timer on the Joomla! page will tell you the remaining time.
- Log in to the admin panel and create a few sections. The following image shows the section creation screen:
- After we add our section, the list of sections may look like this:
- Section is the top-level navigation structure in Joomla!. For subsections, we have to create categories. Go ahead, create a category in the Background section for now.
- For a section to be linked from home page, we need to add a link to it in the Main Menu. Go to Menu Manager, click on the Menu Item(s) icon next to Main Menu, and add a new menu item. Have it point to the Background section. You can remove other menu entries if you wish. Your Menu Item Manager screen will look like this once you are done.
- That should be enough for us to get started. Let's see how this shows up for end users. Click on the Preview link near the top of the administration page and you should see how the main page will look. Voilà! The link we added to main menu is right there. Click on it.
- It shows a blank page for Background. Congratulations! We have successfully set up a basic navigation structure with Joomla!.
What just happened?
We structured the content of our site and created a navigation flow. Users can easily find content they are looking for, if the navigation flow of our site is simple. We followed a hierarchical structure—general sections at the top, then the more specific subsections, and then the actual content pages.
We sketched the navigation structure like a tree. While creating it, we thought about how the actual content can be accessed. We also listed down content elements that each "Posture" will have. We put ourselves in a user's shoes and came up with posture-browsing options—by age, disease, or sequence.
Sketching the navigation structure allowed us to map it to the Joomla! navigation scheme. We first created top-level sections. Subsections are called categories in Joomla! and so we created them next. Each category has a parent section associated with it. We did not create any content pages for now. We modified the site's Main Menu to remove unnecessary links and added a link for the Background section. This showed the link on the site preview and clicking on it showed us a blank page. The page is blank because we do not have any content pages yet.
We learned a lot about Joomla! administration in this exercise. We learned how to add, modify, and delete sections, categories, and menu items. These operations were similar and you can expect other options to follow a similar style.
Do you need a different navigation structure?
Will a hierarchical structure suit your site? Do you need to organize content chronologically? Or does it need to be free flowing?
- A Photo Tour site may need sequential (back—next) navigation
- A personal diary or a blog may need chronological navigation
- An encyclopedia may need great number of internal links, resulting in a free-flow navigation (for example
Wikipedia.org)
Now is a good time to review your requirements and think about the best way in which you can organize your content. Accordingly, you can determine a navigation structure.
Note
Check TED.com—the 2008 Webby Award winner for best navigation. Also, while you are there, look at http://www.schematic.com and http://www.apple.com.
Pop quiz
Why is navigation structure important?
- Improper navigation is like a maze. Most users will get lost in it.
- It gives direction to users about what they can do on the site.
- Because it is the way of organizing site content.
- All of the above.
We have a good grip on navigation now. What else will we need while building our web site? We surely need to set up a CMS. And for that, we need to know its technical requirements. Let's quickly review some technical factors you should be aware of in selecting and setting up a CMS.