{"id":2256,"date":"2013-10-24T01:24:55","date_gmt":"2013-10-24T00:24:55","guid":{"rendered":"http:\/\/blog.bitassa.cat\/?p=2256"},"modified":"2021-04-24T14:41:23","modified_gmt":"2021-04-24T12:41:23","slug":"version-movil-para-meneame","status":"publish","type":"post","link":"https:\/\/blog.benjami.cat\/es\/arxiu\/2013\/10\/24\/2256\/","title":{"rendered":"Experimentando con la versi\u00f3n m\u00f3vil para Men\u00e9ame"},"content":{"rendered":"<figure id=\"attachment_2286\" aria-describedby=\"caption-attachment-2286\" style=\"width: 350px\" class=\"wp-caption alignright\"><a ref=\"magnificPopup\" href=\"http:\/\/blog.benjami.cat\/stuff\/Screenshot_2013-10-24-20-46-46.png\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-2286 \" src=\"http:\/\/blog.benjami.cat\/stuff\/Screenshot_2013-10-24-20-46-46.png\" alt=\"Cabecera del Facebook, con el bot\u00f3n de men\u00fa a la izquierda\" width=\"350\" height=\"181\" srcset=\"https:\/\/blog.benjami.cat\/stuff\/Screenshot_2013-10-24-20-46-46.png 350w, https:\/\/blog.benjami.cat\/stuff\/Screenshot_2013-10-24-20-46-46-300x155.png 300w\" sizes=\"auto, (max-width: 350px) 100vw, 350px\" \/><\/a><figcaption id=\"caption-attachment-2286\" class=\"wp-caption-text\">Cabecera del Facebook, con el bot\u00f3n de men\u00fa a la izquierda<\/figcaption><\/figure>\n<p>Es dif\u00edcil trasladar todas las opciones de la cabecera de Men\u00e9ame a la pantalla peque\u00f1a de un m\u00f3vil, y la cabecera es algo muy importante para cualquier lugar web. El caso es que me gusta la forma que tienen en las ultimas aplicaciones para m\u00f3vil; especialmente tras haber eliminado el bot\u00f3n de men\u00fa (el de las tres l\u00edneas) y combinarlo con el logo. Aquel bot\u00f3n se puso de moda, pero pesaba demasiado en un espacio tan peque\u00f1o e importante como la cabecera. Todav\u00eda lo podemos ver en algunas versiones web m\u00f3viles muy conocidas, como Facebook, pero dir\u00eda que tiene los d\u00edas contados: no les qued\u00f3 espacio ni para el logo.<\/p>\n<p>Esta es una primera aproximaci\u00f3n a c\u00f3mo podr\u00eda verse Men\u00e9ame con ese tipo de cabecera:<\/p>\n<figure id=\"attachment_2272\" aria-describedby=\"caption-attachment-2272\" style=\"width: 349px\" class=\"wp-caption aligncenter\"><a ref=\"magnificPopup\" href=\"https:\/\/blog.benjami.cat\/stuff\/mnm_mv_01.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-2272 size-full\" src=\"https:\/\/blog.benjami.cat\/stuff\/mnm_mv_01.png\" alt=\"Portada\" width=\"349\" height=\"545\" srcset=\"https:\/\/blog.benjami.cat\/stuff\/mnm_mv_01.png 349w, https:\/\/blog.benjami.cat\/stuff\/mnm_mv_01-192x300.png 192w, https:\/\/blog.benjami.cat\/stuff\/mnm_mv_01-183x285.png 183w\" sizes=\"auto, (max-width: 349px) 100vw, 349px\" \/><\/a><figcaption id=\"caption-attachment-2272\" class=\"wp-caption-text\">Portada<\/figcaption><\/figure>\n<figure id=\"attachment_2259\" aria-describedby=\"caption-attachment-2259\" style=\"width: 349px\" class=\"wp-caption aligncenter\"><a ref=\"magnificPopup\" href=\"https:\/\/blog.benjami.cat\/stuff\/mnm_mv_02.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-2259 size-full\" src=\"http:\/\/blog.benjami.cat\/stuff\/mnm_mv_02.png\" alt=\"Men\u00fa principal\" width=\"349\" height=\"568\"><\/a><figcaption id=\"caption-attachment-2259\" class=\"wp-caption-text\">Men\u00fa principal<\/figcaption><\/figure>\n<figure id=\"attachment_2257\" aria-describedby=\"caption-attachment-2257\" style=\"width: 349px\" class=\"wp-caption aligncenter\"><a ref=\"magnificPopup\" href=\"https:\/\/blog.benjami.cat\/stuff\/mnm_mv_03.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-2257 size-full\" src=\"http:\/\/blog.benjami.cat\/stuff\/mnm_mv_03.png\" alt=\"Men\u00fa del usuario\" width=\"349\" height=\"568\"><\/a><figcaption id=\"caption-attachment-2257\" class=\"wp-caption-text\">Men\u00fa del usuario<\/figcaption><\/figure>\n<p>Usar el logo para el men\u00fa supone cambios importantes: al est\u00e1ndar web <em>\u00abel logo lleva a la portada\u00bb<\/em>, en el m\u00f3vil se transforma en <em>\u00abel logo abre el men\u00fa\u00bb<\/em>. \u00bfC\u00f3mo iremos a la portada? Muchos la colocan como una entrada m\u00e1s en el men\u00fa, y as\u00ed tambi\u00e9n lo hice para que no sea in\u00fatil un <em>tap<\/em> en el logo con la intenci\u00f3n de ir a la portada; pero en nuestro caso tambi\u00e9n se puede hacer <em>tap<\/em> en la palabra \u00abmen\u00e9ame\u00bb que est\u00e1 en el centro de la cabecera.<\/p>\n<p>En producci\u00f3n har\u00eda falta m\u00e1s aire entre las entradas de los men\u00fas, aunque con esa separaci\u00f3n caben todas en la mayor\u00eda de pantallas, y quiz\u00e1s es suficiente para no apuntar mal al hacer los <em>tap<\/em> en el men\u00fa.<\/p>\n<p>En los m\u00f3viles tienes menos espacio pero necesitas m\u00e1s aire; me gusta que haya aire, y por eso prefiero los dise\u00f1os para m\u00f3viles y tabletas.<\/p>\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Es dif\u00edcil trasladar todas las opciones de la cabecera de Men\u00e9ame a la pantalla peque\u00f1a de un m\u00f3vil, y la cabecera es algo muy importante para cualquier lugar web. El caso es que me gusta la forma que tienen en las ultimas aplicaciones para m\u00f3vil; especialmente tras haber eliminado el bot\u00f3n de men\u00fa (el de&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":"","_links_to":"","_links_to_target":""},"categories":[304,305],"tags":[357,1505],"class_list":["post-2256","post","type-post","status-publish","format-standard","hentry","category-meneame-net","category-diseno","tag-responsivo-ca","tag-tableta"],"acf":[],"_links":{"self":[{"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/posts\/2256","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/comments?post=2256"}],"version-history":[{"count":3,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/posts\/2256\/revisions"}],"predecessor-version":[{"id":9199,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/posts\/2256\/revisions\/9199"}],"wp:attachment":[{"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/media?parent=2256"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/categories?post=2256"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.benjami.cat\/es\/wp-json\/wp\/v2\/tags?post=2256"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}