Every key you need to explore a Tiki-Toki timeline without a mouse, in 2D or 3D.
Every Tiki-Toki timeline can now be explored without a mouse. This guide is for anyone reading a timeline, whether it's on Tiki-Toki or embedded in a school or museum website. It works the same in 2D and 3D views. Feel free to share it with your students and visitors.
| Key | What it does |
|---|---|
| Tab / Shift+Tab | Move forwards or backwards between links and controls. A coloured ring shows where you are. |
| Enter or Space | Press the button or link you're on. |
| Esc | Close whatever is open: a story, the image viewer, the controls panel or the game. |
The first time you press Tab, a Skip to story navigator link appears. After that, Tab goes to the date slider, then the 2D/3D button, then the controls.
The story navigator is a list of every story in date order. It only shows stories that match your search and category filters. Choose Skip to story navigator to open it.
| Key | What it does |
|---|---|
| Up / Down arrows | Previous or next story |
| Home / End | First or last story |
| Page Up / Page Down | Jump several stories at a time |
| Enter | Open the story |
Stories currently visible on the timeline are tagged "on screen". The heading tells you how many there are, for example "Stories (89, 11 on screen)".
The slider along the bottom of the timeline is the quickest way to travel through time. Tab to it, then:
| Key | What it does |
|---|---|
| Right / Up arrow | Move to the next story |
| Left / Down arrow | Move to the previous story |
| Page Down / Page Up | Jump forwards or backwards a tenth of the timeline |
| Home / End | Go to the first or last story |
| Enter | Open the story you're on |
Screen readers announce each story's headline and date as you move, along with how many stories are on screen and, on timelines with spans, which period you're in.
If you're not on a button or link, the arrow keys and Enter work anywhere on the timeline as well.
When a story opens, you start on its headline. Tab moves through the story's links, pictures and buttons, and stays inside the story until you close it.
Scroll long text: Tab to the story text, then use the arrow keys, Page Up / Page Down, Home and End.
Previous and next story: the arrow buttons at the side of the story take you to the stories either side.
Pictures: press Enter on the main picture to enlarge it. In the image viewer, the Left and Right arrow keys move between pictures.
Video and audio: press Enter on Play video or Play audio, and you go straight to the player.
Close: press Esc. You go back to wherever you were before you opened the story.
The controls panel opens from the spanner button. Its tabs (Search, Categories and the rest) are a single stop: use the Left and Right arrow keys to move between tabs, and press Tab to go into the one you've chosen.
Search: type and press Enter. Screen readers announce the results.
Categories: each category is a checkbox, so press Space to show or hide it.
View type and zoom: use the arrow keys to pick an option.
Close: press Esc to close the panel and return to the spanner button.
If a timeline has game mode, you can play it from the keyboard too. Press Enter on the game button to start.
| Key | What it does |
|---|---|
| Left / Right arrows | Choose where the story goes |
| Home / End | Jump to the first or last position |
| Enter or Space | Place the story |
| Esc | Leave the game |
Screen readers say where the story would land, for example "Position 2 of 4, after the Battle of Hastings". After you place it, you hear whether you were right, the real date, and your score or lives left. When the game ends, you start on Play again.
In Chrome and Edge, and in Firefox on Windows and Linux, the Tab key reaches every link and button straight away. On Apple devices you may need to change a setting first. We leave these choices to you rather than overriding them, because they are your device settings.
Safari on a Mac: by default Tab only stops on text boxes and menus, so it skips links and buttons. Press Option+Tab instead of Tab to reach everything. To make Tab do this all the time, turn on Safari > Settings > Advanced > Press Tab to highlight each item on a webpage (in Safari 14 and earlier, it's under Safari > Preferences > Advanced). On newer versions of macOS you may also need to turn on System Settings > Keyboard > Keyboard navigation.
Firefox on a Mac: Tab also skips links and buttons by default, and Option+Tab doesn't help. Turn on System Settings > Keyboard > Keyboard navigation (on older macOS, System Preferences > Keyboard > Shortcuts > Use keyboard navigation to move focus between controls), then quit and reopen Firefox. If you'd rather not change macOS, type about:config in Firefox's address bar, search for accessibility.tabfocus and set it to 7 (add it as a Number if it isn't there). That works straight away.
iPad and iPhone with a keyboard: turn on Settings > Accessibility > Keyboards > Full Keyboard Access. Tab then moves through links and buttons.
If something doesn't work the way this guide says, or could be easier, please email hello@tiki-toki.com. You can read about all our accessibility work in Making Tiki-Toki easier for everyone to use.