April, 2019 | Chris Aldrich

Reflections on WordCamp Santa Clarita Valley 2019

I really had a grand time at WordCamp Santa Clarita Valley yesterday. I’d like to thank the visionary Joe Simpson, Jr. and his entire group of fantastic organizers and kind volunteers for putting the entire thing together. I couldn’t imagine a better launch for a brand new camp.

College of the Canyons was a fantastic location for the camp and even had some excellent outdoor patio and dining space for lunch.

I do wish I’d been able to make my schedule work out to have been able to attend on Friday. I’m particularly bummed that I didn’t get to see Glenn Zucman’s presentation as he’s always doing some of the most interesting and creative things with WordPress. I’ll wait patiently for WordPress.tv to deliver it for me.

Some of my favorite highlights:

David Nuon wearing a blonde Richard Dean Anderson wig during his talk MacGyver plays with blocks: Using the Gutenberg editor in new and surprising ways
Chatting with Kat Christofer of Woo Commerce about how she and the Woo team create better documentation for their product. I think there’s some things we can learn for documenting pieces of the IndieWeb experience with WordPress. She also mentioned the beginning of a new short Mustang road trip.
Joseph Dickson going old school on Upgrading Kubrick for Gutenberg. His highlighting the fact that the editor is able to better mirror the ultimate output as a time saver is an intriguing idea.
Not that they aren’t always in general, and I didn’t think about it until reflecting on it today, but I also want to mention the spectacular diversity of speakers and attendees at the camp. It really made for a better and more well-rounded experience. I’ll give all the credit to Joe and his team who I suspect are directly responsible for designing it to be that way from the very beginning.

On a more personal level, my two favorite parts included: Seeing the viceral reactions of a handful of people as the proverbial light switch was turned on when they realized the power and flexibility of the posting interfaces provided by micropub clients during my talk. There was also a palpable rush at the end while using a few minutes of extra time demoing some examples of my website and and the power of Micropub, Webmention, and backfeed along with some other IndieWeb goodness. I’ve already had a number of people following up with additional questions, conversations, and emails.

For those who may have missed them, here is a link to my slides from the Micropub and WordPress talk and a link to some of the bigger pieces I’ve wrtitten about with respect to WordPress and IndieWeb technologies in the past. Naturally, these are only a supplement to the hundreds of others who are working in and documenting the space.

I’ll also give a special thanks to Joseph Dickson for the photo/tweet of me just before the talk:

Micropub Rocks! With @ChrisAldrich @wordcampscv #WCSCV learning about “Micropub and WordPress: Custom Posting Applications” pic.twitter.com/MQnOTFFkWY

— Joseph Dickson (@joe4ska) April 6, 2019

The metal and glass edifice framed by the blue sky of the Santa Clarita Valley

Dr. Dianne G. Van Hook University Center on the campus of College of the Canyons

Tables and chairs in foreground with campers chatting in middle ground and the impressive glass wall of the center in the background

Inside the Hook University Center where WordCamp Santa Clarita Valley 2019 was held

Clear signage directs pedestrians to WordCamp Santa Clarita at Hook University Center

My name tag as a speaker at WordCamp Santa Clarita Valley

The afterparty for WordCamp Santa Clarita was held at Draconum in Newhall

Long picnic tables and red umbrellas provided some great ambience with the sun shining brightly in the late afternoon

WordCampers from Santa Clarita gathering on the outdoor patio at Draconum

A selfie by Chris Aldrich with other campers in the background — Hanging out with old friends and new after WordCamp on the patio at Draconum.
Joseph Dixon, Erik Blair

Following Association for Learning Technology

Followed Association for Learning Technology (alt.ac.uk)

The Association for Learning Technology (ALT) represents individual and organisational Members from all sectors and parts of the UK. Our Membership includes practitioners, researchers and policy makers with an interest in Learning Technology. Our community grows more diverse as Learning Technology has become recognised as a fundamental part of learning, teaching and assessment.

Our charitable objective is "to advance education through increasing, exploring and disseminating knowledge in the field of Learning Technology for the benefit of the general public". We have led professionalisation in Learning Technology since 1993.

How we define Learning Technology

We define Learning Technology as the broad range of communication, information and related technologies that can be used to support learning, teaching and assessment. Our community is made up of people who are actively involved in understanding, managing, researching, supporting or enabling learning with the use of Learning Technology. We believe that you don't need to be called 'Learning Technologist' to be one.

What we value and what we do

Our current strategy sets out our aims for 2017-2020:

Increasing the impact of Learning Technology for the wider community, strengthening recognition and representation for the Membership at a national level and leading professionalisation for individual Learning Technology professionals in a broad range of roles.

You can explore the strategy slides, download the full text in PDF or Google docs. Visual content is available on Flickr.

Ideas for IndieWeb-ifying Hypothes.is

I use Hypothes.is regularly as part of my daily workflow. I’m also very interested in being able to “own” the data I generate with the tool and being able to keep it on my own digital commonplace book (aka website). As part of this, I’d like to be able to receive notifications from people publicly annotating, highlighting, and replying to my content and potentially display those directly on either my website in the comments section or as marginalia.

