My IndieWebCamp Austin 2020 Projects

I often come into an IndieWebCamp without a specific project in mind. Sometimes I will get inspired by the discussions. If not, I always have a list of things to tweak on my site; or improvements to indiebookclub, indiewebify.me, or other indieweb tools.

I have recently been working on updating my page header and the main content area. I launched this on my photos page just before the event and today I applied that to the notes page as well. Some things I am really liking about these updates:

• Better responsive design. The header is wider on desktop, with the navigation beside the logo. There’s a medium-size breakpoint where the navigation slips under the logo so they can all still appear on the page. Then there’s a smaller breakpoint where the navigation is hidden and replaced with an open/close toggle.
• The open/close toggle on the smaller size does not require javascript! It uses the CSS :target pseudo-class selector, so clicking different anchor links shows or hides the navigation. I got that idea from this Shellcreeper tutorial.
• The main content area is still optimized for text lines about 70-characters long, which is good for readability. However, I wanted the option to make photos wider on larger screens. I pieced together something from various sources so the photos can break out of the main content area and be up to 960 pixels wide. This is best seen on the photos page. Notice the caption text is narrower under each photo. I think this will look really cool in blog posts that include a striking image.
• On smaller screens, those images are now full-bleed. No left/right margins.

In a session yesterday we were talking about local communities and discovering content by region, e.g. “show me all the meetups around San Diego.” As a starting point, I was thinking that microsub servers could parse feeds for location information and use that to suggest feeds near your location. I don’t work on a microsub server myself and that’s too big a project for me today, but I was able to easily add location to my homepage if anyone wants to parse it. I used the h-geo microformat.