{"id":612,"date":"2024-06-04T08:56:33","date_gmt":"2024-06-04T05:56:33","guid":{"rendered":"https:\/\/papunet.net\/saavutettavuus\/?page_id=612"},"modified":"2024-06-04T11:13:41","modified_gmt":"2024-06-04T08:13:41","slug":"2-5-8-kohdealueen-koko-minimi","status":"publish","type":"page","link":"https:\/\/papunet.net\/saavutettavuus\/ohjeita-ja-oppaita\/teknisen-saavutettavuuden-ohjeet-wcag\/wcag-2-2-saavutettavuusohjeet\/2-5-8-kohdealueen-koko-minimi\/","title":{"rendered":"2.5.8 Kohdealueen koko (minimi)"},"content":{"rendered":"\n<h2>Kriteeri<\/h2>\n<p>Toiminnallisten kohteiden (esimerkiksi linkit, painikkeet, ja lomake-elementit) koko on v\u00e4hint\u00e4\u00e4n 24 x 24 CSS-pikseli\u00e4, paitsi kun:<\/p>\n<ul>\n<li>Et\u00e4isyys: Jos sivulla on l\u00e4hekk\u00e4in alle 24 x 24 CSS-pikselin kokoisia kohteita, kohteiden v\u00e4lill\u00e4 tulee olla riitt\u00e4v\u00e4sti tyhj\u00e4\u00e4 tilaa. Toiminnallisen kohteen keskipisteest\u00e4 tulee olla v\u00e4hint\u00e4\u00e4n 12 CSS-pikseli\u00e4 l\u00e4himp\u00e4\u00e4n toiminnalliseen kohteeseen.<\/li>\n<\/ul>\n<p>Esimerkki: Vierekk\u00e4in on kolme sosiaalisen median kuvalinkki\u00e4. Jokaisen kuvalinkin koko on 10 x 10 CSS-pikseli\u00e4. N\u00e4iden kuvalinkkien v\u00e4liin on j\u00e4tett\u00e4v\u00e4 tyhj\u00e4\u00e4 tilaa. T\u00e4m\u00e4 voidaan tehd\u00e4 esimerkiksi lis\u00e4\u00e4m\u00e4ll\u00e4 jokaisen kuvalinkin vasempaan ja oikeaan reunaan paddingia 6 CSS-pikseli\u00e4.<\/p>\n<h2>Miten tehd\u00e4\u00e4n<\/h2>\n<p>Varmista, ett\u00e4 toiminnalliset kohteet t\u00e4ytt\u00e4v\u00e4t minimikoon (24 x 24 CSS-pikseli\u00e4) tai niill\u00e4 on riitt\u00e4v\u00e4sti tilaa ymp\u00e4rill\u00e4\u00e4n.<\/p>\n<h2>Miksi se on t\u00e4rke\u00e4\u00e4<\/h2>\n<p>Jotkut fyysisist\u00e4 rajoitteista k\u00e4rsiv\u00e4t eiv\u00e4t voi klikata pieni\u00e4 nappuloita, jotka ovat l\u00e4hell\u00e4 toisiaan.<\/p>\n\n","protected":false},"excerpt":{"rendered":"<p>Kriteeri Toiminnallisten kohteiden (esimerkiksi linkit, painikkeet, ja lomake-elementit) koko on v\u00e4hint\u00e4\u00e4n 24 x 24 CSS-pikseli\u00e4, paitsi kun: Et\u00e4isyys: Jos sivulla on l\u00e4hekk\u00e4in alle 24 x 24 CSS-pikselin kokoisia kohteita, kohteiden v\u00e4lill\u00e4 tulee olla riitt\u00e4v\u00e4sti tyhj\u00e4\u00e4 tilaa. [&hellip;]<span class=\"moretag\">Lue lis\u00e4\u00e4&#8230;<\/span><\/p>\n","protected":false},"author":10,"featured_media":0,"parent":130,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-612","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/612","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/comments?post=612"}],"version-history":[{"count":0,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/612\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/130"}],"wp:attachment":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/media?parent=612"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}