{"id":2515,"date":"2024-02-08T02:16:18","date_gmt":"2024-02-08T05:16:18","guid":{"rendered":"https:\/\/ember.com.br\/?p=2515"},"modified":"2024-06-22T05:15:48","modified_gmt":"2024-06-22T08:15:48","slug":"em-memoria-da-caixa-de-selecao-checkbox","status":"publish","type":"post","link":"https:\/\/ember.com.br\/en\/em-memoria-da-caixa-de-selecao-checkbox\/","title":{"rendered":"Em mem\u00f3ria da caixa de sele\u00e7\u00e3o checkbox"},"content":{"rendered":"<p>Esta \u00e9 uma caixa de sele\u00e7\u00e3o:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox@2x.png?t=1707256942\" width=\"600\" height=\"150\" \/><\/figure>\n<p>\u00c9 quadrada, tem uma marca de sele\u00e7\u00e3o dentro e seu diferencial \u00e9 que voc\u00ea pode selecionar qualquer n\u00famero deles ao mesmo tempo:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkboxes@2x.png?t=1707256942\" width=\"600\" height=\"400\" \/><\/figure>\n<p>Diferentes sistemas operacionais os renderizaram de maneira diferente durante sua evolu\u00e7\u00e3o:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_macos_sonoma@2x.png?t=1707256942\" width=\"500\" height=\"100\" \/><figcaption>MacOS Sonoma (2023)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_os_x_maverics@2x.png?t=1707256942\" width=\"500\" height=\"225\" \/><figcaption>OS X Mavericks (2013)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_os_x_leopard@2x.png?t=1707256942\" width=\"500\" height=\"125\" \/><figcaption>OS X Leopard (2007)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_mac_os_9@2x.png?t=1707256942\" width=\"500\" height=\"232\" \/><figcaption>Mac OS 9 (1999)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_mac_os_7.5@2x.png?t=1707256942\" width=\"500\" height=\"125\" \/><figcaption>Mac OS 7.5 (1994)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_11@2x.png?t=1707256942\" width=\"500\" height=\"200\" \/><figcaption>Janelas 11 (2021)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_8@2x.png?t=1707256942\" width=\"500\" height=\"280\" \/><figcaption>Janelas 8 (2012)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_7@2x.png?t=1707256942\" width=\"500\" height=\"150\" \/><figcaption>Janelas 7 (2009)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_xp@2x.png?t=1707256942\" width=\"500\" height=\"200\" \/><figcaption>WindowsXP (2001)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_2000@2x.png?t=1707256942\" width=\"500\" height=\"220\" \/><figcaption>Janelas 2000 (2000)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_95@2x.png?t=1707256942\" width=\"500\" height=\"124\" \/><figcaption>Janelas 95 (1995)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_windows_3.11@2x.png?t=1707256942\" width=\"500\" height=\"200\" \/><figcaption>Windows para grupos de trabalho 3.11 (1993)<\/figcaption><\/figure>\n<p>Como voc\u00ea pode ver, nem sempre a marca de sele\u00e7\u00e3o estava l\u00e1.\u00a0Mas uma coisa permaneceu constante: as caixas de sele\u00e7\u00e3o eram quadradas.<\/p>\n<p>Por que quadrado?\u00a0Porque \u00e9 assim que voc\u00ea pode identific\u00e1-los pelos bot\u00f5es de op\u00e7\u00e3o:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radiobuttons@2x.png?t=1707256942\" width=\"600\" height=\"620\" \/><\/figure>\n<p>Sua caracter\u00edstica distintiva \u00e9 uma escolha \u00fanica.\u00a0Se voc\u00ea selecionar um, todo o resto ser\u00e1 desmarcado.<\/p>\n<p>N\u00e3o tenho certeza de quando a distin\u00e7\u00e3o entre quadrado\/redondo foi introduzida, mas parece j\u00e1 existir na d\u00e9cada de 90:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/turbo_pascal@2x.png?t=1707256942\" width=\"720\" height=\"540\" \/><figcaption>Turbo Pascal 7.0 (1992)<\/figcaption><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/norton_commander_5@2x.png?t=1707256942\" width=\"720\" height=\"540\" \/><figcaption>Comandante Norton 5 (1993)<\/figcaption><\/figure>\n<p>(Adivinhe onde\u00a0<code>[x]<\/code>\u00e9 usado agora? No Markdown! Que retorno, hein?)<\/p>\n<p>E desde ent\u00e3o, todos os principais sistemas operacionais seguiram essa tradi\u00e7\u00e3o.\u00a0No Windows 3.11:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_windows_3.11@2x.png?t=1707256942\" width=\"500\" height=\"100\" \/><figcaption>Windows para grupos de trabalho 3.11 (1993)<\/figcaption><\/figure>\n<p>atrav\u00e9s do Windows 95:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_windows_95@2x.png?t=1707256942\" width=\"500\" height=\"340\" \/><\/figure>\n<p>para Windows 11:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_windows_11@2x.png?t=1707256942\" width=\"500\" height=\"400\" \/><figcaption>Janelas 11 (2021)<\/figcaption><\/figure>\n<p>no Mac OS 4:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_mac_os_7.5@2x.png?t=1707256942\" width=\"500\" height=\"120\" \/><figcaption>Sistema 4 (1987)<\/figcaption><\/figure>\n<p>at\u00e9 macOS Sonoma:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_macos_sonoma@2x.png?t=1707256942\" width=\"500\" height=\"300\" \/><figcaption>MacOS Sonoma (2023)<\/figcaption><\/figure>\n<p>Houve uma breve confus\u00e3o at\u00e9 1986, quando a Apple usou ret\u00e2ngulos arredondados em vez de c\u00edrculos:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_mac_os_3@2x.png?t=1707256942\" width=\"500\" height=\"200\" \/><figcaption>Sistema 3 (1986)<\/figcaption><\/figure>\n<p>mas foi rapidamente resolvido.<\/p>\n<p>A quest\u00e3o \u00e9 que todos os principais fornecedores de sistemas operacionais aderem \u00e0 conven\u00e7\u00e3o de que as caixas de sele\u00e7\u00e3o s\u00e3o quadradas e os bot\u00f5es de op\u00e7\u00e3o s\u00e3o redondos.<\/p>\n<p>Ent\u00e3o veio a Web.\u00a0E quando digo Web, quero dizer CSS.\u00a0E quando digo CSS, quero dizer Flash e depois JavaScript.<\/p>\n<p>Veja bem, as pessoas na Web acham que as conven\u00e7\u00f5es s\u00e3o chatas.\u00a0Que os controles regulares precisam ser reinventados e redesenhados.\u00a0Eles n\u00e3o acreditam que existam normas.<\/p>\n<p>\u00c9 por isso que \u00e9 comum ver bot\u00f5es de op\u00e7\u00e3o contendo marcas de sele\u00e7\u00e3o:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/twitter@2x.png?t=1707256942\" width=\"500\" height=\"400\" \/><figcaption>Twitter (2024)<\/figcaption><\/figure>\n<p>Ou bot\u00f5es de op\u00e7\u00e3o quadrados:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/radio_yandex_maps@2x.png?t=1707256942\" width=\"700\" height=\"300\" \/><figcaption>Mapas Yandex (2024)<\/figcaption><\/figure>\n<p>Seguindo o exemplo da Web, os aplicativos nativos nos apresentaram caixas de sele\u00e7\u00e3o arredondadas:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/telegram@2x.png?t=1707256942\" width=\"720\" height=\"400\" \/><figcaption>Telegrama para macOS (2024)<\/figcaption><\/figure>\n<p>\u00c0s vezes as pessoas simplesmente n\u00e3o fazem mais distin\u00e7\u00f5es.\u00a0Por exemplo, aqui o primeiro grupo \u00e9 de escolha \u00fanica, enquanto o segundo \u00e9 de m\u00faltipla escolha:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/yandex_maps@2x.png?t=1707256942\" width=\"700\" height=\"600\" \/><figcaption>Mapas Yandex (2024)<\/figcaption><\/figure>\n<p>Ou aqui, uma dessas pesquisas \u00e9 de resposta \u00fanica, outra \u00e9 de resposta m\u00faltipla:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/telegram_polls@2x.png?t=1707256942\" width=\"400\" height=\"580\" \/><figcaption>Telegrama Web (2024)<\/figcaption><\/figure>\n<p>Como as pessoas deveriam saber?<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/scooby@2x.jpg?t=1707256942\" width=\"500\" height=\"682\" \/><\/figure>\n<p>Mas apesar de todo esse caos e tenta\u00e7\u00e3o, os fornecedores de sistemas operacionais sabiam disso.\u00a0At\u00e9 hoje, eles seguem A conven\u00e7\u00e3o: as caixas de sele\u00e7\u00e3o s\u00e3o quadradas, os bot\u00f5es de op\u00e7\u00e3o s\u00e3o redondos.<\/p>\n<p>Talvez tenha feito parte do treinamento interno deles.\u00a0Talvez eles tivessem diretores de arte experientes.\u00a0Talvez tenha sido apenas sorte.\u00a0N\u00e3o sei \u2013 isso realmente n\u00e3o importa \u2013 mas \u2013 de alguma forma \u2013 eles conseguiram seguir a conven\u00e7\u00e3o.<\/p>\n<p>At\u00e9 hoje.<\/p>\n<p>A Apple \u00e9 o primeiro grande fornecedor de sistemas operacionais que abandonou uma tradi\u00e7\u00e3o de quatro d\u00e9cadas.\u00a0Seu novo visionOS \u2013 pela primeira vez na hist\u00f3ria da Apple \u2013 ter\u00e1 caixas de sele\u00e7\u00e3o redondas.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/checkbox_vision@2x.png?t=1707256942\" width=\"650\" height=\"672\" \/><figcaption><a href=\"https:\/\/developer.apple.com\/design\/resources\/#visionos-apps\" target=\"_blank\" rel=\"noopener\">Recursos de design da Apple \u2014 visionOS \u2014 Biblioteca<\/a><\/figcaption><\/figure>\n<p>Como dever\u00edamos cham\u00e1-los?\u00a0Verifica\u00e7\u00f5es de r\u00e1dio?\u00a0Verificar bot\u00f5es?<\/p>\n<p>De qualquer forma, com a trai\u00e7\u00e3o da Apple, acho justo dizer que n\u00e3o h\u00e1 esperan\u00e7a de que esta tradi\u00e7\u00e3o continue.<\/p>\n<p>Portanto, anuncio oficialmente que 2024 ser\u00e1 o ano em que a caixa de sele\u00e7\u00e3o quadrada finalmente morrer\u00e1.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tonsky.me\/blog\/checkbox\/rip@2x.jpg?t=1707256942\" width=\"960\" height=\"600\" \/><\/figure>\n<p>As crian\u00e7as hoje em dia usar\u00e3o um bot\u00e3o de qualquer maneira.<\/p>\n<h1 id=\"credits\">Cr\u00e9ditos<\/h1>\n<p>Recursos usados \u200b\u200bpara preparar esta postagem:<\/p>\n<ul>\n<li><a href=\"https:\/\/www.versionmuseum.com\/\" target=\"_blank\" rel=\"noopener\">Museu da Vers\u00e3o<\/a><\/li>\n<li><a href=\"https:\/\/guidebookgallery.org\/index\" target=\"_blank\" rel=\"noopener\">Guia<\/a><\/li>\n<li><a href=\"https:\/\/512pixels.net\/\" target=\"_blank\" rel=\"noopener\">512 pixels<\/a><\/li>\n<li><a href=\"https:\/\/web.archive.org\/\" target=\"_blank\" rel=\"noopener\">Arquivo da Internet<\/a><\/li>\n<li><a href=\"https:\/\/developer.apple.com\/design\/resources\/\" target=\"_blank\" rel=\"noopener\">Desenvolvedor Apple<\/a><\/li>\n<li><a href=\"https:\/\/ilyabirman.net\/meanwhile\/all\/ui-museum-norton-commander-5-0\/\" target=\"_blank\" rel=\"noopener\">ilyabirman.net<\/a><\/li>\n<\/ul>\n<p>Fonte: <a href=\"https:\/\/tonsky.me\/blog\/checkbox\/\">https:\/\/tonsky.me\/blog\/checkbox\/<\/a><br \/>\nEscrito por @nikitonsky<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Esta \u00e9 uma caixa de sele\u00e7\u00e3o: \u00c9 quadrada, tem uma marca de sele\u00e7\u00e3o dentro e seu diferencial \u00e9 que voc\u00ea pode selecionar qualquer n\u00famero deles ao mesmo tempo: Diferentes sistemas operacionais os renderizaram de maneira diferente durante sua evolu\u00e7\u00e3o: MacOS Sonoma (2023) OS X Mavericks (2013) OS X Leopard (2007) Mac OS 9 (1999) Mac [&hellip;]<\/p>\n<\/p><div class=\"more-link\"><a href=\"https:\/\/ember.com.br\/en\/em-memoria-da-caixa-de-selecao-checkbox\/\" class=\"btn btn-small btn--dark btn-hover-shadow\"><span class=\"text\">Continue Reading<\/span><i class=\"seoicon-right-arrow\"><\/i><\/a><\/div>","protected":false},"author":1,"featured_media":2516,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[639,474,267,268,607],"tags":[],"yst_prominent_words":[],"class_list":["post-2515","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-cultura","category-design","category-ui","category-ux","category-web"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/ember.com.br\/wp-content\/uploads\/2024\/02\/rip-checkbox.jpg","jetpack_sharing_enabled":true,"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/posts\/2515","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/comments?post=2515"}],"version-history":[{"count":3,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/posts\/2515\/revisions"}],"predecessor-version":[{"id":2519,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/posts\/2515\/revisions\/2519"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/media\/2516"}],"wp:attachment":[{"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/media?parent=2515"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/categories?post=2515"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/tags?post=2515"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/ember.com.br\/en\/wp-json\/wp\/v2\/yst_prominent_words?post=2515"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}