{"id":22601,"date":"2017-01-02T15:02:24","date_gmt":"2017-01-02T14:02:24","guid":{"rendered":"http:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/"},"modified":"2017-01-02T15:02:24","modified_gmt":"2017-01-02T14:02:24","slug":"ux-ottimizzare-uninterfaccia-mobile-per-lusabilita","status":"publish","type":"post","link":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/","title":{"rendered":"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0"},"content":{"rendered":"<p> <br \/>\n<\/p>\n<div readability=\"47.522965350524\">\n<article readability=\"37\">\n<p><strong>Liquido non significa Responsive<\/strong><br \/>L\u2019interfaccia mobile non dovrebbe essere il semplice adeguamento in termini di dimensioni dello display rispetto al sito web pensato per il desktop. Progettare un\u2019interfaccia responsive implica ripensare ad un interfaccia anche compiutamente diversa a seconda delle dimensioni dello display, spesso anche a scapito di alcune funzionalit\u00e0 a vantaggio di altre di maggiore interesse per l\u2019fruitore mobile.<\/p>\n<p><strong>Utilizzo con una mano sola<\/strong><br \/>Per rendere maggiormente accessibile un\u2019interfaccia dobbiamo immaginarne l\u2019utilizzo dal dispositivo con una mano sola. I bottoni principali dovrebbero essere posizionati nei punti dello display accessibili dal pollice. Posizionare un bottone in alto a sinistra \u00e8 sicuramente di pi\u00f9 scomodo accesso.<\/p>\n<p><strong>Schermate separate per funzionalit\u00e0<\/strong><br \/>Mentre su un sito desktop \u00e8 pensabile avere una serie di funzionalit\u00e0 su una singola pagina sul mobile lo spazio \u00e8 molto ristretto. Il suggerimento \u00e8 di pensare a <strong>schermate separate per singola funzionalit\u00e0<\/strong>.<\/p>\n<p><strong>Senza bisogno di avvertimenti<\/strong><br \/>Gli elementi presenti sullo display non dovrebbero essere mai nascosti o visualizzati solo in determinate condizioni. L\u2019interfaccia di accesso deve essere semplice e intuibile da parte dell\u2019fruitore. Mostrare elementi solo in particolari condizioni, o mostrare elementi in punti diversi fa s\u00ec che l\u2019fruitore non se lo aspetti disturbando di fatto l\u2019esperienza.<\/p>\n<p><strong>Push Notification<\/strong><br \/>Bombardare l\u2019fruitore di Push Notification ottiene come risultato la disattivazione delle stesse. Dare contezza a quest\u2019ultimo di quale saranno le notifiche che ricever\u00e0, magari consentendo la scelta relativa alla tipologia, invoglier\u00e0 l\u2019fruitore ad abilitarle.<\/p>\n<p><strong>Richiesta di permessi<\/strong><br \/>Anticipare le richieste di permessi del sistema operativo con una spiegazione di come questi saranno usati dalla nostra applicazione aumenta la probabilit\u00e0 che l\u2019fruitore le accetti.<\/p>\n<p><strong>Riempire le attese<\/strong><br \/>Lasciare l\u2019fruitore con un loader durante le operazioni di caricamento aumenta le probabilit\u00e0 di abbandono. Spiegare cosa sta succedendo dietro le quinte, ovvero mostrare quanto tempo \u00e8 necessario  aspettare, consente di avere la percezione di maggiore velocit\u00e0 e robustezza.<\/p>\n<p>&#13;<br \/>\n          <!--div class=\"sharelink\">\n              \n\n<ul>\n                  \n\n<li class=\"facebook\"><a href=\"#\" onclick=\"window.open( 'https:\/\/www.facebook.com\/sharer\/sharer.php?u='+encodeURIComponent('http:\/\/blog.html.it\/02\/01\/2017\/come-progettare-uninterfaccia-mobile\/'),'condividi l'articolo su facebook', 'width=626,height=436,location=no,directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no'); return false;\">Facebook<\/a><\/li>\n\n\n                  \n\n<li class=\"twitter\"><a href=\"#\" onclick=\"window.open( 'https:\/\/twitter.com\/share?url=http%3A%2F%2Fblog.html.it%2F02%2F01%2F2017%2Fcome-progettare-uninterfaccia-mobile%2F&via=html_it&text=UX%3A%20ottimizzare%20un%27interfaccia%20mobile%20per%20l%27usabilit%C3%A0','condividi l'articolo su twitter', 'width=626,height=436,location=no,directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no'); return false;\">Twitter<\/a><\/li>\n\n\n              <\/ul>\n\n\n          <\/div-->&#13;<br \/>\n          &#13;<br \/>\n\t\t<\/article>\n<div readability=\"5.3392857142857\">\n            <!--\n\n<style>\n\n.newletter-item, .newsletter-box \n  \/*float: left;\n  margin: 5px 0 20px 0;*\/\n  display: block;\n  width: 100%;\n\n\n.newletter-item, .newsletter-box p \n    font-size: 18px;\n    letter-spacing: 0.3px;\n    line-height: 28px;\n    padding: 0 0 34px 0;\n    color: #161616;\n    font-family: 'Alegreya', serif;\n\n\n.newletter-item, .newsletter-box p span \n  font-weight: bold;\n\n\n.newsletter-box img\n    width: 48px;\n    height: auto;\n    margin: 0 auto 34px auto;\n\n\n.newsletter-panel \n  display: block;\n  width: auto;\n  height: 129px;\n  background: url(http:\/\/www.html.it\/wp-content\/themes\/www.html.it\/images\/newsletter\/newsletter-bg.png) no-repeat;\n  position: relative;\n  left: 0px;\n\n.newsletter-panel form \n  margin: 0;\n\n.newsletter-panel .line-item \n  display: block;\n  float: left;\n  margin: 0 0 0 20px;\n  display: block;\n  width: 408px;\n\n.newsletter-panel input \n  float: left;\n  display: block;\n\n.newsletter-panel input[type=\"text\"] \n  margin: 20px 0 10px 20px;\n  width: 395px;\n  height: 26px;\n  line-height: 26px;\n  padding: 2px;\n\n.newsletter-panel input[type=\"radio\"] \n  margin: 6px 3px 0 0;\n\n.newsletter-panel label.radio-item \n  float: left;\n  display: block;\n  font-size: 1em;\n  width: 10px;\n  margin: 6px 10px 0 0;\n\n.newsletter-panel .lable-text \n  display: block;\n  float: left;\n  width: 240px;\n  font-size: 10px !important;\n  color: #333333 !important;\n  line-height: 130%;\n  margin: 6px 0 0 0px !important;\n\n.newsletter-panel .lable-text a \n  color: #333\n\n.newsletter-panel input[type=\"button\"] \n  position: relative;\n  top: -50px;\n  left: 64px;\n  width: 127px;\n  height: 47px;\n  background: url(http:\/\/www.html.it\/wp-content\/themes\/www.html.it\/images\/newsletter\/newsletter-butt.png) no-repeat;\n  background-repeat: no-repeat;\n  border: 0;\n  cursor: pointer;\n\n.newsletter-panel input[type=\"button\"]:hover \n  background-image: url(http:\/\/www.html.it\/wp-content\/themes\/www.html.it\/images\/newsletter\/newsletter-butt-roll.png);\n\n.newsletter-panel label.radio-item \n  font-size: 10px !important;\n\n.error-newsletter\npadding: 10px 20px;\n\n<\/style>\n\n--><\/p>\n<div id=\"newsletter_div\" class=\"newletter-item nav-txt newsletter-box\" readability=\"6.5714285714286\">\n<p>Se vuoi aggiornamenti su <b>UX: ottimizzare un&#8217;interfaccia mobile per l&#8217;usabilit\u00e0<\/b> inserisci la tua e-mail nel box qui sotto:<\/p>\n<\/div><\/div><\/div>\n<p><br \/>\n<br \/><a href=\"http:\/\/feedproxy.google.com\/~r\/htmlitedit\/~3\/A93ldN74C6Q\/\">Source link <\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Liquido non significa ResponsiveL\u2019interfaccia mobile non dovrebbe essere il semplice adeguamento in termini di dimensioni dello display rispetto al sito web pensato per il desktop. Progettare un\u2019interfaccia responsive implica ripensare ad un interfaccia anche compiutamente diversa a seconda delle dimensioni dello display, spesso anche a scapito di alcune funzionalit\u00e0 a vantaggio di altre di maggiore&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_s2mail":""},"categories":[37],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.13 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy\" \/>\n<meta property=\"og:description\" content=\"Liquido non significa ResponsiveL\u2019interfaccia mobile non dovrebbe essere il semplice adeguamento in termini di dimensioni dello display rispetto al sito web pensato per il desktop. Progettare un\u2019interfaccia responsive implica ripensare ad un interfaccia anche compiutamente diversa a seconda delle dimensioni dello display, spesso anche a scapito di alcune funzionalit\u00e0 a vantaggio di altre di maggiore...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Agency Italia Web Designer realizzazione siti web Italy\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-02T14:02:24+00:00\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/\",\"url\":\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/\",\"name\":\"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy\",\"isPartOf\":{\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/#website\"},\"datePublished\":\"2017-01-02T14:02:24+00:00\",\"dateModified\":\"2017-01-02T14:02:24+00:00\",\"author\":{\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.multimediaweb.eu\/web-agency\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/#website\",\"url\":\"https:\/\/www.multimediaweb.eu\/web-agency\/\",\"name\":\"Web Agency Italia Web Designer realizzazione siti web Italy\",\"description\":\"Web design creazione siti web Italia\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.multimediaweb.eu\/web-agency\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"url\":\"https:\/\/www.multimediaweb.eu\/web-agency\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/","og_locale":"it_IT","og_type":"article","og_title":"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy","og_description":"Liquido non significa ResponsiveL\u2019interfaccia mobile non dovrebbe essere il semplice adeguamento in termini di dimensioni dello display rispetto al sito web pensato per il desktop. Progettare un\u2019interfaccia responsive implica ripensare ad un interfaccia anche compiutamente diversa a seconda delle dimensioni dello display, spesso anche a scapito di alcune funzionalit\u00e0 a vantaggio di altre di maggiore...","og_url":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/","og_site_name":"Web Agency Italia Web Designer realizzazione siti web Italy","article_published_time":"2017-01-02T14:02:24+00:00","author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"admin","Tempo di lettura stimato":"2 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/","url":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/","name":"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0 - Web Agency Italia Web Designer realizzazione siti web Italy","isPartOf":{"@id":"https:\/\/www.multimediaweb.eu\/web-agency\/#website"},"datePublished":"2017-01-02T14:02:24+00:00","dateModified":"2017-01-02T14:02:24+00:00","author":{"@id":"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42"},"breadcrumb":{"@id":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.multimediaweb.eu\/web-agency\/ux-ottimizzare-uninterfaccia-mobile-per-lusabilita\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.multimediaweb.eu\/web-agency\/"},{"@type":"ListItem","position":2,"name":"UX: ottimizzare un\u2019interfaccia mobile per l\u2019usabilit\u00e0"}]},{"@type":"WebSite","@id":"https:\/\/www.multimediaweb.eu\/web-agency\/#website","url":"https:\/\/www.multimediaweb.eu\/web-agency\/","name":"Web Agency Italia Web Designer realizzazione siti web Italy","description":"Web design creazione siti web Italia","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.multimediaweb.eu\/web-agency\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"it-IT"},{"@type":"Person","@id":"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42","name":"admin","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.multimediaweb.eu\/web-agency\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g","caption":"admin"},"url":"https:\/\/www.multimediaweb.eu\/web-agency\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/posts\/22601"}],"collection":[{"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/comments?post=22601"}],"version-history":[{"count":1,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/posts\/22601\/revisions"}],"predecessor-version":[{"id":22602,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/posts\/22601\/revisions\/22602"}],"wp:attachment":[{"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/media?parent=22601"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/categories?post=22601"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.multimediaweb.eu\/web-agency\/wp-json\/wp\/v2\/tags?post=22601"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}