March! What a concept, huh?

Bookmarks from March

Web development/tech related content

• ebook all about Animation in Design Systems - by Val Head.
• Creative Coding Essentials - by Tim Rodenbröker.
• A Complete Guide to calc() in CSS - by Chris Coyier.
• Why the web needs to work for women and girls.
• Don’t call it a comeback. I been here for years. - by Cameron Moll.
• Accessible HTML Elements. - by Amber Wilson.
• Playing With Particles Using the Web Animations API. - by Louis Hoebregts.
• Favicons support emojis.
• The Complete AEA DC 2019 Now Online
• Why videos on GOV.UK use the YouTube video player
• Fastest Browser Based WebP Converter
• Let me be your glue. - by Sush Kelly.
• I mentor people, because I want to give them the opportunities I didn’t have. - by Georgie Luhur Cooke.
• Improve Video Accessibility with Captions. - by Gift Egwuenu.
• More accessible defaults, please! - by Hidde de Vries.
• 2020, the year of the interactive blog post. - by John Otander.

Not exactly web development related

• Youtube shortcuts (I haven't tried them myself).
• Education Links - by Andy Bell.
• Help with COVID-19.
• Education Links - by Andy Bell.

Miscellaneous

Funny or cute or happy or uplifting content etc.

• Cats!

Made me think

Content warning: This section might include content that isn't uplifting and happy but rather thoughts that stayed with me.

• A lawsuit that is missremembered.
• Making a living in creative tech.
• What Have I Got to Be Depressed About? - by Robin Craze.
• Upskirting by paparazzi.
• Politics in the United States.
• Google tracked his bike ride past a burglarized home. That made him a suspect. - by Jon Schuppe.

For the last couple of weeks, I’ve been helping out Cheuk and Calum organise IndieWebCamp London and all the excitement has been building up now that we’re approaching the date of the event.

Similar to other IndieWebCamps, we’ll start off the day with breakfast, intros and keynotes followed by planning our day in a BarCamp-like environment.

Everyone is encouraged to bring up topics and participate in the discussions. With a barcamp on day one, we’ll have the second day to build things. At the time of writing, there will be a keynote from Kevin Feeney and the schedule for the weekend is available on the event page.

I attended my first IndieWebCamp in 2018 and I’m pretty stoked to be contributing to a community that means a lot to me. I’m really hoping that at least someone goes home feeling excited about building things for themselves, similar to how I felt.

So, do you have a personal website to work on? Or do you want to start one? There’s still time to register and join us on the 14th of March.

Not convinced?

Further reading:

• Wiki page for the event.
• Event page with registration link and Indie RSVPs.

I didn't realise February was over until today!!!

Bookmarks from February

Web development/tech related content

• a11y.css - by Gaël Poupard.
• We’re Banning Facial Recognition. We’re Missing the Point. - by Bruce Schneier.
• TIL the ruby tag - by Robb Owen.
• Gatsby Starter Book - by Sara Vieira.
• Expressive Design Systems - by Yesenia Perez-Cruz.
• Images with a consistent surface area - by Piper Haywood.
• Pulling data from websites into Google Sheets - by Nick Colley.
• The Ghost of Stagnation - by Alejandra Villa.
• Image masks: Portraits - by Ruth John.
• #16 alt, no wait…, aria-label, no wait…, alt - by Michael "Spell" Spellacy.
• Guerilla design systems. - by Laura Gonzalez.
• Accessibility for Vestibular Disorders: How My Temporary Disability Changed My Perspective - by Facundo Corradini.
• Reading recommendations: Animation on the web and vestibular disorders - by Manuel Matuzović.
• Lesser-known CSS properties in GIFs - by Pavel Laptev.
• A Complete Guide to Links and Buttons - by CSS Tricks.
• What forces layout / reflow - by Paul Irish.
• While You Weren’t Looking, CSS Gradients Got Better - by Ana Tudor.
• Carousel Concepts - by W3C.
• Now you know - by Christopher Neugebauer.
• Keeping it simple with CSS that scales - by Andy Bell.
• font-variant-numeric: tabular-nums - by Sebastian De Deyne.
• Frend - by frend.co.
• Merry-Go-Round - by Estelle Weyl.
• Typographic grid layouts - by Michelle Barker.
• Accordions Are Not Always the Answer for Complex Content on Desktops - by Hoa Loranger.
• Fixed Headers and Jump Links? The Solution is scroll-margin-top - by Chris Coyier.
• Why 543 KB keep me up at night - by Manuel Matuzovic.
• HTML: The Inaccessible Parts - by Dave Rupert.

Not exactly web development related

• Stop Blaming History for Your All-White, All-Male Movie - by Aisha Harris.
• Very Responsive Typography with Variable Fonts - by Mandy Michael.
• Learning from ‘Bad’ Writing - by Dr Lucy Allen-Goss.
• PSA on "unravel thread tools"
• You'll Never See the Iconic Photo of the 'Afghan Girl' the Same Way Again - by Ribhu.
• Being Your Selves: Identity R&D on alt Twitter - by Aaron Z. Lewis.
• Sharing my salary publicly - by Nienke Dekker.
• Filter out male privilege, and the web can be a ghost town - by Mark Wilson.
• Top 10 Pro-tips for Working Remotely - by Carie Fisher.
• We don't need to look real on social media - by Rachel Charlene Lewis.

Miscellaneous

Funny or cute or happy or uplifting content etc.

• They were just trying to help.
• Cool sound.

Made me think

Content warning: This section might include content that isn't uplifting and happy but rather thoughts that stayed with me.

• On Facebook, anti-vaxxers urged a mom not to give her son Tamiflu. He later died. - By Brandy Zadrozny.

Last November I attended FFConf where I saw two talks about performance: one from Anna Migas and another one from Harry Roberts. I instantly memorised one particular thing from each of the talks. From Anna's I took a mental note to add font-display: swap; and from Harry's talk I was amazed that the order inside the head tag impacts performance.

While I learned that last November, last week I finally had the to chance to see the impact of making those changes on a client's website. This website's performance wasn't great but it seems like this was a very recent issue. I remember the same website actually having a decent performance a while back so something must have happened recently.

I decided to do the "quick wins" first and collect data to see if things had improved. I inspected Harry's personal website and tried to reproduce the ordering of the tags in the head along with adding the font-display: swap;. I don't know why I was so surprised when I compared the data and saw that it actually helped. However, it still had some strong hickups and when I was reading the suggestions for improvements from the testers I used, I realised that those issues were coming from third-party code.

This third party code was actually an iframe from a social media/media website and it was recently added at the top of the main page.

The window’s onload event doesn’t fire until all its iframes, and all the resources in these iframes, have fully loaded. In Safari and Chrome, setting the iframe’s SRC dynamically via JavaScript avoids this blocking behavior.

The above quote comes from a blog post written 10 years ago so I had an extra check to make sure it was still accurate. As a result of this, I also came across an experimental API that I wasn't aware of either.

It actually makes sense? I've never thought about it, come across a situation where the content of the iframe was so heavy, or even come across a project that used third party embeds besides YouTube, surprisingly.

So lesson learned I suppose: I will keep this in mind when working on projects especially when they allow content editors to embed from third parties.

Further reading and/or useful resources:

• Priority hints.
• CSS and Network Performance.

The period between 12 and 22, in other words, is the time when you become you. It makes sense, then, that the memories that contribute to this process become uncommonly important throughout the rest of your life. They didn’t just contribute to the development of your self-image; they became part of your self-image—an integral part of your sense of self.

Surely I haven’t been the only one that has come across some memes that mock one’s insistence of only listening to music they used to listen to when they were teenagers?

I have and annoyingly enough, I can relate to them. This is also backed up by some articles that show that I am not the only one. I can almost bet that The Rasmus’s members can pay bills out of me spinning their “Dead Letters” album on Spotify.

It is quite amusing how today, if I am working on something and I need to be focused, I will only listen to the songs that I used to listen to when I was young. All because my brain automatically brings me warm feelings of safety while writing code.

I haven’t been able to brush off the thought that this doesn’t only apply to music. In my case, I think it also applies to certain pieces of clothes that remind me of my tragically unfashionable half emo days, colours and ultimately the Web.

Today’s web development has become the motive of arguments on Twitter with whispers of “back in my day”. I read love letters to the old Web and I also read hints telling “us” to move on.

In the past I’ve spent some time reminiscing about the old Web. However, I couldn’t exactly and gracefully put my nostalgia into words. But it was very similar to listening to the same music album over and over again.

I can argue about how there are concerning things about today’s web development and the centralization of the web but other than that, everything else has been labeled as pure nostalgia. And I wanted to better understand my nostalgia.

My teenage years weren’t amazing but it wasn’t all bad. And whenever I think about them I think about a couple of things only: discovering music and building fan sites. During these years I developed one of my core personality traits: I build websites. It was my only hobby. I would spend hours learning and experimenting without judgement.

My nostalgia comes from the need to feel safe and experiment. I don’t miss not having rounded borders in CSS. The old way of building for the Web wasn’t better. But in reality what happened was that I had all the time in the world to do whatever I wanted, I didn’t have to pay bills, the quality of what I built wouldn’t jeopardise my non existing reputation, I wasn’t judged, I didn’t have deadlines and I had no one to impress but myself.

Maybe, just maybe, it is completely unreasonable to expect people who just joined the developer community to relate to this nostalgia. This is assuming that I’m talking about people who are new to programming (so, didn’t start it as a hobby).

My, so called, developer experience, from over 10 years ago will never ever be the same as someone who just started. And it is absolutely fine that they don’t relate to it, as this isn’t a competition or right or wrong answer. It is just different.

My nostalgia kicks in when I feel inadequate and behind my peers. On the other hand, I also know that I produce good work when I feel safe, rested and respected.

Weirdly, this made me look at my past blog posts a little bit differently and I tried to think about what exactly do I miss about the old web: I suppose that I miss building things for the web without capitalism?

But I can’t just end this ramble there: I would be a hypocrite since I’ve been exchanging code for a salary since 2012.

If building for the Web is one of my core personality traits, when I feel insecure doing it (for example, when I fail a job interview or when I haven’t learned something new immediately) it is almost like my whole self is worthless.

This also sounds like it is the curse of “doing what you love so that you’ll never work a day”.

Aside, as mentioned before, my concerns about today’s web development and the centralization of the web, my nostalgia is my responsibility to deal with. This made me feel slightly uneasy and selfish but it also made me understand much better the last three paragraphs of the article "Letting Go of the Old Web".

Despite this being a strange brain dump, I think I found something useful about this: my feelings are consequences of my core values. If I identify and define these core values, I will always try to find where I can live by them.