Civic Signals started when we asked ourselves what healthy societies need from digital spaces — not just in terms of harms, but in terms of the public goods they provide. Over the last year, we have been engaging experts across a wide variety of disciplines and doing research to understand what makes “public-friendly” spaces, well, public-friendly — what common characteristics (civic signals) are shared by the spaces that valorize the collective, and that are designed for the greater public good.
We think this matters both because these ideas could inform the design of existing digital platforms, but also perhaps more importantly because they could help inspire and shape the new platforms that will rise up in the years to come.
Tomorrow at 12 PM Eastern/ 9 AM Pacific I’ll be be hosting a Connected Courses discussion that will explore the IndieWeb movement as a people-centered response to the corporate web. How do core IndieWeb principles such as owning your content, remaining better connected, and redefining control online intersect with the values of connected learning? Take a bit of time tomorrow and join myself, Mikhail Gershovich, Ben Werdmuller, Erin Jo Richey, and Simon Thomson to find out more.
I particularly love how they all underline the humanity that should and does underlie the web. This is certainly a classic for the area of IndieWeb and education. I’m not sure how I hadn’t seen this before.
[Withknown is] the posterchild of the IndieWeb.
— Jim Groom
I’ll agree that it is pretty darn awesome!
Some slight rephrasings from Ben in the video that I thought were spot on:
IndieWeb: allowing people to connect online without caring about what platforms or services they’re using.
IndieWeb puts the learner first. The LMS, which primarily serves an administrative function, should not be the center of the process.
I’m not sure why I had never manually done the fix before, but I’ve had issues12 with the Syndication Links plugin showing icons for the reading.am service and my old chrisaldrich.wordpress.com site, which I primarily use as a pseudo-mirror/backup to my primary site. I figured there had to be a way to force them in instead of relying on the set up to process the links and show something. Reading.am doesn’t work because there isn’t an svg available for it and though there’s a WordPress icon, the plugin’s parser doesn’t seem to be able to recognize the subdomain properly.
Within the code at class-syn-link-domain-icon-map.php, I added the following two lines to the obvious spot in the list within the code to fix the icon issues I was having:
I then reuploaded the edited file to my server. Essentially I’m hard-coding the domain name and the default icon I’d like to have the plugin display.
If the plugin is updated, I’ll obviously have to manually add them again, but the disappearance of the icons again will be pretty obvious and this post will document the necessary changes.
Although upon tweaking this I’m noticing that the reading.am icon isn’t working (I also tried ‘website’ instead of ‘book’ but that didn’t work either). Perhaps the .am tld is causing an issue? Alas…
I suspect that there’s some other bug hiding in the works as one or both of the two types of links above should default to the generic ‘website’ icon when a syndication link exists, but the system isn’t able to specify a particular icon. There may be some small if/else bug hiding in the logic of the plugin.
Man, I fucking love when I come back to Twitter or Instagram after a while, and I'm deep in the feed, and I start reading where I left off, and BAM! — full refresh; scrolled to the top.
No chance to finish a thought, no gentle ascension — just straight whiplash. Feels good.
Encourage users to retweet or share a post based on whether a Tweet already exists for your blog post.
This reminds me that I had done a portion of this sort of work for my site a while back as a proof of concept and particularly with relation to Threaded conversations between WordPress and Twitter. I had meant to finish the sketch and turn it into a WordPress plugin or possibly roll it up into the Syndication Links plugin. Perhaps that makes sense as I’m already using it to show where I’ve syndicated copies of my content and it will contain the appropriate tweet ID data. Similar UI could be added for content sent to Flickr, Instagram, and Mastodon presuming the provide similar actions. Perhaps this will be a mini project I can circle back around to during the pending holidays?
I love how Sia has implemented it on her static Eleventy site where she’s kept the UI nice and clean. I particularly like the way she’s done the design and layout and made it more like a call to action.
To take the Twitter actions a half-step further, she could URL wrap the word “liked” with the like action on Twitter.
In general, this reminds me a lot of the idea of webactions, though I don’t think that many have been experimenting with them as of late. Perhaps it’s because of the growth of Microsub-based feed readers that have built-in Micropub support?
This morning, after reading a brief, but interesting snippet in the IndieWeb WordPress chat from last night, David Shanske made me think about an old itch I had to have a quicker and more stripped down posting interface for notes on my website. I immediately thought of WordPress’s P2 and 02 themes/products which had a built-in simple posting interface reminiscent of Twitter’s UI.
Not wanting to wait to see what David might come up with before the next couple of IndieWebCamps, I thought I’d at least do some research to see what was hiding in the good old WordPress repository. I found a few old plugins that were roughly the sort of idea I was looking for, but they were last maintained about 8-10 years ago.
Apparently the plugin itself had an early simple start before the developer came across Jon Smajda’s plugin Posthaste which was apparently repurposed for the Prologue/P2 code that WordPress used for that product/theme. He’s since rewritten a large chunk of it based on Posthaste’s original code and added in some basic formatting options and the ability to add media, so one can post a quick note along with a photo.
Settings for the plugin are hiding in Settings << Writing admin interface (or at the path /wp-admin/options-writing.php on your website) which includes the ability to choose which pages to display the “widget” and allowing one to hide the title, tags, categories, draft seclector, one’s Gravatar, and the Greeting and Links. I’d personally pare my version down to just provide tags, categories, and the draft options to keep the interface as clean as possible.
Finally the developer notes that within the user interface “if you leave the ‘Category:’ box at its default setting it posts to your default category. However… If you have a category named ‘asides’, it will put posts with empty titles into the ‘asides’ category even if you do not explicitly specify the ‘asides’ category in the dropdown. You can then style them as asides.”
This is the view of the posting interface on my site after paring it down to my personal bare minimum.
Benefits
I’ve already discussed some of the immediate benefits for easily and quickly posting directly from my own website. Just below I’ll add a few others.
Most importantly for me at the moment, the plugin works with the Classic Editor in WordPress. The interface also only shows up when one is logged into their website, so visitors won’t ever see it.
Titleless posts
The plugin automatically takes the first 40 characters of your note and posts that into the title field, so you don’t have to bother with it. Sadly, this means that feed readers and other services will take your status updates and give them a title. (Though in the wild, most feed readers do something like this anyway. I am hearing strong rumors that Inoreader is about to have better support for social media-like posts soon.) For those using the plugin for IndieWeb use and prefer to keep their notes/asides/status updates titleless, you can spelunk into the code pretty easily and make a quick change which the developer kindly documents in his support page:
But, if you want to modify the title character limit it is easy to do.
Go to this plugin’s folder and open the narwhal-microblog.php file.
In this file you will see a line for this max character limit and you will see the number 40. You could just increase it to something like 100, 3500, or 999999. Depending on how long you are willing to let your titles get.
In my case, I think I’ll just decrease the character limit to 0 and then rely on the Post Kinds plugin to add it’s customary pseudo-title to the admin interface on my back end so that I can distinguish my posts in the posts pages.
UI suggestions
The category chooser could be a little cleaner and provide a dropdown of all my pre-existing categories with the ability to select multiple ones. I suspect that somewhere in the WordPress universe there’s a way to do this even if it means swiping a snippet of code from core’s editor.
The basic text box for entering text could be a bit smaller on the page to accept 2-4 lines of text since it’s meant for short posts. As it stands now, it defaults to 10, but it also smartly already has a slider that appears when you type more than the available number of lines and it also has a handle in the corner to allow you to increase the boxes size.
I’ve mentioned doing natively titleless notes above, but to make things a bit more user friendly, it would be nice to have the ability in the settings page to enter a number for the text excerpt, so that users could configure it without needing code. I suspect that most in the IndieWeb space would set the title excerpt to zero so as to not have titles on their notes.
It will take me some time to dig into it, but it would be nice if the developer had some notes about the CSS classes used in the plugin so that one might more easily style the display of the output on one’s website. Fortunately the defaults to match one’s current theme seem relatively solid.
At present, there isn’t any UI for including syndication targets to external services like Twitter, Mastodon, etc. It would be nice if there was some tie into syndication services or functionality like that provided with Syndication Links plugin and brid.gy publish or brid.gy fed if those pieces are present.
The last dovetail that would be nice to have, particularly within an IndieWeb framing, would be to have better direct integration of this plugin with the Post Kinds plugin. This could extend to auto-setting the post kind to “note”, which should in turn allow the automatic setting of Post Formats to either “status” or “aside”.
Summary
In sum, this plugin is really fantastic for allowing a simple and lightweight means of posting quick status updates or notes to one’s WordPress website! It’s the next best thing to using any of the variety of Micropub clients, particularly when you already happen to be at your own site.
I suspect this plugin is the sort of thing that many within the IndieWeb and WordPress communities will love using–and at least one person in the chat has already said they think it’s a great find. There are currently less than 10 active installations of the plugin, but I think it deserves a magnitude or more. Let’s see what we can do about that!
For a long time I’ve been consuming the majority of my Twitter feed within various feed readers. My most frequent feed reader is Inoreader, though I’ve been experimenting with and using some IndieWeb influenced microsub-based feed readers for quite a while.
Earlier today I thought I’d try out Inoreader’s Twitter integration and subscribe to some of my twitter lists using that instead of importing feeds directly from outside services. (I’ve been a big fan of using Ryan Barrett’s Twitter-Atom and related tools.) One of the things that had always bothered me about third party RSS feeds into most feed readers is that the author of the post is in such tiny text and there is no avatar indicator of who wrote the post. As a result I’m stuck spending a lot more cognitive load trying to discern the author of a tweet before or after reading it. It just boils down to less than optimal user interface.
Fortunately Inoreader seems to have a slightly better method for doing this (since they control the user interface and are presumably using the Twitter API). Within their reader, Tweets look a tad bit more standard with respect to the usual Twitter client and include an avatar and the name of the author in larger font. Sadly, though they have control over the UI, they’re still including a bolded version of the the text of the tweet as a title and thereby needlessly duplicating some of the content. It would be far better for notes, status updates and other content that typically doesn’t have (or need) a title if they would simply just leave it out. They could then use the extra space to have a larger font for reading the short status update. In fact, most of the IndieWeb-based feeds I read in Inoreader have these unnecessary titles included which typically not only look bad from a UI perspective, but they again needlessly duplicate content I don’t need.
Below I’m including screenshots of the two different methods of reading Tweets via Inoreader. I’m also including a screenshot of how Tweets look like in Monocle when fed in via the same Atom feed that was used in the Inoreader case. In Monocle’s version, it’s got a nice larger and easier to discern author name, but it too is missing the author photo (or avatar), in part because the feed doesn’t include it as a default. I suspect that if the feed included it, Monocle would display it properly though the Inoreader version probably wouldn’t. The Monocle version also includes a copy of the photo in the Tweet twice because the feed adds it in a second time as an enclosure.
UI example of a tweet within Inoreader using their native Twitter support.UI example of a tweet within Inoreader imported using a third party RSS-based client.
UI example of a tweet within Monocle imported using a third party RSS-based client.
For completeness, I’m including the text of the Atom feed for this particular tweet so that we can see what is or isn’t being included in the Inoreader and Monocle versions.
<entry>
<author>
<activity:object-type>http://activitystrea.ms/schema/1.0/person</activity:object-type>
<uri>https://twitter.com/BigHistoryPro</uri>
<name>Big History Project</name>
</author>
<activity:object-type>http://activitystrea.ms/schema/1.0/note</activity:object-type>
<id>https://twitter.com/BigHistoryPro/status/1195385992728985600</id>
<title>In an ideal world, you’d have 1-on-1 time with every student to discuss every...</title>
<content type="xhtml">
<div xmlns="http://www.w3.org/1999/xhtml">
In an ideal world, you’d have 1-on-1 time with every student to discuss every aspect of every writing assignment. With BHP score, you come close. <br />
<a href="https://bh-p.co/2N1xopV">bh-p.co/2N1xopV</a>
<p>
<a class="link" href="https://twitter.com/BigHistoryPro/status/1195385992728985600">
<img class="u-photo" src="https://pbs.twimg.com/media/EJbdObjXkAQ6QNw.jpg" alt="" />
</a>
</p>
</div>
</content>
<link rel="alternate" type="text/html" href="https://twitter.com/BigHistoryPro/status/1195385992728985600" />
<link rel="ostatus:conversation" href="https://twitter.com/BigHistoryPro/status/1195385992728985600" />
<link rel="ostatus:attention" href="https://bh-p.co/2N1xopV" />
<link rel="mentioned" href="https://bh-p.co/2N1xopV" /> <activity:verb>http://activitystrea.ms/schema/1.0/post</activity:verb>
<published>2019-11-15T17:00:04+00:00</published>
<updated>2019-11-15T17:00:04+00:00</updated>
<link rel="self" type="application/atom+xml" href="https://twitter.com/BigHistoryPro/status/1195385992728985600" />
<link rel="enclosure" href="https://pbs.twimg.com/media/EJbdObjXkAQ6QNw.jpg" type="image/jpeg" />
</entry>
In sum, I generally like the UI of the Inoreader version, though they could still do with removing the redundant and unnecessary title. The Monocle version is likely the best, but I’d need to find a feed method that also includes the avatar to have a better representation of the original Tweet. Even with these differences, I think I tend to prefer Monocle at the end of the day because it also automatically includes Micropub functionality which means that I can post my reactions (likes, reposts, or comments) directly to my website and syndicate copies directly to Twitter. (This is also in consideration of my previously having set up some separate functionality for forcing Inoreader to allow me to post some of this same sort of data to my website by other means.)
Has anyone found better/prettier or more useful ways of consuming Twitter in third party means while allowing one to own their data?
The best part of using RSS is that you see all the news, unfiltered and sorted exactly chronologically without a smart “AI” messing with your data and deciding what to feed you.
It is, however, useful sometimes to have the power to sort through thousands of articles and see the most interesting ...
I was looking into adding some navigation links to my post feed/archive pages, when I ran into an old confusion of mine. The Web has a completely messed up arrow of time!
I read quite a bit of material online. I save “bookmarks” of all of it on my personal website, sometimes with some additional notes and sometimes even with more explicit annotations. One of the things I feel like I’m missing from my browser, browser extensions, and/or social feed reader is a social layer overlay that could indicate that people in my social network(s) have read or interacted directly with that page (presuming they make that data openly available.)
One of the things I’d love to see pop up out of the discovery explorations of the IndieWeb or some of the social readers in the space is the ability to uncover some of this social reading information. Toward this end I thought I’d collect some user interface examples of things that border on this sort of data to make the brainstorming and building of such functionality easier in the near future.
If I’m missing useful examples or you’d like to add additional thoughts, please feel free to comment below.
Examples of social reading user interface for discovery
Google
I don’t often search for reading material directly, but Google has a related bit of UI indicating that I’ve visited a website before. I sort of wish it had the ability to surface the fact that I’ve previously read or bookmarked an article or provided data about people in my social network who’ve done similarly within the browser interface for a particular article (without the search.) If a browser could use data from my personal website in the background to indicate that I’ve interacted with it before (and provide those links, notes, etc.), that would be awesome!
Screen capture for Google search of Kevin Marks with a highlight indicating that I’ve visited his page several times in the past. Given the March 2017 date, it’s obvious that the screen shot is from a browser and account I don’t use often.
I’ll note here that because of the way I bookmark or post reads on my own website, my site often ranks reasonably well for those things.
On a search for an article by Aaron Parecki, my own post indicating that I’ve read it in the past ranks second right under the original.
In some cases, others who are posting about those things (reading, commenting, bookmarking, liking, etc.) in my social network also show up in these sorts of searches. How cool would it be to have a social reader that could display this sort of social data based on people it knows I’m following?
A search for a great article by Matthias Ott shows that both I and several of my friends (indicated by red arrows superimposed on the search query) have read, bookmarked, or commented on it too.
Hypothes.is
Hypothes.is is a great open source highlighting, annotation, and bookmarking tool with a browser extension that shows an indicator of how many annotations appear on the page. In my experience, higher numbers often indicate some interesting and engaging material. I do wish that it had a follower/following model that could indicate my social sphere has annotated a page. I also wouldn’t mind if their extension “bug” in the browser bar had another indicator in the other corner to indicate that I had previously annotated a page!
Screen capture of Vannevar Bush’s article As We May Think in The Atlantic with a Hypothes.is browser extension bug indicating that there are 329 annotations on the page.
Reading.am
It doesn’t do it until after-the-fact, but Reading.am has a pop up overlay through its browser extension. It adds me to the list of people who’ve read an article, but it also indicates others in the network and those I’m following who have also read it (sometimes along with annotations about their thoughts).
What I wouldn’t give to see that pop up in the corner before I’ve read it!
Reading.am’s social layer creates a yellow colored pop up list in the upper right of the browser indicating who else has read the article as well as showing some of their notes on it. Unfortunately it doesn’t pop up until after you’ve marked the item as read.
Nuzzel
Nuzzel is one of my favorite tools. I input my Twitter account as well as some custom lists and it surfaces articles that people in my Twitter network have been tweeting about. As a result, it’s one of the best discovery tools out there for solid longer form content. Rarely do I read content coming out of Nuzzel and feel robbed. Because of how it works, it’s automatically showing those people in my network and some of what they’ve thought about it. I love this contextualization.
Nuzzel’s interface shows the title and an excerpt of an article and also includes the avatars, names, network, and commentary of one’s friends that interacted with the piece. In this example it’s relatively obvious that one reader influenced several others who retweeted it because of her.
Goodreads
Naturally sites for much longer form content will use social network data about interest, reviews, and interaction to a much greater extent since there is a larger investment of time involved. Thus social signaling can be more valuable in this context. A great example here is of Goodreads which shows me those in my network who are interested in reading a particular book or who have written reviews or given ratings.
A slightly excerpted/modified screen capture of the Goodreads page for Melanie Mitchell’s book Complexity that indicates several in my social network are also interested in reading it.
Are there other examples I’m missing? Are you aware of similar discovery related tools for reading that leverage social network data?
César Hidalgo has a radical suggestion for fixing our broken political system: automate it! In this provocative talk, he outlines a bold idea to bypass politicians by empowering citizens to create personalized AI representatives that participate directly in democratic decisions. Explore a new way to make collective decisions and expand your understanding of democracy.
“It’s not a communication problem, it’s a cognitive bandwidth problem.”—César Hidalgo
He’s definitely right about the second part, but it’s also a communication problem because most of political speech is nuanced toward the side of untruths and covering up facts and potential outcomes to represent the outcome the speaker wants. There’s also far too much of our leaders saying “Do as I say (and attempt to legislate) and not as I do.” Examples include things like legislators working to actively take away things like abortion or condemn those who are LGBTQ when they actively do those things for themselves or their families or live out those lifestyles in secret.
“One of the reasons why we use Democracy so little may be because Democracy has a very bad user interface and if we improve the user interface of democracy we might be able to use it more.”—César Hidalgo
This is an interesting idea, but definitely has many pitfalls with respect to how we know AI systems currently work. We’d definitely need to start small with simpler problems and build our way up to the more complex. However, even then, I’m not so sure that the complexity issues could ultimately be overcome. On it’s face it sounds like he’s relying too much on the old “clockwork” viewpoint of phyiscs, though I know that obviously isn’t (or couldn’t be) his personal viewpoint. There’s a lot more pathways for this to become a weapon of math destruction currently than the utopian tool he’s envisioning.
This is a ridiculous thing. It came into my head the other day and it amused at least a few of my children . . . once I explained what Snarf was.
I plan to make ridiculous things more often. I initially had it up on...
Content Warning (Earworm: Baby Shark)
This does make me wonder if Ryan Barrett’s website name is related? It would have been in his formative youth (circa 1985) in a nascent pre-web era. Do tell…
Incidentally Tom’s example here is another good reason for Why IndieWeb–one needn’t rely on a silo’s algorithm which may remove content for copyright violations even when it was done with fair use and/or satire in mind.
It’s also been a while since I’ve seen someone with a site that had a Trackback/Pingback URL box on their website like Tom does. Very cool and similar to the Webmention box on my own.
Hosting my own content and comments allows me to be a bit more creative with it. So I decided to take this a step further and have a little fun with negative comments.
This isn’t intended to be a hot-take on Comic Sans. Instead it’s meant to change the tone of the negativity to make it sound like a clown is yelling at a kid’s birthday party.
This is an awesome way to handle some comments online.
Jim Groom from bavatuesdays
Matt Baer (Twitter)
Sia Karamalegos (sia.codes)
Reply
Repost
Like
Kartik Prabhu (kartikprabhu.com)
Tom Woodward (bionicteaching.com)
Zach Leatherman (Zach Leatherman)