User-specific profile page settings fields don't have help text/placeholders
Problem to solve
The edit user profile page does not have help text under several of the editable fields, such as linkedin or twitter. It is unclear whether the user should enter http:// prefix or not.
Further details
These fields don't explain how the input text is handled. Does Gitlab automatically add the service's prefix, such as http://twitter.com/ to whatever username has been entered, or should the user enter a fully qualified URL such as http://twitter.com/girifox?
- skype
- website
- location
- organization
This is a small issue, but equally small to fix. It creates a small wrinkle for new users, because they need to edit/save/view to see if results are as intended, then edit to fix.
Proposal
Fixing this can be done with a boring solution of simply adding explanatory text under each field. More complicated solutions are of course possible, like a JavaScript input validation, but I don't believe they're necessary.
So I'd propose we add text like below, under each relevant entry field:
field | help text |
---|---|
skype | just your Skype username |
just the one word of your Linkedin profile name, from linkedin.com/in/{profilename}, not a URL | |
just your twitter @ handle, not a URL | |
website | fully qualified URL of the website to show on your profile |
location | where in the world you are based |
organization | who you represent or work for |
Solution
Changes required:
- Help text should always be styled as
secondary
. - Limit the width of the
email
,public email
,commit email
,preferred language
,location
, andwebsite
to320px
from our predefined input field widths. - Limit the width of the
Skype
,Twitter
,LinkedIn
, andOrganization
to240px
from our predefined widths. - add the 'username' placeholder to the Skype intput field
- add the '@username' placeholder to the Twitter input field
- add the 'website.com' placeholder to the Website input field. URLs without http:// or https:// work so we should make that clear.
- add the 'City, country' placeholder to the Location input field.
- add help text 'Your LinkedIn profile name from linkedin.com/in/profilename' below the LinkedIn input field.
- add help text 'Who you represent or work for.' below the Organization input field.
Notes
UX user onboarding Relevant team members I believe @matejlatin @akaemmerle