I’d promised to do a quick outline for the kind gang at Hypothes.is to outline how to make their product could be a bit more open and support some additional web standards to make it more IndieWeb friendly as well as to work toward supporting the Webmention protocol to send notifications of annotations on a page. A few weeks ago at IndieWebCamp New Haven I decided to finally sketch out some of the pieces which should be relatively easy for them to implement into the product. Below are some of the recommendations and some examples of what needs to be done to implement them into their platform to allow it to better interact with other content on the web. This post is in reply to a few prior conversations about Webmention, but primarily pertains to Microformats which will help in creating those. ^{[1] [2] [3] [4]}

Overview

To my knowledge Hypothes.is generates a hash for each annotation it has in the system and generates two separate, but related URLs for them. As an example, here are the two URLs for a response Jon Udell made on my website recently:

The first URL is where a stand-alone copy of the annotation lives on the web, separate from the content it is related to. The second URL resolves to the page on which the annotation was made and both will automatically open up Hypothesis’ side drawer UI to the annotation in question and will–on most browsers–auto-scroll down the page to show the point at which the annotation was made. Essentially this second URL shows the annotation in-situ in conjunction with the Hypothes.is user interface. I’ll note that they can also have some human readable trailing data in the URL that indicates the site on which the annotation was made like so: https://hyp.is/_tLJyA-cEemE-qPndyfQow/boffosocko.com/?p=55708991. However, in practice, one could remove or replace the boffosocko.com and trailing portion with any other URL and the correct page will still resolve.

It is great that they make the first URL available with the relevant data. This in itself is very IndieWeb friendly to have each annotation in the system have its own stand-alone URL. Sadly all the data on this particular page seems to be rendered using JavaScript rather than being raw HTML. (See also js;dr.) This makes the page human readable, but makes it much more difficult for machines to read or parse these pages. I’d recommend three simple things to make Hypothes.is more (Indie)Web friendly:

Render the annotation on the first URL example in full HTML instead of JavaScript;
Add the appropriate microformats classes on those pages;
Add the canonical URL for the page on which the annotation is in reference to either instead of or in addition to the Hypothes.is prefixed URL which already appears on these pages. Webmention functioning properly will require this canonical URL to exist on the page to be able to send notifications and have them be received properly.

These things would make these pages more easily and usefully parseable on the open web. If/when Hypothes.is may support Webmention (aka web notifications) then all of these prerequisite pieces will already be in place. In the erstwhile, even without Hypothes.is running code to support sending Webmentions, users could force manual Webmentions using services like Telegraph, mention-tech.appspot, or even personal endpoints generated on individual posts (see the one below) or on custom endpoint pages like mine on WordPress. Aaron Parecki’s article Sending your First Webmention from Scratch is a useful tutorial for those with little experience with Microformats or Webmention.

Types of Annotations and Microformats Markup

To my knowledge there are three distinct types of annotations that might occur which may need slightly different microformats mark up depending on the type. These are:

Unassigned page notes (or sometimes orphaned page notes): For all intents and purposes are the equivalent of bookmarks (and are used this way by many) though they go by a different name within the service.
Highlights of particular passages: In IndieWeb parlance, these are roughly equivalent to quotations of content.
Highlights and annotations of particular passages: In IndieWeb terms these again are quotes of content which also have what might be considered a reply or comment to that segment of quoted text. Alternately the annotation itself might be considered a note related to what was highlighted, but I suspect from a UI and semantic viewpoint, treating these as replies is probably more apropos in the majority of cases.

