0

I believe this question is quite similar to What are the best practices for tooltips on mobile websites?, but this question is more specific (only focus on form fields) and to go deeper in how to show the same information in desktop and mobile version.

I'm thinking of a solution similar to this jQuery example: enter image description here

But this solution doesn't fit into mobile devices. And probably this is not a good solution for desktop version.

So my first question is: Is this a good way to show extra information on form fields?

If so, what is the best way to make it compatible with mobile devices?

Thanks a lot!

2
  • Use tool tips instead. whenever user focuses on any input show tool tip. position tool tip be below form input avoid the current position hence it will look ok in mobile also.
    – prazor9
    Commented Feb 13, 2017 at 10:37
  • Thank you @prazor9 for your response. Do yo think the best position is below inputs? Thinking in mobile devices, I do not know if this position on this devices could hide and could be a little annoying. Commented Feb 14, 2017 at 11:36

1 Answer 1

1

I believe a good answer to this is on this article https://www.nngroup.com/articles/form-design-placeholders/ and using this solution:

enter image description here

Basically you add an hint directly below the label, where clear indication is given to the user and no additional scripting is added.

9
  • Thank you very much @joao-carvalho for your response. I think is the best cross-compatible solution and probably the cleanest. Commented Feb 14, 2017 at 11:28
  • However, imagines you need to put a tooltip, because is a must of the application, do you think is a good solution to put next to the field and to open this tooltip you press it (with the mouse pointer or touching it in a mobile device) and press it once again to close? Commented Feb 14, 2017 at 11:32
  • @MiguelÁngelGarcíaGómez when is a tooltip a "must of the application"? Can you share an example? Commented Feb 14, 2017 at 12:00
  • Oh sorry, I'll try to explain myself. What I'm saying with "must of the application" is a requirement from the customer. In the question there is an edit showing this new situation. Commented Feb 14, 2017 at 12:31
  • As my reputation is not enough to put more links on the original question, I put here: Another approach is using a tooltip nex to header of form, something similar to this: i68.tinypic.com/o6i650.jpg Commented Feb 14, 2017 at 12:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.