Navigation and Interactivity4:33 with Dan Gorgone
From the earliest days of the web, links have represented places where the user can go next. But unfortunately, links are not always as obvious as they seem. In this video, we'll discuss tips to improve navigation and elements of interactivity within your design.
[Dan Gorgone] From the earliest days of the Web, links have represented places where the user can go next. 0:00 But unfortunately, links are not always as obvious as they seem. 0:07 [Guil Hernandez] Website navigation is incredibly important in usability 0:11 because it gets people visiting more pages in your site. 0:14 There are many ways we could do that—of course, there is the top level navigation 0:19 and proper stucture—that is very important. 0:23 It can't be confusing—we can't have deceiving navigation links 0:26 that take you to page that aren't necessarily what you were looking for. 0:29 [Gorgone] Usability can suffer when design confuses the common meaning behind historical expectations. 0:34 For example, things that look like links, such as underlined text, should act like links. 0:41 If they don't, the user is going to be confused. 0:47 Well that means recognizing that anything with a button shape, 0:51 certain images, and anything else that looks clickable should be clickable. 0:55 Otherwise, you're creating an experience that can introduce frustration. 1:00 Be sure to make links obvious, 1:05 so users know what they can click and where they can go next. 1:07 Another common mistake can occur when people create text links. 1:13 Sometimes, designers or even the people creating the content 1:17 will decide to create a link to something important 1:21 and use text in the link that they think sounds interesting or clever. 1:24 Maybe they use a cool term that people at their company will understand 1:28 or make a funny reference to something in the industry. 1:32 Understand that if users don't know what a link does or where it will take them, 1:35 if they can't immediately figure out the meaning behind it, they're going to skip it 1:41 and they're going to look for something else that makes sense. 1:46 Especially on navigation bars and menus, 1:49 be sure to stick to easy-to-understand terms. 1:52 For example, if you want to show off your portfolio, 1:56 link to it with "Portfolio." 1:59 If you have products and services, offer a link called Products and Services. 2:02 Consider the simplest term that your users will think of 2:07 when they're looking for that content and use just that. 2:10 Too often, designers will try to inject too much personality or whimsy into their designs, 2:14 and it can negatively affect usability 2:20 and decrease the chances that the user will stick around. 2:22 In addition to offering helpful navigation, 2:26 you also want to offer interesting and interactive ways 2:29 for your users to explore and engage with your site. 2:32 A rotating carousel of images, for example, should be pleasant to look at, 2:36 easy to read, and clear on how to operate them. 2:41 Using buttons or arrows to control this feature should be intuitive 2:45 and the controls should be close to the content. 2:49 Now, remember those exit signs that we talked about earlier— 2:52 if the visual cues are too far away from the important stuff, 2:55 well, the meaning is going to get lost. 2:59 In this case, controls that are not next to the carousel could be confused as controls for something else on the page. 3:02 Adding functionality from third party sites is an option that many designers choose, 3:10 especially when it provides connectivity with popular social media platforms. 3:14 Keep in mind that adding any code from the outside 3:20 introduces the chance that something could break without you doing a thing. 3:23 Social media platforms change their sites all the time, 3:28 and with it, the badges or plugins that they provide may change, as well. 3:31 With any of these features included on your site, 3:37 you must take responsibility for them 3:39 and review them on a regular basis to ensure that they still work correctly 3:41 and look good within your design. 3:46 In the end, it's important to remember balance in your design. 3:50 Keep your priorities in mind when assembling everything on your site, 3:54 and maintain your focus on the important content— 3:58 the products, the features that the main users of your site will be looking for. 4:00 Don't overload it with too much stuff. 4:05 Always keep in mind what your users want to accomplish, 4:08 but don't lose site of what you want then to do, as well. 4:11 As such, don't bury the most important features or links— 4:15 move them to front and center; make the easy to find. 4:18 And reduce the number of clicks it takes to get everywhere. 4:22 The easier everything is to find, the better the chances are that users will use your site. 4:26
You need to sign up for Treehouse in order to download course files.Sign up