Each of these can obviously have one or more potential tags as well. Some of the examples below include the p-category microformats for how these would logically appear. Using the example URL above and several others for the other cases, I’ll provide some example HTML with proper microformats classes to make doing the mark up easier. I’ve created some minimal versions of text and mark up, though Hypothes.is obviously includes much more HTML (and a variety of divs for CSS purposes. While some of the mark up is a bit wonky, particularly with respect to adding the hyp.is and the original posts’ canonical URLs, it could be somewhat better with some additional reworking of the presentation, but I wanted to change as little as possible of their present UI. For the minimal examples, I’ve stripped out the native Hypothes.is classes and only included the semantic microformats. Because microformats are only meant for semantic mark up, the developers should keep in mind it is good practice NOT to use these classes for CSS styling.

Page note with no annotations (bookmarks)

Example from https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow (but without the annotation portion)


<div class="h-entry">
    <a class="p-author h-card" href="https://hypothes.is/users/judell">judell</a>
    Public on <https://hyp.is/_tLJyA-cEemE-qPndyfQow/boffosocko.com/?p=55708991>"Chris Aldrich on the IndieWeb"</a> (<a class="u-bookmark-of" href="https://boffosocko.com/?p=55708991">boffosocko.com</a>)
    <time class="dt-published" datetime="2019-01-11 18:052:00" title="Friday, Jan 11, 2019, 6:52 PM"><a href="https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow" target="_blank" rel="noopener">Jan 11</a></time>
    
<div class="p-category">tag-name1</div>
 
<div class="p-category">tag-name2</div>
 
<div class="p-category">tag-name3</div>
</div>

Page note with an annotation

(aka a reply, but could alternately be marked up as above as a bookmark) Example from https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow


<div class="h-entry">
    <a class="p-author h-card" href="https://hypothes.is/users/judell">judell</a>
    Public on <https://hyp.is/_tLJyA-cEemE-qPndyfQow/boffosocko.com/?p=55708991>"Chris Aldrich on the IndieWeb"</a> (<a class="u-in-reply-to" href="https://boffosocko.com/?p=55708991">boffosocko.com</a>)
    <time class="dt-published" datetime="2019-01-11 18:052:00" title="Friday, Jan 11, 2019, 6:52 PM"><a href="https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow" target="_blank" rel="noopener">Jan 11</a></time>
    
<div class="e-content">
        
<p>This is web thinking in action.</p>
<p>https://blog.jonudell.net/2011/01/24/seven-ways-to-think-like-the-web/</p>
<p>Well done!</p>

    </div>

    
<div class="p-category">tag-name</div>
</div>

Highlights (aka quotes)

Example from https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow


<div class="h-entry">
    <a class="p-author h-card" href="https://hypothes.is/users/judell">judell</a>
    Public on <a href="https://hyp.is/gBZPQucmEeaPBQvYzSRo-Q/www.theatlantic.com/magazine/archive/1945/07/as-we-may-think/303881/">"As We May Think"</a> (<a class="u-quotation-of h-cite" href="https://www.theatlantic.com/magazine/archive/1945/07/as-we-may-think/303881/">www.theatlantic.com</a>)
    <time class="dt-published" datetime="2017-04-30 08:40:00" title="Sunday, Apr 30, 2017, 08:40 AM"><a href="https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow" target="_blank" rel="noopener">Apr 30, 2017</a></time>
    
<blockquote>First he runs through an encyclopedia, finds an interesting but sketchy article, leaves it projected. Next, in a history, he finds another pertinent item, and ties the two together.</blockquote>

    
<div class="p-category">IAnnotate2017</div>
</div>

Annotations (replies)

Example from https://hypothes.is/a/9JrX5lf9RraeLKKn9WwmMQ


<div class="h-entry">
    <a class="p-author h-card" href="https://hypothes.is/users/jeremydean">jeremydean</a>
    Public on <a href="https://hyp.is/9JrX5lf9RraeLKKn9WwmMQ/www.theatlantic.com/magazine/archive/1945/07/as-we-may-think/303881/">"As We May Think"</a> (<a class="u-in-reply-to" href="https://www.theatlantic.com/magazine/archive/1945/07/as-we-may-think/303881/">www.theatlantic.com</a>)
    <time class="dt-published" datetime="2015-09-02 15:11:00" title="Wednesday, Sep 2, 2015, 03:11 PM"><a href="https://hypothes.is/a/_tLJyA-cEemE-qPndyfQow" target="_blank" rel="noopener">Sep 2, 2015</a></time>
    
<blockquote class="p-in-reply-to h-cite">This has not been a scientist's war; it has been a war in which all have had a part.
<blockquote>
    
   
<div class="e-content">
        
<p>It kind of blows me mind that the end of WWII is the context for these early dreams of the Internet. Is it the hope experienced in patriotic collaboration toward technological innovation? That's what Bush seems to acknowledge explicitly. It's a techno-militaristic union that haunts us to this day (#prism). But I wonder too if it's the precarious of knowledge, or perhaps the destructiveness of knowledge, that also inspires Bush…</p>

    </div>

    
<div class="p-category">tag-name</div>
</div>

I’ll also note that there’s the potential of a reply on Hypothes.is to a prior reply to a canonical URL source. In that case it could be either marked up as a reply to the “parent” on Hypothesis and/or a reply to the canonical source URL, or even both so that webmentions could be sent further upstream. (My experience in this is more limited, not having dealt with it personally in the past.) Once these pieces are implemented, they can be tested against a variety of microformats parsers to ensure they’re outputting the correct (and properly nested) information. I often find that pin13 is a pretty solid modern and up-to-date choice for this.

Additional resources with examples

I’ll also leave the caveat here, that while I’ve got a stronger grasp of Microformats than the average bear, that the above examples may have some subtle quirks that others may catch or which could be improved upon. I find that the Microformats web chat can be a good source for helps from some of the world’s best experts in the area. (Other methods for engaging in chat via IRC, Slack, etc. can be utilized as well.)

If Dan, Jon, or any of the gang has questions about any of this, I’m happy to chat via phone, video conference, or other to help get them going.

👓 The Death of an Adjunct | The Atlantic

Read The Death of an Adjunct (The Atlantic)

Thea Hunter was a promising, brilliant scholar. And then she got trapped in academia’s permanent underclass.