Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Revamp contact and social media links #1477

Open
1 of 15 tasks
huntertur opened this issue Nov 24, 2024 · 5 comments
Open
1 of 15 tasks

Revamp contact and social media links #1477

huntertur opened this issue Nov 24, 2024 · 5 comments
Assignees
@huntertur
Labels
enhancement ui

Comments

@huntertur
Copy link
Contributor

huntertur commented Nov 24, 2024 •
edited
Loading

Capturing a discussion from 2024-11-10 and a discussion from 2024-12-15 in the developer chatroom.

Possible enhancements from discussion

  • Make name/value pair orientations consistent between editor (currently vertical) and profile (currently horizontal).
  • Guard against accidentally swapping names and values.
    • "Some people add them with the site names and values swapped. The labels aren’t totally obvious enough, and it’s possible auto-recognizing URLs and splitting/moving them as they’re entered would help. Also, if the UI does auto-recognize pasted URLs and autofill the corresponding site names, how do we expose that functionality to the user? Putting the URL field first implies this flow, but then how do we support usernames? Do we need to? Predefined fields, like how FA does it, with the option to relabel and add multiples might help." - charmander
  • If a full URL to a recognized service is inserted, extract just the identifier.
    • "The result is cleaner and more trustworthy. This also means stripping tracking parameters, mostly Twitter’s." - charmander
  • Add additional services (at least AO3, Itaku, Mastodon mentioned).
    • Bluesky added in Add Bluesky as a social media site #1439
    • Itaku added in Add Itaku as a social site #1484
    • AO3, Ko-fi, Picarto, Piczel, Telegram, Twitch added in Add more contact sites #1496
    • Mastodon might be an issue. @username@example.com format is preferred to support author metadata (see below), but since anyone can be running any Fediverse software, we likely can't assume this will always map to https://example.com/@username. However, if we require a URL for Fediverse accounts, it might not be possible to always map back to the username-at-domain format.
  • Add rel="me" to outgoing links. (Add rel="me" to profile links #1472)
  • Add Mastodon-recognized author metadata to Weasyl embeds.
    • This seems to involve taking <head> and putting <meta name="fediverse:creator" content="@username@example.com" /> in there. Assorted blog posts suggest this is a new feature added in Mastodon 4.3.

Future goals from discussion

  • Add icons to recognized services.
    • "we do have a set of icons from weasyl3, but that needs discussion." - charmander
    • Getting icons from official sources is preferred.
  • Better present contact links; they are currently small and not prominent.
  • Support bidirectional verification.
    • This could potentially lead to an opt-in "last resort" option for password resets.
  • Detect broken links.
  • "permalinking by user id to avoid impersonation on outdated links"
  • Potentially sync with linktree-like services for use with bidirectional verification?

Additional discussion from WIP redesign

  • Split site names into a site type and optional label.
    • Users can currently list the same service multiple times, but if they want to disambiguate the accounts in the site name field (such as main account and after-dark account), they'll have to replace the username with a whole link since Weasyl will no longer recognize the site.
    • charmander's proposal: [ Bluesky 🔽 ] [ ✏ label ]
  • Replace existing <datalist> + list with a combobox-style dropdown.
    • Talked about showing site icons next to each entry.
    • "the dropdown could be a third-party component, but try to pick a lightweight modern (popover) one with good accessibility characteristics and progressive enhancement if you do. I’m not aware of any; last time I needed to do something like this was with Select2, which is jQuery-based and not a good fit for what we want." - charmander
  • Live preview, with the potential to be a good place to put eventual link validation/verification.
@asonix
Copy link

asonix commented Nov 24, 2024

For fediverse @username@domain handles you can likely look up the proper URL via webfinger to the provided domain

@huntertur huntertur mentioned this issue Dec 1, 2024
Merged
@huntertur
Copy link
Contributor Author

Current thoughts on how to show icons and labels on the profile page:

image

@huntertur
Copy link
Contributor Author

Trying out color:

image

@charmander
Copy link
Contributor

Should people be able to set the order of their contact links? (Not as part of the current set of changes, but in the future.)

@huntertur
Copy link
Contributor Author

I think that is a good future goal. On the production website I currently have a "_Personal Website" contact link with the underscore in front so it shows up first.

@huntertur huntertur mentioned this issue Dec 27, 2024
Open
@huntertur huntertur self-assigned this Dec 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@huntertur huntertur

Labels
enhancement ui
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@charmander @asonix @huntertur