Community

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
ddumonde
New Member

Keyboard shortcuts for Next and Previous buttons?

Jump to solution

As an instructional designer, I spend much of my day working my way through the "horizontal" navigation of modules with the Next and Previous buttons – Scroll to the bottom of the page ... Next ... Scroll to the bottom of the page ... Next ... Scroll to the bottom of the page ... Next ...

Is there a keyboard shortcut for the Next and Previous buttons? It would be incredibly helpful to not have to scroll to the bottom of a page each time and be able to move to the Next page from anywhere in the current page.

(I realize this may depend on whether the cursor focus inside a field like the RCE, but maybe there will be a workaround. Indeed, this might be the main reason why these shortcuts don't exist.)

And if we do it, why not keyboard shortcuts for other common UI items, such as:

  • Next
  • Previous
  • Home
  • Modules
  • Grades
  • Settings
  • Cancel
  • Save
  • Publish

I'm not asking about this from an accessibility standpoint, but from a user/admin standpoint.

1 Solution

Accepted Solutions
James
Community Champion

Here is a list of the Canvas Keyboard Shortcuts. Here's a link to Canvas' statement about accessibility: Accessibility within Canvas. When there is a conflict between accessibility and usability, accessibility often wins out.

One trick you can use when you're on a really long page is Ctrl+End. That's a browser shortcut that takes you to the end of the page where the navigation links exist. You'll still need to click on them, but you don't have to scroll.

Keyboard shortcuts are provided as usability and accessibility issues. Too many of them and you're accidentally triggering something without knowing why or you're interfering with the other programs that have the same shortcuts (it's not just the browser, some people have keyboard shortcuts for their graphics card). The keys that you think you would use, like Alt+Right Arrow for next or Alt+Left Arrow for previous are already used by the browser for navigation. Others like Ctrl+Right Arrow and Ctrl+Left Arrow are used for editing purposes and it would be confusing to have it used for multiple places. You might say Ctrl+P for previous and Ctrl+N for next, but those are already used by the browser as well.

On the other hand, if you have too few of the keyboard shortcuts, you're not meeting accessibility requirements that say you have to be able to navigate without using a mouse.

The previous and next can be tabbed to and then press enter to activate it. You could write your own script to add keyboard shortcuts and inject it into each page using a user script manager like Tampermonkey. Accesskeys are one way, but browser support is poor and there are accessibility concerns. Commands are another way to do this, but support is completely missing in Edge. You can always add event listeners that listen for you to press a key and check to see if it's one of the special keys, but that can slow things down. Still the biggest issue is probably what to use?

View solution in original post

4 Replies
James
Community Champion

Here is a list of the Canvas Keyboard Shortcuts. Here's a link to Canvas' statement about accessibility: Accessibility within Canvas. When there is a conflict between accessibility and usability, accessibility often wins out.

One trick you can use when you're on a really long page is Ctrl+End. That's a browser shortcut that takes you to the end of the page where the navigation links exist. You'll still need to click on them, but you don't have to scroll.

Keyboard shortcuts are provided as usability and accessibility issues. Too many of them and you're accidentally triggering something without knowing why or you're interfering with the other programs that have the same shortcuts (it's not just the browser, some people have keyboard shortcuts for their graphics card). The keys that you think you would use, like Alt+Right Arrow for next or Alt+Left Arrow for previous are already used by the browser for navigation. Others like Ctrl+Right Arrow and Ctrl+Left Arrow are used for editing purposes and it would be confusing to have it used for multiple places. You might say Ctrl+P for previous and Ctrl+N for next, but those are already used by the browser as well.

On the other hand, if you have too few of the keyboard shortcuts, you're not meeting accessibility requirements that say you have to be able to navigate without using a mouse.

The previous and next can be tabbed to and then press enter to activate it. You could write your own script to add keyboard shortcuts and inject it into each page using a user script manager like Tampermonkey. Accesskeys are one way, but browser support is poor and there are accessibility concerns. Commands are another way to do this, but support is completely missing in Edge. You can always add event listeners that listen for you to press a key and check to see if it's one of the special keys, but that can slow things down. Still the biggest issue is probably what to use?

Bobby2
Community Champion

I feel like I've struck gold  @James ‌! 

Now to commit them to memory. 

James
Community Champion

I'll also add that a frequent feature idea is to move the next and previous buttons to the top of the page. One of those is still open for voting. If you'd like to go there and lend you use case and vote, you can.

https://community.canvaslms.com/ideas/1936-back-and-next-buttons-at-top-of-module-items (June 2015)

The feature ideas in the following list are archived as Canvas only wants to consolidate similar requests in one place to make it easier to track and follow. You would have to join the Cold Storage group to read them. I don't provide the list to prod you to do that, I am merely including the list to show that you're not the only person who wishes there was an easier way.

James, I'm aware of the UX/accessibility trade-off and know it's a question of striking a balance, so keyboard shortcuts would need to be ranked in terms of actual usage. Next/Previous seems to be an obvious contender. Possibly Cancel/Save.

But you helped me by mentioning the browser shortcuts. I'm on Chrome on a Mac and Ctrl+End (actually Ctrl+DownArrow) invokes a MacOS system feature to reveal all open windows (Mission Control). But then I remembered that Fn+DownArrow scrolls by screen "page" (I use this all the time), so I tried Fn+RightArrow and it brought me to the bottom of the page (Fn+UpArrow jumps to the top). This is on a MacBook Pro and might be different on Macs with other keyboards.

This works for me! Thanks for your help.