{"id":168,"date":"2006-02-03T10:06:56","date_gmt":"2006-02-03T08:06:56","guid":{"rendered":"http:\/\/www.maratz.com\/blog\/archives\/2006\/02\/03\/why-ajax-forms-need-an-explanation\/"},"modified":"2006-04-10T14:35:53","modified_gmt":"2006-04-10T12:35:53","slug":"why-ajax-forms-need-an-explanation","status":"publish","type":"post","link":"http:\/\/www.maratz.com\/blog\/archives\/2006\/02\/03\/why-ajax-forms-need-an-explanation\/","title":{"rendered":"Why AJAX forms need an explanation?"},"content":{"rendered":"<p>Web 2.0 is currently all over the Internet. Web based applications are popping up on a weekly basis. The first contact with the future interface is usually a notification form with AJAX. Predictable or not, it has its\u2019 reasons.<\/p>\n<p>Most of the time, in spreading-the-word phase, an application\u2019s  homepage (teaser page) gives you short and sweet &#8211; a paragraph or two &#8211; overview of what it\u2019s gonna do for you and why it\u2019s cool. And a notification form. Nothing else, nothing more. Subscribe or not. Simple as that.<\/p>\n<p>But lately, I found some of such pages too complicated for a visitor. They require guessing. And therefor they possibly fail.<span style=\"display: block;\"><!--more--><\/span><\/p>\n<h3>The setup<\/h3>\n<p>I could draw a wireframe, but I\u2019ll write it down, intentionally. The main content objects on the page are (by order of appearance):<\/p>\n<ul>\n<li>logotype<\/li>\n<li>notification form<\/li>\n<li>headline and the main copy<\/li>\n<li>send-to-a-friend form<\/li>\n<li>screen shot of the application<\/li>\n<li>more copy about the application<\/li>\n<\/ul>\n<p>The target market here are not technical people, more of general population, but the premise is that they are browsing the internet regularly.<\/p>\n<h3>Possible scenario<\/h3>\n<p>Let\u2019s say Jane Doe is not fond of giving her e-mails on every cool new web service or whatever. She would want to read all about it and then submit for a notification. We are assuming that the application is really cool enough for Jane to eventually subscribe.<\/p>\n<p>Jane remembers that when she hits the submit button, the page reloads and she looses her track about the content areas on the page.<\/p>\n<p>Jane here comes to our pretty cool web site. She sees attractive logo and a nice input field with a button. She tempts to subscribe, but she also sees that there\u2019s some attractive copy text. She\u2019ll read that first. She remembers she subscribed last week on another site and now she has a trouble unsubscribing. She wants to be sure it\u2019s worth it.<\/p>\n<ol>\n<li>Mistake one: the subscription form <em>before<\/em> the main copy.<\/li>\n<\/ol>\n<p>Okay, she reads the main copy and it all sounds great to her. She sees send-to-a-friend form. But she also sees a screen shot. She decides to take a closer look at it, plus, she has no time to wait for a page to reload after the form submission &#8211; the screen shot is much more interesting!<\/p>\n<ol start=\"2\">\n<li>Mistake two: missing explanation about how the page will not reload after the form submission<\/li>\n<li>Mistake three: the form <em>before<\/em> the screen shot.<\/li>\n<\/ol>\n<p>By now, Jane already scrolled page down and saw additional text about the app. She reads some of it, glances down to the bottom and concludes that this application could be handy. But the notification form is already out of her sight and the attractive interface elements disappeared. You are already guessing &#8211; chances are she will leave the page without subscribing.<\/p>\n<ol start=\"4\">\n<li>Mistake four: poor exit point.<\/li>\n<\/ol>\n<h3>What we could do here?<\/h3>\n<p>If she only knew that she wouldn\u2019t wait for a page to reload after she hits the submit button, she\u2019d probably submit both of the forms. I\u2019ll tell you why.<\/p>\n<p><strong>The notice about the super cool functionality could immediately raise her experience to a higher level<\/strong>, which would most possibly raise site\u2019s overall convenience. She\u2019d know that the can expect the same from that application once it\u2019s released.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Don&#8217;t let them guess wrong.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[8],"tags":[],"_links":{"self":[{"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/posts\/168"}],"collection":[{"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/comments?post=168"}],"version-history":[{"count":0,"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/posts\/168\/revisions"}],"wp:attachment":[{"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/media?parent=168"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/categories?post=168"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.maratz.com\/blog\/wp-json\/wp\/v2\/tags?post=168"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}