Open RassanGrant opened 6 years ago
Hi, @RassanGrant I just filled out the Contact Us form on mobile to test it out. Here are my initial thoughts:
Let me know if you want me to spend some time addressing any of these.
Hey Vicky – Do you know if the autofill settings on our forms on as current as we can be? I want to make sure people can quickly and easily autofill their data.
From: Vicky Leong notifications@github.com<mailto:notifications@github.com> Reply-To: "Norstone/norstone.github.io" reply@reply.github.com<mailto:reply@reply.github.com> Date: Monday, March 5, 2018 at 9:05 AM To: "Norstone/norstone.github.io" norstone.github.io@noreply.github.com<mailto:norstone.github.io@noreply.github.com> Cc: Rassan Grant Rassan@norstoneusa.com<mailto:Rassan@norstoneusa.com>, Mention mention@noreply.github.com<mailto:mention@noreply.github.com> Subject: Re: [Norstone/norstone.github.io] Mobile Form - Contact Us - Autofill Settings (#259)
Hi, @RassanGranthttps://github.com/rassangrant I just filled out the Contact Us form on mobile to test it out. Here are my initial thoughts:
Let me know if you want me to spend some time addressing any of these.
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/Norstone/norstone.github.io/issues/259#issuecomment-370429106, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ARjj3QFXoNKxYAbqaaOKKKyV2rMruvOFks5tbUY7gaJpZM4SbKyZ.
@RassanGrant Is there any other form on the site? I browse the website but could only found the contact form.
As far as I know there are only contact and project registration forms and both have no autofill.
For the checkboxes and the radio buttons, I'm thinking of something simple: adjusting the layouts and the sizes. Is it okay if I spend 20-30 minutes on that?
For the name, how beneficial is it to have them as separate piece of data? I'm always leaning to "Full Name" by default for mobile and desktop.
Hey Vicky -
Forms are on: Contact Us, How To Buy, and Project Registration. We do have forms on some old landing pages, like this onehttps://www.norstoneusa.com/natural-stone-veneer-solutions/, but that is not a part of the scope of this project.
As far as autofill is concerned – Do you know how to implement it?
You are approved to work on the check boxes and radios, thanks Vicky
From: Vicky Leong notifications@github.com<mailto:notifications@github.com> Reply-To: "Norstone/norstone.github.io" reply@reply.github.com<mailto:reply@reply.github.com> Date: Tuesday, March 6, 2018 at 9:19 PM To: "Norstone/norstone.github.io" norstone.github.io@noreply.github.com<mailto:norstone.github.io@noreply.github.com> Cc: Rassan Grant Rassan@norstoneusa.com<mailto:Rassan@norstoneusa.com>, Mention mention@noreply.github.com<mailto:mention@noreply.github.com> Subject: Re: [Norstone/norstone.github.io] Mobile Form - Contact Us - Autofill Settings (#259)
@RassanGranthttps://github.com/rassangrant Is there any other form on the site? I browse the website but could only found the contact form.
As far as I know there are only contact and project registration forms and both have no autofill.
For the checkboxes and the radio buttons, I'm thinking of something simple: adjusting the layouts and the sizes. Is it okay if I spend 20-30 minutes on that?
For the name, how beneficial is it to have them as separate piece of data? I'm always leaning to "Full Name" by default for mobile and desktop.
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/Norstone/norstone.github.io/issues/259#issuecomment-370999561, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ARjj3ZIp90q5TPaG6skIjqsiBPsLHnkSks5tb0PMgaJpZM4SbKyZ.
@RassanGrant, I'll work on those radio buttons.
Could you clarify what you mean by autofill? I just want to make sure we're on the same page.
Hi Vicky -
I am fairly certain this all boils down to labels, which may already be set up properly, but in any case I’m asking if you can review to ensure we are complying with the latest best practices. Here’s an older article covering labels: https://developers.google.com/web/updates/2015/06/checkout-faster-with-autofill
Here is an article with more information, please scroll down to the section that says “Choose the best input type” and read on from there: https://developers.google.com/web/fundamentals/design-and-ux/input/forms/
Ultimately I’m looking for all data entries from mobile devices to be eligible for auto populating. Perhaps we are already optimized but wanted to check. Thanks!
From: Vicky Leong notifications@github.com<mailto:notifications@github.com> Reply-To: "Norstone/norstone.github.io" reply@reply.github.com<mailto:reply@reply.github.com> Date: Thursday, March 8, 2018 at 10:11 PM To: "Norstone/norstone.github.io" norstone.github.io@noreply.github.com<mailto:norstone.github.io@noreply.github.com> Cc: Rassan Grant Rassan@norstoneusa.com<mailto:Rassan@norstoneusa.com>, Mention mention@noreply.github.com<mailto:mention@noreply.github.com> Subject: Re: [Norstone/norstone.github.io] Mobile Form - Contact Us - Autofill Settings (#259)
@RassanGranthttps://github.com/rassangrant, I'll work on those radio buttons.
Could you clarify what you mean by autofill? I just want to make sure we're on the same page.
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/Norstone/norstone.github.io/issues/259#issuecomment-371700068, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ARjj3VtV7xIA9hLDFpeZgd8lEAQLVC2gks5tcfLFgaJpZM4SbKyZ.
@RassanGrant Thank you for the articles. I watched Ido's tutorial on forms a while back. If you look at the open PR #260, you'll see that I put labels there so that user can click on the label to check the box instead on the actual box itself. Just a slight improvement on UX.
There are certainly other things in the form that I can re-examine in light of the articles you posted. Let me get back to you on that. In the mean time, why don't you check out the adjust-contact-form
branch and see if you like the way I arrange the checkboxes and radio button?
@RassanGrant I put in a few things in the contact form:
required
flag on required input elements.autocomplete
attributes on some input elements.type
on some input elements.Because those features are for HTML5, users with modern web browsers that support it will get the benefit. Users that don't will have the experience as it is right now.
For the Autofill, users would have to have compatible browsers, enable the feature, and "teach" it how to autofill. https://www.computerhope.com/issues/ch001377.htm
I've been using the contact form as the prototype. Once you're happy, I'll apply the same things to the other forms.
Thanks @vleong2332 - I went ahead and merged this, it looks great. Couple of quick questions:
Thanks, @vleong2332!
@RassanGrant
Let me know what you think.
Vicky - Do you know if our form has the most up to date autofill technology in it? I want to ensure that we've done everything we can on the technical side to make sure mobile phone users have an easy time filling out our form. Let me know how we're looking and/or if you have ideas for improving it. Thanks!