hashtags
This article is a stub. You can help the IndieWeb wiki by expanding it.
hashtags are the use of the hash "#" symbol followed immediately by a word/phrase/abbreviation to explicitly denote a topic inline in a post. Popularized on Twitter, they're now everpresent on Instagram and other silos where they link to aggregations of posts inside those silos with those tags.
This page is specifically about hashtags the specific concept, how to implement, examples on sites. For related pages, see:
- Category:hashtags — for notable IndieWeb related hashtags documented on the wiki
- tags — for the general concept of tags and tagging content
- tag page — for the page displayed when you click on a hashtag
- tags page — a page showing all the tags used by a particular person / profile
How to
Markup
Mark up hashtags inside an h-entry
with p-category
.
Also use rel=tag
on hashtag links that apply to an entire page.
Discovery
How do we discover indieweb posts tagged with a particular tag? It’s a problem well suited to centralised hubs.
IndieWeb Examples
Aaron Parecki
Aaron Parecki uses p3k on aaronparecki.com to auto-link hashtags on his posts to his own tag aggregation page since 2013-03-08.
Barnaby Walters
Barnaby Walters uses Taproot on waterpigs.co.uk to auto-link to a /tags page containing a list of links to content which is tagged with that tag (as per hypermedia API design, example) since 2012-09-22. This probably needs some js/iframe goodness to pull that content in --Waterpigs.co.uk 05:57, 19 April 2013 (PDT)
Tantek
Tantek Çelik has published automatically marked up hashtags since 2016-01-26, and autolinked hashtags since 2023-080 (backdated implementation for all posts in 2023 and later).
- http://tantek.com/2016/002/t2/change-clothing-inspired-tomorrowland
- https://tantek.com/2023/081/t1/mozfest-making-fediverse-socialweb first post after implementing auto-linked hashtags
Implementation notes:
- initial (non-linked) regex used:
/(^|\s)#([\w\:\.\/\-]){1,139}/
Jamie Tanna
Jamie Tanna uses hashtags in his posts to tags on the post itself, so it can be used to categorise his content more easily. This has the added benefit of owning Twitter-specific interactions if using a certain hashtag. Since 2020-01-13, see a recent example with auto-linked hashtags
Jamie has written about this more at https://www.jvt.me/posts/2021/12/08/owning-hashtags/
gRegor Morrill
gRegor Morrill uses hashtags with p-category
microformats on articles since 2019-11-01. They are not currently linked to a tag aggregation page for similar posts.
Note in the markup the # is outside the p-category: #<span class="p-category">nablopomo</span>
Sometime in late 2022 I started displaying hashtags similarly on notes. A recent example:
Add yourself!
Add yourself here… (see this for more details)
FAQ
Autolinking hashtags
Where should hashtags in posts be auto-linked to?
Link them to a page on your site which aggregates posts tagged with that tag. It’s fine for this to just redirect to, for example, a google search of your site for that tag, but by always linking to a URL you control you can improve it/self-host it later.
Blog Aggregators
There are some blog aggregators that show posts from other sites with a particular hashtag.
- Dev.to, e.g.
Silo Examples
Silos that support (hash)tag aggregation on their own content.
Flickr
Flickr - photos (and videos, but they don't play on tag aggregation pages, so effectively they're just images as well - poster-images from videos), e.g.:
Twitter - notes (with embedded media), e.g.
Tumblr
Tumblr - Tumblr has an amazing display of heterogeneous post types in a single tag aggregation grid., e.g. Tubmlr's /tagged/ path shows a tag grid of the following post types: photo, including animated GIFs, video, note, quote, post with embedded media (photo or video), at least partially displayed by default
Previously
- Delicious was well known for tagged links
Limitations
It appears that most platforms/silos limit hashtags to:
- _a-zA-Z0-9 characters
- Twitter, max length 139 (since Tweet length is 140)
- Twitter max promoted trend (hashtag) is 20.[1]
- most sites disallow hashtags that are just numbers (exception: Instagram allows them)
- some sites disallow hashtags that start with numbers (exception: Twitter near the end of 2009 started supporting hashtags that start with numbers per the increased frequency of use, e.g. #2009resolution.)
See also:
Brainstorming
person tag in plain text
Regex
Check out Twitter's regex: https://github.com/twitter/twitter-text/blob/master/js/twitter-text.js#L135-L141
The following are a coarse approximations which will miss numerous international (non-English) hashtags.
/#[_a-zA-Z0-9]{1,139}/
is a regex that will match common hashtags per the #Limitations documented above, while liberally allowing numbers-only and numbers-starting hashtags, limited to hashtags that will fit on Twitter./#\w{1,139}/
is shorter./(^|\s)#([\w\:\.\/\-]){1,139}/
is what Tantek Çelik is using in Falcon.
more characters
Tantek Çelik I have use-cases for more characters than the "usual" / Twitter’s regex. E.g. (from https://github.com/w3c/csswg-drafts/labels?page=1&sort=name-asc)
- ' ': "Needs Thought" (will use "__" for ' ' per Falcon#tags_with_spaces as noted below)
- '-': "css-ui"
- '/': "unknown/future spec"
hashtags for tags with spaces
Examples:
- Many WordPress blogs have categories with spaces in them.
- Feed Validator doc of category element has
<category>Grateful Dead</category>
example
So having a way for hashtags to link to categories with spaces is desirable
- Tantek Çelik: some thoughts here for now: Falcon#tags_with_spaces
- Leaning towards "__" (double underscore = space)
Accessibility
Consider capitalizing the first letter of each word in your hashtags because screen readers will announce each word separately.
"Did you know that when you capitalize the first letter of each word in your hashtag, it's easier for everyone to read?
Screen readers will announce each word separately.
Compare #MakeItEasyToRead to #makeiteasytoread #SocialMedia #accessibility"
"This is your random reminder that capitalizing each word in a hashtag means screen-readers can parse the words correctly for sight-impaired Tweeps.
#AccessibilityIsPrettyCool"
- Idea: have your CMS (semi?) automatically help you auto-capitalize the words in hashtags to help with accessibility/readability
IndieWeb-centric hashtags
Some hashtags commonly used by the IndieWeb community:
- #IndieWeb (naturally)
- #IndieWebCamp
- #ownyourdata
- #NewwwYear
- #LetsFixThis
See Also
- tags
- building blocks
- posts
- microformats
- FAQ: https://twitter.com/jjdelc/status/1104808804217163776
- "Where is the best place to universally link to content matching a #hashtag? To Twitter's results? To Instagram? To some aggregator that'll die next year? #indieweb https://jj.isgeek.net/2019/03/10-181838/" @jjdelc March 10, 2019
- 2019-12-08 Hashtag Steganography
- https://adactio.com/notes/14469
- Criticism for moderation challenges: "I said it then and I'll say it now. The better solution is groups - which we've supported in one form or another since about 2010. You can eject bad actors from a group. You cannot eject bad actors from a hashtag." macgirvin.com March 14, 2023
- Brainstorming: Needs a spec for how to federate, across any kind of system, regardless of transport (e.g. ActivityPub, Webmention).
- How should hashtags be detected/discovered by a hosting site (e.g. in a reply-context, comments display, repost, quote post, online social reader), including both in plain text, and hashtag links?
- When should a receiving site replace the hashtag link in content displayed from elsewhere with a local-to-the-site hashtag link?
- See also: https://github.com/swicg/general/issues/6
- ^ Possibly of some historical interest / background for Mastodon’s hashtag federation implementation: https://web.archive.org/web/20170716044005/https://mastodon.social/users/Gargron/updates/3288643
- "@cwebber i had another concern: OStatus URIs of the type tag:example.com;12345;foobar are not represented in ActivityPub, but present in Mastodon. How to avoid duplicates between things Mastodon sees via AP vs what it sees via OStatus?" @Eugen June 19, 2017
- ^ prior art: INFORMATIONAL (not standard) RFC: https://www.rfc-editor.org/rfc/rfc4151 for a "tag:" scheme. Possibly useful for extracting/re-using concept/structure (though likely not overall syntax).
- Encouragement to use personal websites with hashtags and at-mentions: https://personal-web.org/
- History: 2007-08-26 Template:chrismessina: mockup of Twitter UI showing popular hashtags as channels: https://www.flickr.com/photos/factoryjoe/1236839235/
- History proposal as groups: 2007-08-25 Template:chrismessina: Groups for Twitter; or A Proposal for Twitter Tag Channels