{"id":4302,"date":"2017-11-09T08:54:22","date_gmt":"2017-11-09T07:54:22","guid":{"rendered":"https:\/\/florianbrinkmann.com\/en\/?p=4302"},"modified":"2020-02-09T10:59:41","modified_gmt":"2020-02-09T09:59:41","slug":"remove-elements-from-tab-order","status":"publish","type":"post","link":"https:\/\/florianbrinkmann.com\/en\/remove-elements-from-tab-order-4302\/","title":{"rendered":"Remove elements from tab order"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Elements like links, buttons, and form fields, can be reached via the keyboard (by default by using the tab key). This post shows you how to remove specific elements from this tab order, so they can no longer be accessed via the keyboard.<\/p>\n\n\n\n<!--more-->\n\n\n\n<p class=\"wp-block-paragraph\">You may ask yourself: \u00bbWhy should I want to remove an element from the tab order?\u00ab<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Great question. Let us take the following scenario of a blog view as an example: title, featured image, date, and read-more-link are linking to the single view of the post. This means if the user is using the keyboard to tab through the page, he will \u2013 assuming that all have a title, featured image, and read-more-link (the date is always there) \u2013 have four tab stops per post, all linking to the single view.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To improve that, you can use&nbsp;<code class=\"lang-markup\">tabindex=\"-1\"<\/code> for all these links except one. With that, they are no longer accessible via the keyboard, and there would only be one link to the single view for keyboard users.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Elements like links, buttons, and form fields, can be reached via the keyboard (by default by using the tab key). This post shows you how to remove specific elements from this tab order, so they can no longer be accessed via the keyboard.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"wpf_show_in_dewp_planet_feed":false,"flobn_post_versions":"","webmentions_disabled_pings":false,"webmentions_disabled":false,"lazy_load_responsive_images_disabled":false,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-4302","post","type-post","status-publish","format-standard","hentry","category-web-development"],"wp-worthy-pixel":{"ignored":false,"public":null,"server":null,"url":null},"wp-worthy-type":"normal","_links":{"self":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/comments?post=4302"}],"version-history":[{"count":3,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4302\/revisions"}],"predecessor-version":[{"id":5834,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4302\/revisions\/5834"}],"wp:attachment":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/media?parent=4302"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/categories?post=4302"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/tags?post=4302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}