- General Tips: https://speckyboy.com/10-methods-for-optimizing-your-forms-for-mobile-devices/
- Mobile SEO: https://moz.com/learn/seo/mobile-optimization
- Only show important fields so that people don't have to spend more time filling out the form than they need to
- Top align fields so that the form is suitable for a mobile view
- Design for fat fingers so people aren't penalized for using a smaller device
- Collapse menus and dropdowns so that the form isn't harder to navigate through
- Use predictive text so that the user has to type less
- Use single inputs where possible so that they user has less fields to fill out
- Make submit buttons standout, have meaningful names & possibly 1/3 so it is clear what the user must do and they know how close they are to completing the section
- Add
html <meta name="viewport" content="width=device-width,initial-scale=1">
so the user doesn't accidently zoom the form in such a way that it becomes difficult to read/restore - When opening linkes from a form, notify the user and open them in a new tab so users do not lose their progress
- Track progress (eg. Page 1/3 or 75%) so that the user knows how much further they need to go to complete the form
- Load the form quickly <3s (reduce superfluous assets and ensure images emphasize your point) so the user doesn't get impatient https://mobile1st.com/patience-impatience-curse-load-time-mobile-web-ux/
- Consider using the device's native controls so that the form is accessibility and consistent with the device
- Remove the 300ms delay from form inputs for mobile devices (assuming double taps aren't necessary) so that the form feels more responsive (this often happens automatically when the viewport element has been added to the header)
- Use legible font sizes so that people can read the site: https://developers.google.com/speed/docs/insights/UseLegibleFontSizes