Chapter 6, “Street Signs and Breadcrumbs,” is about designing navigation. People won’t use our websites if they cannot find their way around it; it’s a fact! It is the same as going into a store to buy something. You always look for the section’s sign to know where to go. It all comes down to if you’re in a hurry, willing to talk to someone, or want to go about your business. When creating your navigation for your site you want to create hierarchy. Then create a list of subsections under the highest sections. If it isn’t set up this way, chances are you’ll leave and take your business elsewhere. Navigation’s purpose if often overlooked. It tells us what is here, it tells us how to use the site, and it gives us confidence in the people who built it. And it better be really good!
Then you have something called persistent navigation. It should include four elements you should have at all times, site id, utilities, sections, and a search bar. This just confirms you’re still on the same site. And you do not need it on every page. The only pages that you shouldn’t include the navigation on is when you’re looking at a form or PDF. You always need the site id or logo though, because this tells the person browsing what page they are on. The site id should be recognizable and memorable hopefully. The site id or logo can also be the home button. That should be persistent and easily identified.
“Page names are the street signs of the Web.” This is very true, because you want it to be readable and give you a sense of direction at all times. There are four things you need to know about page names, every page needs a name, the name needs to be in the right place, the name needs to be prominent, and the name needs to match what I clicked. A “you are here” indicator should highlight each page when you navigate to them. You can highlight it or put it in bold. There are many ways to do this. Then there are “breadcrumbs” that show you where you are and where you were. It is a trail to get back to the home page. To implement breadcrumbs you should put them at the top, use > between levels, and bold face the last item.
This chapter is a must read to know how to have good navigation for ANY site.
Even though this design site is in French, it is clean and simple. The navigation is on the left hand side of the page and reads from top to bottom. The whole site is also continuous scroll which is what I am looking for to use in my portfolio site. The logo is in the upper left hand corner and is also used as a graphic on the home page. The typeface chosen is easy to read and goes well with the site and logo. The animations as you scroll make the site more interesting.
The Design Studio of JDSN
There is no navigation bar when accessing this site. You seem a small about paragraph and then a link to contact him. It is another continuous scroll site and shows his work, but you cannot view them in a bigger format and there is no description of them. At the very bottom of the page is his social media. This is the most simplistic site I have viewed. I like it, but I won’t take much away from it.
Jessie Sima Illustration
The home page for this designer shows four categories in boxes and then has the navigation bar along the left hand side of the page. The navigation has about, illustration, apparel, design, patterns, sketches and junk, and contact. The four boxes have illustration, apparel, design, and pattern all accompanied with photos. Her logo includes type and illustration which I don’t see often with designers. The colors used are natural and toned down, and the font used is playful and easy to read.