Ana RodriguesA personal blog from Ana Rodrigues.2014-06-02T00:00:00-00:00https://ohhelloana.blogAna Rodriguescontact@ohhelloana.blogSpeaking at WebExpo!2024-03-27T00:00:00-00:00https://ohhelloana.blog/speaking-at-webexpo/<p><img src="https://ohhelloana.blog/assets/posts/2024-03-27.jpg" alt="Flyer with my photo and details of the event."></p>
<p>I'm over the moon to share that I am one of the speakers for this year's <a href="https://webexpo.net/sessions/exploring-the-potential-of-the-web-speech-api-in-karaoke/">WebExpo</a>! It will be my first time attending WebExpo. I was impressed with how keen the organising team was on the community and the attendees' experience.</p>
<p>It will also be my first time at a multi-track conference, and the speakers list is so good! I know it will be difficult for me to choose what to attend.</p>
<p>Since I gave this talk at the State of the Browser and FFConf, I've been working on new experiments and sharing the things I've learned.</p>
<p>Tickets are still available; you should get them before they increase the price!</p>
<p>See you there?</p>
Reflections from IndieWebCamp Brighton2024-03-19T00:00:00-00:00https://ohhelloana.blog/iwc-brighton-2024/<p>The other weekend, I attended <a href="https://indieweb.org/2024/Brighton">IndieWebCamp Brighton</a> and had a wonderful time! I've been working from home for four years, and most of my friends have left London, so events like this excite me to see internet buddies! <a href="https://adactio.com/notes/20962">Like Jeremy said</a>, I, too, feel like it was my RSS feed coming to life!</p>
<p><a href="https://indieweb.org/2024/Brighton/Schedule#Saturday">Notes from the event were masterfully collected in IndieWeb's wiki</a>, but here are my write-up and thoughts on the sessions I attended. It was incredibly hard to pick which sessions to attend, as all the topics were interesting.</p>
<h2>Day one - Unconference</h2>
<h3>Energy Efficiency</h3>
<p>I started to follow this topic a few years ago when the carbon calculator came out. It impacted how I added certain things to my website, which also positively impacted its performance. In 2022, at FFConf, I saw a talk by Natalia about a greener web that mentioned how streams are a source of pollution. Frankly, it had never occurred to me and has been bothering me a lot. It was <a href="https://ohhelloana.blog/goodbye-spotify/">one of the decisions that led me to delete my Spotify account</a> and made me think about what other waste I was making.</p>
<p>As captured in the notes, one of my comments was about how many automated processes are running in the background of running our personal websites. I could generate the HTML pages of my website locally and manually upload the files to my hosting. Instead, I have it on GitHub, which gets my commits and then triggers a build on Netlify and, later, a deployment. For all this cool tech to work, there are servers, energy consumption, data stored, etc.</p>
<p>On the other hand, I promote the idea that your personal website should be a place where you experiment and learn. In the grand scheme of things, my personal website does not impact the environment, the same way that deleting my Spotify account hasn't improved the world, but it makes part of me give up taking space on the web.</p>
<p>I've wondered in the past if I could create some videos or even stream, but <a href="https://ohhelloana.blog/overthinking-online-participation/">not only do I have privacy concerns</a>, but I also know I would feel guilty if I didn't feel as sustainable as I could be.</p>
<p>I really enjoyed the session, but I have a hang-up on feeling like I am doing too much digital waste instead of rightfully blaming the billionaires and their stupid private jets.</p>
<h3>Site death</h3>
<p>I love how I just carried on choosing slightly less happy themes. I loved that this topic was suggested, especially since I recently dealt with my dad's digital life.</p>
<p>My mind was in two places during this session: how would I build a dead man's switch on my personal website, and what do I even want to happen if I suddenly die.</p>
<p>I still don't have an answer. My tech content will undoubtedly be useless, and my personal notes will only prove that I existed and had thoughts and opinions.</p>
<p>Do I want a banner at the top explaining that I died? Maybe I should renew my domains for ten more years? Should I print my personal posts? I am still trying to figure out what I want.</p>
<p>I keep thinking about the 80L plastic box at my mum's house with my dad's belongings that we picked that we wanted to keep. I wonder what he would have picked.</p>
<p>It also made me realise that because of digital cameras, only a few photos of me were printed from the age of 11 or 12 until my wedding. If I suddenly died, I don't think anyone would know about my teenage years. I wondered what my daughter would like to have from me. It is a digital dark age. Before worrying about my website, I should worry about my backups and create physical copies. See? More waste.</p>
<h3>Hosting</h3>
<p>I attended this session because I was keen to help if anyone had questions. I am trying to remember where I said this before, but deciding where to host your website in 2024 is awful. The search results are full of ads. Someone who wants their personal website to exist will struggle with this. No wonder websites like Squarespace have an extensive consumer base since they solve build and hosting. But their pricing is ridiculous.</p>
<p>I made a note that I would like to create a blog post where I try out and list free hosting services for anyone to host their HTML pages. Hopefully, this would help someone.</p>
<h3>NFC</h3>
<p>I really enjoyed this session with <a href="https://shkspr.mobi/blog/">Terrence</a>! I've seen people sharing cool experiments like having your oyster card on your nails, but I never thought about how it works. I suggested having an NFC tag on my cat and pointing to her website.
As soon as I got home, I planned to put the NFC sticker on her AirTag case. And I did it! Except her AirTag is also an NFC, so they clashed when I scanned it with my phone. I will get back to this—there must be a way of having a tiny one glued to her collar at a distance from the Airtag.</p>
<p>But the question was: how would you apply this to the IndieWeb? We thought of the dead man's switch! Maybe an API/smart URL on the other side of the NFC tag that, when run, would update the website so that it knows I am still alive? Maybe an NFC tag that opens a URL that tells your website to deploy a type of webmention (like a check-in). That would be fun!</p>
<p>I noticed that my library books have NFC tags! I can't stop seeing them everywhere I go now!</p>
<h3>Personal Website Pain Points</h3>
<p><a href="https://maggieappleton.com/">Maggie</a> initially suggested this topic, and I suggested another topic loosely titled "tech debt" on your personal website. I proposed merging the topics into one session to make it easier to organise the unconference, and it worked out well.</p>
<p>Maggie was curious to know people's pain points on their websites because they are working on building a digital garden tool (which sounds incredible).</p>
<p>I shared how I have so many regrets about decisions I made on this website: URLs, asset locations, organisation, very old code that still hasn't been refactored, etc.</p>
<p>It was amusing to realise that the way I organise my blog posts' URLs, which I regret, is how many people wanted to do on their websites.</p>
<p>I've recently made better mental efforts to avoid allowing tech debt to paralyse me and make me feel like my blog codebase has to be perfect.</p>
<h2>Day two - Hands-on</h2>
<p>My day started by sitting down with <a href="https://paulrobertlloyd.com/">Paul</a> and trying out <a href="https://getindiekit.com/">IndieKit</a>. I've been dreaming of creating my micropub endpoint, but lack of time and confidence has stalled me. <a href="https://ohhelloana.blog/testing-indiekit/">We got it working</a>! It turns out that having sat down together to try to run it allowed us to spot some bugs and gave Paul a different perspective on how another person could use their tool. I loved it! Now, I need to work on my plug-in to ensure the templates are created for my specific needs. After that, I will be unstoppable!</p>
<p>This took a chunk of the morning, so I needed an achievable task after it. I decided to add a <a href="https://ohhelloana.blog/privacy-policy/">privacy page</a> to my blog. A while back, through my analytics, I saw someone having thoughts and opinions on my analytics usage and the way it was worded made it sound like I used trackers of the invasive kind. It was time to add a page that clarified my analytics usage.</p>
<p>The day was wrapped up with impressive demos from everyone.</p>
<p>Thank you so much, <a href="https://paulrobertlloyd.com/">Paul</a> and <a href="https://qubyte.codes/">Mark</a>, for organising it! I had a fantastic time and hope it will become a frequent event.</p>
<p>More people wrote about their day, and you should check it out!</p>
<ul>
<li><a href="https://qubyte.codes/blog/indiewebcamp-brighton-2024">IndieWebCamp Brighton 2024 by Mark</a></li>
<li><a href="https://adactio.com/journal/20968">Indie webbing by Jeremy</a></li>
<li><a href="https://tantek.com/2024/072/t1/created-at-indiewebcamp-brighton">What I created at IndieWebCamp by Tantek</a></li>
<li><a href="https://roobottom.com/articles/plugging-into-the-indieweb/">Plugging into the IndieWeb by Jon</a></li>
<li><a href="https://theadhocracy.co.uk/wrote/indiewebcamp-brighton-2024">IndieWebCamp Brighton 2024 by Murray</a></li>
</ul>
You don't have to be a “content creator” to have a website.2024-03-14T00:00:00-00:00https://ohhelloana.blog/just-get-a-website/<p>This is clearly the result of living in a capitalist society. In recent years, people have felt the pressure to monetise their hobbies, so there’s a constant state of hustle. We all need money to exist in our society.</p>
<p>In the online communities and circles where I try to hang out, there is a slight pressure to “create content”. It is expected to bring you exposure and credibility within the community and job opportunities. Of course, this happens. It’s a big reason why I’ve even had the opportunities I’ve had so far. I created something, and people saw it and wanted to know more about it. It’s excellent, and it feels like a reward!</p>
<p>Now, it pains me when this reaches the concept of a personal website. People often say, “I have no content to put on a personal website”, and 1) that is not true, and 2) it should not be the goal.</p>
<p>The goal of a personal website is to be reachable. I have a <a href="https://anarodrigu.es/">simple landing page</a> with information on how to contact me.</p>
<p>You don’t have to be a content creator to have a website.</p>
<p>Dang, I want us to start putting our personal website URLs in our lanyards when we go to conferences instead of social media handles! What is the difference between a personal website that doesn’t have “content” and a social media account where there aren’t many posts anyway? The only thing in common is being reachable.</p>
<p>Just put your name and email, and it’s good to go! That’s content! Maybe one day, expand with a link to LinkedIn or, even better, add a CV in HTML. It doesn’t matter!</p>
<p>Give yourself permission to exist and be seen regardless of whether you have a blog, side projects or “content” - whatever it means.</p>
Testing IndieKit2024-03-10T11:28:11.290-00:00https://ohhelloana.blog/testing-indiekit/<p>I am at IndieWebCamp Brighton and I am testing IndieKit! Ignore this post.</p>
My loss. Their public consumption.2024-03-04T00:00:00-00:00https://ohhelloana.blog/personal-loss-public-consumption/<p>Growing up, I wasn’t close to my extended family. My parents weren’t close to them or were not on speaking terms, so, as a child, I followed their pattern. It probably explains why it took until recently for me to experience grieving while online.</p>
<p>I just flew back from Portugal, having spent the first anniversary of my father’s death with my mum and sister. I don’t know if I am lying to myself but I feel that I’ve accepted some things that panned out at the time.</p>
<p>I started this draft in August 2023, just before I started to struggle a lot mentally, and I really want to talk about what happened online after my dad passed away.</p>
<p>I grew up in a small town, and my dad was popular. He was born and lived in the area all his life and was heavily involved in the community. So, his death was a shock to everyone. The news had already spread by the time I landed in Portugal the following morning. The funeral agency that handled his passing immediately shared it via printed posters on all the local businesses and their own Facebook page. This is what usually happens over there.</p>
<p>I think that because he was catholic, it meant that his vigil would generally be the day immediately after his passing and then a funeral. However, due to the reasons why he passed, my dad’s body was not suitable to be seen by anyone. This isn’t normal there, so people immediately became curious and shamelessly intrigued and inquisitive. His body was cremated, and we didn’t do the traditional vigil. We had a vigil and funeral on the same day, two days after his passing.</p>
<p>After landing and travelling to see my mum, I opened my phone. I decided to share on my Facebook account (which I never use) where and when the vigil and funeral would be if anyone wished to attend. I decided to share a link to the funeral home’s website with the latest information. But as I opened Facebook, I could already see it everywhere. My body felt a shiver as I saw the original post of the funeral home already with dozens of comments, dozens more shares and reactions.</p>
<p>Most comments were sending condolences and expressing their shock at the news. But of course, the nosy people are also online. Comments like “Why can’t we see his body?”, “What did he die of?” gave me a glimpse of what families of crime victims feel like when people speculate online. I couldn’t stop scrolling. I would click on their profile to see if they were Facebook friends with my dad. I wanted to understand their rationale for thinking it was appropriate to ask such things. I remember one comment that said something along the lines of “Oh, I don’t recognise him”, and then someone else replied, “It’s [my mum’s name]’s husband.” while tagging my mum. I wanted to scream. I wanted to teach them manners. But I just froze.</p>
<p>That evening, I was tasked with deleting his social media accounts. His phone was still vibrating from all the group chats he was in and from getting calls. It was strange. I know this isn’t a unique experience, but like I said, I have never dealt with it before.</p>
<p>I entered his Facebook account, downloaded his photos and attempted to delete the account. I don’t remember the details now, but it was extremely difficult to delete his Instagram account. I think I did it right. I haven’t had the guts to check yet. It was a long day, and I went to sleep.</p>
<p>The following day, during his vigil, I went outside the chapel to greet a friend. I had someone come up to me, all cheerful, asking me, unknowing that I was his daughter, who exactly was he. “My father”, I said with an awkward, pleasant tone.</p>
<p>“Oh. He was young,” she replied.</p>
<p>“I know.”</p>
<p>I could hear the whispers of people gossiping over the alleged state of his body. They said the “funeral home” was shocked and had never seen anything like it. I was sore, but I couldn’t make a scene.</p>
<p>The evening after the funeral, I checked his phone. I shouldn’t, but I read the unread messages. He was in a group chat, and I saw someone breaking the news to the whole group. Their reactions, shock, confusion, them wondering about us, them organising a funeral bouquet. Then, a random question about something else (I don’t remember what), and the reply was, “What should we do about his number here? His daughters might be getting all these messages”. They didn’t know what to do. I suppose none of them wanted to remove him from the group, but it was haunting at the time. Someone brought back his last message to the group. There were messages about what they would bring to the funeral, when to meet up, etc.</p>
<p>Then, after the funeral, someone asked about a dinner and drinks they had arranged before this all happened and what the plans were. I had reached the bottom of the group chat. Life carried on for everyone (as it should). I removed him from the group and hoped it allowed them to talk freely and carry on.</p>
<p>While everyone was asleep, I went back to Facebook to check the latest tattle. Then I shared on my own profile a handful of tributes shared on Facebook by the communities he was involved in and employers.</p>
<p>I was angry because he deserved more respect and dignity in this death. And while I am thankful to the hundreds who attended and paid their respects, I am seething over the ones who wanted to be entertained.</p>
<p>While life seemed to have stopped for us, it didn’t for everyone else. Soon after, another tragedy struck someone in the town, and now they were in the spotlight instead. I pushed back my feelings and focused on supporting my mum.</p>
<hr>
<p>Two weeks later, I needed to find something, so I remembered that I had shared it on my Facebook profile, and since I so rarely post, I would be super quick to find it. It was. But by scrolling through my own profile, I also saw that his employer removed their tribute post.</p>
<p>I guess it didn’t match the aesthetic.</p>
TIL: How to fix it when an element blinks when using intersection observer.2024-02-27T00:00:00-00:00https://ohhelloana.blog/til-blinking-item-intersection-observer/<p>I recently built a page where a positioned sticky element would appear when another element wasn't visible anymore. For this, I used the intersection observer.</p>
<p>Later on, it was noticed that on an iPhone using Safari, it was as if this sticky item would start blinking, appearing and disappearing at certain scroll positions.</p>
<p>
I had no idea why, but eventually, I found a <a href="https://github.com/thebuilder/react-intersection-observer/issues/308#issuecomment-645537678">comment buried on a GitHub thread</a> that fixed my issue. I replaced <code>position: sticky</code> with <code>position: fixed</code>, and it got fixed! Why? I don't know. But now I know, I guess.
</p>
<p>The project I was working on wasn't using React or any other JavaScript framework. Still, sometimes, the framework used is a red herring. It's best not to dismiss search results based on their title and just have a look.</p>
I too have deleted my Spotify account2024-02-20T00:00:00-00:00https://ohhelloana.blog/goodbye-spotify/<p>I've been thinking, especially since the recent Spotify layoffs, that I'm due to delete my Spotify account. I haven't paid for it in years, and I have also significantly reduced my usage.</p>
<p>The other thing is that I've had this draft for ages and procrastinated on this topic. Luckily, today, I stumbled across this post from <a href="https://blog.raed.dev/posts/goodbye_spotify">Raed explaining their reasonings for deleting their account</a>. I thought, "Yeah, see, I had the same idea but procrastinated on it!". Not anymore!!</p>
<p>I have reasons similar to Raed's, but here are some of the thoughts that have been lurking in my head.</p>
<h2>Their apps take up too much disk space.</h2>
<p>It first annoyed me some years ago when I had a very old laptop with limited disk space. At one point, their app and its data took over 4 GB of disk space. That was when I deleted their app from my computer.</p>
<h2>I don't want to pay for music I don't own.</h2>
<p>The appeal for me to use Spotify Premium was that I had already bought the CDs from my favourite artists, so I didn't want to re-buy their digital versions. Now, this was, of course, pure laziness too.</p>
<p>Technically, you can plug a CD into your computer and copy and play the files. But this process was more straightforward in the early 2000s. I don't remember having a CD player on my laptop many years ago.</p>
<p>But since there was a way to avoid this whole effort, I paid for Spotify when commuting using the tube in London. Since there was no signal, I had to use Spotify Premium to be able to listen offline. One morning, one of my favourite artists removed their catalogue from Spotify. I couldn't listen to them anymore. Fair enough. It is in the terms and conditions, but I had the CD at home.</p>
<p>I ended up buying an external CD player to plug into my laptop to copy the songs. But doing that is a whole process because I also have to copy them to my phone.</p>
<h2>Spotify took too long to allow blocking users.</h2>
<p>I've been stalked via my Spotify account. Their harassment was by getting themselves and their friends to hit follow on my profile as a tactic to let me know that they are there and they see me. It was only in late 2021 that Spotify took measures to address this. At that point, they had already lost me.</p>
<h2>Spotify gives a lot of money and a platform to awful people.</h2>
<p>I don't need to say more about this.</p>
<h2>Spotify gives too little money to the artists.</h2>
<p>Another self-explanatory.</p>
<h2>Spotify is bad for the environment.</h2>
<p><img src="https://ohhelloana.blog/assets/posts/ffconf_2022_1.jpeg" alt="Slide saying "Streaming spotify 8 hours a day for 21 working days emits as much CO2 per month as driving 19.6 miles by an average passenger vehicle.".">
<img src="https://ohhelloana.blog/assets/posts/ffconf_2022_2.jpeg" alt="Slide saying "Music streaming accounted for 200 to 350 million kilograms of greenhouse gas emissions."."></p>
<p>I took these photos at FFConf 2022. That was the first moment I felt ashamed, and I should have pulled the plug then. And I shouldn't have shared some of my Spotify playlists since then, but I wanted to share something that would connect me to people.</p>
<p>Please watch <a href="https://ffconf.org/talks/2022_lil_natw_talk/">Natalia's talk on this topic</a> as it is really important.</p>
<h2>Goodbye Spotify wrapped</h2>
<p>I always felt so smug and happy when I shared that I was either in The Rasmus's 0.001% or 0.005% top fans every year. I buy their merch and art and travel to see them live, so I am contributing to their livelihood as much as possible. But I can't contribute to this company anymore either.</p>
<p>Thank you, Raed, for sharing your post and prompting me to take action, too.</p>
Speaking at All Day Hey!2024-02-19T00:00:00-00:00https://ohhelloana.blog/speaking-at-all-day-hey/<p><img src="https://ohhelloana.blog/assets/posts/1707928686007.jpeg" alt="Flyer with my photo and details of the event."></p>
<p>I'm excited to share that I am one of the speakers for this year's <a href="https://heypresents.com/conferences/2024">All Day Hey</a>! I first attended All Day Hey in 2018, and it has since been one of my favourite conferences. Well, technically, this is a comeback to the stage since I did give a lightning talk at All Day Hey back in 2019.</p>
<p>So, five years later (I can't believe it has been five years), I will be back, but this time to talk in a longer format about my new experiments with the Web Speech API and thinking a bit more about voice interfaces.</p>
<p>I've been working on new experiments and will be sharing new things I've learnt since I gave this talk at the State of the Browser and FFConf.</p>
<p>Tickets are still available but I bet not for long!</p>
<p>See you there?</p>
Attending IndieWebCamp Brighton2024-02-12T00:00:00-00:00https://ohhelloana.blog/attending-indiewebcamp-brighton/<p>I am excited to attend IndieWebCamp Brighton in less than a month! I already booked my non-refundable hotel, which felt very nerve-wracking!</p>
<p>The last time I tried to attend an IndieWebCamp, I ended up cancelling my trip last minute because childcare plans fell through.</p>
<p>But Brighton is near where I live, so hopefully, all will go well this time.
I'm super looking forward to meeting people from the community and having some dedicated time to work on my little blog! I know that technically, this could have been an RSVP type of post, so it's one more thing for my backlog of things to improve around here.</p>
<p>I'm really thankful to <a href="https://paulrobertlloyd.com/">Paul Robert Lloyd</a> for taking the initiative to organise this. If you need any more convincing, <a href="https://paulrobertlloyd.com/2024/032/a1/indiewebcamp_brighton/">Paul has written a more compelling introduction to the event on his blog</a>.</p>
<p><a href="https://indieweb.org/2024/Brighton">Learn more about the event and RSVP on the event page</a>.</p>
<p>See you there?</p>
Bookmarks I saved in 2023 and beyond2024-02-02T00:00:00-00:00https://ohhelloana.blog/bookmarks-2023/<p>Let's get these out of the way!</p>
<h2>Bookmarks related to tech and web development</h2>
<ul>
<li><a href="https://blog.geocities.institute/archives/7047">Shawna, a Set Maker</a> by olia.</li>
<li><a href="https://codefoodpixels.com/blog/2022/12/07/letting-eleventy-schedule-its-own-builds/">Letting Eleventy Schedule Its Own Builds</a> by Luke Morrigan.</li>
<li><a href="https://css-tricks.com/using-trello-as-a-super-simple-cms/">Using Trello as a Super Simple CMS</a> by Phil Hawksworth.</li>
<li><a href="https://daverupert.com/2023/05/assembly-line/">Sometimes the job is an assembly line</a> by Dave Rupert.</li>
<li><a href="https://liptrot.org/guides/">Hands‐on guides to assitive technology and accessibility testing</a> by Adam Liptrot.</li>
<li><a href="https://darekkay.com/blog/rss-styling/">Style your RSS feed</a> by Darek Kay.</li>
<li><a href="https://codepen.io/matuzo/pen/ZEqbXOM">WIP: Block links / Cards</a> by Manuel Matuzović.</li>
<li><a href="https://dm.hn/">Hacker News Blogroll</a>.</li>
<li><a href="https://dev.to/madsstoumann/re-creating-a-japanese-fireworks-catalog-from-1883-in-css-83j">Re-creating a Japanese Fireworks Catalog from 1883 in CSS</a> by Mads Stoumann.</li>
<li><a href="https://blog.yoav.ws/posts/web_platform_change_you_do_not_like/">So, you don't like a web platform proposal</a> by Yoav Weiss.</li>
<li><a href="https://codepen.io/thebabydino/pen/GRwLOKp">Tucked corners</a> by Ana Tudor.</li>
<li><a href="https://www.a11yiseverything.com/quizzes/aria-label/">Take this aria-label quiz</a> by A11y is Everything.</li>
<li><a href="https://viewports.fyi/">The ideal viewport doesn’t exist</a> by Andy Bell.</li>
<li><a href="https://www.nngroup.com/articles/scrolljacking-101/">Scrolljacking 101</a> by Sara Ramaswamy.</li>
<li><a href="https://sundaysites.cafe/">Sunday Sites</a>.</li>
<li><a href="https://developer.mozilla.org/en-US/blog/custom-easing-in-css-with-linear/">Creating custom easing effects in CSS animations using the linear() function</a> by Michelle Barker.</li>
<li><a href="https://www.macstories.net/stories/i-used-a-game-boy-camera-for-facetime-video-calls-in-ipados-17-and-it-was-glorious/">I Used a Game Boy Camera for FaceTime Video Calls in iPadOS 17 and It Was Glorious</a> By Federico Viticci.</li>
<li><a href="https://berjon.com/fixing-search/">Fixing Search</a> by Robin Berjon.</li>
<li><a href="https://codepen.io/gabriellewee/pen/MWqRZzp">Windows 95</a> by Gabrielle Wee.</li>
<li><a href="https://www.theverge.com/2023/6/26/23773914/ai-large-language-models-data-scraping-generation-remaking-web">AI is killing the old web, and the new web struggles to be born</a> by James Vincent.</li>
<li><a href="https://restofworld.org/2023/social-media-privacy-momo-dinosaur/">Why thousands of young Chinese people use a pink dinosaur as their alias</a> by Caiwei Chen.</li>
<li><a href="https://elizabethtai.com/2023/07/06/being-an-imperfect-gardener-of-my-digital-garden/">Being an imperfect gardener of my digital garden</a> by Elizabeth Tai.</li>
<li><a href="https://www.bram.us/2023/10/09/learnwithjason-css-only-scroll-driven-animation/">LearnWithJason: CSS-Only Scroll-Driven Animations</a> by Bramus Van Damme.</li>
<li><a href="https://eleventy-notes.sandroroth.com/">Eleventy Notes</a> by Sandro Roth.</li>
<li><a href="https://www.designethically.com/">Design Ethically</a> by Katherine M. Zhou.</li>
<li><a href="https://jacobian.org/2021/mar/9/coworking-to-write-more/">Coworking With a Friend to Write More</a> by Jacob Kaplan-Moss.</li>
<li><a href="https://www.appblit.com/scribe">Scribe</a>.</li>
<li><a href="https://kizu.dev/scroll-driven-state-transfer/">Scroll-Driven State Transfer</a> by Roman Komarov.</li>
<li><a href="https://roytang.net/2023/10/social-media-lurkers-introverts-blogging/">On Social Media, Lurkers, Introverts, and Blogging</a> by Roy Tang.</li>
<li><a href="https://meyerweb.com/eric/thoughts/2023/11/01/blinded-by-the-light-dom/">Blinded By the Light DOM</a> by Eric A. Meyer.</li>
<li><a href="https://noahliebman.net/projects/plucky-underline/">Plucky: a standing wave underline</a> by Noah Liebman.</li>
<li><a href="https://jonas.do/writing/2023-10-05-side-projects/">Why side projects are essential for creatives—and employers should embrace them</a> by Jonas Downey.</li>
<li><a href="https://www.wired.com/story/first-gen-social-media-users-have-nowhere-to-go/">First-Gen Social Media Users Have Nowhere to Go</a> by Jason Parham.</li>
<li><a href="https://whiona.weblog.lol/2023/10/what-happened-to-blogging-for-the-hell-of-it">What happened to blogging for the hell of it?</a> by Whiona.</li>
<li><a href="https://blog.kizu.dev/never-use-overflow-scroll/">Never Use “Scroll” Value for Overflow</a> by Roma Komarov.</li>
<li><a href="https://benmyers.dev/blog/multilingual-web-accessibility/">Lost in Translation: Tips for Multilingual Web Accessibility</a> by Ben Myers.</li>
<li><a href="https://ashleemboyer.com/blog/don-t-use-fixed-css-height-or-width-on-text-containers">Don't Use Fixed CSS height or width on Buttons, Links, or Any Other Text Containers</a> by Ashlee M Boyer.</li>
<li><a href="https://codepen.io/michellebarker/pen/WNKbQOO">Pixel Art Studio</a> by Michelle Barker.</li>
<li><a href="https://ginger.wtf/posts/building-a-tag-cloud-with-eleventy/">Using 11ty to bring back tag clouds</a> by Ginger.</li>
<li><a href="https://blog.kizu.dev/weekly-bookmarks-005/">Weekly Bookmarks 5: CSS and Web Components</a> by Roma Komarov.</li>
<li><a href="https://darn.es/share-button-web-component/">share-button Web Component</a> by David Darnes.</li>
<li><a href="https://adactio.com/articles/20638">Of Time And The Web</a> by Jeremy Keith.</li>
<li><a href="https://greentechsouthwest.org/insights/dimpact/">DIMPACT – measuring emissions from media and digital entertainment</a> by Ellen Davies.</li>
<li><a href="https://localghost.dev/blog/engineering-progression-for-humans/">Engineering progression for humans</a> by Sophie Koonin.</li>
<li><a href="https://www.nngroup.com/articles/infinite-scrolling-tips/">Infinite Scrolling: When to Use It, When to Avoid It</a> by Tim Neusesser.</li>
<li><a href="https://htmlwithsuperpowers.netlify.app/">HTML with Superpowers</a> by Dave Rupert.</li>
<li><a href="https://jamesdoc.com/blog/2023/git-changelog-in-11ty/">Adding a git based changelog in 11ty</a> by James Doc.</li>
<li><a href="https://www.tommyp.org/blog/tales-from-a-solo-dev">Tales from a solo dev</a> by Tommy Palmer.</li>
<li><a href="https://frontendmasters.com/blog/highlight-text-when-a-user-scrolls-down-to-that-piece-of-text/">Highlight Text When a User Scrolls Down to That Piece of Text</a> by Chris Coyier.</li>
<li><a href="https://ohhelloana.blog/bookmarks-2023/"></a> by .</li>
</ul>
<h2>Other bookmarks</h2>
<ul>
<li><a href="https://visiblemagazine.com/we-are-covids-collateral-damage/">We are COVID’s collateral damage. And we are legion.</a> by Amy Bailey, PhD.</li>
<li><a href="https://everythingchanges.us/blog/energy-makes-time/">Energy makes time</a> by Mandy Brown.</li>
<li><a href="https://jvns.ca/blog/2023/08/07/tactics-for-writing-in-public/">Some tactics for writing in public</a> by Julia Evans.</li>
<li><a href="https://nearlyknowledgeablehistory.blogspot.com/2021/05/the-nine-men-of-madeley.html">The Nine Men Of Madeley</a>.</li>
<li><a href="https://www.etsy.com/uk/listing/642526182/humpty-dumpty-print">Humpty Dumpty Print</a>.</li>
<li><a href="https://purrli.com/">Purrli</a>.</li>
<li><a href="https://www.tortoisemedia.com/2023/10/30/british-police-testing-women-for-abortion-drugs/">British police testing women for abortion drugs</a> by Phoebe Davis.</li>
<li><a href="https://www.theonion.com/i-bet-i-can-speak-spanish-1819583640">I Bet I Can Speak Spanish</a></li>
</ul>
Another round of bookmarks2024-01-23T00:00:00-00:00https://ohhelloana.blog/another-round-of-bookmarks/<p>I had not realised it had been 805 days since my last bookmarks roundup. 805 days. This section is still one of the most visited parts of my little web corner.</p>
<p>It's been so long that I have accumulated an intimidating number of bookmarks. On the other hand, I did go on maternity leave and stayed away from the tech world for a while. I started the draft for this post in May 2023, and here I am, on January 2024, finally sharing it. It's a good thing that for the past few weeks, <a href="https://hidde.blog/sharing-links/">people have been talking a bit more about their bookmarks</a>, and because I want to move to a system of individual link sharing rather than bulk, I needed to get this batch out of the way.</p>
<p>This post will mostly include links from 2022 - things I bookmarked while on maternity leave. It's great to revisit these because I have no memories of that time.</p>
<p>I hope to get another batch of bookmarks from May 2023 out soon, and then I will move on to add them individually. I mentioned before somewhere in these posts, but adding them as a batch isn't working for me right now. I used to do it monthly, but if it is a month that I bookmark a lot, it will be a long post to curate. Right now, this format takes me at least one hour to create. I could switch to a weekly post but must integrate it into my routine. Maybe forcing a time slot every Friday morning or something. I also like the idea of individual link posts so that I can add tags and get back to them quickly.</p>
<h2>Bookmarks related to tech and web development</h2>
<ul>
<li><a href="https://ishadeed.com/article/position-sticky-css-grid/">Using Position Sticky With CSS Grid</a> by Ahmad Shadeed.</li>
<li><a href="https://meowni.ca/posts/doing-the-work/">Doing the work</a> by Monica Dinculescu.</li>
<li><a href="https://colly.com/articles/stream-on">Stream on</a> by Simon Collison.</li>
<li><a href="https://ffoodd.github.io/a11y.css/">a11y.css</a> by Gaël Poupard.</li>
<li><a href="https://12daysofweb.dev/">12 Days of Web</a> by Stephanie Eckles.</li>
<li><a href="https://yuanchuan.dev/pixel-patterns">Pixel patterns</a> by Chuan.</li>
<li><a href="https://tomcritchlow.com/2022/05/29/underground-blogging/">Subterranean Blogging</a> by Tom Critchlow.</li>
<li><a href="https://fixa11y.com/">Fix Contrast</a>.</li>
<li><a href="https://esoteric.codes/">Esoteric.Codes</a> by Daniel Temkin.</li>
<li><a href="https://css-tricks.com/generate-a-pull-request-of-static-content-with-a-simple-html-form/">Generate a Pull Request of Static Content With a Simple HTML Form</a> by Hilman Ramadhan.</li>
<li><a href="https://henry.codes/writing/how-to-use-contentful-with-eleventy/">How To Use Contentful With Eleventy</a> by Henry Desroches.</li>
<li><a href="https://adrianroselli.com/2021/02/whcm-and-system-colors.html">WHCM and System Colors</a> by Adrian Roselli.</li>
<li><a href="https://www.basbroek.nl/getting-started-dynamic-type">Getting Started With Accessibility: Dynamic Type</a> by Bas Thomas Broek.</li>
<li><a href="https://www.smashingmagazine.com/2021/03/svg-generators/">SVG Generators</a> by Iris Lješnjanin.</li>
<li><a href="https://github.com/stars/daviddarnes/lists/11ty">All the Eleventy things</a> by David Darnes.</li>
<li><a href="https://thisiswcag.com/">Web accessibility simplified</a>.</li>
<li><a href="https://yosracodes.hashnode.dev/how-i-make-css-art">How I Make CSS Art</a> by Yosra Emad.</li>
<li><a href="https://www.baldurbjarnason.com/2022/i-cant-keep-up-with-web-dev/">How to keep up with web development without falling into despair</a> by Baldur Bjarnason.</li>
<li><a href="https://css-tricks.com/evergreen-does-not-mean-immediately-available/">“Evergreen” Does Not Mean Immediately Available</a> by Eric Bailey.</li>
<li><a href="https://www.smashingmagazine.com/2022/02/reducing-web-carbon-footprint-optimizing-social-media-embeds/">Reducing The Web’s Carbon Footprint: Optimizing Social Media Embeds</a> by Michelle Barker.</li>
<li><a href="https://css-irl.info/aspect-ratio-is-great/">Aspect Ratio is Great</a> by Michelle Barker.</li>
<li><a href="https://zine.yesterweb.org/issue-02/">Websites as an Act of Creativity</a> by Yesterweb Zine.</li>
<li><a href="https://www.digitalcleanupday.org/">Digital Cleanup Day</a>.</li>
<li><a href="https://how-many.herokuapp.com/index">Estimate how many people using your website might be disabled</a>.</li>
<li><a href="https://mashable.com/article/tumblr-girl-learn-code">From Tumblr girl to engineer: How the platform inspired a generation of women to code</a> by Elizabeth de Luna.</li>
<li><a href="https://www.craigabbott.co.uk/blog/using-the-language-attribute-to-make-your-website-accessible/">Using the language attribute to make your website accessible</a> by Craig Abbott.</li>
<li><a href="https://prototypr.io/post/dont-alienate-your-user-a-primer-for-internationalisation-localisation?utm_source=swlinks-tw">Don’t Alienate Your User: A Primer for Internationalisation & Localisation</a> by Sophie Clifton-Tucker.</li>
<li><a href="https://blog.jim-nielsen.com/2022/what-is-the-web/">What is the Web?</a> by Jim Nielsen.</li>
<li><a href="https://www.joshwcomeau.com/css/understanding-layout-algorithms/">Understanding Layout Algorithms</a> by Josh W Comeau.</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector">Privacy and the :visited selector</a>.</li>
<li><a href="https://tomcritchlow.com/2022/04/01/blogging-accelerator/">Notes on a Blogging Accelerator</a> by Tom Critchlow.</li>
<li><a href="https://sailorhg.com/home_sweet_homepage/">Home Sweet Homepage</a> by Amy Wibowo.</li>
<li><a href="https://sofuckingagile.com/blog/mourning-loss-as-a-remote-team">Mourning loss as a remote team</a>.</li>
</ul>
<h2>Other bookmarks</h2>
<ul>
<li><a href="https://www.theguardian.com/society/2022/mar/30/11-years-10-arrests-at-least-62-women-how-did-britains-worst-cyberstalker-evade-justice-for-so-long">11 years, 10 arrests, at least 62 women: how did Britain’s worst cyberstalker evade justice for so long?</a> by Sirin Kale.</li>
</ul>
Adventures in fixing a noisy book2023-12-13T00:00:00-00:00https://ohhelloana.blog/fix-noisy-book/<p>For my daughter, I've been buying second-hand as much as possible. If it can be washed and disinfected, it will be second-hand. She loves noisy books right now, so I've been getting some cheap books from Vinted and charity shops. The other day I found a noisy book in a charity shop for £1, but I couldn't test it. I assumed the batteries had died, so I still bought it. I was right regarding the batteries - they were dead - but after replacing them, I still couldn't get the book to work. I've wanted to learn how to fix small home appliances, so I thought this would be an excellent first project.</p>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/unassembled-book.jpeg" alt="Unassembled part of the book which contains the area to press the buttons, chip, batteries and speaker."></p>
<p>I've made quite some mistakes along the way, so I will share them here, hoping that someone does not make them!
The book is now fixed and working, but I did waste some time fixing the wrong things. The first thing I did was search YouTube for videos showing how to fix noisy books. I found two of them, and they were interesting but threw me in the wrong direction. The first video showed how to replace the speaker in a noisy book. Like me, they replaced the batteries, but pressing the buttons still didn't produce any sound, so they showed how to solder a new mini speaker into the book.</p>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/soldering-kit.jpeg" alt="My soldering kit and new speaker."></p>
<p>So, of course, that's what I did! I got an intro kit into soldering, bought a mini speaker and began the task of soldering this new speaker. I spent time learning how to do it on YouTube and then tried it. It was not easy, but fascinating. Once that was done, I tested it out, and it was still not working. Bummer.</p>
<p>The second YouTube video showed me someone testing things out and replacing the chip that holds the sounds because the chip was dead. In my head, this made sense. There are only three items here: batteries, chip and speaker. If a new speaker and batteries are in, the problem must be the chip.</p>
<p>Things would get more complicated if it were the chip, but I was keen to learn! But it was time to ask for help. <a href="https://mastodon.social/@ohhelloana/111490313132551193">I tooted on Mastodon asking for help</a> and was reminded that <a href="https://ffconf.org/chat">FFConf's discord server</a> has a hardware help channel.</p>
<p><a href="https://remysharp.com/">Remy</a> asked if I had a multimeter. (which I didn't). He followed:</p>
<blockquote>
<p>"You should have continuity through the speaker if it's working - also useful to test if the voltage is coming in. Since the chip is under a resin blob, it's hard to think the chip is gone/bad, but if that's the case, I'm sure I've seen boards like this on Alix (and I'll take a look for you)."</p>
</blockquote>
<p>I bought a multimeter. A tip shared by <a href="https://sarajoy.dev/">Sarah</a> was to get one that makes beep-beep sounds so that you don't have to look at the screen. At this point, I had exceeded the cost of buying this type of book brand new, but the thought of saving this one from landfill was very exciting.</p>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/multimeter-and-book.jpeg" alt="My setup on the table. Ipad with YouTube on, multimeter and noisy book parts."></p>
<p>It was tough to find a YouTube video that showed how to use a multimeter in this scenario, and of course, I wasn't using it right.
Remy very kindly annotated the photo I provided, which helped me understand how to use the multimeter to check for continuity.
All the beep-beep was there, so continuity wasn't an issue. It was time to test the voltage.</p>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/voltage-continuity.jpg" alt="Close-up of the chip where there are some annotations of where to test for voltage and continuity. Voltage to be tested on two cables that connect batteries to the chip and continuity to be tested on the two cables that connect speaker to the chip."></p>
<p>There are three batteries, but I was only getting a little over 2V. Remy said that it was too low and should be around 4.5v.
Okay, we're getting somewhere. Using the multimeter, I checked if the batteries were full (they were), and I also took a close-up photo of the battery holder just in case. Remy spotted the culprit quickly. There was some corrosion in the metal. He then dropped pieces of wisdom:</p>
<blockquote>
<p>"This would add resistance and reduce the voltage being delivered. (...) put a very small amount of white vinegar in a pot/glass pot and put in the microwave for about 15 seconds - doesn't need much more. then drop those two metal tabs in there. it should fizz for a bit, it'll remove the corrosion - then dry them off (really well), replace and test. (battery corrosion is alkaline, and vinegar is acid, so mix the two => water)."</p>
</blockquote>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/corrosion-battery.jpg" alt="Close-up of the metal parts in the battery that show a little bit of corrosion."></p>
<p>So I did that. Then, the voltage was over 4v. Then I assembled it all, and it worked!! It worked!! I was over the moon! I was disappointed that I misidentified the cause of the issues but glad I learned something. But most importantly, it is saved from landfill!</p>
<p><img src="https://ohhelloana.blog/assets/posts/fix-noisy-book/assembled-book.jpeg" alt="Book next to assembled speaker, chip and batteries."></p>
<p>After assembled, I fixed the paper with green self adhesive paper I had left over from other crafts.</p>
<p>Thanks Remy and everyone who replied to my toot! I'm super happy I was able to fix this. Also, I was wondering if I could make a custom noisy panel for my girl. Something like a family member's face, and if she presses, something we say plays. That would be cool!</p>
<p>Lessons learned:</p>
<ul>
<li>You can do this!</li>
<li>Don't be afraid to ask for help!</li>
<li>Don't assume the first solution YouTube tells you is the right one if you don't know the basics.</li>
<li>Basics matter!</li>
</ul>
The opposite of shame is vulnerability2023-12-07T00:00:00-00:00https://ohhelloana.blog/opposite-of-shame/<p>I’ve had a long year. I spent the first half on maternity leave and struggled quite a bit. Raising a baby is hard enough, and then adding the constant worry of milestones and development, their health, getting all the information to ensure you’re doing things right, all the apps and books, weaning, the comparison, etc., is a full-time job. <a href="https://ohhelloana.blog/some-memories/">Then my dad suddenly died</a>, and I found myself having another caregiver role of supporting my mum. Luckily, I wasn’t alone in this; my sister and brother-in-law were also there and did a lot. But at the end of my maternity leave and the first months of returning to work, I was constantly making sure things were okay with Mum and with the baby. And then working all while travelling back and forth to Portugal. The baby started nursery, and although she settled well, the germs made their way in, and we were all constantly ill. I’ve lost track of the number of flights to Portugal and the number of stays in hospitals this year alone.</p>
<p>I don’t remember the first 3 months back at work. I remember feeling deeply insecure in the first months, looking up if the code I was writing was still the best practice. This meant that I was taking longer to do tasks. During summer, I was trying to get my spark back, whatever that means. I had an idea for a talk, which I had been excited about for a while, and I decided to work on it. I was super happy to have been invited to present it in a few places, and it was the drive I needed. The talk gave me joy and a purpose. I suppose the sun helped me continue to push through. We had a little holiday at home, but we all got sick, and the infection was so rough that my husband lost his voice (and at the time of writing, it still isn’t fully back). A CT scan showed that, thankfully, nothing sinister was going on. Just very unlucky. But it was an anxious wait. Communicating at home was hard, but again, we pushed through.</p>
<p>Then, sometime in October, things took a turn. A close friend of mine had their father pass away unexpectedly, too. They found themselves in a similar position as I did in March, getting a last-minute flight and helping their mum. And that was the trigger. I was deeply sad for my friend and was not prepared for how my grief would suddenly take over me. I barely cried from the moment I landed in Portugal for my dad’s funeral. I was in support mode. But from this moment on, it was game over for me.</p>
<p>I broke down every single day until my talk at FFConf. I had dreams all the time where he was still alive, and it was business as usual. I spent my lunch breaks crying. I started not to be able to sleep, so the struggle at work followed. Then, the baby would get sick from nursery germs, so everything started to fall apart. I was angry at myself that I was suddenly not coping. Feeling unproductive absolutely destroys every single positive thought I have of myself. I felt useless, a waste of space, a nuisance. And I was sad, and I missed my dad.</p>
<p>On top of this, since I stopped breastfeeding, I’ve been struggling with PMDD. Every month, for two weeks, I feel physically and emotionally drained. It’s been all too much, and I feel deeply ashamed.</p>
<p>I feel ashamed because other people are going through worse, so I should be coping better.</p>
<p>I felt ashamed because I didn’t feel intelligent or productive or that my comeback to work after maternity leave was a success.</p>
<p>I felt ashamed when I realised I needed to speak with work and explain that I wasn’t okay and needed a break.</p>
<p>Not so long ago, a friend messaged me saying that I was on fire (that was a reaction to me giving talks at conferences). I was somehow glad that it looked like that, but I felt a bit icky that it wasn’t the reality, and it felt dishonest. While I feel ashamed that I am “not on fire” in a good way, I am indeed “on fire” in a bad way. I guess I am burned out.</p>
<p>So here I am, on an “extended holiday”, trying to figure out how to move past this bump. The crying is improving, but I know this first Christmas without him will be difficult.</p>
<p>I am trying to take time for myself and do one thing at a time. Maybe, finally, give journaling a go! Who knows!</p>
<p>The title of this post is inspired by the book I am currently listening to, “Daring Greatly” by Brené Brown. And if the opposite of shame is vulnerability, here I am waving my arms, telling you, “Hey… things suck over here and sharing it might change what people think of me for the worst, but what can I do? I exist with all my goodness and my faults.”</p>
I gave a talk at FFConf!2023-11-24T00:00:00-00:00https://ohhelloana.blog/ffconf-2023/<p>Two weeks ago, I spoke at <a href="https://2023.ffconf.org/">FFConf</a>. Yes! Me! Last year, I made a little shy appearance in one of <a href="https://localghost.dev/">Sophie's</a> slides, but it was the big deal this year.</p>
<p><img src="https://ohhelloana.blog/assets/posts/ffconf2023/ffconf2022.jpg" alt="Screenshot of my blog on the bottom left corner of Sophie's slides."></p>
<p><a href="https://mastodon.social/@ohhelloana/111171359089249081">I mentioned in a toot</a> a while back how special FFConf is for me. Years ago, my friend <a href="https://paulcuth.me.uk/">Paul</a> told me about it, and it turned out to be a life-changing conference.</p>
<p>I was disheartened with the industry and tech community at the time (I think this was in 2016). The talks I saw and the people I met throughout the years were the inspiration and acceptance I desperately needed to find.</p>
<p>I even found my current job by chatting with people there. Someone told me about this agency, and I should say "hi". I did, and it turns out they were hiring!</p>
<p>As you can imagine, I was over the moon that I was invited to speak there after applying to their call for papers.</p>
<p>The topic was the same as <a href="https://2023.stateofthebrowser.com/">The State of the Browser</a>, but I changed the slides and demo based on feedback received and my own perception after watching the video. I also added a new demo at the end!</p>
<p>One of my last slides was a thank you to one of the talks from the previous years that really moved me at the time. In 2018, <a href="https://tholman.com/">Tim Holman's</a> talk showed us some enjoyable demos. Then he compiled what he learned from building some seemingly "useless things". He ends with "any idea you have has value". So there I was, on a stage, sharing what I learned from building a karaoke in the browser.</p>
<p>Unlike the previous years at FFConf, I was extremely nervous this year. My head was over the place during the day. I was the penultimate speaker, so I could relax and enjoy Salma's talk.</p>
<p>Now, I plan to watch all the videos of the other talks when they come out so that I can properly enjoy them.</p>
<p><a href="https://www.trysmudford.com/">Trys Mudford</a> took <a href="https://www.flickr.com/photos/remysharp/albums/72177720312654713">photos of the day</a> and wrote a lovely recap. So did <a href="https://amyhupe.co.uk/articles/ffconf-2023/">Amy</a> and <a href="https://remysharp.com/2023/11/15/my-experience-of-ffconf-2023">Remy</a>!</p>
<p>This has been one of the highlights of my (quite crappy) year. I hope I contributed to people feeling as happy at the end of the day as I felt all these years as an attendee. Thank you to everyone who came to say hi before and after the talk! My heart is full!</p>
<p><img src="https://ohhelloana.blog/assets/posts/ffconf2023/53328355327_64b929da0b_c.jpg" alt="Me speaking in front of my slides."></p>
<p><img src="https://ohhelloana.blog/assets/posts/ffconf2023/53329689930_cca7d5e883_c.jpg" alt="Group photo with speakers and organisers."></p>
<p>If you saw the talk and have any feedback/criticism/suggestions, please use the form below this post and share it with me. The form won't appear if you're part of the cool people who are reading this via RSS feed hehe.</p>
People and Blogs interview2023-11-17T00:00:00-00:00https://ohhelloana.blog/people-and-blogs/<p>Some weeks ago, I was so privileged to have been invited to <a href="https://manuelmoreale.com/pb-ana-rodrigues">chat about myself and my blog</a> at Manu's new series, <a href="https://peopleandblogs.com/">People and Blogs</a>. I really enjoyed following someone else's prompts. I never rationalised some decisions about this blog out loud, so it was a fascinating exercise.</p>
<p>Since then, I've been thinking about how I need to bring my bookmarks back, how my voice and thoughts matter to me and how I need to branch off and read more from people who don't work in tech.</p>
<p>I've been trying hard for the last few months to find a balance between work, my mental health, quality family time and returning to the tech community after maternity leave, but I haven't made much space to write here.</p>
<p>On a related note, <a href="https://matthiasott.com/">Matthias Ott</a> has a new newsletter called <a href="https://buttondown.email/ownyourweb">Own Your Web</a>, and recently, Matthias asked, "If you have a personal website: how did it change your life?". <a href="https://mastodon.social/@matthiasott">I replied with</a>: "@matthiasott oh! Things I've been invited to do were because of my website, especially articles and interviews.
Also writing, quoting and linking to other people's work on my website has led me to actually meeting them in person later on in conferences which is lovely."</p>
<p>This reflection and my interview with Manu make me want to hug my blog.</p>
<p>Check the whole series because reading everyone else's interviews has given me so much joy!</p>
Could it be that maybe LinkedIn was the answer after all? If so, I lost the game.2023-10-19T00:00:00-00:00https://ohhelloana.blog/overthinking-social-media/<p>With Twitter imploding and people (myself included) trying to move to multiple similar apps, I was following everyone I knew numerous times. It may not look like it, but I can be a bit shy! If we're "Twitter/conference friends", you probably noticed me clicking the follow button on at least three new platforms. Then, some social anxiety creeps in!</p>
<p>"Oh, I liked my friend's post on Mastodon. Should I also like and share it on the other platform they also shared it?"</p>
<p>"Oh no, this person only follows me back on this platform, but not on the other. Do they hate me?"</p>
<p>"Am I being annoying?"</p>
<p>"Where do I post this mediocre attempt at a joke?" (actually, the answer for that is your personal website.)</p>
<p>While I am content with Mastodon (I've had an account since 2017), I did sign up for Threads and BlueSky. I will probably sign up for whatever else comes along because, you know… FOMO. Turns out I had forgotten about our old friend LinkedIn, which is also where everyone is!</p>
<p>I initially created an account in 2012 and kept it until 2016 or 2017. At that point, I had amassed hundreds of connections. I was also a young woman, so a few previous male co-workers constantly crept on me, from frequently visiting my profile to even drunk messaging me (yes, on LinkedIn). At that time, I wasn't using my last name online and was keen to protect my privacy and location, so having a profile where anyone could see where I was for 8 hours a day did not make sense. It was a time of my life when I was going through lots of anxiety, so I deleted my account.</p>
<p>I just remembered about LinkedIn in mid-pandemic. I created a new account, added my current co-workers and some close friends and realised I only had 11 connections. I felt… a bit concerned about how it would make me look. The pandemic and life gave me lots more to worry about, so I forgot about LinkedIn again until a couple of weeks ago.</p>
<p>A friend messaged me, telling me something happened to them on LinkedIn, and I decided to log in. Turns out more people I know are on it (obviously!). More people to follow and add! And my number of connections is still tiny. What does that say about me? In 2023! Social media anxiety is back!</p>
<p>"Okay, so LinkedIn is, in theory, the professional side of social media. Am I being too much for adding this person I have only interacted with on Twitter?"</p>
<p>"This recommended person, I know them and have worked with them, but.. We haven't spoken in years. What should I do?!"</p>
<p>"I follow this person on four other social media platforms. Will I come across as overly keen if I click "follow here too??"</p>
<p>Anyway - I did click in a few! I even saw some posts from the State of the Browser that I was mentioned in.</p>
<p>But this got me thinking. Dang, what could have happened if creepy men weren't bothering me back in the day? Could I have kept connections with lovely people I have actually worked with in the past? Most aren't active on tech Twitter or these new platforms.</p>
<p>Because let's be realistic: before Twitter imploded, tech Twitter was/is very much only a Twitter thing. Most people I have ever worked with don't care about Twitter. And quite frankly, some of them were the best people I ever worked with. But they are all on LinkedIn. And I wasn't for years because I felt I had to get away to feel safe. How unfair. What opportunities could I have missed because of this?</p>
<p>There's a lot of crap on LinkedIn. It is its own meme, but something tells me that these new microblogging platforms will come and go, but LinkedIn will still be there with its own cursed vibe.</p>
<p>Anyway, if we have actually met, feel free to add me on <a href="https://www.linkedin.com/in/ana-rdrg">LinkedIn</a>!</p>
I am back to doing tech talks!2023-10-17T00:00:00-00:00https://ohhelloana.blog/back-to-doing-talks/<p>Well, well, well. Who would have thought I would give this another go after <a href="https://ohhelloana.blog/six-talks-later/">pouring my heart a few years ago in a blog post</a>? But I did! And nothing terrible happened!</p>
<p>I've had a silly idea of something I wanted to build for a long time, and I was daydreaming of turning it into a talk. While at <a href="https://pixelpioneers.co/">Pixel Pioneers</a> earlier in the summer, I asked <a href="https://adactio.com/">Jeremy</a>, <a href="https://michellebarker.co.uk/">Michelle</a> and <a href="https://andy-bell.co.uk/">Andy</a> for their opinion on my "elevator pitch", and they encouraged me to go for it. Later on, <a href="https://hidde.blog/">Hidde</a> gave me excellent feedback on my written pitch. (Thank you!)</p>
<p>I applied around and was excited to have been invited to give it at the <a href="https://2023.stateofthebrowser.com/">State of the Browser</a> (which happened last month) and at <a href="https://2023.ffconf.org/">FFConf</a> (which is due to occur in less than a month). Another event is lined up for next year, but an official announcement still needs to be made.</p>
<p>My plan is to adapt the talk to each event. For the State of the Browser, I wanted to emphasize what you can do now with the browsers and their current ability. So, using vanilla javascript, HTML and CSS only. For future events, I'm hoping to expand on the tooling but also bring other aspects of fun and encouragement to build silly things for the sake of having fun.</p>
<p>I was incredibly nervous at the State of the Browser. It was my first talk in so many years, but the audience was incredible, and it was lovely to see so many familiar and friendly faces cheering me on. It went well. I even dared to watch the video!
I now only hope that it gets even better each time.</p>
<p>I'm very nervous but looking forward to FFConf. It's literally the conference that started a journey of inspiration and acceptance in the tech community I chose to belong. I hope to contribute to people feeling as happy at the end of the day as I felt all these previous years as an attendee. And there are still tickets available!</p>
<p>I don't know where else I will give this talk - or if. But I will convert it to a blog post sometime next year. Regardless, I've updated my <a href="https://ohhelloana.blog/talks/">speaking page</a>.</p>
<p>PS.: How cool is it that I could link a bunch of people here to their personal websites?</p>
Experimenting with using box-shadow as a border on top of a grid-gap2023-08-02T00:00:00-00:00https://ohhelloana.blog/box-shadow-border-grid-gap/
<p>I need to preface this post by saying: bare with me. I was without doing much coding for over a year, so maybe I'm wrong, or everyone already knows this.</p>
<p>I recently had a situation where I needed to add a border between elements that sat in a 12 grid with a gap between them. To my knowledge (and again, possibly I am wrong), you can't add much on top of the grid-gap. I searched around but was in a rush, so I decided to do something that achieved the result visually. But it doesn't feel super nice and clean. In moments like this, I remind myself of what <a href="https://rachelandrew.co.uk/">Rachel Andrew</a> said at Pixel Pioneers some years ago: “Is this the right way to do it?... well, does it work?”.</p>
<p>It works. So here it is. You can fake a border effect by using two shadows, one on top of the other. The first declared shadow should match your background colour, while the second should be the desired border colour. The shadow with the same background colour will be on top of the shadow with the desired border colour. When this happens, there is a tiny difference in their offset. The shadow with the border colour will only be visible in that little offset gap.</p>
<p>The offset value should be half of the size of the gap, and the shadow that will act as the border should be a tiny bit bigger offset value.</p>
<br>
<br>
<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="YzRBqbW" data-user="ohhelloana" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<span>See the Pen <a href="https://codepen.io/ohhelloana/pen/YzRBqbW">
Experimenting with using box-shadow as a border on top of a grid gap</a> by Ana Rodrigues (<a href="https://codepen.io/ohhelloana">@ohhelloana</a>)
on <a href="https://codepen.io/">CodePen</a>.</span>
</p>
<script async="" src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>
<br>
<p>In the codepen above I was somewhat successful at reproducing this visual effect with a few specific sizes. While the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/gap">gap property</a> accepts quite a few of them, the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow">box-shadow property</a> is more limited (I couldn't get this to work with percentages or calc() for example).</p>
<p>While the pixel option is the one that seems to work as expected in most browsers (desktop and mobile), it is also quite interesting how different lengths will generate visually different thicknesses of this fake border.</p>
<p>Update: <a href="https://chriskirknielsen.com/">Christopher Kirk-Nielsen</a> very kindly forked my codepen and <a href="https://codepen.io/chriskirknielsen/pen/WNYPdxV">experimented with using custom properties and outlines</a>.</p>
Overthinking online participation with my image2023-06-22T00:00:00-00:00https://ohhelloana.blog/overthinking-online-participation/<p>Editing and manipulating someone isn't new. But now that it is more accessible than ever for anyone to do, it feels as if every day I could be risking my safety.</p>
<p>As someone who has been online for over 20 years, the majority of those as a child, teenager and young adult who didn't think much of consequences means that I have been trying to delete traces of myself from the internet for a couple of years. As a typical millennial, I went from extreme oversharing to extreme perusing of every privacy setting when I create an account anywhere.</p>
<p>In the early 2000s, someone could edit an image of me, for example, or as we say, "to Photoshop" me into anything. It could be done as a joke or malicious. It wasn't impossible but rare as most people didn't have the skills to do so. Nowadays, we can't say the same. Image manipulation apps are easy and free to get, as well as filters. With the so-called "deep fakes", your face could be posted on any body quickly and maliciously. The same with your voice.</p>
<p>Many years ago, I was having a conversation with a filmmaker who told me something that still haunts me: "I can't wait for it to be possible to use any dead actor in my films". The disregard for someone's image for profit and the lack of consent isn't new, but somehow tormenting when it is about someone who isn't alive anymore. I thought we were far from it, but <a href="https://web.archive.org/web/20230601124139/https://www.smartenergygb.org/about-us/meet-einstein">it is already happening</a>.</p>
<p>Almost every invention is eventually weaponised to hurt women.</p>
<p>I'm keen to return to being more active in the online community, particularly giving talks again. I'm now stressed about having videos of my face and voice online. It has put me off of doing some videos or even streaming. I've found examples of people who successfully stream without showing their faces or voice. Still, they have a lot more experience in setting up such things. Right now, I don't have the same skill or time. I recognise that perhaps I am overthinking and over-fearful of an unlikely scenario, but it does take one bad event.</p>
<p>I have thought, "While there isn't more protection, I will stay hidden and quiet, " but then the opportunities I want will also be taken away from me.</p>
<p>I don't have a solution. Just concerning thoughts.</p>
<ul>
<li><a href="https://www.bbc.co.uk/news/entertainment-arts-65854112">Deepfake porn documentary explores its 'life-shattering' impact</a></li>
<li><a href="https://www.bbc.co.uk/news/technology-54584127">Fake naked photos of thousands of women shared online</a></li>
</ul>
Some of my favourite memories with my dad2023-06-07T00:00:00-00:00https://ohhelloana.blog/some-memories/<p>When I moved to the UK some years ago, I developed a strange new fear that I was unfamiliar with. Despite living alone for many years at that point, it was the first time I was living abroad. For the first time, I realised that I was hundreds and hundreds of miles away from my parents. I suddenly became afraid of being far from my parents should something happen to them. This new anxiety took over my life. I was finding myself crying over things that hadn’t happened yet. I was also saving money if I needed to buy a last-minute flight. It was one of the reasons why I did therapy some years ago. I needed to let go of things I couldn’t control.</p>
<p>Then the pandemic happened. Something I didn’t even think could happen: flights were grounded. I was terrified that my parents would become seriously ill and I couldn’t see them, just like it happened to loads of people. I was not seeing my parents in person for nearly two years, but we made it.</p>
<p>Three months ago, my biggest fear happened. My dad passed away suddenly, and no money in the world and no amount of anxiety helped me be prepared for it. I got a phone call from my uncle informing me that my dad was suddenly in terrible shape and that it didn’t look good. He told me I should arrange to fly as soon as possible. It was evening, so I only had flights the next day. When I finished booking a flight, I got a phone call telling me my dad had passed away. I wasn’t on time. My biggest fear happened.</p>
<p>In this blog post, and in no particular order, I will share some of my favourite memories with my dad.</p>
<p>My dad used to call me whenever “In the Shadows” played on the radio and put his phone down for me to listen. He knew it was my favourite band and was excited for me every time they played on the radio.</p>
<p>My dad took me to see The Rasmus live in 2005. I was there for hours, queuing to be in the front row. My dad and mum went out for dinner and returned to the venue when the opening act started, and all the fans were already inside. My dad met the band and scored himself row 0 tickets and a free drink! Incredible!</p>
<p>I remember when he taught me how to ride a bicycle.</p>
<p>When I was tiny, we were walking somewhere, and I kept finding money on the floor, and I was over the moon! Turns out my dad was pranking me by throwing money on the floor without me noticing.</p>
<p>Almost every Christmas, there would be fun and complicated wrapped presents, surprises and pranks.</p>
<p>He would play with me and my little friends at my birthday parties when I was little.</p>
<p>His reaction when I shared that I was pregnant.</p>
<p>Our last Christmas together, the first with his granddaughter.</p>
<p>I miss you every day, dad.</p>
One year later2023-05-09T00:00:00-00:00https://ohhelloana.blog/one-year-later/<p>My maternity leave has ended! I was one year at home with my little one. But, it's really like they say: the days are long, but the years are short. Around six months ago, I wrote a blog post called <a href="https://ohhelloana.blog/mastrescence/">Matrescence</a> which resonated with a few people. Meanwhile, as I found some headspace to go back online, I found a few more <a href="https://rachsmith.com/the-inevitable-menty-b/">posts written by other parents</a> that resonated with me too.</p>
<p>Around the time I wrote that post, things were rough in a different way. Driven by the fear of losing myself, I forced myself to attend three conferences (as an attendee) when maybe I wasn't ready. I put so much pressure on myself and on "having it all". I wanted perfection in our society's imperfect and unfair world of motherhood. I would crumble when I didn't achieve perfection (I never did). Finally, around December, I admitted that I needed to pause. Mentally I wasn't okay, so I took myself to see a GP. While we're still bouncing back ideas on whether I have PPD or PMDD, I started medication.</p>
<p>The first weeks were again tough. The side effects were brutal, and it took a while to see a difference. But now, nearly six months later, I am thankful to my past self for taking action. While life wasn't easy (for example, my father passed away unexpectedly a couple of months ago), I coped much better than I would have six months ago. And, of course, while there are moments of sadness, I can finally find joy in many things. Of course, I still worry about milestones and everything that entails in growing a little human, but I don't start the waterworks and can sleep at night.</p>
<p>Besides medication, I also took a proper social media break. It helped that Twitter, my social media of choice to compare myself to others and then feel sad, somehow got even worse, and people started to migrate to other places. But I did delete the app from my phone. Eventually, I completely forgot to check it out. Away from the sight, away from the heart. I stopped checking other places where the tech community hung out and didn't work on my blog. I stopped. And it was the best thing I did.</p>
<p>More recently, I did get back to it and noticed a few things. My network is now much smaller and also more spread out. I suppose many people assumed that my lack of content meant goodbye, so I must admit that it was a bit sad seeing mutuals unfollowing me. It's okay, and I know it isn't personal, but my evil inner voice blames me for not being "out there". On the other hand, I did reconnect with people differently.</p>
<p>I'm happy and excited for this new chapter of my life. I'm so glad to have found peace and some happiness in slowing down. I'm sure some days I will have labrador energy, and I'm sure that other days it will look like I went missing again.</p>
<p>I asked on <a href="https://twitter.com/ohhelloana/status/1651834949203378178">Twitter</a>, <a href="https://mastodon.social/@ohhelloana/110275004846390330">Mastodon</a> and <a href="https://staging.bsky.app/profile/ohhelloana.blog/post/3jufy3vw5gj2o">Bluesky</a> what I missed, and these were the replies. So if you were away for the last 12 months, here it goes!</p>
<ul>
<li><a href="https://www.matuzo.at/blog/2022/100-days-of-more-or-less-modern-css/">100 Days Of More Or Less Modern CSS</a> via <a href="https://danabyerly-junkdrawer.website/">Dana</a> and <a href="https://buttondown.email/sturobson">Stu</a>.</li>
<li><a href="https://www.youtube.com/watch?v=ZuZizqDF4q8">CSS Variable Secrets</a> via <a href="https://matthiasott.com/">Matthias</a>.</li>
<li><a href="https://www.youtube.com/watch?v=8slZJrTK3nE">Scaling CSS Layout Beyond Pixels</a> via <a href="https://matthiasott.com/">Matthias</a>.</li>
<li><a href="https://css-tricks.com/css-cascade-layers/">A Complete Guide to CSS Cascade Layers</a> via <a href="https://matthiasott.com/">Matthias</a>.</li>
<li><a href="https://www.oddbird.net/2022/08/18/cq-syntax/">Use the Right Container Query Syntax</a> via <a href="https://matthiasott.com/">Matthias</a>.</li>
<li><a href="https://www.youtube.com/playlist?list=PL8ZzmQWppBBv7I3d0lYfGze6avk6NdurI">beyond tellerrand 2023 playlist</a> via <a href="https://calumryan.com/">Calum</a>.</li>
<li><a href="https://www.youtube.com/watch?app=desktop&v=uXCipjbcQfM">Rich Harris on frameworks, the web, and the edge</a> via <a href="https://mastodon.social/@bersling@techhub.social">bersling</a>.</li>
<li><a href="https://ui.dev/why-react-renders">The Interactive Guide to Rendering in React</a> via <a href="https://github.com/nitin42">Nitin</a>.</li>
<li>Andy Bell's talk "<a href="https://andy-bell.co.uk/be-the-browsers-mentor-not-its-micromanager/">be the browsers mentor, not it's micro-manager</a>" via <a href="https://fedmentor.dev/">Grace</a> and <a href="https://gregoryhammond.ca/">Gregory</a>.</li>
</ul>
Mastrescence2022-11-14T00:00:00-00:00https://ohhelloana.blog/mastrescence/This post has a content note of pregnancy, birth & mention of previous loss. Visit the link directly if you're okay with reading it.TIL: A situation where the <svg> doesn't fully appear in Safari.2022-02-01T00:00:00-00:00https://ohhelloana.blog/til-use-image-pattern-safari/<p>I wasn't entirely sure how to title this blog post as it isn't straightforward to describe it but here it goes. I should also preface that my knowledge of SVGs is quite high level so maybe someone who is may more experienced than me would have spotted this out easily but I feel like this warrants a post because it doesn't happen in all browsers and quirks are annoying to solve.</p>
<p>Recently, we had a very intricate SVG that wasn't rendering as expected in Safari. Chrome, Edge and Firefox seemed to be happy with it. This SVG was an illustration and its code was automatically generated by a design platform and it included a raster image.</p>
<p>The following isn't the actual SVG but a high level presentation of the structure of the SVG. I substituted some random values with the word <code>value</code> as they aren't particularly important to the goal or issue.</p>
<pre class="language-svg"><code class="language-svg"><br><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>svg</span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>600<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>300<span class="token punctuation">"</span></span> <span class="token attr-name">viewBox</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>0 0 600 300<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>defs</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>pattern</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>pattern-a<span class="token punctuation">"</span></span> <span class="token attr-name">patternUnits</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>objectBoundingBox<span class="token punctuation">"</span></span> <span class="token attr-name">x</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100%<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100%<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>use</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#image-a<span class="token punctuation">"</span></span> <span class="token attr-name">transform</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>scale(value)<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>pattern</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>image</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>image-a<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>1223<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>2190<span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xlink:</span>href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>data:image/png;base64,VALUE<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>defs</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>path</span> <span class="token attr-name">d</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value value<span class="token punctuation">"</span></span> <span class="token attr-name">fill</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>url(#pattern-a)<span class="token punctuation">"</span></span> <span class="token attr-name">fill-rule</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>nonzero<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span> <br> <span class="token comment"><!--Lots of paths from here on without any links to patterns in the fill attribute--></span><br><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>svg</span><span class="token punctuation">></span></span><br></code></pre>
<p>When opened in Safari, all the <code>path</code> would render as expected except the <code>path</code> that was requesting to be filled with a pattern. So visually, people could describe it as "half of the image doesn't appear". It took me a bit to understand what was the problem because the svg file was really long.</p>
<p>Long story short: either the <code>pattern</code> or the <code>use</code> wasn't finding <code>#image-a</code> in Safari which looks like it might be a scope issue.
</p><p>I moved the <code>image</code> to be inside the <code>pattern</code> and it began to appear twice. Which made sense. So my solution was to delete the <code>use</code> and use the <code>image</code> directly inside the <code>pattern</code>.</p>
<pre class="language-svg"><code class="language-svg"><br><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>svg</span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>600<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>300<span class="token punctuation">"</span></span> <span class="token attr-name">viewBox</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>0 0 600 300<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>defs</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>pattern</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>pattern-a<span class="token punctuation">"</span></span> <span class="token attr-name">patternUnits</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>objectBoundingBox<span class="token punctuation">"</span></span> <span class="token attr-name">x</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100%<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100%<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>image</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>image-a<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>328<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>329<span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xlink:</span>href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>data:image/png;base64,VALUE<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>pattern</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>defs</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>path</span> <span class="token attr-name">d</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value value<span class="token punctuation">"</span></span> <span class="token attr-name">fill</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>url(#pattern-a)<span class="token punctuation">"</span></span> <span class="token attr-name">fill-rule</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>nonzero<span class="token punctuation">"</span></span><span class="token punctuation">/></span></span> <br> <span class="token comment"><!--Lots of paths from here on without any links to patterns in the fill attribute--></span><br><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>svg</span><span class="token punctuation">></span></span><br></code></pre>
<p>The image ended up needing some adjustments to its width and height but this finally fixed it in all browsers.</p>
<p>Now I know.</p>
Bookmarks that were collecting dust2021-11-09T19:38:23.465-00:00https://ohhelloana.blog/bookmarks-that-were-collecting-dust/<p>Here are some of the things that have been collecting dust in my bookmarks since June. I missed a lot of things shared online since. I hope one day I can catch up. This really isn't my year when it comes to sharing bookmarks. Luckily, the world won't end because of it!</p>
<p>Bookmarks related to tech and web development</p>
<ul>
<li><a href="https://www.smashingmagazine.com/2021/10/guide-debugging-css/">A Guide To CSS Debugging</a> by Stephanie Eckles.</li>
<li><a href="https://www.smashingmagazine.com/2021/10/object-fit-background-size-css/">A Deep Dive Into object-fit And background-size In CSS</a> by Ahmad Shadeed.</li>
<li><a href="https://www.smashingmagazine.com/2021/10/respecting-users-motion-preferences/">Respecting Users’ Motion Preferences</a> by Michelle Barker.</li>
<li><a href="https://podcast-accessibility.com/">Podcast accessibility</a>.</li>
<li><a href="https://skamille.medium.com/an-incomplete-list-of-skills-senior-engineers-need-beyond-coding-8ed4a521b29f">An incomplete list of skills senior engineers need, beyond coding</a> by Camille Fournier.</li>
<li><a href="https://doesmysitedeserverecognition.com/">Does my site deserve recognition?</a></li>
<li><a href="https://thewalrus.ca/the-double-exploitation-of-deepfake-porn/">The Double Exploitation of Deepfake Porn</a> by Maggie MacDonald.</li>
<li><a href="https://sallylait.com/blog/2021/06/17/advice-for-my-younger-dev-self/">Advice for my younger developer self</a> by Sally Lait.</li>
<li><a href="https://www.smashingmagazine.com/2021/06/complete-guide-accessibility-tooling/">A Complete Guide To Accessibility Tooling</a> by Nic Chan.</li>
<li><a href="https://tinytools.directory/">Open source, experimental, and tiny tools roundup</a>.</li>
<li><a href="https://september.city/nostalgia/">Nostalgia is bullshit</a></li>
<li><a href="https://greensock.com/cheatsheet/">GSAP 3 Cheat Sheet</a></li>
<li><a href="https://blog.rentpathcode.com/analyzing-performance-e7aed196df64">Stop building websites for iPhones</a> by David Sommers.</li>
<li><a href="https://web.dev/telegraph/">Improving Cumulative Layout Shift at Telegraph Media Group</a> by Chris Boakes.</li>
<li><a href="https://css-irl.info/inspecting-sizes/">Inspecting Sizes</a> by Michelle Barker.</li>
<li><a href="https://sia.codes/posts/render-blocking-resources/">How to Eliminate Render-Blocking Resources: a Deep Dive</a> by Sia Karamalegos.</li>
<li><a href="https://www.scottohara.me/blog/2021/07/16/section.html">Accessibility of the section element</a> by Scott O'Hara.</li>
<li><a href="https://adactio.com/articles/18580">The State Of The Web</a> by Jeremy Keith.</li>
<li><a href="https://accessibility.blog.gov.uk/2021/09/21/an-update-on-the-accessibility-of-conditionally-revealed-questions/">An update on the accessibility of conditionally revealed questions</a></li>
<li><a href="https://ericwbailey.design/writing/what-they-dont-tell-you-when-you-translate-your-app/">What they don’t tell you when you translate your app</a> by Eric W Bailey.</li>
<li><a href="https://www.smashingmagazine.com/2021/09/improving-accessibility-of-markdown/">Improving The Accessibility Of Your Markdown</a> by Eric W Bailey.</li>
<li><a href="https://spees.dev/2020/01/30/on-tech-management/">On Tech Management</a> by Shelby Spees.</li>
<li><a href="https://blog.cloudflare.com/building-a-pet-cam-using-a-raspberry-pi">Building a Pet Cam using a Raspberry Pi, Cloudflare Tunnels and Teams</a> by Mohak Kataria.</li>
<li><a href="https://believermag.com/ghosts/">I didn’t know how to write about my sister’s death - so I had AI do it for me</a> by Vauhini Vara.</li>
<li><a href="https://blog.jim-nielsen.com/2021/quibbles-with-social-share-imagery/">Quibbles With Social Share Imagery</a> by Jim Nielsen.</li>
<li><a href="https://www.latimes.com/entertainment-arts/story/2021-07-26/la-et-anthony-bourdain-deepfake-ai-voice-documentary-audio-cgi">AI deepfakes of Anthony Bourdain’s voice are only a taste of what’s coming</a> by Matt Pearce.</li>
</ul>
<p>Other bookmarks</p>
<ul>
<li><a href="https://frankchimero.com/blog/2020/burnout-list/">The Burnout List</a> by Frank Chimero.</li>
<li>"<a href="https://twitter.com/FernRiddell/status/1407294336962863113">transphobic hate has stolen the colours of the suffragettes to identify themselves</a>"</li>
<li><a href="https://reallifemag.com/why-cant-we-be-friends/">Why Can’t We Be Friends</a> by Brendan Mackie.</li>
<li><a href="https://unsilencetheconversation.com/">#UnsilenceTheConversation</a> Content note: pregnancy loss</li>
<li><a href="https://amycutler.net/films">Dr. Amy Cutler - films</a>.</li>
</ul>
So I am now a naturalised citizen...2021-07-07T16:53:36.809-00:00https://ohhelloana.blog/so-i-am-now-a-naturalised-citizen/<p>One year and one day after receiving my settled status I officially became naturalised and am now a British citizen.</p>
<p>I’m grateful for having been welcomed here (despite Brexit!) and making it “official” with the country I now call my home and for Portugal to allow dual citizenship.</p>
<p>It is an accomplishment but it was also due to privilege and luck. There are so many other people who will not be as lucky as me and that is deeply unfair.</p>
<p>Six years later, one settled status application, one English exam, one “Life in the UK'' exam, one long naturalisation application and at least £1500 later, I had a ceremony in Wandsworth Town Hall alongside 26 others from at least 10 different countries.</p>
<p><img src="https://ohhelloana.blog/assets/posts/ceremony.jpg" alt="Me holding my naturalisation certificate next to a photo of the Queen." title="Photo from ceremony"></p>
<p>It is unrealistic to expect that everyone can go through this process. I cried a few times and I am fully aware I still had the easiest route. One of the easiest and quickest examples of privilege is the fact that the moment anything has a monetary cost, it isn’t accessible to everyone.</p>
<p>I get asked a lot if I “feel British”. I do… whatever that means. But I am also very Portuguese. This is my home now. I have my house, my life, some of my friends and family here. In a light tone, I love laughing about memes from two countries. I love knowing more than one language. I appreciate feeling a part of both “cultures”.</p>
<p>It’s hard to care about two countries. It’s really hard. Some Portuguese folks have expressed disappointment in me. They see it as a betrayal. I’m met with a lot of emotions if I criticise current affairs that are happening in Portugal. It’s complicated because I don’t fit in the narrative that people expect: the immigrant who wants to go back “home”. This doesn’t mean that I don’t miss many things from the country I was born in and lived 80% of my life. But these 20% have been the best years of my life.</p>
<p>Sometimes I am asked if I would have done this process if Brexit wasn't a thing. The answer is "yes". Maybe not immediately after five years but I would have likely done it anyways.</p>
<hr>
<p>Here’s a breakdown of my process as it happened to me at the time along with lots of personal notes just like you would find on a recipe website!</p>
<p><em>This isn’t a guide and isn’t intended to be a guide. This was my experience and you should look up all the latest guidance from the government website.</em></p>
<h2>One way ticket</h2>
<p>In March 2015 I moved to London. At the time Brexit was already a topic of conversation but like everyone else, I didn’t think it was actually going to happen. Then the 2015 general elections happened followed by a year of xenophobic campaigns the 2016 Brexit referendum happened. It is now part of my core memories, that morning in June when we woke up (and we were doing holidays in Spain) and we saw the news.</p>
<p>Before I moved to London I had no clue what was happening here politics wise but shortly after my arrival, the Brexit threat was constantly living in my head. So I never really experienced what it was like to immigrate to a country within the European Union and simply live there without the deportation fear.</p>
<p>The last five years of my life have been with a tiny little constant fear that the worst of the worst could happen. I ended up writing about <a href="https://ohhelloana.blog/about-the-b-word/">the anxiety Brexit gave me</a> in 2019.</p>
<p>After three years of living in the UK, I applied for <a href="https://www.gov.uk/uk-residence-card">the now-defunct residence card</a>. I remember it being a very long form with a lot of attachments of evidence that I live here. At the time I paid around £60 (I can’t remember the exact value) for the application and received a little blue booklet with my photo. It had an expiration date of December 2020.</p>
<p>Years went by and I decided not to apply for pre-settled status and wait until my five year anniversary to apply for settled status. This was backed due to the fact that I got married in late 2019 and changed my name. Then the pandemic began.</p>
<p>I had just changed my name in the Portuguese consulate in November 2019 and that meant that I had to get a new Portuguese passport and a new identity card and the pandemic meant that it became incredibly complicated to renew these.</p>
<p>In March 2020 it was the five year anniversary so technically I could apply for settled status. I tried to do it online but at that point, I didn’t have any identification document with my new name that had the chip (so that we could verify my document with a mobile phone) and they were not accepting identification documents via post (because of the pandemic). I pleaded with the Portuguese consulate as soon as it reopened to give me an appointment to renew my documents.</p>
<p>At last, in June 2020 I was finally able to apply for settled status. Waiting for June also meant that I had five full years of tax returns. We’re very lucky that we were tech-savvy enough for it and that we had one of the phones that were able to read the chip of my passport. I received the approval around two weeks later.</p>
<p>Given the five year mark, I decided to look into citizenship and I had two options: either normal naturalisation application or naturalisation by marriage.</p>
<p>There were some big differences at the time: if I did the normal naturalisation process I couldn’t immediately apply and I would have to wait another year after receiving my settled status. I would also have to provide all my travel history for the last five years. While the naturalisation via marriage I could apply immediately after receiving settled status and only required a three-year travel history.</p>
<p>I was impatient so I picked the option that would allow me to immediately apply. The other reason was that I somehow lost all the emails with the flights I took in 2015 and 2016 (I was flying a lot back to Portugal when I first moved here) so I wasn’t completely sure I was able to provide the correct travel dates.</p>
<p>Despite this being last year, I don’t fully remember why I didn’t immediately begin the naturalization process. I think I was feeling really sad and anxious over the pandemic so I took a little break and searched what I had to do first. And I think it was because things were a bit closed up and I struggled to book the two tests I needed.</p>
<p>Meanwhile, we had a family friend who also went through the same process who very kindly did a video call with me to explain the process. Our friend recommended that I book and apply for everything with the same identification card (in this case I decided to use my Portuguese national ID card for consistency).</p>
<p>Things I did before beginning my application:</p>
<ul>
<li>Ensure I had my passport, identity card, bills, paperwork, documents etc with my new name;</li>
<li><a href="https://www.gov.uk/life-in-the-uk-test">Book the “Life in the UK” test</a>;</li>
<li><a href="https://www.gov.uk/guidance/prove-your-english-language-abilities-with-a-secure-english-language-test-selt">Book the test that assesses my English skills</a>;</li>
<li>Ordered a copy of my wedding certificate;</li>
</ul>
<p>Both my tests were in Croydon and in the same week in October 2020. I took the week off work to study and prepare.</p>
<h2>“Life in the UK” test</h2>
<p>At the time I ordered the whole pack of books to read and practise mock tests along with the official app so that I could test on my mobile devices. I found the mock tests to be very easy and repetitive so there was a shock in the actual test where it was quite difficult. I passed - but I found it very difficult compared to all the mock tests I took during the week. The questions I received were heavily focused on history and politics. I received my results on their website ten minutes after finishing the test (notified via email). I knew that I had some questions wrong but it didn't tell me which. For example, it asked who was the Prime Minister after Margaret Thatcher. I know I replied to that one incorrectly.</p>
<p>While waiting for my test I met someone who was taking the test for the 5th time. This nice old lady told me that she was living with her daughter and she needed citizenship to be able to stay in the country. Because of COVID, we couldn’t stay around but I do hope she passed that day and I think about her often.</p>
<h2>Testing my English skills</h2>
<p>I personally found the page about booking the English skills tests really complicated to understand. After advice from our friend and from the internet I booked: <a href="https://www.trinitycollege.com/qualifications/SELT/UKVI">Graded Examination in Spoken English (GESE) Grade 5</a> (CEFR Level B1.1). It was incredibly stressful making sure you’re booking the correct test at the correct place. Once I decided on an approved venue, there was a small bit of anxiety about booking something so expensive (£150) not via a gov.uk website. I didn’t buy any of the support materials offered. I only downloaded the “<a href="https://duckduckgo.com/?q=SELT+topic+form&atb=v167-1&iar=images&iax=images&ia=images">Topic form</a>” and decided to talk about my job (not the most creative I know).</p>
<p>Covid meant that the whole thing was still done in a site but instead of speaking to someone in person, I was taken to a small room where I would be in a video call with the examiner.</p>
<p>We had a small introduction chat and I brought up the topic and carried on talking. I didn’t notice the time going by but eventually, the examiner asked me if there was anything I would like to ask her. I panicked! I didn’t think of any particular questions so I asked something very silly like “have you met a lot of web developers?” and she said “I meet people from all sorts of jobs” and she ended it. So… because I overthink every social interaction I have, I began to be terrified of the idea that maybe I failed because I wasn’t social enough. I left the room and I had to wait one day to receive provisional results via email. I received them 24 hours later and my results were AA (Distinction)!</p>
<p>I waited a couple of weeks and later received the certification in the post (which is necessary for the application).</p>
<h2>The application</h2>
<p>I began filling the application and I think it took me around a week to finish it. I had to include information like name changes, my parents, employment history, travel history, address history, wedding details, husband’s details as well as two referees. The referees' section took some time because one of them had to be someone of an “<a href="https://www.gov.uk/countersigning-passport-applications/accepted-occupations-for-countersignatories">approved profession</a>”. Luckily a close friend of ours is a solicitor and lives a 15-minute walk from us so we asked him. The application was during lockdown so we had to find a place to take passport photos for me and to be able to print the referee form.</p>
<p>My application was stressful but straightforward - my life situation at the time meant that I didn’t enter other loops in the application such as dependants, living children, previous marriages or convictions and other penalties.</p>
<p>I was so nervous when I added my card to pay £1349.20 and submit it! I lost track of how many times I reviewed the application. Once submitted it is done - nothing can be amended and a new application (and I presume new payment) would have to be submitted.</p>
<p>After it was done I received an email with the next instructions. The next step was to do my document submission and book my biometrics appointment.</p>
<h2>Document submission and biometrics appointment</h2>
<p>We’re now in November 2020. I wanted to book that last appointment as soon as possible in case another lockdown happened and things closed down again. I remember I stayed up until midnight to refresh the website to look for appointments.</p>
<p>There was another reason why I was so keen to have an appointment as soon as possible. One of the required documents was:</p>
<blockquote>
<p>“Evidence that you have been in the UK lawfully for your 3 or 5-year qualifying residence period. This should be evidence that you were here as a worker, student, self-employed, self-sufficient, retired or incapacitated person.“</p>
</blockquote>
<p>It was really hard to find answers for what could qualify as a valid document that would satisfy this requirement until I remembered my residence card. The residence card would expire by the end of that year. I also included all my P60 just in case.</p>
<p>We’re all entitled to a free appointment but if you’re in a hurry you can pay quite a lot for some appointments. I remember seeing slots available for appointments that would be either £69 or even close to £200 but I decided to try and get a free appointment.</p>
<p>I booked it via the <a href="https://www.ukvcas.co.uk/home-internal">UK Visa and Citizenship Application Services</a> and I paid extra to have my documents checked and documents scanned (£72.49 in total because one of them had a 50% discount at the time). This is because I don’t have a scanner and I was too afraid of not doing the scan up to the standards.</p>
<p>In my booking confirmation, I received a PDF attachment that included a QR code that would later be needed to attend it. I’m mentioning this because the day of this appointment was also the day all google services went down. So as I was about to leave my house to go to this appointment I couldn’t load that PDF and until the services came back up I was really stressed.</p>
<p><img src="https://ohhelloana.blog/assets/posts/screen-shot-2021-06-25-at-17.31.53.png" alt="Screenshot of a tweet from me saying Guess who has a biometrics appointment today for the UK Visa and Citizenship Application Services and sent the appointment's QR code to their Gmail account." title="Tweet screenshot"></p>
<p>During the appointment, the documents I brought were scanned and my biometrics were taken. All my documents were returned to me at the same appointment.</p>
<h2>The wait and ceremony</h2>
<p>I received the decision for my application three months and eight days later. It included instructions for the next steps. I had to wait for an invitation letter in order to be able to book my ceremony in my town hall which took nearly a month to arrive.</p>
<p>I immediately did everything I could to book the earliest ceremony possible which ended up being two months later.</p>
<p>Everyone in my local town hall was super nice and they gave us a passport case (I don’t know if this happens in other town halls). And again, because of the pandemic, we weren’t allowed to bring our family to watch it and the national anthem was played instead of sung.</p>
<p>The day after my ceremony I applied for my first passport (June 2021). I chose to do it all online. It requested again a referee who would confirm my identity so I asked the same friend as before. This time, this step was possible to be done completely online. All they had to do was sign in with the invitation link and answer some questions. I posted the naturalisation certificate that I received at the ceremony and my Portuguese passport the following day. Eight days later I received a message that my passport was approved and two weeks later I had my British and Portuguese passport and my certificate.</p>
<p>I’m not going to lie: I’m truly looking forward to being able to vote!</p>
TIL: Fixing horizontal scrolls due to full bleed blocks without overflow: hidden2021-07-05T00:00:00-00:00https://ohhelloana.blog/til-fix-scrollbar-full-beed/<p>A while back I worked on a project with an existing seven year old codebase and it was my task to refresh the design of it without a rebuild. This meant that I found a few constraints and one of them was allowing full bleed components (like a newsletter banner) which didn’t exist before.</p>
<p>Luckily, Andy Bell shared <a href="https://piccalil.li/tutorial/creating-a-full-bleed-css-utility/">how to create a full bleed CSS utility</a> which was what I ended up using. Towards the end of the article, in the section <a href="https://piccalil.li/tutorial/creating-a-full-bleed-css-utility/#heading-how-the-%22full-bleed%22-utility-works">how the “full-bleed” utility works</a>, Andy points out that using that CSS method might allow the possibility of having horizontal scrollbars and suggests using <code>“overflow-x: hidden”</code> in the <code>body</code> tag to fix it.</p>
<p>Since this all worked fine and as expected, I overlooked the reason why having to hide the overflow was necessary. Tepy Thai explains <a href="https://tepy.dev/til/why-100vw-causes-horizontal-scroll">why 100vw causes horizontal scrollbar</a>:</p>
<blockquote cite="https://tepy.dev/til/why-100vw-causes-horizontal-scroll">
<p>When you set an element's width to 100vw, the element's width now will be the whole view width of the browser and the important part is 100vw does not include the vertical scrollbar's width into its calculation at all. Therefore, when there is a vertical scrollbar, the total width will be the sum of the element's width and the vertical scrollbar's width, which causes the overflow on the x-axis and thus the horizontal scrollbar.</p>
<footer>Tepy Thai, <cite>Why 100vw causes horizontal scrollbar</cite></footer>
</blockquote>
<p>And then last week I was presented with a problem. Another developer in this project messaged me and asked if we could delete the <code>overflow-x: hidden</code> from the <code>body</code>. They were trying to build a feature that uses <code>position: sticky</code> and as it turns out, there is a <a href="https://github.com/w3c/csswg-drafts/issues/865">ticket reporting that position sticky inside overflow hidden doesn’t work</a>.</p>
<p>A solution could be to do a refactor and create a <a href="https://www.joshwcomeau.com/css/full-bleed/">full-bleed layout using CSS grid</a> like Joshua Comeau suggests. Due to a variety of constraints a refactor wasn’t possible.</p>
<p>After making the overflow visible, I needed to fix the horizontal scrollbar and that led me to an article from Jonnie Hallman called “<a href="https://destroytoday.com/blog/100vw-and-the-horizontal-overflow-you-probably-didnt-know-about">100vw and the horizontal overflow you probably didn’t know about</a>”. My solution was based on the one presented in that article.</p>
<p>I’m not feeling 100% confident over my solution - but it works!</p>
<h2>Solution (I think)</h2>
<h3>Javascript</h3>
<pre class="language-js"><code class="language-js"><br><span class="token comment">//remove small horizontal scrollbar when a block is full bleed</span><br><span class="token keyword">var</span> scrollbarWidth <span class="token operator">=</span> window<span class="token punctuation">.</span>innerWidth <span class="token operator">-</span> document<span class="token punctuation">.</span>body<span class="token punctuation">.</span>clientWidth<span class="token punctuation">;</span><br><span class="token keyword">var</span> halfScrollbarWidth <span class="token operator">=</span> scrollbarWidth <span class="token operator">/</span> <span class="token number">2</span><span class="token punctuation">;</span><br>document<span class="token punctuation">.</span>body<span class="token punctuation">.</span>style<span class="token punctuation">.</span><span class="token function">setProperty</span><span class="token punctuation">(</span><span class="token string">'--scrollbarWidth'</span><span class="token punctuation">,</span> <span class="token template-string"><span class="token template-punctuation string">`</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>scrollbarWidth<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">px</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span><br>document<span class="token punctuation">.</span>body<span class="token punctuation">.</span>style<span class="token punctuation">.</span><span class="token function">setProperty</span><span class="token punctuation">(</span><span class="token string">'--halfScrollbarWidth'</span><span class="token punctuation">,</span> <span class="token template-string"><span class="token template-punctuation string">`</span><span class="token interpolation"><span class="token interpolation-punctuation punctuation">${</span>halfScrollbarWidth<span class="token interpolation-punctuation punctuation">}</span></span><span class="token string">px</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">)</span><span class="token punctuation">;</span><br></code></pre>
<p>My javascript steps were similar to the ones in <a href="https://destroytoday.com/blog/100vw-and-the-horizontal-overflow-you-probably-didnt-know-about">Jonnie Hallman’s article</a> except that when I needed to set the <code>margin-left</code> I needed to take into account the possible existence of the scrollbar. After some poking, it looked like half of the width of the scrollbar would fix that.</p>
<h3>CSS</h3>
<pre class="language-css"><code class="language-css"><br><span class="token property">--viewportWidth</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span>100vw - <span class="token function">var</span><span class="token punctuation">(</span>--scrollbarWidth<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span><br><span class="token comment">/* finalHalfScrollbar: value must be negative */</span><br><span class="token property">--finalHalfScrollbar</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span><span class="token function">var</span><span class="token punctuation">(</span>--halfScrollbarWidth<span class="token punctuation">)</span> * -1<span class="token punctuation">)</span><span class="token punctuation">;</span><br><br><span class="token property">width</span><span class="token punctuation">:</span> 100%<span class="token punctuation">;</span><br><span class="token property">width</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span>100vw - 15px<span class="token punctuation">)</span><span class="token punctuation">;</span><br><span class="token property">width</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--viewportWidth<span class="token punctuation">)</span><span class="token punctuation">;</span><br><span class="token property">margin-left</span><span class="token punctuation">:</span> 0<span class="token punctuation">;</span><br><span class="token property">margin-left</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span>50% - 50vw - <span class="token function">var</span><span class="token punctuation">(</span>--finalHalfScrollbar<span class="token punctuation">,</span> -7px<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span><br></code></pre>
<p>As a fallback - which I am not very confident about - in case javascript is disabled, is giving the scrollbar a width of 15px and then I used half of it as an integer (the 15px was the most common value from the browsers I tested). I also tried to cover the scenario where CSS custom properties and vw properties weren't supported, so in this case it would be contained within the width of the parent. It seems to work and I suppose that the worst case scenario is a horizontal scrollbar in the end.</p>
<p>There's a good chance there's a better solution for this but I did learn something regardless and do enjoy when CSS makes me scratch my head!</p>
More bookmarks from 20212021-06-03T18:10:07.942-00:00https://ohhelloana.blog/more-bookmarks-from-2021/<p>I'm not gonna lie - I'm quite disappointed in myself that I still haven't got my poop together and gone back to doing this monthly. I managed to write some blog posts since March but all those happened because I milked really hard the surge of energy I had at that moment.</p>
<p>As I've gone a bit quieter, the following quote has been haunting me every time I sign in on Twitter.</p>
<blockquote>
<p>On the platform, silence isn’t an option, at least not if you want the network to remember you exist.</p>
</blockquote>
<p>Quote via <a href="https://www.documentjournal.com/2021/01/the-internet-didnt-kill-counterculture-you-just-wont-find-it-on-instagram/">The internet didn’t kill counterculture—you just won’t find it on Instagram</a>.</p>
<p>Bookmarks related to tech and web development</p>
<ul>
<li><a href="https://www.stefanjudis.com/today-i-learned/how-to-use-language-dependent-quotes-in-css/">How to display language-specific quotes in CSS</a> by Stefan Judis</li>
<li><a href="https://www.sarasoueidan.com/blog/accessible-icon-buttons/">Accessible Icon Buttons</a> by Sara Soueidan.</li>
<li><a href="https://www.thetimes.co.uk/article/sharing-deepfake-images-must-be-made-a-crime-thf20kqw2">Sharing deepfake images ‘must be made a crime’</a> by Jonathan Ames.</li>
<li><a href="https://kittygiraudel.com/2021/02/17/hiding-content-responsibly/">Hiding content responsibily</a> by Kitty Giraudel.</li>
<li><a href="https://iainbean.com/posts/2021/system-fonts-dont-have-to-be-ugly/">System fonts don’t have to be ugly</a> by Iain Bean.</li>
<li><a href="https://charity.wtf/2021/02/19/questionable-advice-how-can-i-sniff-out-bad-managers-while-interviewing-for-a-job/">Questionable Advice: “How can I sniff out bad managers while interviewing for a job?”</a> by Charity Majors.</li>
<li><a href="https://ishadeed.com/article/css-logical-properties/">Digging Into CSS Logical Properties</a> by Ahmad Shadeed.</li>
<li><a href="https://dev.to/georgedoescode/a-generative-svg-starter-kit-5cm1">A Generative SVG Starter Kit</a> by George Francis.</li>
<li><a href="https://infrequently.org/2021/03/the-performance-inequality-gap/">The Mobile Performance Inequality Gap, 2021</a> by Alex Russell.</li>
<li><a href="https://www.pennlive.com/news/2021/03/pa-woman-created-deepfake-videos-to-force-rivals-off-daughters-cheerleading-squad-police.html">Pa. woman created ‘deepfake’ videos to force rivals off daughter’s cheerleading squad</a> by Jana Benscoter.</li>
<li><a href="https://leaddev.com/career-paths-progression-promotion/why-individual-contributor-tetris-block">Why is an individual contributor like a Tetris block?</a> by Denise Yu.</li>
<li><a href="https://remysharp.com/til/css/perfect-fullscreen-43-aspect-ratio">Perfect fullscreen 4:3 aspect ratio</a> by Remy Sharp.</li>
<li><a href="https://dev.to/afif/100-underline-overlay-animation-the-ultimate-css-collection-4p40">100 underline/overlay animations | The ultimate CSS collection</a> by Temani Afif.</li>
<li><a href="https://www.noiseandgradient.com/?chaos=0.1&colors=%23ed625d-%2342b6c6-%23f79f88-%23b2dfe6-%2303232d&grain=0.1">Noise & gradient</a> by Clara B.</li>
<li><a href="https://www.documentjournal.com/2021/01/the-internet-didnt-kill-counterculture-you-just-wont-find-it-on-instagram/">The internet didn’t kill counterculture—you just won’t find it on Instagram</a> by Caroline Busta.</li>
<li><a href="https://kittygiraudel.com/2021/03/22/a-tale-of-languages/">A tale of languages</a> by Kitty Giraudel.</li>
<li><a href="https://codepen.io/michellebarker/pen/KKagoLy" title="Kentrosaurus">Kentrosaurus</a> by Michelle Barker.</li>
<li><a href="https://css-tricks.com/mistakes-ive-made-as-an-engineering-manager/">Mistakes I’ve Made as an Engineering Manager</a> by Sarah Drasner.</li>
<li><a href="http://www.craigabbott.co.uk/blog/defining-a-strategy-for-accessibility">Defining a strategy for accessibility</a> by Craig Abbott.</li>
<li><a href="https://jvns.ca/blog/2017/04/27/no-feigning-surprise/">No feigning surprise</a> by Julia Evans.</li>
<li><a href="https://www.nytimes.com/2021/04/07/opinion/google-job-harassment.html">After Working at Google, I’ll Never Let Myself Love a Job Again</a> by Emi Nietfeld.</li>
<li><a href="https://www.rollingstone.com/culture/culture-features/target-sex-trafficking-tiktok-hoax-1151665/">A Target Sex-Trafficking Hoax Is Going Viral on TikTok</a> by EJ Dickson.</li>
<li><a href="https://ericwbailey.design/writing/how-to-make-an-ineffective-404-page/">How to make an ineffective 404 page</a> by Eric W Bailey.</li>
<li><a href="https://www.matuzo.at/blog/html-boilerplate/">My current HTML boilerplate</a> by Manuel Matuzovic.</li>
<li><a href="https://www.technologyreview.com/2021/04/02/1021635/beauty-filters-young-girls-augmented-reality-social-media/">Beauty filters are changing the way young girls see themselves</a> by Tate Ryan-Mosleyarchive.</li>
<li><a href="https://piccalil.li/tutorial/build-a-fancy-hover-animation">Build a fancy hover animation</a> by Andy Bell.</li>
<li><a href="https://www.youtube.com/watch?v=96DCTASFniI">The Layers of the Web</a> by Jeremy Keith.</li>
<li><a href="https://devyarns.com/logical-focus-order/">Understanding Logical Focus Order</a> by Rachel Leggett.</li>
<li><a href="https://ishadeed.com/article/tiny-enhancements-in-css/">The Beauty Of Tiny Enhancements In CSS</a> by Ahmad Shadeed.</li>
<li><a href="https://adrianroselli.com/2021/01/bulletproofing-embedded-tweets.html">Bulletproofing Embedded Tweets</a> by Adrian Roselli.</li>
<li><a href="https://css-tricks.com/the-importance-of-career-laddering/">The Importance of Career Laddering</a> by Sarah Drasner.</li>
<li><a href="https://github.com/andy-piccalilli/11ty-base-no-blog">Project base for Eleventy Sites</a> by Andy Bell.</li>
<li><a href="https://www.bloomberg.com/news/articles/2021-04-22/how-to-go-viral-on-tiktok-like-megan-thee-stallion-play-the-app-s-game">How TikTok Chooses Which Songs Go Viral</a> by Shelly Banjo.</li>
<li><a href="https://brianlovin.com/writing/make-a-personal-changelog">Make a personal changelog</a> by Brian Lovin.</li>
<li><a href="https://webdevlaw.uk/2021/04/20/your-cut-and-keep-guide-to-the-unregulated-wild-west-internet/">Your cut-and-keep guide to the “unregulated wild west internet”</a> by Heather Burns.</li>
<li><a href="https://github.com/davatron5000/awesome-standalones">Awesome standalones</a> by Dave Rupert.</li>
<li><a href="https://martinschneider.me/articles/going-public/">Going public</a> by Martin Schneider.</li>
<li><a href="https://lab.hakim.se/flora/">Flora</a> by Hakim El Hattab.</li>
<li><a href="https://www.phirephoenix.com/blog/2021-05-03/privacy">Left alone, together</a> by Jenny Zhang.</li>
<li><a href="https://css-tricks.com/how-to-add-a-double-border-to-svg-shapes/">How to Add a Double Border to SVG Shapes</a> by Mariana Beldi.</li>
<li><a href="https://github.com/rubymorillo/pocket-tech-writing-list">The Pocket Technical Writing List</a> by Stephanie Morillo.</li>
<li><a href="https://css-irl.info/creating-generative-svg-characters/">Creating Generative SVG Characters</a> by Michelle Barker.</li>
<li><a href="https://testingaccessibility.com/">Learn How to Build Accessible Web Apps</a> by Marcy Sutton.</li>
<li><a href="https://maggieappleton.com/nontechnical-gardening">Digital Gardening for Non-Technical Folks</a> by Maggie Appleton.</li>
<li><a href="https://www.deque.com/blog/auditing-design-systems-for-accessibility/">Auditing Design Systems for Accessibility</a> by Anna E. Cook.</li>
<li><a href="https://www.tpgi.com/accessibility-testing-as-a-screen-reader-user/">Accessibility testing as a screen reader user</a> by Isabel Holdsworth.</li>
<li><a href="https://www.sarasoueidan.com/blog/tips-for-reader-modes/">Design for reading: tips for optimizing content for Reader modes and reading apps</a> by Sara Soueidan.</li>
<li><a href="https://technology.blog.gov.uk/2021/04/19/simple-things-are-complicated-making-a-show-password-option/">Simple things are complicated: making a show password option</a> by Andy Sellick.</li>
<li><a href="https://visitmy.website/2020/11/01/why-i-write-weeknotes/">Why I write weeknotes</a> by Steve Messer.</li>
<li><a href="https://bnijenhuis.nl/notes/2021-05-10-automatically-generate-open-graph-images-in-eleventy/">Automatically generate open graph images in Eleventy</a> by Bernard Nijenhuis.</li>
<li><a href="https://ericwbailey.design/writing/dont-use-custom-css-mouse-cursors/">Don’t use custom CSS mouse cursors</a> by Eric W Bailey.</li>
<li><a href="https://hiddedevries.nl/en/blog/2021-05-24-introducing-an-eleventy-starter-project-for-wcag-reports">Introducing: an Eleventy starter project for WCAG reports</a> by Hidde de Vries.</li>
<li><a href="https://uxdesign.cc/inclusive-ux-in-an-era-of-anxiety-dc89c39ec202">Inclusive UX in an era of anxiety</a> by Cara Brashears.</li>
<li><a href="https://shkspr.mobi/blog/2021/05/what-are-unusual-characters/">What are “unusual characters”</a> by Terence Eden.</li>
<li><a href="https://opml.glitch.me/">Twitter to OPLM</a> by Luca Hammer.</li>
<li><a href="https://css-tricks.com/html-inputs-and-labels-a-love-story/">HTML Inputs and Labels: A Love Story</a> by Amber Wilson.</li>
<li><a href="https://adactio.com/journal/18046">Get the FLoC out</a> by Jeremy Keith.</li>
<li><a href="https://www.cassie.codes/posts/swipey-image-grids/">Swipey Image Grids</a> by Cassie Evans.</li>
<li><a href="https://www.smashingmagazine.com/2021/05/complete-guide-css-container-queries/">A Primer On CSS Container Queries</a> by Stephanie Eckles.</li>
<li><a href="https://georgefrancis.dev/writing/create-a-liquid-hover-effect-with-gsap-and-svg/">Create a Liquid Hover Effect with GSAP & SVG</a> by George Francis.</li>
<li><a href="https://jvns.ca/blog/2021/05/24/blog-about-what-you-ve-struggled-with/">Blog about what you've struggled with</a> by Julia Evans.</li>
<li><a href="https://adactio.com/journal/18117">The cage</a> by Jeremy Keith.</li>
<li><a href="https://chias.blog/2021/in-defense-of-disorder-on-career-creativity-and-professionalism/">In defense of disorder: on career, creativity, and professionalism</a> by Chiara Amisola.</li>
</ul>
<p>Other bookmarks</p>
<ul>
<li><a href="https://www.aljazeera.com/features/2021/3/10/how-portugal-silenced-centuries-of-violence-and-trauma">How Portugal silenced ‘centuries of violence and trauma’</a> by Ana Naomi de Sousa.</li>
<li><a href="https://twitter.com/cdespinosa/status/1371162640173559810">All culture is cancel culture </a>(via twitter).</li>
<li><a href="https://www.latimes.com/opinion/op-ed/la-xpm-2013-apr-07-la-oe-0407-silk-ring-theory-20130407-story.html">How not to say the wrong thing by Susan Silk</a> and Barry Goldman.</li>
<li><a href="https://twitter.com/wank_666/status/1376580978311901186">Crab mentality</a> (via twitter).</li>
<li><a href="https://twitter.com/joulee/status/1377645731515822081">My identity = my job has a dark side</a> (via twitter).</li>
<li><a href="https://www.polygon.com/22358945/wii-fit-nintendo-health-ring-fit-adventure">For some, Wii Fit’s legacy is body shame</a> by Ana Diaz.</li>
<li><a href="https://www.irishtimes.com/culture/books/kevin-power-my-first-novel-was-a-hit-i-could-write-full-time-and-that-made-me-angry-1.4543526">My first novel was a hit. I could write full-time. And that made me … angry</a> by Kevin Power.</li>
<li><a href="https://www.vice.com/en/article/y3dmav/what-does-it-cost-to-go-on-rupauls-drag-race">Shantay, You Pay: Inside the Heavy Financial Burden of Going On ‘Drag Race’</a> by Rachel Miller.</li>
<li><a href="https://www.theguardian.com/politics/2021/may/13/eu-citizens-arriving-in-uk-being-locked-up-and-expelled">EU citizens arriving in UK being locked up and expelled</a> by Giles Tremlett and Lisa O'Carroll.</li>
<li><a href="https://the-orbit.net/brutereason/2016/03/24/boundary-setting-vs-tone-policing">Boundary Setting vs Tone Policing</a> by Miri.</li>
<li><a href="https://annehelen.substack.com/p/just-because-your-early-career-was">Just because your early career was hell doesn't mean others' has to be</a> by Anne Helen Petersen.</li>
<li><a href="https://amyhupe.co.uk/articles/hope-in-the-dark/">Hope in the dark: a post for mental health awareness week</a> by Amy Hupe.</li>
</ul>
My most memorable bad interview2021-05-17T19:29:18.223-00:00https://ohhelloana.blog/my-most-memorable-bad-interview/<p>Last weekend my husband and I started to watch Ted Lasso and as soon as the character Ted sets up their new home in Richmond, it reminded me of one of my worst job interviews because I’m pretty sure I cried in front of Ted’s local.</p>
<p>Let’s start from their (the interviewers) perspective. Here is what happened: this nice woman got through the first conversations and seemed okay enough to be sent a coding exercise to do at home. She sent back her exercise which wasn’t finished so they decided to have an in-person interview to go through it. A date and a time were suggested but never confirmed however she turned up anyway and then froze and couldn’t finish the coding exercise.</p>
<p>This is deeply embarrassing and I am still mortified that this will forever be the reflection of me in their eyes.</p>
<p>Now here’s what happened from my perspective: I was really happy at my job at the time until a snowball of events unrelated to me or the team I was in happened. Then a new manager was hired. This manager had control issues and quickly started to question all the team. This included doubting that people were absent for known medical issues (which wasn’t an issue before) to banning casual work from home without a justification that they deemed acceptable. Our team environment was severely impacted and people started to quit and the ones that remained were miserable. But the moment that I knew that I needed to leave was when he jokingly asked me in front of my teammates if I was thinking of getting pregnant while noting that it would be inconvenient for our future product release.</p>
<p>Needless to say, I was in a rush to get a new job. I couldn’t sleep and I started to completely forget about plans I made outside work hours. With everyone else quitting or some taking time off, I found myself alone managing contractors in a strange work environment where you could cut the tension with a knife. By the time this prospect company sent me the code challenge, my mental health had severely declined. I was also following people’s advice: do not tell the real reasons you’re leaving your job. The coding challenge was timed for two hours and I don’t actually remember it. I don’t remember doing it. I was crying while trying to do it. By the time the two hours were hit, I gave up. So I sent what I had done (which wasn’t enough at all), apologised and moved on.</p>
<p>A few days later they got back to me and suggested a day and time. Unfortunately, their office was in Richmond, which is on the other end of London. This meant that either I had to leave work early and risk getting transportation issues getting there because of rush hour or I could work from home (at the time I was living in Fulham) and I could work all day and leave after work and only take half an hour to get there. My heart was racing because it meant I had to ask this manager permission for either of these options. I replied to the email saying that it worked for me and I put in a request with my manager to leave work a little bit earlier. I was questioned a lot about it and it was incredibly stressful since a white lie was involved.</p>
<p>It’s the day of it and I prepare to make my way to Richmond. As I am leaving, I text my now husband to let him know and he says “oh, you didn’t tell me they had confirmed it”. My heart sank. I opened my email app. They never confirmed it. I never got a reply to that email. While in the tube, I went through all the scenarios in my head. I overthought everything and I was deeply ashamed. I tried to tell myself “maybe all will be okay and I am overthinking this”. Until I got there and they weren’t expecting me.</p>
<p>I wanted to hide forever. I thought “oh my god - these people have my full name and my Twitter handle… they now know how much I suck”. They were incredibly polite and welcomed me in. I’m sure I ruined their evening plans and I apologised. In the back of my head, I had another running task: “what other excuse can I come up with to tell my manager if this gets postponed?”. I held my tears and we sat in the room. We talked about how my exercise wasn’t finished and I said: “well.. That’s what I did in two hours”. What they didn’t know is that that’s what I did in two hours while having a breakdown. One of them mentioned how it is interesting because most people would lie about it. I tried to convince myself that was one small point in my favour. He then suggested “how about we finish it now together?” and I agreed. Except that I didn’t. I was bottling up all the tears and shame of my blunder, the build-up inside my head of even imagining having to ask my then manager to be excused and how I was mentally and emotionally drained from my current job. I don’t remember what happened next. I don’t remember what I told them. I just know we wrapped up and they left with the idea that I was really bad at coding.</p>
<p>I left their office and walked towards the park that is shown in the Ted Lasso series and I cried a lot. In the next few days, they followed up via email obviously explaining that I wasn’t on their top list but there was nothing but kindness from their end.</p>
<p>This interview still haunts me. I struggle a lot when I fail at something, especially when I fail “in public”. The idea of someone knowing that I didn't do something well breaks me but this was one of the very times in my life that I immediately forgave myself and treated myself with kindness.</p>
<p>Either way, I don't do well in interviews. The last time I went on another job hunt, I also failed at a few of them. I particularly dislike doing any code in front of others as so rarely I build projects/exercises from scratch. And guess what? So far I’ve always been employed.</p>
<p>If there’s any lesson from this story, I’d say: don’t start job hunting when it’s officially really bad. Trust your instinct and begin leaving before you get desperate. Although I don’t regret the path I ended up taking because I’m pretty happy now, I regret that I sacrificed my mental health at the time and now have bad memories because I left it too late to leave a job that was making me miserable.</p>
On onion cutting2021-05-11T20:29:14.175-00:00https://ohhelloana.blog/on-onion-cutting/<p>In the television show Masterchef there was an episode where the judges did a test on what they call “basic skills”. One of the judges often says that in order to be a “true chef”, you must know how to quickly and finely cut onions. It was really intense and they were looking for near perfection! I don’t know the industry well but I had a quick look on Youtube and cutting onions produced a lot of results.</p>
<p>So my immediate instinct, without thinking it through, was laughing and thinking: “hehe would they yell at me if I turned up with my onion chopper? Why does it matter how fast and how you chop your onions if the end result tastes good anyway?”.</p>
<p>I got an onion chopper because I don’t like how my hands smell after cutting onions, I don’t like how it makes my eyes tear up, I’m not very fast at cutting onions manually and I don’t have lots of space in the kitchen to set up multiple cutting boards.</p>
<p>This was really bothering me and I am stubborn so I wanted to win this fake argument really badly so I looked up <a href="https://www.npr.org/sections/thesalt/2016/07/11/485235765/slice-dice-chop-or-julienne-does-the-cut-change-the-flavor">why the way one cuts onions is important</a>: as it turns out, the shape and even the surface area affect the end flavour. I thought the whole “chop chop chop” was about performance in the kitchen. Cut quickly to serve quickly! I was wrong.</p>
<p>It annoyed me, even more, when I realised how this applies to my industry: web development.</p>
<p>My onion chopper is great! Though, if I am being honest, it does affect the texture and flavour a little bit in the end. The thing here is that I prioritised how my hands would smell because the end flavour wasn’t really bothering me. And if we think about web development, I suppose that many tools that save us time… might output something a little bit different in the end regardless if it looks the same.</p>
<p>Back to onions! I can see why there was a dedicated test for it on this show (maybe I could dismiss the “quick” bit as part of the assignment, but I won’t get into that now). In real life, there will be people, like myself, who don’t know enough about the craft and won’t know why such tests exist and just buy an onion chopper.</p>
<p>You see where I am getting here? Anyway, analogies aside, my point is: front end interviews should really test basic skills like HTML, CSS and accessibility as it truly affects the outcome of a website. This also made me realise that the only time I’ve ever been asked in detail about HTML, CSS and accessibility in a job interview was when I was interviewing for a junior developer role. Since then, most of my interviews and job ads I’ve seen, completely gloss over basic skills and focus on tools/frameworks. And if we don’t know the basics, how can we know what is missing in the tools we use?</p>
A personal note2021-04-11T00:00:00-00:00https://ohhelloana.blog/a-note/This post has a content note of miscarriage. Visit the link directly if you're okay with reading it.One year of online-only2021-03-17T17:40:14.096-00:00https://ohhelloana.blog/one-year-of-online-only/<p>The one year anniversary of the "never-ending" March has just passed. One year ago, my co-organisers and I were in limbo on whether the events we were running would happen in person or not. That week I was helping to run a <a href="https://www.londoncss.dev/">London CSS</a> and an <a href="https://2020.indieweb.org/london">IndieWebCamp</a>. Both events were moved to fully online at the last minute.</p>
<p>I always feel anxious when running events, especially when it was London CSS. The IndieWebCamp crowd is smaller and more familiar to me so I always felt more comfortable - which is why I took on two big events on the same week.</p>
<p>As both events happened before official lockdowns, we didn't know more than what the official authorities were saying. I remember our exchanges with the venues, writing up and drafting guidances as best as we knew and trying to update our attendees. We didn't know if the venues would pull last minute. Even if the events went ahead, we were concerned and terrified that someone could get ill from attending. Since I was running two events, I was having quick lessons and sharing as much information as possible. <br>
<br>
For both events, at that point, we all knew we had to be safe than sorry. Sending the emails to move to online-only was, to me, really bittersweet, but also gut-wrenching as we knew that some people had made travel arrangements to come to London.</p>
<p>While IndieWebCamps usually have an online stream by default, that wasn't the case with London CSS - yet. <a href="https://twitter.com/_phzn">Kevin</a> did a lot of work, just a few days before the event, to <a href="https://dev.to/_phzn/running-my-first-online-meetup-o1h">set-up everything</a> so that our online-only event would go through. For IndieWebCamp, I bought a second-hand camera lens worth £600 for £79! I was over the moon with that find! Never got to use it...</p>
<p>Both events went really well. It was a brand new flashy thing! We were all excited! Little did we know that it would definitely last more than two weeks.</p>
<p><a href="http://calumryan.com/">Calum</a> and I also moved <a href="https://www.hwclondon.co.uk/">Homebrew Website Club</a> to online-only. At some point, we did it weekly! I look back and I can't believe we had that much energy!</p>
<p>There are lessons to be learned though. As I gave some nerve-wracking intros in London CSS, I tried to give emphasis on how hard it is to be welcoming online. When we all meet online, there's a good chance we're meeting with people we already know and it is really hard to include people who are just joining from behind a screen. I tried to explain, maybe with an odd choice of words, that in community events, we should leave private jokes behind to welcome everyone. I was somewhat speaking from experience. It is already hard enough in person to get courage and ask to join a group in the social bit of a conference/meet-up, let alone online where everyone is typing faster than you or you're just too afraid to interrupt a video call to say "hello".</p>
<p>While hosting the Homebrew Website Club, I've been trying different ways to prompt someone new who joined our video call. Some people prefer to watch and don't say much. Others will present themselves. Others would prefer if the host prompts them for an introduction. We're all trying our best.</p>
<p>During this last year. there were lots of lessons on moderation. Lessons on how to use tools to apply the code of conduct online instead of in-person. But also, lots of opportunities to connect with people who wouldn't be able to join in-person. Not only people from other countries or cities but also parents or caregivers. There's still work to be done here: many parents of little ones, still need to work around dinner and bedtimes. Maybe we can push further and explore other timings for events that are not immediately after working hours.</p>
<p>Since March, I attended and bought a few tickets to other conferences. However, I didn't necessarily attend all of them. Knowing that the videos are there to re-watch anytime I want, mean that I have postponed that task. I've been drained and exhausted from being online, at home, all the time. I wonder if this is a trend among organisers.</p>
<p>As of this year, knowing that London CSS is in excellent hands, I decided to leave the organisation team and I don't personally plan on organising another IndieWebCamp. I may be biased, but I really recommend those events. I'm still around for Homebrew Website Club every two weeks (unless cancelled). <br>
<br>
And while we don't meet in person, if you're an event organiser, spend some time and learn how you can <a href="https://laurakalbag.com/safety-at-conferences/">make your future events safer</a>.</p>
<p>Stay safe friends!</p>
Catching up on my bookmarks2021-03-06T13:00:00-00:00https://ohhelloana.blog/catching-up-on-my-bookmarks/<p>The thing about loss is that it just doesn't seem to end. It gets easier though. One day you wake you and you're feeling fine but one insignificant action somehow opens the gates for the sadness to creep in. And then that's it. The floodgates open and the tears come out.</p>
<p>If I thought the last months of 2020 were somewhat hard, January really proved me wrong. I do regret that I neglected my monthly bookmarks post. I've been wondering if I should start sharing the bookmarks individually like some folks do so that it doesn't pile up. I will think about it.</p>
<p>I'm sure I accidentally missed some bookmarks - a consequence of delaying sharing them. I hope that I can catch up on my missed bookmarks in my next post. It is also likely that I accidentally missed some posts from friends. Being online hasn't been a priority for me.</p>
<p>Take care friends.</p>
<h2>Bookmarks related to tech or web development</h2>
<ul>
<li><a href="https://11ty.rocks/">11ty Rocks</a> by Stephanie Eckles.</li>
<li><a href="https://www.studio24.net/blog/accessibility-of-content-management-systems-whats-stopping-us/">Accessibility of Content Management Systems – what’s stopping us?</a> by Marie Manandise.</li>
<li><a href="https://www.wired.co.uk/article/stalkerware-spyware-monitoring-apps-uk">Inside the fight to rid the world of abusive stalkerware </a>by Helena Pozniak.</li>
<li><a href="https://shinesolutions.com/2018/01/08/falsehoods-programmers-believe-about-names-with-examples/">Falsehoods Programmers Believe About Names – With Examples</a> by Tony Rogers.</li>
<li><a href="https://css-tricks.com/gifs-and-prefers-reduced-motion/">GIFS and prefers-reduced-motion</a> by Chris Coyier.</li>
<li><a href="https://css-tricks.com/parsing-markdown-into-an-automated-table-of-contents/">Parsing Markdown into an Automated Table of Contents</a> by Lisi Linhart.</li>
<li><a href="http://a11yengineer.com/">Accessibility Acceptance Criteria</a>.</li>
<li><a href="https://dev.to/kimmaida/7-tips-for-career-advancement-and-personal-fulfillment-5e02">7 Tips for Career Advancement and Personal Fulfillment</a> by Kim Maida.</li>
<li><a href="https://www.washingtonpost.com/technology/2020/11/19/can-not-quit-facebook/">Why it’s easy to hate Facebook but hard to leave</a> by Heather Kelly.</li>
<li><a href="https://chrisburnell.com/article/time-to-cache-up/">Time to Cache Up</a> by Chris Burnell.</li>
<li><a href="https://plaiceholder.co/">Plaiceholder</a> by Joe Bell.</li>
<li><a href="https://css-tricks.com/a-dynamically-sized-sticky-sidebar-with-html-and-css/">A Dynamically-Sized Sticky Sidebar with HTML and CSS</a> by Ryan Mulligan.</li>
<li><a href="https://webfoundation.org/2020/11/the-impact-of-online-gender-based-violence-on-women-in-public-life/">The impact of online gender-based violence on women in public life</a> by Web Foundation.</li>
<li><a href="https://www.smashingmagazine.com/2020/11/weaving-web-accessibility-usability/">Weaving Web Accessibility With Usability</a> by Uri Paz.</li>
<li><a href="https://thoughtbot.com/blog/so-you-wanna-create-an-eco-friendly-website">So you wanna create an eco-friendly website</a> by Eric Bailey.</li>
<li><a href="https://visitmy.website/2020/12/05/bookmarks-3/">Boomarks #3</a> by Steve Messer.</li>
<li><a href="https://joelhooks.com/on-writing-more">Stop Giving af and Start Writing More</a> by Joel Hooks.</li>
<li><a href="https://www.joshwcomeau.com/css/rules-of-margin-collapse/">The Rules of Margin Collapse</a> by Joshua Comeau.</li>
<li><a href="https://almanac.httparchive.org/en/2020/accessibility">Web Alamanc - Accessibility</a> by Olu Niyi-Awosusi and Alex Tait.</li>
<li><a href="https://webdevlaw.uk/2020/12/09/facebook-derangement-syndrome/">Facebook Derangement Syndrome</a> by Heather Burns.</li>
<li><a href="https://kittygiraudel.com/2020/12/10/accessible-icon-links/">Accessible icon links</a> by Kitty Giraudel.</li>
<li><a href="https://yqnn.github.io/svg-path-editor/">SVG Path Editor</a></li>
<li><a href="https://www.technologyreview.com/2020/12/04/1013068/algorithms-create-a-poverty-trap-lawyers-fight-back/">The coming war on the hidden algorithms that trap people in poverty</a> by Karen Hao.</li>
<li><a href="https://henry.codes/writing/spotify-now-playing/">How To Use The Spotify API and Netlify Functions To Build A “Now Playing” Widget</a> by Henry Desroches.</li>
<li><a href="https://thoughtbot.com/blog/alt-vs-figcaption">Alt vs Figcaption</a> by Elaina Natario.</li>
<li><a href="https://css-tricks.com/not-much/">Not Much</a> by Ire Aderinokun.</li>
<li><a href="https://www.theatlantic.com/technology/archive/2020/12/facebook-doomsday-machine/617384/">Facebook Is a Doomsday Machine</a> by Adrienne LaFrance.</li>
<li><a href="https://umaar.com/dev-tips/242-considerate-javascript/">Conditional JavaScript, only download when it is appropriate to do so</a> by Umar.</li>
<li><a href="https://ably.com/blog/airtable-database-realtime-messages">Using Airtable as a database to store realtime messages</a> by Srushtika Neelakantam.</li>
<li><a href="https://remysharp.com/2020/12/17/webbish">Webbish</a> by Remy Sharp.</li>
<li><a href="https://medium.com/bumble-tech/interface-localisation-adapting-text-fields-for-rtl-languages-67a386006a17">Interface localisation: adapting text fields for RTL languages</a> by Mitya Kuznetsov.</li>
<li><a href="https://www.smashingmagazine.com/search-engine-optimization-checklist/">Search Engine Optimization Checklist (PDF)</a> by Frederick O’Brien.</li>
<li><a href="https://tomcritchlow.com/2018/02/23/small-b-blogging/">Small b blogging</a> by Tom Critchlow.</li>
<li><a href="https://colly.com/articles/this-used-to-be-our-playground">This used to be our playground</a> by Simon Collison.</li>
<li><a href="https://blog.tito.io/posts/designing-with-empathy/">Designing with Empathy: Don’t</a> by Doc Parsons.</li>
<li><a href="https://dev.to/marcysutton/content-visibility-and-accessible-semantics-2994">Content-visibility and Accessible Semantics</a> by Marcy Sutton.</li>
<li><a href="https://amberwilson.co.uk/blog/are-your-anchor-links-accessible/">Are your anchor links accessible?</a> by Amber Wilson.</li>
<li><a href="https://themarkup.org/2020-in-review/2020/12/15/algorithms-bias-racism-surveillance">Algorithms Behaving Badly: 2020 Edition</a> by The Markup Staff.</li>
<li><a href="https://www.nj.com/middlesex/2020/12/he-spent-10-days-in-jail-after-facial-recognition-software-led-to-the-arrest-of-the-wrong-man-lawsuit-says.html">He spent 10 days in jail after facial recognition software led to the arrest of the wrong man, lawsuit </a>says by Anthony G. Attrino.</li>
<li><a href="https://www.vice.com/en/article/zme97a/inside-the-strange-world-of-youtube-thumbnails">Inside the Strange World of YouTube Thumbnails</a> by Louise Matsakis.</li>
<li><a href="https://eleventy-parcel.netlify.app/">Eleventy-Parcel</a> by Michelle Barker.</li>
<li><a href="https://github.com/5t3ph/eleventy-plugin-template">Eleventy Plugin Template</a> by Stephanie Eckles.</li>
<li><a href="https://css-tricks.com/give-your-eleventy-site-superpowers-with-environment-variables/">Give your Eleventy Site Superpowers with Environment Variables</a> by Andy Bell.</li>
<li><a href="https://tink.uk/thoughts-on-screen-readers-and-image-recognition/">Thoughts on screen readers and image recognition</a> by Léonie Watson.</li>
<li><a href="https://yuanchuan.dev/how-to-make-seamless-patterns">How To Make Seamless Patterns</a> by Yuan Chuan.</li>
<li><a href="https://hiddedevries.nl/en/blog/2021-01-04-how-i-turned-my-goodreads-data-into-a-self-hosted-website-with-eleventy">How I turned my Goodreads data into a self-hosted website with Eleventy</a> by Hidde de Vries.</li>
<li><a href="https://sia.codes/posts/architecting-data-in-eleventy/">Architecting data in Eleventy</a> by Sia Karamalegos.</li>
<li><a href="https://ishadeed.com/article/building-real-life-components/">The Art of Building Real-life Components</a> by Ahmad Shadeed.</li>
<li><a href="https://beesbuzz.biz/blog/2316-Distributed-toxicity-and-the-IndieWeb">Distributed toxicity and the IndieWeb</a> by Fluffy.</li>
<li><a href="https://defaced.dev/tools/simple-social-image-resizer/">Simple Social Image Resizer</a> by Chris Johnson.</li>
<li><a href="https://www.smashingmagazine.com/2021/01/front-end-performance-2021-free-pdf-checklist/">Front-End Performance Checklist 2021</a> by Vitaly Friedman.</li>
<li><a href="https://codersblock.com/blog/the-surprising-things-that-css-can-animate/">The Surprising Things That CSS Can Animate</a> by Will Boyd.</li>
<li><a href="https://sarahmhigley.com/writing/grids-part2/">Grids Part 2: Semantics</a> by Sarah Higley.</li>
<li><a href="https://svgcrop.com/">SVG Crop</a> by Steve Dennett.</li>
<li><a href="https://www.technologyreview.com/2021/01/29/1017065/ai-image-generation-is-racist-sexist/">An AI saw a cropped photo of AOC. It autocompleted her wearing a bikini</a> by Karen Hao.</li>
<li><a href="https://webdevlaw.uk/2021/01/30/why-generation-x-will-save-the-web/">Why Generation X will save the web</a> by Heather Burns</li>
<li><a href="https://adactio.com/journal/17794">Authentication</a> by Jeremy Keith.</li>
<li><a href="https://uxdesign.cc/uniwidth-typefaces-for-interface-design-b6e8078dc0f7">Uniwidth typefaces for interface design</a> by Lisa Staudinger.</li>
<li><a href="https://dev.to/georgedoescode/create-a-generative-landing-page-webgl-powered-background-animation-3nl0">Create a generative landing page & WebGL powered background animation</a> by George Francis.</li>
<li><a href="https://taeluralexis.com/2021/02/08/command-line-basics-a-short-sweet-introduction/">Command Line Basics: A Short & Sweet Introduction</a> by Tae'lur Alexis.</li>
<li><a href="https://exposing.ai/">Exposing.ai</a> by by Adam Harvey and Jules LaPlace.</li>
<li><a href="https://www.aboutmonica.com/blog/adding-instagram-timeline-to-next-js-site">How to Add Instagram Timeline To a NextJS Site</a> by Monica Powell.</li>
<li><a href="https://ericwbailey.design/writing/accessibility-auditing-and-ego/">Accessibility auditing and ego</a> by Eric W Bailey.</li>
<li><a href="https://css-irl.info/finding-an-elements-nearest-relative-positioned-ancestor/">Finding an Element’s Nearest Relative Positioned Ancestor</a> by Michelle Barker.</li>
<li><a href="https://benmyers.dev/blog/skip-links/">Implement a Skip Link for Navigation-Heavy Sites</a> by Ben Myers.</li>
<li><a href="https://adrianroselli.com/2020/02/link-targets-and-3-2-5.html">Link Targets and 3.2.5</a> by Adrian Roselli.</li>
<li><a href="https://piccalil.li/tutorial/improve-the-readability-of-the-content-on-your-website">Improve the readability of the content on your website</a> by Andy Bell.</li>
<li><a href="https://www.smashingmagazine.com/2021/02/responsive-image-effects-css-gradients-aspect-ratio/">Create Responsive Image Effects With CSS Gradients And aspect-ratio</a> by Stephanie Eckles.</li>
</ul>
<h2>Other bookmarks</h2>
<ul>
<li><a href="https://www.thetricontinental.org/studies-4-coronashock-and-patriarchy/">CoronaShock and Patriarchy</a>.</li>
<li><a href="https://www.vox.com/2020/11/12/21562278/jails-prisons-texas-covid-19-coronavirus-crime-prisoners-death">80 percent of those who died of Covid-19 in Texas county jails were never convicted of a crime</a> by Jerusalem Demsas.</li>
<li><a href="https://medium.com/@damonreece/the-uncanny-valley-of-culture-9d035a3c1776">The Uncanny Valley of Culture</a> by Damon.</li>
<li><a href="https://www.theguardian.com/world/2020/nov/26/matt-hancock-former-neighbour-won-covid-test-kit-contract-after-whatsapp-message">Hancock's former neighbour won Covid test kit work after WhatsApp message</a> by Felicity Lawrence.</li>
<li><a href="https://thecorrespondent.com/820/the-time-has-come-to-take-the-self-out-of-self-care/108559145640-42103323">The time has come to take the self out of self-care</a> by Tanmoy Goswami.</li>
<li><a href="https://visitmy.website/2020/12/12/reading-list-picks-of-2020/">Reading list picks of 2020</a> by Steve Messer.</li>
<li><a href="https://lyz.substack.com/p/the-real-reason-local-newspapers">The Real Reason Local Newspapers are Dying</a> by Lyz.</li>
<li><a href="https://www.glaad.org/amp/beginners-guide-being-ally-to-trans-people">A beginner's guide to being an ally to trans people</a> by Ted Ravago.</li>
<li><a href="https://www.bbc.co.uk/news/world-asia-55301200">The family with no fingerprints</a> by Mir Sabbir.</li>
<li><a href="https://twitter.com/Rainmaker1973/status/1340643235983740929">Trail cam footage of opossum and a skunk.</a></li>
<li><a href="https://www.spacetobefree.co.uk/thoughts/newyear">Figuring Out What You Need To Flourish In The New Year</a> by Nina Dearden.</li>
<li><a href="https://tatianamac.com/posts/mistakes/">Compassionate action over empathy</a> by Tatiana Mac.</li>
<li><a href="https://twitter.com/johnharris1969/status/1346545808515223556">Lockdown ramifications</a>.</li>
<li><a href="https://hbr.org/2020/12/why-you-need-to-stop-using-these-words-and-phrases">Why You Need to Stop Using These Words and Phrases</a> by Rakshitha Arni Ravishankar.</li>
<li><a href="https://www.dw.com/en/in-germany-your-ex-must-destroy-nude-photos-on-request/a-18934921">In Germany, your ex must destroy nude photos on request</a> by Ben Knight.</li>
<li><a href="https://www.curbed.com/2021/01/vessel-hudson-yards-suicide-problem.html">I Knew the Vessel Was Going to Have a Suicide Problem Years Before It Was Built</a> by Audrey Wachs.</li>
<li><a href="https://www.theguardian.com/inequality/2017/nov/08/us-vs-them-the-sinister-techniques-of-othering-and-how-to-avoid-them">Us vs them: the sinister techniques of ‘Othering’ – and how to avoid them</a> by John A Powell.</li>
<li><a href="https://www.thecut.com/2020/07/ana-de-armas-infamous-twitter-stan-account-speaks.html">Twitter’s Most Infamous Stan Account Speaks</a> by Sangeeta Singh-Kurtz.</li>
<li><a href="https://www.theguardian.com/technology/2021/jan/20/far-right-extremists-take-over-uk-land-sales-facebook-page">Far-right extremists take over UK land sales Facebook page</a> by Alex Hern.</li>
<li><a href="https://chias.blog/2021/in-defense-of-disorder-on-career-creativity-and-professionalism/">In defense of disorder: on career, creativity, and professionalism</a> by Chiara Amisola.</li>
<li><a href="https://francesmx.medium.com/how-i-recovered-from-imposter-syndrome-after-changing-career-to-software-engineering-a4edbf609d44">How I recovered from imposter syndrome after changing career to software engineering</a> by Frances Maxwell.</li>
<li><a href="https://www.propublica.org/article/meet-the-customer-service-reps-for-disney-and-airbnb-who-have-to-pay-to-talk-to-you?utm_medium=social&utm_source=twitter">Meet the Customer Service Reps for Disney and Airbnb Who Have to Pay to Talk to You</a> by Ken Armstrong, Justin Elliott and Ariana Tobin.</li>
<li><a href="https://www.huffingtonpost.co.uk/entry/hoarding-second-generation-families_uk_5f85647ac5b6e6d033a75528">Hoarding Is All Too Familiar To Second Generation Brits. Here's Why</a> by Deborah Yewande Bankole.</li>
<li><a href="https://conversationalist.org/2021/02/19/content-moderation-wont-stop-the-spread-of-disinformation-heres-why/">Content moderation won’t stop the spread of disinformation. Here’s why</a> by Jillian C. York</li>
<li><a href="https://www.nytimes.com/2021/02/23/opinion/britney-spears-mara-wilson-hollywood.html">The Lies Hollywood Tells About Little Girls</a> by Mara Wilson.</li>
</ul>
My typical day2021-02-27T14:51:36.750-00:00https://ohhelloana.blog/my-typical-day/<p><a href="https://hiddedevries.nl/en/blog/2021-02-15-my-typical-day">Hidde</a> invited me to share what my typical day looks like. I saw the chain going around and I read a few from people I know. I thought it was really interesting and I had a strange feeling of relief when I read about real humans and the fact that, actually, they are very similar to me!</p>
<p>It is a bit silly, but I always imagine that everyone else is constantly switched on and creating things. I mean, social media gives that illusion and my own insecurities feed it, but this pandemic really made me feel ashamed for taking it easy.</p>
<p><strong>8:30</strong> My husband's alarm goes off. But realistically, I'm usually a little bit awake since half-past six because that's the time my cat comes to check if I am awake. I also live in an area that has some traffic, so I wake up really easily with any noise. Once the alarm goes off, she starts meowing and jumping on us because she knows it is absolutely fair game. Around this time, I get up, put the collar on my cat, top-up her food and open her catflap. I hate when I don't make the bed so I usually make it around this time, have a shower and have coffee (my husband usually makes it and leaves it on my desk). <br>
<br>
I usually have my coffee while checking my emails, social media, RSS feed and the news but many times I take the coffee outside and go to my garden. Around this time I check if we were visited by foxes or other cats during the night, examine how my flower bed is doing and just look at my cat wandering around and smelling things.</p>
<p><strong>9:30</strong> Work starts around this time. I share what I did the day before, what I'm going to do today and, if I need something from someone on the team, this is usually the moment I let everyone know in advance so that they can plan their work too. But most importantly, I tell people what I dreamt the night before!</p>
<p><img src="https://ohhelloana.blog/assets/posts/screen-shot-2021-02-27-at-15.35.55.png" alt="Screenshot of my slack with a search query with the words I dreamt from me. Showing a total number of messages to be 71."></p>
<p>We also do team updates on video calls, but since we already shared our day, we usually do fun and informal conversations. If I had a really incredible dream (which is very often by the way), I don't write it out and this is the moment where everyone is forced to listen to it.</p>
<p>A great part of the morning is spent on calls (either with teammates or clients) but that actually works for me as I need some time to get into productive mode.</p>
<p><strong>13:00</strong> I try to use my lunch break for a quick walk in the common. Sometime last year, I completely lost my appetite and energy to think about lunch so I normally grab a quick and small bite and do more frequent fruit snacks during the day instead. I don't recommend this. Sometimes I also use this walk to run some quick errands. I usually listen to music that makes me want to sing and think about how much I miss karaoke with friends.</p>
<p>If the weather isn't great, I use this time to write on my drafts and jot down thoughts that I would like to maybe one day convert into a blog post.</p>
<p><strong>14:00</strong> Work time. This is usually my most focused time. Similar to <a href="https://www.cassie.codes/posts/my-typical-day/#heading-schedule">Cassie</a>, I have lots of herbal tea and listen to music that helps me focus. I personally use <a href="https://noiz.io/">Noizio</a> or <a href="https://open.spotify.com/playlist/2ovkBiLErf0XBJtfgsExcb?si=5a35b6c0910b4919">my own playlist</a> with my favourite music from The Rasmus. <a href="https://ohhelloana.blog/overthinking-my-nostalgia/">I explored this before</a>: I usually focus really well if I am listening to music that brings me positive nostalgia, especially if I am doing a complicated task. Probably placebo, but I will not fight against it.</p>
<p>Some days, my anxiety and feelings from "<a href="https://indieweb.org/life_happens">life happens</a>" creep in and I end up feeling extremely guilty for not being super productive. I try to catch up on work whenever I can so sometimes I feel like I did 8 hours of work in one afternoon. Other times... not so much.</p>
<p><strong>18:00</strong> I try to wrap up around this time and turn off my laptop. Halfway through last year I felt incredibly burned out from constantly being on my laptop at home so unless I am on a tight deadline, I will turn off my computer. There is also another exception: every other Wednesday, there's <a href="https://www.hwclondon.co.uk/">Homebrew Website Club</a>, so from this time on, I try to write or work on my blog and then participate in the call.</p>
<p>From this moment on, I close the cat's catflap, take off her collar, play with her (she demands it like a dog!), do some home admin, check out my indoor plants (especially my Venus Fly Trap and whatever I'm trying to get roots from in a jar of water) and call my family.</p>
<p><strong>19:00</strong> Cooking and dinner time! My husband and I take turns in cooking. I feel more adventurous to try new recipes on Fridays and Saturdays - in case it goes wrong, there's always a takeaway option. And the cat also has her dinner!</p>
<p>I light up whatever candle I have in progress (I love candles), we chat about work, do the dishes and usually end the evening watching series together. This is also the time I ask my husband to read things I've written. We have a couple of shows "in progress". I know I am ten years too late, but we're now watching Breaking Bad. I prefer to watch films on the weekends.</p>
<p>While we watch things, I do some knitting. I'm currently doing a summer cardigan!</p>
<p><strong>21:30</strong> Around this time, I start getting ready for bed. First things first: pick up the cat's litter box. Then, my sort of inefficient yet harmless, skincare routine. I have extremely sensitive skin and once I find a product that doesn't cause an allergic reaction, I will not switch.</p>
<p>One of my solid routines is telling the cat "come to bed Jessie" and see her running past me and jump on the bed to her sleeping area (yes, she has a sleeping nest that I do for her on the bed).</p>
<p>I wish I could say I have an inspiring adult way of going to bed: but no. I do use my phone. And I do watch some TikToks. I also catch up on some things I bookmarked during the day that I wanted to revisit when I had more time.</p>
<p>Despite going to bed quite early (and eventually putting my phone down!), I struggle to fall asleep. My mind goes to a lot of places.</p>
<h3>Other random facts:</h3>
<ul>
<li>My favourite day is Thursday because it is rubbish day and I love taking the rubbish out.</li>
<li>I miss the gym every day. I hate exercising at home and I don't like exercising. I see it as a task and because it is an unpleasant task, I will not do it if I have to do it at home. I need the gym to feel accountability. I also don't like running.</li>
<li>Saturday is the day I catch up on the shows that my husband and I don't watch together (he does the same).</li>
<li>I also play Fantasy Football so, Fantasy Football deadlines are a thing for me (along with knowing the scores).</li>
<li>I run an <a href="https://instagram.com/purrfect_jessie">Instagram page for my cat</a>, so recently, I've been trying to snap a photo of her and post it.</li>
</ul>
<p>At first, I was afraid that this chain would create some "productivity shame". I truly hope that at least my post doesn't. I struggle a lot many days. This pandemic hasn't been easy on anyone. January was, personally, a devastating month for me - if anyone judges me for the lack of content I put out there, then that's a problem with their unrealistic and false expectations.</p>
<p>My husband, my cat, my plants, my little journals, my candles, my friends and family are what's bringing me comfort these times.</p>
<p>Whatever you're doing, please do it for yourself. Realistically, nobody is expecting anything from anyone.</p>
<p>I'd love to see the chain going and reading more from more people. I'd like to invite <a href="http://calumryan.com/">Calum</a>, <a href="https://suze.dev/">Suze</a> and <a href="https://carol.gg/">Carol</a> to share theirs if they want to.</p>
<p>Have a good weekend folks!</p>
Unsolicited rejection2021-02-08T15:53:59.950-00:00https://ohhelloana.blog/unsolicited-rejection/<p>Every once in a while I realise that I have been rejected for something I didn’t even apply for.</p>
<p>A couple of jobs ago, I was in the common area having lunch when a work colleague asked me if I had a Twitter account. “Yes”, I replied and told him my Twitter handle. I saw him scrolling on his phone and, after a minute, he looked at me and said: “wow, you don’t post anything about tech” whilst frowning. I don’t remember if I replied but I do remember, a few minutes later, checking my phone and noticing he didn’t follow me. It wasn’t that this person didn’t follow me, it was that this person actively looked up my profile, scrolled through, then voiced their disappointment in me out loud and “rejected” me.</p>
<p>I felt embarrassed and judged and it was an interaction that I never forgot. I internalised that interaction so hard that, six years after, it still bothers me and makes me judge my own social media activity from the “tech gaze” point of view.</p>
<p>Realistically, I understand that my feed (and me as a person) will not please everybody but this wasn’t really a stranger. This was someone who worked closely with me and, unsolicitedly, judged me and rejected me.</p>
<p>The unsolicited rejection was a frequent thing growing up as a woman but lately, it has taken a new form as I became a bit more active in the tech community.</p>
<p>Recently, I received a Twitter notification saying that I was tagged in a tweet. A wonderful friend of mine replied to someone who was asking recommendations for blog articles and the person asking was someone with quite a big following and, I suppose, popularity.</p>
<p>I was truly flattered that my friend thought of me, of all people, and I got a little bit excited at the idea that someone who is respected in the community could read what I wrote and appreciate it.</p>
<p>But nothing happened. Not even a “like” from the original poster. I felt embarrassed. Heck, I felt embarrassed that I noticed that it didn’t even get a “like”. I thought I was cooler than that. I wondered what happened. Did they click my blog post and thought “what a load of crap”? I felt a new flavour of shame that I wasn’t unfamiliar with but until that point, I couldn’t really explain it.</p>
<p>This had happened before when I am tagged in tweets that ask people to suggest “women in tech” to follow. Not that I am tagged frequently (at all), but the few times that I am, that has never resulted in a new follower. Did the original poster see my profile and thought “wow she sucks”? In the back of my mind, I’m always reminded of that interaction I had six years ago. I imagine someone perusing through my profile and thinking that I am not qualified.</p>
<p>When these types of tweets came out, I was flattered that someone thought of me. But the mental note still existed: someone rejected me when I didn’t even ask for it.</p>
<p>On the other hand, I understand now that many of these tweets are clout chasers. They are written by, usually, men, who want to do some performative work to pretend they care about diversifying their timeline. By having a popular tweet, and because a lot of people interacted with it in good faith, the social media algorithm works in their favour to promote their own account while also getting “ally” points. I’m sure they mute their own tweet immediately after posting it. This might explain it, but the rejection is still there.</p>
<p>When my inner critic is on and ready to hurt me, I imagine that other people scroll through those tweets and make a deliberate decision that I am not worthy. Almost like we would be in a group and somebody introduces me and nobody acknowledges what just happened.</p>
<p>There’s no resentment or bitterness here. Just the acknowledgement that it is an unpleasant feeling to sit with. Especially when you didn’t invite these situations.</p>
<p>Updated: 9th February 2021 - Added clarification to the introduction.</p>
Bookmarks from September and October2020-11-02T13:33:15.591-00:00https://ohhelloana.blog/bookmarks-from-september-and-october/<p>The whole September I was quite overwhelmed with work and life. I remember that in September "The Social Dilemma" came out. I don't remember a lot more weirdly. <br>
<br>
In October I managed to take two weeks off! Visited the Isle of Wight for the first time to celebrate my birthday. Last week I took some time off to study for my "Life in the UK" exam. I also took an English exam. And I passed both!! Now I have the basics to begin the process to apply for British citizenship.</p>
<p>Time is still blur. Some days are particularly hard. It is what it is.</p>
<p>Bookmarks related to tech or web development:</p>
<ul>
<li><a href="https://websitesetup.org/web-accessibility-checklist/">Web accessibility checklist</a> by Bruce Lawson.</li>
<li><a href="https://www.technologyreview.com/2020/09/03/1007716/digital-gardens-let-you-cultivate-your-own-little-bit-of-the-internet/">Digital gardens let you cultivate your own little bit of the internet</a> by Tanya Basuarchive.</li>
<li><a href="https://www.bdadyslexia.org.uk/advice/employers/creating-a-dyslexia-friendly-workplace/dyslexia-friendly-style-guide">Dyslexia friendly style guide</a> by The British Dyslexia Association.</li>
<li><a href="https://magnetfinge.rs/">Magnet Fingers</a> by Charlotte Dann.</li>
<li><a href="https://codepen.io/HighFlyer/full/GRZyONO">SVG Line animation</a> by Thea.</li>
<li><a href="https://a11y.coffee/">A11y Coffee</a>.</li>
<li><a href="https://bbc.github.io/gel/components/pockets/">Pocket pattern</a>.</li>
<li><a href="https://www.aboutmonica.com/blog/how-to-make-your-vs-code-sparkle">How to make your VSCode sparkle</a> by Monica Powell.</li>
<li><a href="https://the-sustainable.dev/how-to-audit-your-website-on-a-budget/">How to audit your website on a budget</a>.</li>
<li>"<a href="https://www.theverge.com/2020/9/4/21419993/the-social-dilemma-jeff-orlowski-netflix-movie-review-social-media-algorithms">Telling people to delete Facebook won’t fix the internet</a>" by Adi Robertson.</li>
<li>"<a href="https://css-tricks.com/how-css-perspective-works/">How CSS Perspective Works</a>" by Amit Sheen.</li>
<li>"<a href="https://sallylait.com/blog/2020/09/11/focusing-your-learning-goals/">A framework for focusing your learning goals</a>" by Sally Lait.</li>
<li>"<a href="https://scottvinkle.me/blogs/blog/hidden-content">Tips on Making Sure Hidden Content is Accessible (or Not!)</a>" by Scott Vinkle.</li>
<li><a href="https://twitter.com/colinmadland/status/1307111816250748933">Thread on Algorithms and Black Faces</a>.</li>
<li>"<a href="https://onezero.medium.com/data-privacy-exhaustion-is-real-9ca868068f2b">Data Privacy Exhaustion Is Real</a>" by Simon Pitt.</li>
<li>"<a href="https://www.matuzo.at/blog/writing-even-more-css-with-accessibility-in-mind-user-preferences/">Writing even more CSS with Accessibility in Mind, Part 2: Respecting user preferences</a>" by Manuel Matuzovic.</li>
<li>"<a href="https://blog.sapegin.me/all/accessibility-testing/">The most useful accessibility testing tools and techniques</a>" by Artem Sapegin.</li>
<li><a href="https://www.theguardian.com/commentisfree/2020/oct/17/uk-tax-brexit-data-haven-britain?CMP=Share_iOSApp_Other">You've heard of tax havens. After Brexit, the UK could become a 'data haven'</a> by Carissa Véliz.</li>
<li>"<a href="https://www.lflegal.com/2020/08/quick-fix/">Honor the ADA: Avoid Web Accessibility Quick-Fix Overlays</a>".</li>
<li>"<a href="https://adactio.com/journal/17573">Portals and giant carousels</a>" by Jeremy Keith.</li>
<li>"<a href="https://css-irl.info/why-i-dont-have-time-for-your-coding-challenge/">Why I Don’t Have Time For Your Coding Challenge</a>" by Michelle Barker.</li>
</ul>
<p>Other bookmarks:</p>
<ul>
<li>"<a href="https://www.theguardian.com/artanddesign/gallery/2020/sep/01/pom-poms-and-pigs-bladders-the-traditions-of-germanys-black-forest-in-pictures">Pom-poms and pig's bladders: the traditions of Germany's Black Forest – in pictures</a>" by Mee-Lai Stone.</li>
<li>"<a href="https://www.creativeboom.com/inspiration/candy-coloured-photographs-of-la-by-george-byrne/">Candy-coloured photographs of LA's glorious hidden beauty by George Byrne</a>" written by Katy Cowan.</li>
<li>"<a href="https://www.nytimes.com/2020/09/05/technology/parents-time-off-backlash.html">Parents Got More Time Off. Then the Backlash Started</a>." by Daisuke Wakabayashi and Sheera Frenkel.</li>
<li>"<a href="https://www.the-tls.co.uk/articles/official-history-of-united-kingdom-according-to-home-office/">How not to be an alien</a><a href="https://www.the-tls.co.uk/articles/official-history-of-united-kingdom-according-to-home-office/"></a>" By Frank Trentmann.</li>
<li><a href="https://twitter.com/RussInCheshire/status/1306904082108624896">Brexit/Ireland/Trade thread</a>.</li>
<li>"<a href="https://www.mentalfloss.com/article/83262/how-photo-retouching-worked-photoshop">How Photo Retouching Worked Before Photoshop</a>" by Jocelyn Sears.</li>
<li>"<a href="https://www.bloomberg.com/features/2020-japan-lost-generation/">Japan’s Lost Generation Is Still Jobless and Living With Their Parents</a>" by Yoshiaki Nohara.</li>
<li>"<a href="https://cookingonabootstrap.com/2020/07/30/the-price-of-potatoes-and-the-value-of-compassion/">You Don’t Batch Cook When You’re Suicidal</a>" by Jack.</li>
<li>"<a href="https://medium.com/indica/the-overwhelming-racism-of-covid-coverage-78e37e4ce6e8">The Overwhelming Racism Of COVID Coverag</a>e" by Indi Samarajiva.</li>
<li><a href="https://www.thecut.com/article/emily-ratajkowski-owning-my-image-essay.html">Buying Myself Back</a> by Emily Ratajkowski.</li>
</ul>
Thoughts: this version of myself2020-11-01T18:34:15.333-00:00https://ohhelloana.blog/thoughts-this-version-of-myself/<p>When my <a href="https://ohhelloana.blog/article-at-smashing-magazine/">Smashing Magazine article</a> went live a couple of months ago a small discussion happened regarding my choice of words where I said I could have a “one true version” of yourself online.</p>
<p>Behind my two extremes of either silence or self deprecating jokes, is a socially anxious human with baggage. I am not my “true self” online. I wish I was. But this, and I suppose this blog and my current social media activity, is indeed a true version of myself. Without any quote marks. But it is one of the many versions I have and they all have many things in common between them.</p>
<h3>Behind “ohhelloana”</h3>
<blockquote>
<p>A name can be an important part of one's online <a href="https://indieweb.org/identity">identity</a> and can be almost anything one chooses to represent themselves.</p>
</blockquote>
<p>Quote from the page "<a href="https://indieweb.org/name">name</a>" in the IndieWeb wiki.</p>
<p>Many years ago, I wanted to be online without using my real name as I didn’t feel that it was completely safe for me. Not only that but Ana Rodrigues is a very common name so, in many popular websites, that username was already taken. I always liked speech balloons so this name came from that idea. And it was available almost everywhere! I would then use in the name fields something like “Ana R” in an attempt to deceive search results. It was around 2018 that I began to use the full surname in social media because around that time I began to give a couple of talks in meet-ups.</p>
<p>This domain, where this post lives, became the entry point from social media. When applying for jobs, I would redirect people to a <a href="http://anarodrigu.es/">domain that used my then legal name</a>. It would still reference this blog somewhere but I was indeed creating two identities. Even if one of them was very easily discoverable (from my “professional domain” to this one), one would have to put in the effort. So two entry points: one more watered down for job prospects and with information that the recruiter would immediately want but keeping the door open if they wanted to know a bit more about myself as a person.</p>
<p>There were times where I thought I regretted this decision. It crossed my mind that having only one domain to represent me would be the best marketing (this whole sentence is a can of worms). I wondered if ohhelloana.blog was memorable enough. If I have a professional domain to apply for jobs, does this mean that this is my unprofessional domain? I wondered if I should buy all possible TLD combinations to ensure people would land here. In panic, I also bought ohhelloana.dev and anarodrigues.dev as soon as these became available. I wanted to be memorable without having to give up the illusion of privacy and safety that I created many years ago.</p>
<h3>Overthinking this whole thing</h3>
<p>Anyway, I feel very IndieWeb for having two different domains with two different information goals. Both represent me. I think a lot of people find themselves in this situation and it is a tiny bit harder when they work for the web.</p>
<p>For many of us, who work for the web, our domain is a way to stand out in the job market and, especially for freelancers, a way to secure gigs. A professional identity, a means to reach a goal. Perhaps a place where we can’t relax with ourselves as we become a product to be sold. From my perspective, it looks as if we allow our identity, our whole person, to perhaps glow a bit more in certain social media profiles while we truly constraint ourselves when it comes to our personal websites. It is interesting because in quite a few job interviews, you’re tested if you’re “a culture fit” (which is another can of worms).</p>
<p>This isn’t a criticism. In fact, for many people, this is the ideal and the expected thing. It fits their purpose and what they are comfortable with sharing and it is absolutely fine. It only becomes complicated when that isn’t the case.</p>
<p>The way I identify myself within the <a href="https://indieweb.org/User:Ohhelloana.blog">IndieWeb community</a> is by this particular domain. I’m happy with that.</p>
<p>Lastly, Ana Rodrigues, is legally my old name. I decided to remove a couple of my names and add new ones some time ago. Isn’t that funny?</p>
<p>There’s no conclusion to this post. I don’t think there is a right or wrong answer. But this is my experience and how I am dealing with it right now.</p>
August bookmarks2020-09-07T00:00:00-00:00https://ohhelloana.blog/august-2020-bookmarks/<p>The highlight of the month was: <a href="https://www.smashingmagazine.com/2020/08/autonomy-online-indieweb/">My article for Smashing Magazine went live</a>!! Please read (and share if you think someone else would like it too)! 🤗</p>
<h2>Bookmarks from August</h2>
<h3>Web development</h3>
<ul>
<li><a href="https://systemuicons.com/">System UIcons</a> by Corey Ginnivan.</li>
<li><a href="https://www.transparenttextures.com/">Transparent textures</a> by Mike Hearn.</li>
<li><a href="https://matthiasott.com/notes/debugging-html-with-advanced-css-selectors">Debugging HTML With Advanced CSS Selectors</a> by Matthias Ott.</li>
<li><a href="https://codepen.io/michellebarker/pen/MWygYdm">Multiple drop-shadows on clipped element</a> by Michelle Barker.</li>
<li><a href="https://codepen.io/Mamboleoo/pen/xxVKWPG">Rainbow color selection</a> by Louis Hoebregts.</li>
<li><a href="https://css-irl.info/drop-shadow-the-underrated-css-filter/">Drop-Shadow: The Underrated CSS Filter</a> by Michelle Barker.</li>
<li><a href="https://www.youtube.com/watch?v=wjcuhMXuULY">Build vs Buy: Software Systems at Jurassic Park</a> by Todd Gardner.</li>
<li><a href="https://codepen.io/enbee81/full/zYrXVGo">Gradient angles in CSS</a> by Nils Binder.</li>
<li><a href="https://gist.github.com/threepointone/2c2fae0622681284410ec9edcc6acf9e">Feature flags</a> by Sunil Pai.</li>
<li><a href="https://sebastiangreger.net/2020/08/figuring-out-how-to-markup-a-figure">Figuring out how to mark up a figure</a> by Sebastian Greger.</li>
<li><a href="https://github.com/nickcolley/convert-html-to-accessible-pdf">Convert HTML to Accessible PDF</a> by Nick Colley.</li>
<li><a href="https://ericwbailey.design/writing/a11y-is-web-accessibility.html">a11y is web accessibility</a> by Eric W Bailey.</li>
<li><a href="https://www.ilithya.rocks/blog/generative-art/">Generative art</a> by Ilithya.</li>
<li><a href="https://github.com/matuzo/a11y-tests.css">a11y-tests.css</a> by Manuel Matuzovic.</li>
<li><a href="https://gist.github.com/zachleat/a7393810acf7890e6bef6a34eaa7b78c#gistcomment-3426446">smoothscroll.css</a> by Zach Leatherman.</li>
<li><a href="https://tink.uk/the-difference-between-aria-label-and-aria-labelledby/">The difference between aria-label and aria-labelledby</a> by Léonie Watson.</li>
<li><a href="https://www.matuzo.at/blog/heres-what-i-didnt-know-about-content/">Here’s what I didn’t know about “content”</a> by Manuel Matuzovic.</li>
<li><a href="https://beesbuzz.biz/blog/3876-Incremental-progress">Incremental progress</a> by Fluffy.</li>
<li><a href="https://codepen.io/inescodes/pen/VwapRLO">Spirited Away CSS Illustration</a> by Inès.</li>
<li><a href="https://codepen.io/fossheim/pen/BaKQGZJ">RolandMC-500.css</a> by Sarah Fossheim.</li>
<li><a href="https://css-tricks.com/category/history/">Web History</a> by Jay Hoffmann.</li>
<li><a href="https://codepen.io/cobra_winfrey/full/qBZWVmO">Take Me On</a> by Adam Kuhn.</li>
</ul>
<h3>Nice things on personal websites</h3>
<ul>
<li><a href="https://anaulin.org/blog/structured-book-data-in-hugo-posts/">Adding Structured Book Data to My Blog Posts</a> by Ana Ulin.</li>
<li><a href="https://amberley.dev/gratitude/">Gratitude</a> by Amberley Romo.</li>
<li><a href="https://jamesg.blog/2020/09/03/my-first-homebrew-website-club-meeting.html">My First Homebrew Website Club Meeting</a> by James Gallagher.</li>
<li><a href="https://www.tiffanymatthe.com/not-extraordinary">Being OK With Not Being Extraordinary</a> by Tiffany Matthé.</li>
<li><a href="https://visitmy.website/2020/07/13/this-website-is-killing-the-planet/">This website is killing the planet</a> by Steve Messer.</li>
<li><a href="https://lisilinhart.info/projects/portfolio-2020/">Personal Portfolio Refresh</a> by Lisi Linhart.</li>
</ul>
<h3>Others</h3>
<ul>
<li><a href="https://onezero.medium.com/a-permanent-nightmare-pinterest-moderators-fight-to-keep-horrifying-content-off-the-platform-4d8e7ec822fe">A Permanent Nightmare’: Pinterest Moderators Fight to Keep Horrifying Content Off the Platform</a> by Sarah Emerson.</li>
<li><a href="https://www.instagram.com/p/CBgjB2LHFXa/?igshid=1x1d9l362r5pc">Structural Racism and it's Influence on GPs/Dermatologist</a> by Harriet.</li>
<li><a href="https://gen.medium.com/the-pandemic-isnt-forcing-moms-out-of-the-workforce-dads-are-e0cb58e1965b">The Pandemic Isn’t Forcing Moms Out of the Workforce — Dads Are</a> by Jessica Valenti.</li>
<li><a href="https://psyche.co/ideas/you-want-people-to-do-the-right-thing-save-them-the-guilt-trip">You want people to do the right thing? Save them the guilt trip</a> by Claudia R Schneider.</li>
<li><a href="https://www.wsj.com/articles/millennials-covid-financial-crisis-fall-behind-jobless-11596811470">Millennials Slammed by Second Financial Crisis Fall Even Further Behind</a> by Janet Adamy.</li>
<li><a href="https://www.atlasobscura.com/articles/kek-lapis-sarawak">The Mesmerizing Geometry of Malaysia’s Most Complex Cakes</a> by Samantha Chong.</li>
<li><a href="https://www.vox.com/the-goods/21359098/social-justice-slideshows-instagram-activism">How social justice slideshows took over Instagram</a> by Terry Nguyen.</li>
<li><a href="https://kotaku.com/ubisofts-metoo-reckoning-two-months-later-1844717203">Ubisoft's #MeToo Reckoning, Two Months Later</a> by Ethan Gach and Ash Parrish.</li>
<li><a href="https://www.dissentmagazine.org/online_articles/when-polaroid-workers-fought-apartheid">When Polaroid Workers Fought Apartheid</a> by Michael McCanne.</li>
<li><a href="https://www.theguardian.com/world/2020/aug/16/facebook-algorithm-found-to-actively-promote-holocaust-denial">Facebook algorithm found to 'actively promote' Holocaust denial</a> by Mark Townsend.</li>
<li><a href="https://leaddev.com/so-you-want-build-antiracist-teams">So you want to build antiracist teams?</a> by Erica Stanley.</li>
<li><a href="https://qz.com/1668502/colin-mcginn-started-a-philosophy-consultancy-to-advise-on-business-ethics/">A philosopher accused of sexual harassment started a company to advise on business ethics</a> by Olivia Goldhill.</li>
<li><a href="https://www.tinykat.cafe/on-all-that-fuckery">On all that fuckery</a> by Kat Fukui.</li>
<li><a href="https://www.refinery29.com/en-us/2020/08/9987054/new-teacher-challenge">A Message To TikTok Parents Who Use My Face To Make Their Kids Cry</a> by Melissa Blake.</li>
<li><a href="https://leaddev.com/harassers-are-nice-me-and-probably-you">Harassers are nice to me, and probably to you</a> by Sarah Milstein.</li>
<li><a href="https://www.thetimes.co.uk/article/britain-cant-afford-to-miss-this-chance-to-clean-up-the-web-z236dx6h9">Britain can’t afford to miss this chance to clean up the web</a> by Salma Shah. (Note: I didn't actually read this one because I don't have a subscription.)</li>
<li><a href="https://webfoundation.org/2020/08/activists-and-tech-companies-met-to-talk-about-online-violence-against-women-here-are-the-takeaways/">Activists and tech companies met to talk about online violence against women: here are the takeaways</a>.</li>
<li><a href="https://www.unconsentingmedia.org/">Unconsenting Media</a>.</li>
</ul>
<h3>Tweets</h3>
<ul>
<li><a href="https://twitter.com/fightu4anapple/status/1296214703132221440">What trauma sometimes is</a>.</li>
<li><a href="https://twitter.com/danidonovan/status/1290040952153763840">Productivity Anxiety</a> by Dani Donovan.</li>
<li><a href="https://twitter.com/SEOStephW/status/1298944838386282496">Google sheets trick</a>.</li>
<li><a href="https://twitter.com/Schnumn/status/1300434770267115520">On not being social</a>.</li>
<li><a href="https://twitter.com/esrdogrescue">Edinburgh Samoyed Rescue</a>.</li>
<li><a href="https://twitter.com/wallysfax/status/1298946810736566272">How the email finds me</a>.</li>
<li><a href="https://twitter.com/audrocur/status/1298893122747822081?s=20">Malicious compliance</a>.</li>
<li><a href="https://twitter.com/Relentlessbored/status/1298518581274185728?s=20">Relatable alligator</a>.</li>
<li><a href="https://twitter.com/HeyChelseaTroy/status/1296061607198494720">On authors</a>.</li>
<li><a href="https://twitter.com/humorandanimals/status/1292899088313257984">Two types of dogs</a>.</li>
</ul>
<p>And now, in all honesty, my article was indeed the highlight of the month. Mostly because I struggled a lot with my mental health this past month. Maybe it is because I read a lot of unhappy things (my "others" section is nightmare fuel) but I can't help it. I can't just escape. Just a hopeless, powerless and anxious month. Hopefully this September I... feel better.</p>
<p>PS.: I am almost certain I missed some links here of awesome stuff friends did. I'm sorry... My brain isn't fully here recently.</p>
Autonomy Online: A Case For The IndieWeb on Smashing Magazine2020-09-02T00:00:00-00:00https://ohhelloana.blog/article-at-smashing-magazine/<p>Last week <a href="https://www.smashingmagazine.com/2020/08/autonomy-online-indieweb/">my article</a> for Smashing Magazine went live! I was quite nervous and anxious but... so far nobody yelled at me - which is good! It was my first ever experience writing something slightly serious and going through an editing process.</p>
<p><img src="https://ohhelloana.blog/media/smashing_magazine_screenshot.png" alt="Screenshot of my article at Smashing Magazine's website"></p>
<p>I really want to be proud of myself: I wrote something in my second language and during a pandemic. I cried a few times because I felt like I couldn't do it but I... pushed through it. I read it so many times that I hated it at some point. Other times I read it and I thought "nice one Ana". Most times, I was so anxious about misrepresenting the IndieWeb community.</p>
<p>I accidentally may have sparked some discussion due to a couple of things I said - especially around identity.</p>
<blockquote>
<p>I didn’t realize until this point how much it made sense to have a “one true version” of yourself online</p>
</blockquote>
<p>Everything I wrote was based on me, my interpretation, my experience and how I wish to express myself ✨ on the internet ✨. The <a href="https://indieweb.org/name">community welcomes anything</a> one chooses to represent themselves. Which is interesting to me especially because when I joined the IndieWeb community I was hiding my surname on purpose. I want to reflect a bit more on the "one true version" and read what <a href="https://theadhocracy.co.uk/note/autonomy-online-a-case-for-the-indieweb">others</a> <a href="https://petermolnar.net/article/making-things-private/index.html">have</a> <a href="http://www.roughtype.com/?p=8724">written</a> on the topic before I share how I navigate these waters.</p>
<p>I learned a lot throughout the editing process. <a href="https://twitter.com/thewhalelines">Frederick O'Brien</a> really helped me make it much nicer compared to my first draft! The posts in this blog will never be as nice and polished as that one. So don't get used to that tone. Also, for the first time in my life I was asked what is the pronunciation of my last name: it is <code>roo-dree-guhsh</code> (I had to look up) - so thank you Fred!</p>
<p>A big thank you as well to my husband, Hactar friends and friends that read it before I sent it over. And, finally, thank you to everyone who took some minutes to message me, like it or share it. I am still very anxious and I really appreciate all the kindness.</p>
My tech-savvy privilege2020-08-26T00:00:00-00:00https://ohhelloana.blog/my-tech-savvy-privilege/<p>Many of us, myself included, have made jokes about how we are our family’s tech support in an annoyed tone. I now regret those jokes. I wasn’t empathetic and I regret it.</p>
<p>We expect parental controls to help children navigate the internet. The funny thing is that children have been online for the same time as our parents and older generations have been. We’re very forgiving when a <a href="https://www.bbc.co.uk/news/technology-48925623">child orders thousands of pounds worth of fake game coins online</a> but we’re not when it comes to the mistakes of older people. We shame them for falling into Nigerian Prince’s schemes, <a href="https://www.bbc.co.uk/news/business-49825888">romance scams</a>, virus and <a href="https://www.theguardian.com/technology/askjack/2019/jan/17/phishing-email-blackmail-sextortion-webcam">porn phishing emails</a>. <a href="https://en.wikipedia.org/wiki/Catfish:_The_TV_Show">Catfish</a> raised my generation and we have people our age doing stand up routines based on those scams - as if they are general knowledge. They are not.</p>
<p>How can I expect my parents to be tech-savvy when it was my generation (or my sister’s generation) the ones who introduced them to a computer or a phone? My parents have been “online” since 2012. I’ve been online since 2000.</p>
<p>I saw it all, either via direct experience or via friends telling me at school - you know… the grooming, chat roulettes, obscure forums, scams, illegal downloads, fake profiles, photoshopping, editing videos, fake emails, rumours, cyber-bullying. Only to be now trying hard to protect my parents from those things.</p>
<p>I have tech-savvy privilege. Plus I work in the industry. I know how many things are built hanging by thread and I’ve witnessed terrible decisions behind made for the sake of clicks.</p>
<p>The ageism in tech (you know, besides the sexism and racism) is also when you completely forget about a group of users. Decisions made by product and design teams have an incredibly strange consequence and end up being the but end of jokes. The “<a href="https://knowyourmeme.com/memes/family-technical-support">family tech support</a>”. I must extend my understanding of the constraints here: more often than not, there isn’t the money or time to test with all the possible people who could use tech products and it won’t be people like my parents who would be in such testing groups either.</p>
<p>The ageism in tech is for example when your relatives call you because they can’t sign in anymore on a website (usually social media). So you try to explain to them how to find the form input fields. You ask them what they are seeing only to suddenly realise that they are on the page that creates a new account instead of sign-in. This isn’t about intellect. You’re not this superior being because you know how to sign-in on a website. Firstly, we’re probably seeing a design that is likely inaccessible due to colour contrast and hidden labels anyway and secondly is probably designed by someone who has been online for over 15 years now and we’re just used to the pattern. We, tech-savvys, are not special. We just have muscle memory.</p>
<h2>Next, next, next, install</h2>
<p>I’m an immigrant. I use a lot of “free” services to easily communicate with my family and friends regardless of what devices we use. A lot of people have mentioned this before, but the “rage quit social media” is a privilege. I tried it once for three months and we were miserable. The moment we don’t have the same apps to communicate, things like <a href="https://en.wikipedia.org/wiki/Multimedia_Messaging_Service">MMS</a> don’t seem to work well between different operating systems of phones. They just want to communicate with me like… everyone else is communicating with everyone else. They are not going to be involved in a discussion about ethics and privacy of social media. I can’t blame them. Why would they? Why would they assume ill intentions of this medium of communication when they grew up with phones and things they could use without hidden consequences? There is no easy and cheap alternative way to communicate that works on all devices.</p>
<p>Privacy is a privilege - but i’m not going to start on that one right now but for example: I know that if I go to a website to buy something and if I click “confirm and pay” and nothing happens, it is probably because my ad-blocker is on and I have to turn it off.</p>
<p>I know about ad-blockers and I guarantee you that the majority of people don’t. The majority of people are not in dev twitter. The majority of people are on facebook and youtube and others. The majority of people don’t know about VPNs either let alone even afford them.
And again, I am not superior or better than anyone else because I know about this.</p>
<h2>No, people don’t have a choice</h2>
<p>A while back my parents bought a new android phone. They called me and it was already set up. In that call they mentioned: “and my new email is something something”. I asked “why? What is wrong with the email I created for you?” and they explained: “at the phone shop, we asked the staff to set up our phone and it asked for email and password and I didn’t have a google account so they created a new one for me”.</p>
<p>When I say “to most people, Facebook is the internet” I don’t mean this in a patronising tone. I mean that when my parents bought that phone and were forced into a Google account, apps like Facebook and whatsapp were already installed. The majority of the people who didn’t grow up with the internet, especially those who don’t speak english, don’t know about browsers. To most people it is: “Look up on the internet”. And the internet is this thing and no app on their phone is called “internet”.</p>
<p>Speaking of which, the other day I picked up an android phone to test something in a browser and I couldn’t immediately find how to type an url… and I’m tech-savvy. I was stuck in the google dot com landing page.</p>
<p>Anyway...
I was on “family tech support” today. A relative added a comment in the wrong photo and couldn’t figure out how to find it again and how to delete it. Admittedly, I struggled to find the page where I could see all the activity done by the person and find the correct post to even do this task and again... I'm “tech-savvy”.</p>
<p>When I signed in on their account I was horrified with what I saw. Their timeline was just scam ads, people selling fake goods, fake/clickbait news and there is nothing I can do to stop it and protect them from making a mistake. I can click and remove an ad as many times as I want but new ones creep in immediately after. Technically, you aren’t allowed to show the majority of these things on television but you clearly can on the “internet”. Why wouldn’t people assume that these things are regulated too?</p>
<p>I am not perfect. Sometimes I get annoyed with people and blurt out “how could you click in that?”, “of course that’s fake”, “just click on the button!!” and I’m not empathetic or patient. I’m just sad that we got to this point when sometimes all people want is to communicate and connect with their loved ones.</p>
<p>While this is just a ramble without any solution, the more I thought about this the more I tried to remove myself from “the website world” and the devices we use to be online. I started to think about the user interfaces that also have technology and that lots of people can use without as many complaints: ATMs, ticket machines, television or anything with a screen really. It’s interesting.</p>
<p>The internet and communication shouldn’t have a one way path with arrows pointing. And things won’t be fixed by only creating your own blog and sending your RSS feed to your parents. Things won’t be fixed either by burning all the evil websites. The problem is much deeper as it isn’t just websites: it’s operating systems, it’s protocols, it’s hardware, it’s software, it’s design, it’s internationalisation and more. It comes from meetings that only do personas of people who are in the building. It comes from copying what “bigger players” in the industry have done which we assume are the right patterns. If we raise our hands and say “look, there has to be a compromise as we can’t make things easy for everyone” then, in that case, the web isn’t for everyone.</p>
July bookmarks2020-08-04T00:00:00-00:00https://ohhelloana.blog/july-2020-bookmarks/<p>I've been thinking about this bookmark page especially because styling wise it is incomplete and a bit ugly and one day someone will call me out. But that isn't the only thing I've been thinking about: all those days (almost all this year) when I thought that I've done nothing for myself or my career I like to come to my bookmarks page and scroll. The work in the links that I collect here wasn't done by me, but they were learned by me and that is progress and accomplishment. All these people contributed to expanding my views and to my growth. I'm proud of my small archive.</p>
<h2>Bookmarks from July</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://webdevlaw.uk/2020/07/03/check-your-privacy-privilege/">Check your privacy privilege.</a> by Heather Burns.</li>
<li><a href="https://www.fastcompany.com/90523292/discrimination-charges-at-pinterest-reveal-a-hidden-silicon-valley-hiring-problem">Discrimination charges at Pinterest reveal a hidden Silicon Valley hiring problem</a> by Katharine Schwab.</li>
<li><a href="https://monzo.com/blog/training-and-resources-to-help-you-make-your-organisation-more-inclusive">Training and resources to help make your organisation more inclusive</a> by Monzo.</li>
<li><a href="https://shiinobee.itch.io/chronicles-of-2020">Chronicles of 2020</a> by Bea.</li>
<li><a href="https://codepen.io/kathykato/pen/pogaOKG">Clipped Image Reveal on Hover</a> by Katherine Kato.</li>
<li><a href="https://lisilinhart.info/posts/css-houdini-performance">Performance - CSS Painting vs. CSS Houdini Paint API</a> by Lisi Linhart.</li>
<li><a href="https://accessibility-for-teams.com/accessibility-for-product-managers">Accessibility for Product Managers</a> by Peter van Grieken.</li>
<li><a href="http://pauljadam.com/demos/video.html">Video Accessibility Demo</a> by Paul J. Adam.</li>
<li><a href="https://joebell.co.uk/fyi/writing-cleaner-css-transitions">Writing Cleaner CSS Transitions</a> by Joe Bell.</li>
<li><a href="https://pineco.de/accessibility-donts-learn-from-basic-mistakes-in-web-design/">Accessibility Dont’s, Learn From Basic Mistakes in Web Design</a> by Adam Laki.</li>
<li><a href="https://stylestage.dev/">Style Stage</a> by Stephanie Eckles.</li>
<li><a href="https://vincentp.me/articles/2020/07/16/16-20/">From Indieweb Monolith to Microservices</a> by Vincent Pickering.</li>
<li><a href="https://doesmysitedeserverecognition.com/">Does my site deserve recognition?</a> by Adrian Roselli.</li>
<li><a href="https://adamsilver.io/articles/float-labels-are-problematic/">Float labels are problematic</a> by Adam Silver.</li>
<li><a href="https://websitesetup.org/web-accessibility-checklist/">Web Accessibility Checklist</a> by Bruce Lawson.</li>
<li><a href="https://codepen.io/argyleink/pen/BajvPLz">Easings Are Rad</a> by Adam Argyle.</li>
<li><a href="https://martinfowler.com/articles/feature-toggles.html">Feature Toggles (aka Feature Flags)</a> by Pete Hodgson.</li>
<li><a href="https://twitter.com/b0rk/status/1285257205571366917">Position: absolute</a> by Julia Evans.</li>
<li><a href="https://medium.com/@mandy.michael/you-dont-need-a-media-query-for-that-1-inline-content-separators-a9c562a597a6">You don’t need a media query for that: #1 Inline content separators</a> by Mandy Michael.</li>
<li><a href="https://css-irl.info/from-gatsby-to-eleventy/">From Gatsby to Eleventy: Choosing a Static Site Generator for a Personal Site</a> by Michelle Barker.</li>
<li><a href="https://medium.com/ubxd/using-the-gov-uk-prototype-kit-for-back-office-systems-cd0f30129dbf">Challenges and opportunities: Using the GOV.UK Prototype Kit for Back Office systems</a> by Claudia Hopkins.</li>
<li><a href="https://ishadeed.com/article/css-multiple-backgrounds/">Understanding CSS Multiple Backgrounds</a> by Ahmad Shadeed.</li>
<li><a href="https://www.a11ywithlindsey.com/blog/7-ways-tweets-more-accessible">7 Ways to make your Tweets more Accessible</a> by Lindsey.</li>
<li><a href="https://themarkup.org/google-the-giant/2020/07/23/google-advertising-keywords-black-girls">Google Ad Portal Equated “Black Girls” with Porn</a> by Leon Yin and Aaron Sankin.</li>
<li><a href="https://www.youtube.com/watch?v=bjn_eY_cu3Q">Building a Linktree in Webflow | Episode 2 of Webflow 101</a> by Sara Brunettini.</li>
<li><a href="https://edition.cnn.com/2020/07/25/opinions/americans-with-disabilities-act-30th-anniversary-thompson-johns/index.html">The story of the Americans with Disabilities Act is all about bridges</a> by Vilissa Thompson and David J. Johns.</li>
<li><a href="https://doodle-place.glitch.me/">Doodle place</a> by Lingdong Huang.</li>
<li><a href="https://www.smashingmagazine.com/2020/07/thoughts-feelings-creative-wellness/">It’s Good To Talk: Thoughts And Feelings On Creative Wellness</a> by Jhey Tompkins.</li>
<li><a href="https://dev.to/lydiahallie/cs-visualized-cors-5b8h">CS Visualized: CORS</a> by Lydia Hallie.</li>
<li><a href="https://www.theverge.com/21339756/moms-in-tech-facebook-group-racism-white-fragility-community-members">Moms in Tech Facebook group splintering over allegations of racism</a> by Zoe Schiffer.</li>
<li><a href="https://codepen.io/lynnandtonic/pen/VweJKbg">Single div CSS cross stitch</a> by Lynn Fisher.</li>
<li><a href="https://piccalil.li/tutorial/build-a-dashboard-with-cube-css/">Build a dashboard with CUBE CSS</a> by Andy Bell.</li>
<li><a href="https://css-tricks.com/fluid-images-in-a-variable-proportion-layout/">Fluid Images in a Variable Proportion Layout</a> by Lari Maza.</li>
<li><a href="https://1linelayouts.glitch.me/">1-Line Layouts</a> by Una.</li>
<li><a href="https://codepen.io/michellebarker/pen/PoZVqYd">Single div colour wheel</a> by Michelle Barker.</li>
<li><a href="https://www.melissamcewen.com/blog/wordpress-is-fine-for-tech-blogging/">WordPress is fine for tech blogging</a> by Melissa McEwen.</li>
<li><a href="https://piccalil.li/newsletter/50/">Piccalilli Newsletter - Issue #50</a> by Andy Bell.</li>
<li><a href="https://alistapart.com/article/webwaste/">Webwaste</a> by Gerry McGovern.</li>
<li><a href="https://github.com/gnclmorais/bookshelf">Bookshelf</a> by Gonçalo Morais.</li>
</ul>
<h3>Others</h3>
<ul>
<li><a href="https://dignified-mammoth.itch.io/wave-or-waive">Wave or waive game</a>.</li>
<li><a href="https://holapapi.substack.com/p/im-scared-to-learn-new-things">I'm Scared to Learn New Things</a> by John Paul Brammer.</li>
<li><a href="https://theoutline.com/post/7373/you-cant-beat-an-unwinnable-game-you-break-it?zd=4&zi=mjxogv4y">You can’t beat an unwinnable game, but you can break it</a> by Joe Veix.</li>
<li><a href="https://www.their.tube/">Their tube</a>.</li>
<li><a href="https://joshnesbitt.cooking/parisian-baguette/">Parisian Baguette</a> by Josh Nesbitt.</li>
</ul>
<h3>Tweets</h3>
<ul>
<li><a href="https://twitter.com/hankchizljaw/status/1280155138397810688">Representation of twitter arguments</a>.</li>
<li><a href="https://twitter.com/heybuddy_comic/status/1280188690162204674">Joke about capitalism, corona and the government</a>.</li>
<li><a href="https://twitter.com/emrazz/status/1280615057295052801">Cancel culture always existed for women</a>.</li>
<li><a href="https://twitter.com/gnuman1979/status/1281244842081878016?s=20">When you spend $100 on your cat</a>.</li>
<li><a href="hhttps://twitter.com/vizcomic/status/1289113569632673792">Sick and tired of the "I'm not a robot"</a>.</li>
<li><a href="https://twitter.com/Herne_TheHunter/status/1287653401342423040?s=20">Cat eating</a>.</li>
<li><a href="https://twitter.com/liatrisbian/status/1286278309849059328">For when we want to feel better about ourselves</a>.</li>
<li><a href="https://twitter.com/borrachacansada/status/1285435787001999360?s=20">Cat cube</a>.</li>
<li><a href="https://twitter.com/blakekathryn/status/1283068489964478465">Beautiful portfolio items</a>.</li>
</ul>
My Hugo cheat sheet2020-07-29T00:00:00-00:00https://ohhelloana.blog/my-hugo-cheatsheet/<p>I'm a big fan of static site generators and since last year I've been using <a href="https://gohugo.io/">Hugo</a> for a lot for simple and small marketing/product websites for clients. However, I don't know <code>Go</code> and I struggle a bit to remember all the logic that work in the templates so... I do a lot of searching and copy pasting. I started to collect the code/logic that I use most often in websites of this kind. Basically, this page will become for me what CSS Tricks's "A complete guide to Flexbox" is for everyone!</p>
<p>Some of these are in the documentation of Hugo but I personally find it easier to find things with examples. In fact, almost everything I needed, I found via the community chat from Hugo.</p>
<p>Also, some of these things will likely seem very obvious to people who are very used to using Hugo. I am also 100% certain that there are better ways to do certain things. In my opinion, it doesn't really matter as long as the output does what we need. But I had to start somewhere, so this is the blog post I wish I had found when I first started.</p>
<p>PS.: there may be typos in the titles and description of the examples. Funny how these things only turn up after an article is published online! 😁</p>
<h2>The if/else</h2>
<pre class="language-html"><code class="language-html"><br>{{ if }}<br> // something<br>{{ else }}<br> //something<br>{{ end }}<br></code></pre>
<h2>How to check if a value is equal to something</h2>
<pre class="language-html"><code class="language-html"><br>{{ if eq value_1 value_2 }}<br></code></pre>
<h2>How to check if a value is lower than something</h2>
<pre class="language-html"><code class="language-html"><br>{{ if lt value_1 value_2 }}<br></code></pre>
<h2>How to check if a value is greater than something</h2>
<pre class="language-html"><code class="language-html"><br>{{ if gt value_1 value_2 }}<br></code></pre>
<h2>How to combine two checks</h2>
<p>This example checks if a value is lower than 5 and greater than 1.</p>
<pre class="language-html"><code class="language-html"><br>{{ if and (lt $currentIndex 5) (gt $currentIndex 1) }}<br></code></pre>
<h2>How to add a class based on what page you're on</h2>
<p>I wanted to add a specific class to a page called "Privacy policy". This page was created inside my <code>content</code> folder and I named its folder <code>privacy-policy</code> and inside it I created an <code>_index.md</code>. The frontmatter of the <code>.md</code> file has a title. Something like: <code>title: Privacy Policy</code>.</p>
<p>I want a specific class to be added when I visit this particular page.</p>
<pre class="language-html"><code class="language-html"><br><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>main</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{ if eq .Name `Privacy Policy` }}privacy{{ end }}<span class="token punctuation">"</span></span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>main<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> My content<br><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>main</span><span class="token punctuation">></span></span><br></code></pre>
<h2>How to update aria-current in a menu</h2>
<p>This particular example assumes we're iterating on a menu set in the config.</p>
<pre class="language-html"><code class="language-html"><br><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>nav</span> <span class="token attr-name">aria-label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Main menu<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ul</span><span class="token punctuation">></span></span><br> {{ $currentPage := . }}<br> {{ range .Site.Menus.main }}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">aria-current</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{if or ($currentPage.IsMenuCurrent `main` .) ($currentPage.HasMenuCurrent `main` .)}}true{{else}}false{{end}}<span class="token punctuation">"</span></span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{ .URL }}<span class="token punctuation">"</span></span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{ .Title }}<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>{{ .Name }}<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span><br> {{ end }}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ul</span><span class="token punctuation">></span></span><br><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>nav</span><span class="token punctuation">></span></span><br></code></pre>
<h2>How to only render something if there is at least one page in a section.</h2>
<p>This example assumes we have a section called "latest" that has some posts inside it.</p>
<pre class="language-html"><code class="language-html"><br>{{ $news := where .Site.RegularPages "Section" "latest" }} <br>{{ $postCount := len $news }}<br>{{ if gt $postCount 0 }}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>section</span><span class="token punctuation">></span></span><br> {{.Title}}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>section</span><span class="token punctuation">></span></span><br>{{end}}<br></code></pre>
<h2>How to only show the latest three posts of a section</h2>
<p>This example assumes we have a section called "latest" that has some posts inside it.</p>
<pre class="language-html"><code class="language-html"><br>{{ $news := where .Site.RegularPages "Section" "latest" }} <br><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ul</span><span class="token punctuation">></span></span><br> {{ range first 3 $news }}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>{{.Title}}<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span><br> {{ end }}<br><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ul</span><span class="token punctuation">></span></span><br></code></pre>
<h2>How to create a collection of posts that have a certain param and value</h2>
<p>This example wants to collect all the posts inside a section that have a specific param defined in the frontmatter.
For this example, let's assume that we're looking for all the posts inside a section called "latest" that have <code>type: summary</code>.</p>
<pre class="language-html"><code class="language-html"><br>{{ $services := where .Site.RegularPages "Section" "latest" }} <br>{{ $finalList := where $services "Params.type" "summary" }}<br></code></pre>
<h2>How to create a collection of posts that match a certain value</h2>
<p>This example creates a variable called <code>test</code> that iterates over the pages inside a section called <code>case-studies</code> that have the value of <code>draft</code> as false.</p>
<pre class="language-html"><code class="language-html"><br>{{$test := where (where .Site.RegularPages "Section" "case-studies") ".Params.draft" false }}<br></code></pre>
<h2>How to range and order by the value of a param</h2>
<p>This example assumes that a page has <code>order</code> in the frontmatter and a number.</p>
<pre class="language-html"><code class="language-html"><br>{{ $services := where .Site.RegularPages "Section" "latest" }}<br>{{ range $services.ByParam "order" }}<br> // your content<br>{{ end }}<br></code></pre>
<h2>How to replace a character with something else</h2>
<p>I had a specific situation where I had to replace "_" that could come up in a couple of words with a blank space.</p>
<pre class="language-html"><code class="language-html"><br>{{ replace $tag "_" " "}}<br></code></pre>
<h2>How to get the content of an _index.md inside a partial</h2>
<p>Imagine you have a partial (like a banner) and could like to bring the content of the index file of a section to it (in this case, for example an "about" page).</p>
<pre class="language-html"><code class="language-html"><br>{{ with .Site.GetPage "/about" }}<br> {{ .Content }}<br>{{ end }}<br></code></pre>
<h2>How to get Pages that have a value that resolves into false</h2>
<p>This example collects all the pages inside a section that have the value "false" for draft.</p>
<pre class="language-html"><code class="language-html"><br> where .Pages ".Params.draft" false<br></code></pre>
<h2>How to show a list and add commas</h2>
<p>This example attempts to re-create something like the following:</p>
<p>"Animals that are very chill: capybaras, tortoise, dogs."</p>
<pre class="language-html"><code class="language-html"><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Animals that are very chill:<br><br> {{ $list := (where .Site.Pages "Section" "animals") }}<br> {{ $len := (len $list) }}<br><br> {{ range where .Site.Pages "Section" "animals" }} <br> {{ range $index, $element := .Pages }}<br> <br> {{ $currentIndex := (add $index 1)}}<br><br> {{ $currentLength := (sub $len 1 )}}<br> {{.Title}}{{ if eq $currentIndex $currentLength }}. {{else}}, {{end}}<br> {{ end }}<br> {{ end }}<br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span><br> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span><br></code></pre>
<h2>Iterate inside a section and combine options</h2>
<p>Assuming you're adding this to the <code>list.html</code> of a section, this example shows how to get all the pages of a section that have the param draft as <code>false</code> and putting them in reverse chronological order.</p>
<pre class="language-html"><code class="language-html"><br>{{ range ((where .Pages ".Params.draft" false).ByParam "order").Reverse }}<br></code></pre>
<p>I think this is it. I will update it if I remember anything else.</p>
<p>Big thanks to <a href="https://bryanlrobinson.com/blog/how-to-show-your-template-code-in-11ty-blog-posts/">Bryan Robinson</a> who helped me out sort out why my syntax highlight wasn't working via the JAMStack slack channel.</p>
Other bookmarks from May and June2020-07-16T17:32:01.971-00:00https://ohhelloana.blog/may-june-other-bookmarks/<p>The news are quiet now and it is on purpose. There's protests happening. There's things happening. They just aren't showing it anymore. #BlackLivesMatter</p>
<p>I can't believe that I also have to say this but... wear a mask!</p>
<p>My bookmark list was getting big so here's a couple of things I've saved during May and June 2020.</p>
<h2>Bookmarks from the last couple of months</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://oliverjam.es/blog/diy-analytics-netlify-functions/">Build your own analytics with Netlify Functions</a> by Oliver Phillips.</li>
<li><a href="https://ldnwebperf.org/sessions/screen-readers-and-cookie-consents/">Screen readers and cookie consents</a> by Léonie Watson.</li>
<li><a href="https://drawing.garden/">Drawing garden</a>.</li>
<li><a href="https://moderncss.dev/">Modern CSS Solutions</a> by Stephanie Eckles.</li>
<li><a href="https://css-tricks.com/lazy-load-embedded-youtube-videos/">Lazy load embedded YouTube videos</a> by Chris Coyier.</li>
<li><a href="https://cassey-til.glitch.me/">Today Cassey Learned</a> by Cassey Lottman.</li>
<li><a href="https://www.htmhell.dev/20-close-buttons/">#20 HTMHell special: close buttons</a> by Manuel Matuzović.</li>
<li><a href="https://accessibility.expedia.biz/">Expedia Accessibility Guidelines (ExAG)</a>.</li>
<li><a href="https://www.gov.uk/government/publications/cdei-publishes-briefing-paper-on-facial-recognition-technology/snapshot-paper-facial-recognition-technology">Snapshot Paper - Facial Recognition Technology</a>.</li>
<li><a href="https://codepen.io/oliviale/full/BaoXOOP">CSS Grid: Newspaper Layout</a> by Olivia Ng.</li>
<li><a href="https://www.aleksandra.codes/tech-content-consumer">Most tech content is bullshit</a> by Aleksandra Sikora.</li>
<li><a href="https://website-gallery.now.sh/">Monica's inspiration gallery</a>.</li>
<li><a href="https://www.aleksandra.codes/tech-content-consumer">Most tech content is bullshit</a> by Aleksandra Sikora.</li>
<li><a href="https://www.sarasoueidan.com/blog/keyboard-friendlier-article-listings/">Optimizing keyboard navigation using tabindex and ARIA</a> by Sara Soueidan.</li>
<li><a href="https://codepen.io/thebabydino/pen/LYGGwrm?editors=1100">Pure CSS halftone portrait from jpg source</a> by Ana Tudor.</li>
<li><a href="https://codepen.io/fossheim/pen/VweaNYW">CSS Casio keyboard</a> by Sarah Fossheim.</li>
<li><a href="https://blog.logrocket.com/new-media-queries-you-need-to-know/">New media queries you need to know</a> by Kristofer Selbekk.</li>
<li><a href="https://neustadt.fr/essays/the-small-web/">The small web</a> by Parimal Satyal.</li>
<li><a href="https://codepen.io/jh3y/pen/XWmvwYg">Border radius playground</a> by Jhey.</li>
<li><a href="https://amberwilson.co.uk/blog/where-did-the-focus-go/">Where did the focus go</a> by Amber Wilson.</li>
<li><a href="https://increment.com/frontend/when-frontend-means-full-stack/">When frontend means full stack</a> by Chris Coyier.</li>
<li><a href="https://xd.adobe.com/ideas/perspectives/leadership-insights/why-i-dont-believe-in-empathic-design-don-norman/">Why I Don’t Believe in Empathic Design</a> by Don Norman.</li>
<li><a href="https://iainbean.com/posts/2020/your-blog-doesnt-need-a-javascript-framework/">Your blog doesn’t need a JavaScript framework</a> by Iain Bean.</li>
<li><a href="https://thegymnasium.com/take5/introduction-to-screen-readers-using-voiceover">Introduction to screen readers using VoiceOver</a>.</li>
<li><a href="https://adrianroselli.com/2019/01/baseline-rules-for-scrollbar-usability.html">Baseline Rules for Scrollbar Usability</a> by Adrian Roselli.</li>
<li><a href="https://ishadeed.com/article/aligning-logos-css/">Aligning Logo Images in CSS</a> by Ahmad Shadeed.</li>
<li><a href="https://www.aboutmonica.com/blog/2020-06-24-exploring-art-direction-in-gatsby">Exploring Art Direction With Gatsby-Image</a> by Monica Powell.</li>
<li><a href="https://leportella.com/why-have-a-blog.html">Why you should have a blog (and write in it)</a> by Leticia Portella.</li>
<li><a href="https://fettblog.eu/11ty-automatic-twitter-cards/">11ty: Generate Twitter cards automatically</a> by Stefan Baumgartner.</li>
</ul>
<h3>Others</h3>
<ul>
<li><a href="https://onezero.medium.com/the-problem-isnt-zoom-fatigue-it-s-mourning-life-as-we-knew-it-5651bf9053a6">The Problem Isn’t Zoom Fatigue — It’s Mourning Life as We Knew It</a>.</li>
<li><a href="https://twitter.com/TatianaTMac/status/1267252980882997249">Common beginner mistakes when calling out individuals and organisations who are explicitly and repeatedly saying racist shit</a></li>
<li><a href="https://policeabuses.info/">Video archive of police abuse</a></li>
<li><a href="https://twitter.com/AdalynGrace_/status/1275130086090371072">What being difficult to work with actually means</a></li>
</ul>
Overthinking "likes"2020-07-06T00:00:00-00:00https://ohhelloana.blog/overthinking-likes/<p>Back in March (which feels like it was 6 months ago), I helped organise the IndieWebCamp London and one of the sessions was about <a href="https://indieweb.org/2020/London/analytics">analytics and the IndieWeb</a>. At the time I blurted something without much context and I think I need to explain myself.</p>
<h2>Analytics on this blog</h2>
<p>Every once in a while I reactivate my analytics subscription on Netlify (and right now I am actually doing a trial of Fathom). This usually happens when I am getting unusual social media activity and I get curious/nervous to try to find out where it could be coming from. In a previous blog post, I explained that I don’t have analytics anymore because I found that they were a personal source of anxiety. Maybe not so much now, but they were some years ago and when I stopped using them, I actually felt pretty good about it and carried on. </p>
<p>As the <a href="https://indieweb.org/website-analytics">wiki page for analytics in IndieWeb</a> points out in the “criticism” section, not having analytics on a personal website has its upsides around performance and privacy. I personally don’t care what anyone does on their personal website. I don’t have any intentions of imposing my opinion and personal preference about this matter on others.</p>
<p>Whenever I do turn the analytics on, I found them to be super useful to find out where have I messed up: for example, when I converted my blog from Jekyll to Eleventy I deprecated my JSON feed because I couldn’t figure out how to build it (and while I was writing this, I looked up and turns out someone created it) and eventually I had data to back this up: to this date, my analytics show, on the section that tells me what resources were not found, it seems like only one person was actually calling it (i’m so sorry to that person and I will fix this!). It also helps me find out what links I have actually typed incorrectly in my bookmarks section.</p>
<h2>I don’t like “likes” as they are</h2>
<p>Recently, the social media platform Instagram, has announced that they would be trialing hiding the number of likes in posts. This is a response to a public outcry of how this particular social media is a source of <a href="https://www.pbs.org/newshour/science/how-removing-likes-from-instagram-could-affect-our-mental-health">mental health issues</a> <a href="https://edition.cnn.com/2017/05/19/health/instagram-worst-social-network-app-young-people-mental-health/index.html">among our youth</a>. This is where things get a bit tough. I want to be a “cool woman” and claim that “yeah I don’t care about likes” but that isn’t true. I am a very ordinary human with the same dopamine features as anyone else and I would be raising my hand if someone said “never have I ever deleted a funny tweet because no one liked it”. To me, it is a tiny bit embarrassing to admit this but don’t we all care a tiny little bit? Well I’ve been working on getting used to not having a reaction when I share something. Unfortunately, having this feature impact one’s self worth is more common than what we think.</p>
<p>Regardless of how you personally let “likes” affect you, hear me out: if we, as a society, allow ourselves to feel that “likes” or the exact lack of them, somehow define the worth of what we shared, isn’t that saying that the “like” is a metric? A very reduced way of having some sort of analytics? </p>
<p>And for what it is worth: I love liking people’s stuff. I hit “like” all the time! On Instagram, I always “like” what my close friends post (even if it is a photo of my least favourite dish) because I want to show them that “I see you and I care”. My mum likes every single thing I post on facebook, even if it is in English and she doesn’t understand it. </p>
<p>It is a feature that has layers of emotion. </p>
<p>In the past, I used to have in my twitter bio: “some likes are bookmarks” because I was using Twitter’s “like” feature as a bookmark. Other times I was doing a “like” to support what someone posted or a “like” because something made me laugh.</p>
<p>Also on Twitter, in the past I’ve restrained myself from “liking” things because I didn’t want to lose the respect of people I admire. I would stop myself from “liking” cute cat videos because I was too afraid that my interaction would appear on their feed and people would unfollow me. I know, I’m insecure. </p>
<p>I recently noticed that I was doing something unhelpful to my cause. When I am scrolling on TikTok, I instantly scroll through videos that don’t have a single like or only have a handful of them. My brain instantly thinks: “not a lot of likes, not worth it”. I don’t even give them a chance and that sucks. </p>
<p>The few times I posted on Medium or Dev.to I realised that I was constantly looking at their “claps”/”likes”. And yeah, the numbers didn’t go up so I felt silly posting there. I feel silly for admitting this here.</p>
<p>In a tangent and in all honesty, our tech community looks at the numbers of “likes” (or followers) to deem something or someone as worthy of other’s time. That’s how the algorithms sometimes work anyway. And maybe, just maybe, our brains may have become trained to ignore small numbers.</p>
<h2>“Likes” in the IndieWeb</h2>
<p>In the analytics and IndieWeb session, I shouldn’t have stirred and connected analytics and <a href="https://indieweb.org/likes">“likes”</a> in such a loose way where I didn’t explain properly where I was coming from. My usage and view of “likes” is not the way everyone sees it and that’s okay.</p>
<p>I love how the IndieWeb shows us ways <a href="https://indieweb.org/like">we can have interaction in our personal website</a> and even ways to bring likes from silos to our website. When I learned that, I was so excited! It was one of the things that drew me to the community: an alternative. I care a lot about the IndieWeb and promoting it. I really want people to know that you can have exciting web actions on your personal website. </p>
<p>I also care a lot about how social media is having an impact on mental health and what I, a developer, am doing about it. I know “likes” aren’t going away and I’m not trying to push for that. Personally, I don’t think “likes” are a healthy thing at the moment so I don't think I’m going to have “likes” on my blog. I might change my mind in the future.</p>
<p>And the cool thing about IndieWeb and your personal website is that you’re in control of what you show and what you’re comfortable with. </p>
May bookmarks - BLM2020-06-17T17:32:01.971-00:00https://ohhelloana.blog/may-bookmarks-blm/<p>Black Lives Matter.</p>
<p>In today's age with today's resources there is no excuse not to educate yourself and see how we're in a racist society.</p>
<p>Follow the folks who talk about racial injustice. Think how the technology we're building is tracking and tracing everyone who is protesting. Learn about data regulations. Learn the tricks of the media.</p>
<p>Here's a couple of things I think everyone should see. However, I urge you all to please diversify the feeds you consume.</p>
<ul>
<li><a href="https://blacklivesmatter.carrd.co/">Black Lives Matter</a>;</li>
<li><a href="https://www.wetheprotesters.org/">We the protesters</a>;</li>
<li><a href="https://eji.org/">Equal Justice Initiative</a>;</li>
<li><a href="https://docs.google.com/document/d/1BRlF2_zhNe86SGgHa6-VlBO-QgirITwCTugSfKie5Fs/preview?fbclid=IwAR31e5lyskz3mX_EnrFyHvdLSMaPZ0MClWYBWbqzfaA8NzHC8X1PD7k4R04">Anti racism resources</a>;</li>
<li><a href="https://tatianamac.com/posts/save-the-tears/">Save the Tears: White Woman's Guide by Tatiana Mac</a>;</li>
<li><a href="https://twitter.com/tomakeupwityou/status/1266920326182641670">Twitter thread #1</a>;</li>
<li><a href="https://twitter.com/byersfilms/status/1265762726380539904">Twitter thread with petitions</a>;</li>
<li><a href="https://twitter.com/initialola/status/1267037457935224833">Know your rights for stop and search (UK) - Twitter thread</a>;</li>
<li><a href="https://twitter.com/TatianaTMac/status/1267252980882997249">Tips for calling out racist posts - Twitter thread</a>;</li>
<li><a href="https://twitter.com/kamaraxtaurus/status/1266328844056825857">Twitter thread of places you can donate to</a> ;</li>
<li><a href="https://twitter.com/_w0bb1t_/status/1268173813767974923">Anonymise your online footprint (Twitter)</a>;</li>
<li><a href="https://twitter.com/trussleadership/status/1267333391604527104">Twitter thread to white educators</a>;</li>
<li><a href="https://twitter.com/vvnsings/status/1269199349311029248">Donate to BlackMindsMatter UK (Twitter thread)</a>;</li>
<li><a href="https://www.notion.so/Black-Activists-Swers-Creatives-Healers-c9a31d64480e45a59a90e88fbc96c030">Database of Black activists, swers, creatives, and astrologers/spiritualists to support;</a></li>
<li><a href="https://www.instagram.com/p/CA6A3Usl5c4/">Guide to what to say when people deny the reality of what's happening right now</a> (Instagram);</li>
<li><a href="https://www.instagram.com/p/CA41eo8HgXh/">How can I help from Europe? (Instagram)</a>;</li>
<li><a href="https://www.instagram.com/p/BzAarCMiLrx/">The racist legacy of Portuguese colonialism (Instagram)</a>;</li>
<li><a href="https://www.instagram.com/p/CA-02hMnSUD/">Black and POC designers that the fashion industry has silenced</a><a href="https://www.instagram.com/p/CA-02hMnSUD/"> (Instagram)</a>;</li>
<li><a href="https://www.instagram.com/p/CA82O3YlqUS/">Racial gaslighting 101</a> (Instagram);</li>
<li><a href="https://www.instagram.com/p/CA0_G0zDXTr/">"this is to my white friends with feed fatigue" (Instagram)</a>;</li>
<li><a href="https://www.instagram.com/p/CA-O_7vCY_R/">Racismo em Portugal</a> (Instagram);</li>
<li><a href="https://www.instagram.com/p/CAq9_0uJary/">Supremacy system</a> (Instagram);</li>
</ul>
<p>Tech bookmarks can wait another month. This is what matters.</p>
April Bookmarks2020-05-06T17:10:04.830-00:00https://ohhelloana.blog/april-bookmarks/<p>I don't remember much from this last month. All I remember is trying not to be on my computer and just look at the birds that come to the garden. So this will be a very short blog post. A jotting!!!!</p>
<h2>Bookmarks from April</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://www.npmjs.com/package/@aimee.gm/responsive">@aimee.gm/responsive</a></li>
<li><a href="https://www.frontendbookmarks.com/">Front-end Bookmarks</a> by Manuel Matuzović.</li>
<li><a href="https://jdan.github.io/98.css/">98.css</a> by Jordan Scales.</li>
<li><a href="https://blog.mozilla.org/accessibility/">Mozilla Accessibility.</a></li>
<li><a href="https://9elements.com/bem-cheat-sheet/">BEM naming cheat sheet</a> by 9elements.</li>
</ul>
<h3>Not exactly web development related</h3>
<ul>
<li><a href="https://explorabl.es/">Explorable Explanations</a>.</li>
<li><a href="https://ciechanow.ski/gears/">Gears</a> by Bartosz Ciechanowski.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Funny or cute or happy or uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/ArtOfMaquenda/status/1252908785015967744">Lots of babies.</a></li>
<li><a href="https://www.instagram.com/p/B_BL_GeJh_M/?utm_source=ig_web_copy_link">All the cartoons from this account</a>.</li>
<li><a href="https://twitter.com/joevendon/status/1250342472632303616">Baby fox</a>.</li>
<li><a href="https://www.reddit.com/r/IndoorGarden/comments/g15d6p/my_avocado_that_was_grown_from_seed_will_soon/">A big avocado tree</a>.</li>
<li><a href="https://twitter.com/romainrevert/status/1249798306454212610">What we can see now that the skies are clear</a>.</li>
<li><a href="https://vm.tiktok.com/W1rp21/">Just a boy and his cat</a>.</li>
<li><a href="https://twitter.com/AHappierDay/status/1247507101343199233?s=20">Weather man dog</a>.</li>
<li><a href="https://www.pawpixels.com/bernard?pgid=jqqrzeqc-e3f84936-ac2c-4bb0-b4ac-598835450b44">A round cat</a>.</li>
</ul>
Pandemic jottings2020-05-04T16:55:30.386-00:00https://ohhelloana.blog/pandemic-jottings/<p>Around two months ago I started to work from home everyday due to the COVID-19 pandemic. I wasn't really going to write about this as it is hardly positive but I changed my mind after reading <a href="https://www.nytimes.com/2020/04/13/smarter-living/why-you-should-start-a-coronavirus-diary.html">an article suggesting the exact opposite</a>. This article introduced me to my brand new favourite word: jottings!!</p>
<p>So I will try to keep it brief. The last two months have been hard and have been a blur. I've had loved ones fall ill to the virus and people that I knew are no longer here. It's been overwhelming to follow the news in Portugal and in the UK and caring about both countries. It was hard knowing that loved ones were ill in Portugal when I couldn't fly. And coming to terms to the fact that if the worst happens, I couldn't be there and I can't do anything about it.</p>
<p>I've been working from home and there were many days that I genuinely don't remember happening. There were days where I was so anxious I couldn't breathe. There were days that my eyelids were so heavy. I've been exhausted. So I wasn't as productive. And then I felt guilty about that so I would work extra hours to make up for it. I had to stop that cycle.</p>
<p>The irony is that <a href="https://twitter.com/ohhelloana/status/1239329370856214528">I "predicted it"</a> since I am someone who constantly suffers from productivity shame. There were many tweets of people saying that we should "take this lockdown as an opportunity to learn and be better at your job". But like many, I couldn't. This is why I've been away from social media (twitter) because I don't want to feel even more useless.</p>
<p>Everything has started to happen online: tech events, seeing my friends and family, quizzes, my therapist appointments, all work meetings and that has been draining too. I've been shutting down my computer at the end of the day and during the weekends because it can be too much.</p>
<p>While I was writing this post, I scrolled through my phone to see the photos that I had taken in the last two months. While most photos were of my cat and my plants (who deserve their own blog post because they are beautiful and make me happy) some were also of the empty shelves in the supermarket and how much I cried that day. I couldn't stop thinking of all the people who didn't get a chance to buy food and how many people were going to struggle so much. In one of my shopping trips, I saw someone verbally abuse a staff member of the supermarket - someone immediately intervened.</p>
<p>With that episode in mind and the current fines for breaking the rules in lockdown, even though I'm very lucky and privileged, I can't help but worry about hidden repercussions against immigrants. And finally, as a woman, the daily news of increase of domestic violence and <a href="https://www.bbc.co.uk/news/stories-52413994">intimate image abuse</a> have been breaking my heart.</p>
<p>Everything has been poopy but still I am one of the lucky ones. There's lots of people going through a lot worse.</p>
<p>End of jotting! A longer and happier post will come in the next couple of days. Stay safe and healthy.</p>
Redesign in progress2020-04-30T21:01:32.002-00:00https://ohhelloana.blog/redesign-in-progress/<p>I announced on twitter a couple of days ago that I went a bit rogue on my blog. I removed all the CSS after converting it from Jekyll to Eleventy and I want a brand new design for it. The trouble is I'm not a designer.</p>
<p>It doesn't help that I have an irrational hate for white backgrounds. I was just now looking up on Pinterest for some inspiration when I realised that I wasn't looking at "blog designs". I was looking at notebooks. When I want to think about my blog, I look at everything but web design. In fact, <a href="https://twitter.com/ohhelloana/status/1201577627456331776/photo/1">my previous blog design</a>, was inspired by a <a href="https://www.pinterest.co.uk/pin/159385274297948765/">scrapbook pin</a>. This tiny fact was actually buried in my memory because only just now I re-visited my saved pins.</p>
<p>There are rare moments where I see something, like a <a href="https://www.metmuseum.org/art/collection/search/437383">painting</a> or a concert and I immediately think: "how can I make my blog look like that?" and it isn't even... a <em>web medium</em> thing!</p>
<p>I've added a tiny bar at the top of the website to let people know that this is a very raw redesign and it might take a while. I'm sure my blog looks much better in an RSS reader. I've also reduced the size of the main image so that a cat bum isn't the first thing people see.</p>
<p>I'm still working out how it will look like. And then I will make it super IndieWeb! Until there, I will vent in my workplace slack channel about how much all I want is a pretty blog.</p>
<p><img src="https://ohhelloana.blog/assets/posts/screen-shot-2020-04-30-at-22.22.41.png" alt="Screenshot of two of the 71 times I mentioned in slack that I want a pretty blog."></p>
March bookmarks2020-04-01T00:00:00-00:00https://ohhelloana.blog/march-bookmarks-2020/
<p>March! What a concept, huh?</p>
<h2>Bookmarks from March</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://twitter.com/vlh/status/1238581917122953216">ebook all about Animation in Design Systems</a> - by Val Head.</li>
<li><a href="https://www.youtube.com/watch?v=XEI571ju3oE">Creative Coding Essentials</a> - by Tim Rodenbröker.</li>
<li><a href="https://css-tricks.com/a-complete-guide-to-calc-in-css/">A Complete Guide to calc() in CSS</a> - by Chris Coyier.</li>
<li><a href="https://webfoundation.org/2020/03/web-birthday-31/">Why the web needs to work for women and girls.</a></li>
<li><a href="http://cameronmoll.com/journal/dont-call-it-a-comeback">Don’t call it a comeback. I been here for years.</a> - by Cameron Moll.</li>
<li><a href="https://amberwilson.co.uk/blog/accessible-html-elements/">Accessible HTML Elements.</a> - by Amber Wilson.</li>
<li><a href="https://css-tricks.com/playing-with-particles-using-the-web-animations-api/">Playing With Particles Using the Web Animations API.</a> - by Louis Hoebregts.</li>
<li><a href="https://twitter.com/LeaVerou/status/1241619866475474946">Favicons support emojis.</a></li>
<li><a href="https://aneventapart.com/news/post/the-complete-aea-dc-2019-now-online">The Complete AEA DC 2019 Now Online</a></li>
<li><a href="https://accessibility.blog.gov.uk/2020/03/16/why-videos-on-gov-uk-use-the-youtube-video-player/">Why videos on GOV.UK use the YouTube video player</a></li>
<li><a href="https://fontice.com/">Fastest Browser Based WebP Converter</a></li>
<li><a href="https://www.sushkelly.co.uk/work/2020/03/04/let-me-be-your-glue.html">Let me be your glue.</a> - by Sush Kelly.</li>
<li><a href="https://hey.georgie.nu/iwd2020/">I mentor people, because I want to give them the opportunities I didn’t have.</a> - by Georgie Luhur Cooke.</li>
<li><a href="https://www.giftegwuenu.com/improve-video-accessibility-with-captions/">Improve Video Accessibility with Captions.</a> - by Gift Egwuenu.</li>
<li><a href="https://hiddedevries.nl/en/blog/2020-03-01-more-accessible-defaults-please">More accessible defaults, please!</a> - by Hidde de Vries.</li>
<li><a href="https://johno.com/year-of-the-interactive-blog-post/">2020, the year of the interactive blog post.</a> - by John Otander.</li>
</ul>
<h3>Not exactly web development related</h3>
<ul>
<li><a href="https://twitter.com/baba_Omoloro/status/1240956039345901569">Youtube shortcuts (I haven't tried them myself)</a>.</li>
<li><a href="https://educationlinks.fyi/">Education Links</a> - by Andy Bell.</li>
<li><a href="https://helpwithcovid.com/">Help with COVID-19.</a></li>
<li><a href="https://educationlinks.fyi/">Education Links</a> - by Andy Bell.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Funny or cute or happy or uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/ziyatong/status/1240303392188248070?s=20">Cats!</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section might include content that isn't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://twitter.com/lukeisamazing/status/1236943988348813315">A lawsuit that is missremembered.</a></li>
<li><a href="https://twitter.com/helenleigh/status/1235201569618092032">Making a living in creative tech.</a></li>
<li><a href="https://www.belongcon.com/2020/03/11/what-have-i-got-to-be-depressed-about/">What Have I Got to Be Depressed About?</a> - by Robin Craze.</li>
<li><a href="https://twitter.com/Jemima_Khan/status/1234955617825120258">Upskirting by paparazzi.</a></li>
<li><a href="https://twitter.com/yanakuchirko/status/1235050702654672896">Politics in the United States.</a></li>
<li><a href="https://www.nbcnews.com/news/us-news/google-tracked-his-bike-ride-past-burglarized-home-made-him-n1151761">Google tracked his bike ride past a burglarized home. That made him a suspect.</a> - by Jon Schuppe.</li>
</ul>
IndieWebCamp London2020-03-04T00:00:00-00:00https://ohhelloana.blog/indiewebcamp-london/
<p>For the last couple of weeks, I’ve been helping out <a href="https://cheuk.dev/">Cheuk</a> and <a href="https://calumryan.com/">Calum</a> organise IndieWebCamp London and all the excitement has been building up now that we’re approaching the date of the event.</p>
<p>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.</p>
<p>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 <a href="https://2020.indieweb.org/london">event page</a>.</p>
<p>I attended <a href="https://ohhelloana.blog/indie-web-camp-berlin-2018">my first IndieWebCamp</a> 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.</p>
<p>So, do you have a personal website to work on? Or do you want to start one? There’s still time to <a href="https://2020.indieweb.org/london">register</a> and join us on the 14th of March. </p>
<p><a href="https://adactio.com/journal/16320">Not convinced?</a></p>
<h3>Further reading:</h3>
<ul>
<li>
<a href="https://indieweb.org/2020/London">Wiki page for the event.</a>
</li>
<li>
<a href="https://2020.indieweb.org/london">Event page with registration link and Indie RSVPs.</a>
</li>
</ul>
February bookmarks2020-03-03T00:00:00-00:00https://ohhelloana.blog/february-bookmarks-2020/
<p>I didn't realise February was over until today!!!</p>
<h2>Bookmarks from February</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://github.com/ffoodd/a11y.css">a11y.css</a> - by Gaël Poupard.</li>
<li><a href="https://www.nytimes.com/2020/01/20/opinion/facial-recognition-ban-privacy.html">We’re Banning Facial Recognition. We’re Missing the Point.</a> - by Bruce Schneier.</li>
<li><a href="https://twitter.com/Robb0wen/status/1225069857626042368">TIL the ruby tag</a> - by Robb Owen.</li>
<li><a href="https://github.com/SaraVieira/gatsby-starter-book">Gatsby Starter Book</a> - by Sara Vieira.</li>
<li><a href="https://speakerdeck.com/yeseniaperezcruz/expressive-design-systems">Expressive Design Systems</a> - by Yesenia Perez-Cruz.</li>
<li><a href="https://piperhaywood.com/images-consistent-surface-area/">Images with a consistent surface area</a> - by Piper Haywood.</li>
<li><a href="https://nickcolley.co.uk/2020/02/07/pulling-data-from-websites-into-google-sheets/">Pulling data from websites into Google Sheets</a> - by Nick Colley.</li>
<li><a href="https://slides.com/alejandravilla/stagnation#/">The Ghost of Stagnation</a> - by Alejandra Villa.</li>
<li><a href="https://codepen.io/Rumyra/full/xxGKzwp">Image masks: Portraits</a> - by Ruth John.</li>
<li><a href="https://www.htmhell.dev/alt-no-aria-label-no-alt/">#16 alt, no wait…, aria-label, no wait…, alt</a> - by Michael "Spell" Spellacy.</li>
<li><a href="https://drive.google.com/file/d/1JdS15JUSRQLVXWFAzAE8S6qOZHzZ1rQd/view">Guerilla design systems.</a> - by Laura Gonzalez.</li>
<li><a href="https://alistapart.com/article/accessibility-for-vestibular/">Accessibility for Vestibular Disorders: How My Temporary Disability Changed My Perspective</a> - by Facundo Corradini.</li>
<li><a href="https://www.matuzo.at/blog/reading-recommendations-animation-on-the-web-and-vestibular-disorders/">Reading recommendations: Animation on the web and vestibular disorders</a> - by Manuel Matuzović.</li>
<li><a href="https://medium.com/@PavelLaptev/lesser-known-css-properties-in-gifs-966a143497ba">Lesser-known CSS properties in GIFs</a> - by Pavel Laptev.</li>
<li><a href="https://css-tricks.com/a-complete-guide-to-links-and-buttons/">A Complete Guide to Links and Buttons</a> - by CSS Tricks.</li>
<li><a href="https://gist.github.com/paulirish/5d52fb081b3570c81e3a">What forces layout / reflow</a> - by Paul Irish.</li>
<li><a href="https://css-tricks.com/while-you-werent-looking-css-gradients-got-better/">While You Weren’t Looking, CSS Gradients Got Better</a> - by Ana Tudor.</li>
<li><a href="https://www.w3.org/WAI/tutorials/carousels/">Carousel Concepts</a> - by W3C.</li>
<li><a href="https://twitter.com/chrisjrn/status/1232016100038266880">Now you know</a> - by Christopher Neugebauer.</li>
<li><a href="https://hankchizljaw.com/wrote/keeping-it-simple-with-css-that-scales/">Keeping it simple with CSS that scales</a> - by Andy Bell.</li>
<li><a href="https://twitter.com/sebdedeyne/status/1229709640126124033">font-variant-numeric: tabular-nums</a> - by Sebastian De Deyne.</li>
<li><a href="https://frend.co/">Frend</a> - by frend.co.</li>
<li><a href="https://github.com/estelle/merry-go-round">Merry-Go-Round</a> - by Estelle Weyl.</li>
<li><a href="https://codepen.io/michellebarker/pen/oNXZQJK">Typographic grid layouts</a> - by Michelle Barker.</li>
<li><a href="https://www.nngroup.com/articles/accordions-complex-content/">Accordions Are Not Always the Answer for Complex Content on Desktops</a> - by Hoa Loranger.</li>
<li><a href="https://css-tricks.com/fixed-headers-and-jump-links-the-solution-is-scroll-margin-top/">Fixed Headers and Jump Links? The Solution is scroll-margin-top</a> - by Chris Coyier.</li>
<li><a href="https://www.matuzo.at/blog/why-543kb-keep-me-up-at-night/">Why 543 KB keep me up at night</a> - by Manuel Matuzovic.</li>
<li><a href="https://daverupert.com/2020/02/html-the-inaccessible-parts/">HTML: The Inaccessible Parts</a> - by Dave Rupert.</li>
</ul>
<h3>Not exactly web development related</h3>
<ul>
<li><a href="https://www.nytimes.com/2020/02/06/opinion/sunday/oscars-movies-diversity.html">Stop Blaming History for Your All-White, All-Male Movie</a> - by Aisha Harris.</li>
<li><a href="https://noti.st/mandy/2W12mw/very-responsive-typography-with-variable-fonts">Very Responsive Typography with Variable Fonts</a> - by Mandy Michael.</li>
<li><a href="https://readingmedievalbooks.wordpress.com/2020/02/09/learning-from-bad-writing/">Learning from ‘Bad’ Writing</a> - by Dr Lucy Allen-Goss.</li>
<li><a href="https://twitter.com/AaronLinguini/status/1226500538776391680">PSA on "unravel thread tools"</a></li>
<li><a href="https://thewire.in/media/afghan-girl-steve-mccurry-national-geographic">You'll Never See the Iconic Photo of the 'Afghan Girl' the Same Way Again</a> - by Ribhu.</li>
<li><a href="https://www.ribbonfarm.com/2020/01/23/being-your-selves-identity-rd-on-alt-twitter/">Being Your Selves: Identity R&D on alt Twitter</a> - by Aaron Z. Lewis.</li>
<li><a href="https://nienke.dev/blog/sharing-my-salary/">Sharing my salary publicly</a> - by Nienke Dekker.</li>
<li><a href="https://www.fastcompany.com/90462892/filter-out-male-privilege-and-the-web-can-be-a-ghost-town">Filter out male privilege, and the web can be a ghost town</a> - by Mark Wilson.</li>
<li><a href="https://cariefisher.com/top-ten/">Top 10 Pro-tips for Working Remotely</a> - by Carie Fisher.</li>
<li><a href="https://i-d.vice.com/en_uk/article/dygga7/we-dont-need-to-look-real-on-social-media">We don't need to look real on social media</a> - by Rachel Charlene Lewis.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Funny or cute or happy or uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/coolestdudeva/status/1233285333715783681">They were just trying to help.</a></li>
<li><a href="https://twitter.com/hateshaliek/status/1220969875276873728">Cool sound.</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section might include content that isn't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://www.nbcnews.com/tech/social-media/facebook-anti-vaxxers-pushed-mom-not-give-her-son-tamiflu-n1131936">On Facebook, anti-vaxxers urged a mom not to give her son Tamiflu. He later died.</a> - By Brandy Zadrozny.</li>
</ul>
TIL: Iframes and performance2020-02-11T00:00:00-00:00https://ohhelloana.blog/TIL-iframes-and-performance/
<p>Last November I attended <a href="https://ffconf.org/">FFConf</a> where I saw two talks about performance: one from <a href="https://twitter.com/szynszyliszys">Anna Migas</a> and another one from <a href="https://csswizardry.com/">Harry Roberts</a>. I instantly memorised one particular thing from each of the talks. From Anna's I took a mental note to add <code>font-display: swap;</code> and from Harry's talk I was amazed that the order inside the <code>head</code> tag impacts performance.</p>
<p>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.</p>
<p>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 <code>head</code> along with adding the <code>font-display: swap;</code>. 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.</p>
<p>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.</p>
<blockquote cite="https://www.stevesouders.com/blog/2009/06/03/using-iframes-sparingly/">
<p>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.</p>
<footer>—Steve Souders, <cite>Using Iframes Sparingly</cite></footer>
</blockquote>
<p>The above quote comes from a <a href="https://www.stevesouders.com/blog/2009/06/03/using-iframes-sparingly/">blog post written 10 years ago</a> so I had an <a href="https://html.spec.whatwg.org/multipage/iframe-embed-object.html#potentially-delays-the-load-event">extra check</a> to make sure it was still accurate. As a result of this, I also came across an <a href="https://wicg.github.io/priority-hints/">experimental API</a> that I wasn't aware of either.</p>
<p>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.</p>
<p>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.</p>
<h3>Further reading and/or useful resources:</h3>
<ul>
<li>
<a href="https://wicg.github.io/priority-hints/">Priority hints.</a>
</li>
<li>
<a href="https://csswizardry.com/2018/11/css-and-network-performance/">CSS and Network Performance.</a>
</li>
</ul>Overthinking my nostalgia2020-02-06T00:00:00-00:00https://ohhelloana.blog/overthinking-my-nostalgia/<blockquote cite="https://slate.com/technology/2014/08/musical-nostalgia-the-psychology-and-neuroscience-for-song-preference-and-the-reminiscence-bump.html">
<p>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.</p>
</blockquote>
<p>Surely I haven’t been the only one that has come across some <a href="https://www.instagram.com/p/B6iuimOB-2A/">memes</a> that mock one’s insistence of only listening to music they used to listen to when they were teenagers?</p>
<p>I have and annoyingly enough, I can relate to them. This is also backed up by some <a href="https://slate.com/technology/2014/08/musical-nostalgia-the-psychology-and-neuroscience-for-song-preference-and-the-reminiscence-bump.html">articles</a> 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.</p>
<p>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.</p>
<p>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. </p>
<p>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. </p>
<p>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.</p>
<p>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.</p>
<p>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.</p>
<p>My nostalgia comes from the need to feel safe and experiment. I don’t miss <a href="https://eev.ee/blog/2020/02/01/old-css-new-css/">not having rounded borders in CSS</a>. 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.</p>
<p>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). </p>
<p>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. </p>
<p>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.</p>
<p>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?</p>
<p>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.</p>
<p>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.</p>
<p>This also sounds like it is the curse of <a href="https://www.forbes.com/sites/work-in-progress/2010/09/21/bad-career-advice-do-what-you-love-and-youll-never-work-a-day/">“doing what you love so that you’ll never work a day”</a>.</p>
<p>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 <a href="https://dezz.ie/web-history/letting-go-of-the-old-web/">article "Letting Go of the Old Web"</a>.</p>
<p>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. </p>
January bookmarks2020-01-31T00:00:00-00:00https://ohhelloana.blog/january-bookmarks-2020/
<p>The longest month of the year is finally over! The days are getting longer and plans are starting to look aligned.</p>
<h2>Bookmarks from January</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://www.cfpland.com/guides/speaking/">The Comprehensive Guide to Speaking at Technology Conferences in 2020</a> - by Karl Hughes.</li>
<li><a href="https://medium.com/@mattholt/its-2019-and-i-still-make-websites-with-my-bare-hands-73d4eec6b7">It’s 2019 and I Still Make Websites with my Bare Hands</a> - by Matt Holt.</li>
<li><a href="https://dev.to/penelope_zone/changing-your-name-is-a-hard-unsolved-problem-in-computer-science-kjf">Changing your name is a hard unsolved problem in Computer Science</a> - by Penelope Phippen.</li>
<li><a href="https://www.smashingmagazine.com/2020/01/front-end-performance-checklist-2020-pdf-pages/">Front-End Performance Checklist 2020 [PDF, Apple Pages, MS Word]</a> - by Vitaly Friedman.</li>
<li><a href="https://github.com/kadikraman/sorting">A collection of sorting algorithms in JavaScript</a> - by Kadi Kraman.</li>
<li><a href="https://www.chenhuijing.com/blog/is-your-browser-a-polyglot/#%F0%9F%8F%80">Is your browser a polyglot?</a> - by Chen Hui Jing.</li>
<li><a href="https://scottvinkle.me/blogs/blog/how-html-microdata-helps-with-accessibility">How Does HTML Microdata Help With Accessibility?</a> - by Scott Vinkle.</li>
<li><a href="https://www.matuzo.at/blog/css-pro-tip-for-mac-users-always-show-scroll-bars-in-macos/">CSS pro tip for mac users: always show scroll bars in macOS.</a> - by Manuel Matuzovic.</li>
<li><a href="https://codepen.io/xdesro/pen/OJPBjLv">"There Is No Year" Album Cover</a> - by Henry Desroches.</li>
<li><a href="https://accessibility.blog.gov.uk/2020/01/14/training-people-to-do-accessibility-reviews/">Training people to do accessibility reviews</a> - by Beverley Newing.</li>
<li><a href="https://heidiwaterhouse.com/2019/06/19/lady-conference-speaker-speaker-bios/">Speaker Bios</a> - by Heidi Waterhouse.</li>
<li><a href="https://www.freecodecamp.org/news/the-html-handbook/">The HTML Handbook</a> - by Flavio Copes.</li>
<li><a href="https://solar.lowtechmagazine.com/">LOW←TECH MAGAZINE</a></li>
<li><a href="https://twitter.com/argyleink/status/1223026734817087488">CSS can check for a font installed locally before fetching it remotely</a> - by Adam Argyle.</li>
<li><a href="https://css-irl.info/optimising-svgs-for-the-web/">Optimising SVGs for the Web</a> - by Michelle Barker.</li>
<li><a href="https://wattenberger.com/blog/css-cascade">The CSS Cascade</a> - by Amelia Wattenberger.</li>
</ul>
<h3>Not exactly web development related</h3>
<ul>
<li><a href="https://www.elle.com/life-love/sex-relationships/advice/a10010/failure-to-launch-when-beauty-fades-323090/">Failure To Launch: When Beauty Fades</a> - by Elizabeth Wurtzel.</li>
<li><a href="https://www.teenvogue.com/story/digital-blackface-reaction-gifs">We Need to Talk About Digital Blackface in Reaction GIFs</a> - by Lauren Michele Jackson.</li>
<li><a href="https://hbr.org/2019/12/burnout-is-about-your-workplace-not-your-people">Burnout Is About Your Workplace, Not Your People</a> - by Jennifer Moss.</li>
<li><a href="https://www.theecoexperts.co.uk/blog/henry-viii-carbon-footprint">Henry VIII’s Carbon Footprint</a> - by Josh Jackman.</li>
<li><a href="https://www.insider.com/gynecologists-say-ibuprofen-can-lessen-menstrual-flow-2020-1">A viral tweet is claiming that ibuprofen can lessen menstrual flow, and gynecologists say the method actually works</a> - by Shira Feder.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Funny or cute or happy or uplifting content etc.</p>
<ul>
<li><a href="https://www.tiktok.com/@eriicjae/video/6780846262074821894">Cat calling on TikTok.</a></li>
<li><a href="https://twitter.com/GumbyGrrl/status/1217274782925893633">This recipe disaster.</a></li>
<li><a href="https://twitter.com/yungsids/status/1217512949482475521">This miscommunication.</a></li>
<li><a href="https://www.tiktok.com/@pamelaroberts72/video/6783669495987817734">This person living my dream of having a catio.</a></li>
<li><a href="https://twitter.com/bobby/status/1222174262120919040">"My butthole has been a location on Facebook since 2012 and I can't get it removed."</a></li>
<li><a href="https://twitter.com/tinyredbook/status/1222212081090539522">No refunds because of seaguls.</a></li>
<li><a href="https://www.bbc.co.uk/news/uk-england-norfolk-51301815">Calvin Klein perfume 'big hit' with Banham Zoo's big cats</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section might include tweets that aren't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://twitter.com/LouisatheLast/status/1216431532577038337">"How to infantilize an entire generation"</a> - oh no.</li>
</ul>Bookmarks of the rest of 20192020-01-22T00:00:00-00:00https://ohhelloana.blog/bookmarks-2019/
<p>My last bookmark post was in July 2019 and that is quite telling of how things didn't go so well last year for me. At the time, I told myself that I would try to do a bookmark post every month and it all came crashing down around that time. It was in September that I think that I officially burned out. So actually, this will not be a very long collection: I wasn't browsing or reading much and I spent a lot of time offline.</p>
<h2>Bookmarks from August to December 2019</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://dev.to/erikaheidi/normalizing-maternity-in-tech-2oe9">Normalizing Maternity in Tech</a> - by Erika Heidi.</li>
<li><a href="https://docs.google.com/document/d/1ALVJFA8gp7H53iIyPQqoBN1IvZku-5YYcjKpMx6HCXE/edit#">Questions for our First 1:1</a> - by Lara Hogan.</li>
<li><a href="https://www.chenhuijing.com/blog/about-subpxiel-rendering-in-browsers/#%F0%9F%91%BE">Sub-pixel rendering and borders</a> - by Hui Jing.</li>
<li><a href="https://www.nicchan.me/blog/what-tumblr-taught-me-about-accessibility/">What Tumblr Taught Me About Accessibility</a> - by Nic Chan.</li>
<li><a href="https://css-tricks.com/accessibility-and-web-performance-are-not-features-theyre-the-baseline/">Accessibility and web performance are not features, they’re the baseline</a> - by Robin Rendle.</li>
<li><a href="https://blog.tenon.io/web-accessibility-overlays-dont-work">Web Accessibility Overlays Don't Work</a> - by Karl Groves.</li>
<li><a href="https://idea-shredder.glitch.me/">Idea Shredder</a> - by Ruth John.</li>
<li><a href="https://www.nytimes.com/interactive/2019/08/23/opinion/data-internet-privacy-tracking.html">I Visited 47 Sites. Hundreds of Trackers Followed Me.</a> - by Farhad Manjoo.</li>
<li><a href="https://blog.tenon.io/web-accessibility-overlays-dont-work">Web Accessibility Overlays Don't Work</a> - by Karl Groves.</li>
<li><a href="https://css-irl.info/how-to-accessibly-split-text/">How to Accessibly Split Text</a> - by Michelle Barker.</li>
<li><a href="https://adactio.com/journal/15740">The Weight of the WWWorld is Up to Us by Patty Toland</a> - by Jeremy Keith.</li>
<li><a href="https://css-tricks.com/advice-for-technical-writing/">Advice for Technical Writing</a> - by Chris Coyier.</li>
<li><a href="https://dailydevlinks.com/css-style-guides/">CSS Style Guides</a></li>
<li><a href="https://www.technologyreview.com/f/614323/ai-deepfakes-anonymizes-faces-in-videos-photos/">Deepfakes could anonymize people in videos while keeping their personality</a> - by Karen Hao.</li>
<li><a href="https://vanschneider.com/a-love-letter-to-personal-websites">A love letter to my website</a></li>
<li><a href="https://medium.com/@caricaldwell/apology-to-chelsey-rhodes-875eecb5e015">Apology to Chelsey Rhodes</a> - by Cari Caldwell.</li>
<li><a href="https://generativeartistry.com/episodes/generative-art-and-creative-code/">Generative art, creative code, and the world around us!</a> - by Ruth John and Tim Holman.</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/paint-order">Paint order of SVG elements.</a></li>
<li><a href="https://amberwilson.co.uk/blog/what-makes-a-mid-level-developer/">What Makes a Mid-Level Developer?</a> - by Amber Wilson</li>
<li><a href="https://www.matuzo.at/blog/beyond-automatic-accessibility-testing-6-things-i-check-on-every-website-i-build/">Beyond automatic accessibility testing: 6 things I check on every website I build</a> - by Manuel Matuzovic.</li>
<li><a href="https://codepen.io/sdras/full/YzzpVMp">Farting Rhino</a> - by Sarah Drasner.</li>
<li><a href="https://welearncode.com/career-advice/">The Career Advice I Wish I Had</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_layout/Subgrid">Introduction to subgrid</a></li>
<li><a href="https://www.vice.com/en_us/article/d3awk7/flash-is-responsible-for-the-internets-most-creative-era">Flash Is Responsible for the Internet's Most Creative Era</a> - by Ernie Smith.</li>
<li><a href="https://noti.st/laurakalbag/Y4Q95l/8-unbelievable-things-you-never-knew-about-tracking">8 Unbelievable Things You Never Knew About Tracking</a> - by Laura Kalbag.</li>
<li><a href="https://www.theatlantic.com/technology/archive/2015/01/why-i-am-not-a-maker/384767/">Why I Am Not a Maker</a> - by Debbie Chachra.</li>
<li><a href="https://www.npmjs.com/package/canvas2svg">canvas2svg</a></li>
<li><a href="https://www.youtube.com/watch?v=c0bsKc4tiuY">Why you should make useless things</a> - by Simone Giertz.</li>
<li><a href="https://www.slideshare.net/jameswillweb/everyone-39758731">A Web for Everyone</a> - by James Will.</li>
<li><a href="http://juliepagano.com/blog/2016/10/06/mid-career-survival-talk-transcript/">Mid-Career Survival for People Who Don't Want to be an Attrition Statistic When They Grow Up: Talk Transcript</a> - by Julie Pagano.</li>
<li><a href="https://www.rtlstyling.com/">RTL Styling 101</a> - by Ahmad Shadeed.</li>
<li><a href="https://dezz.ie/web-history/letting-go-of-the-old-web/">Letting Go of the Old Web</a> - by Desiree Zamora Garcia.</li>
<li><a href="https://csswizardry.com/2018/11/css-and-network-performance/">CSS and Network Performance</a> - by Harry Roberts.</li>
</ul>
<h3>Not exactly web development related</h3>
<ul>
<li><a href="https://foreignpolicy.com/2018/05/18/sexpat-journalists-are-ruining-asia-coverage/">Sexpat Journalists Are Ruining Asia Coverage</a> - by Joanna Chiu.</li>
<li><a href="https://story.californiasunday.com/escape-domestic-violence">The cost of leaving an abusive relationship</a> - By Ashley Powers.</li>
<li><a href="https://www.bbc.co.uk/programmes/p07nkd84">The Missing Cryptoqueen.</a></li>
<li><a href="https://www.theatlantic.com/technology/archive/2019/10/reddit-moderation-relationships-subreddit-memes/600322/">Inside R/Relationships, the Unbearably Human Corner of Reddit</a> - by Kaitlyn Tiffany.</li>
<li><a href="https://stephaniewalter.design/blog/52-ux-cards-to-discover-cognitive-biases/">52 UX Cards to Discover Cognitive Biases</a> - by Stéphanie Walter.</li>
<li><a href="https://melmagazine.com/en-us/story/talking-to-men-about-their-female-role-models-still-like-pulling-teeth">Talking to Men About Their Female Role Models Is Still Like Pulling Teeth</a> - by
Madeleine Holden.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Funny or cute or happy or uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/joelnet/status/1166723428780597250">I actually quote that clip all the time at home.</a></li>
<li><a href="https://twitter.com/ThingsWork/status/1177307360664027136">A demonstration of constant velocity, using a moving trampoline.</a></li>
<li><a href="https://twitter.com/probablyalissa/status/1180213233124179968">Very haunted</a></li>
<li><a href="https://twitter.com/WildlifeTrusts/status/1195228955055460352">Mini pond.</a></li>
<li><a href="https://twitter.com/KentingtonC/status/1195177863168716803">A "the good place" reference!</a></li>
<li><a href="https://twitter.com/BBCEarth/status/1199689332413460481">Filming an enchanted forest.</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section might include tweets that aren't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://twitter.com/girlziplocked/status/1160610774513004546">"you actually have no idea how the algorithms have affected your social network"</a> - oh no.</li>
<li><a href="https://twitter.com/EricaJoy/status/1166423243948843009">One of the reasons why your product is sexist.</a></li>
<li><a href="https://twitter.com/dqpdang/status/1196126707452973056">4 steps for politely, but firmly, ending a disagreement.</a></li>
</ul>Goodbye 20192019-12-30T00:00:00-00:00https://ohhelloana.blog/goodbye-2019/
<p>This year sucked with the exception of one moment of it. It was a long and draining year. The year number switch doesn’t magically create a brand new blank year where everything bad goes away. In fact, I’ve been dreading the end of 2019 exactly because the end of the year forces me to reflect on it. And when it is a bad year, it is painful to do it.</p>
<p>I looked back to the <a href="https://ohhelloana.blog/the-end-of-2018">blog post</a> that I did one year ago and I’m heartbroken and I feel disappointed in myself. My goals for 2019 were vague but I still feel like I didn’t accomplish anything.</p>
<p>This year <a href="https://ohhelloana.blog/starring-jessie">I lost and found my cat</a> and the whole experience absolutely destroyed me. One of the reasons why I have a lot of anxiety, it is because I have the need to feel safe. When my cat got lost, as I explain in the blog post, I felt exposed, vulnerable and unsafe. These feelings didn’t disappear once we found the cat and it took me weeks to recover. I was on edge all the time and very sensitive to “potential threats”. </p>
<p>I resumed therapy and with it I lost friendships and had some rude awakenings on some people’s character. Realising you’re a people pleaser all your life and sometimes a doormat is a disappointing realisation. And in my case, start asserting boundaries or stop accepting some behaviours towards me backfired. Some people don’t even know they lost me. I was so heartbroken with how I was treated that I just decided to accept that confrontation would not only not change them but it would cause me even more distress. </p>
<p>Therapy was incredibly painful this year and I also experienced re-traumatisation. I addressed a lot of painful memories that I tried to bury and I thought that talking about them would make me feel better. But the actual result was opening intense wounds that bleed for months.</p>
<p>The majority of my year was spent crying and feeling anger and sadness. The bitterness was overwhelming and all I could think was: “where could I have been if this and that hadn’t happened to me?”. This year I finally understood why people talk a lot about the power of forgiveness. I always saw forgiveness in a light level. I thought it was accepting someone’s apology when they messed up but it isn’t. And my problem is that I haven’t been able to forgive the past and it consumed me all year. This has taken a big physical and mental toll on me and changed a lot of relationships.</p>
<p>Because I am not a robot, I can’t fully separate things: <a href="https://ohhelloana.blog/six-talks-later">my talks didn’t go that well</a>, I stopped applying to give talks, I stopped writing, I lost count the amount of times I cried at work. I burned out because I wanted to compensate for every bad day I had this year and I was never satisfied.</p>
<p>And then I entered the forbidden loop: the one where I start comparing myself to the other’s perceived success on social media and resent myself for having current personal issues.</p>
<p>In a scenario where I am a bank account, all the things that happened this year where withdrawals from me and very little was being transferred back. And good things did happen to but I felt like I was living in an overdraft. </p>
<p>Speaking of good things: </p>
<ul>
<li>I helped Oliver organise two very successful <a href="https://www.londoncss.dev/">London CSS events</a>;</li>
<li>I was also hanging out at <a href="http://hwclondon.co.uk/">Homebrew Website Club</a>;</li>
<li>I did some travel;</li>
<li>I got interviewed at <a href="https://developur.rs/posts/ana-rodrigues/">Developurrs</a>;</li>
<li>I got a mention in two of my favourite newsletters: <a href="http://piccalil.li/issues/10">Piccalilli</a> and <a href="https://thehistoryoftheweb.com/postscript/april-2019-weblog-giving-the-web-its-spirit-back/">The History of the Web</a>;</li>
<li><a href="https://twitter.com/SuzeShardlow/status/1131483241981063173">Suze did a beautiful sketch of my talk</a>;</li>
<li>I gave a <a href="https://stac.works/articles/all-day-hey-2019-retrospective">lightning talk</a> at one of my favourite conferences;</li>
<li>I saw beautiful humans getting married and starting their families;</li>
</ul>
<p>And finally, the highlight of the year:</p>
<p>I married the most understanding, patient, kind, compassionate and beautiful human. My resilience is what made me survive this year but it would have been much much harder without him by my side supporting me. </p>
<p>Even in the past when things didn’t go well either he was the only person that fully accepted me and gave me room to feel and grow without holding anything against me. Thank you.</p>
<p>I would be lying if I said I don’t have goals for 2020. I do have some but all I want is for my whole self to feel better. </p>
<p>I suppose that making lists with a lot of goals that are for productivity and efficiency instead of happiness are the killers of my creativity and passion. So I will try but I will need to practise a lot of self forgiveness.</p>
<p>To anyone else who may read this: have a healthy 2020.</p>
Starring Jessie2019-12-11T00:00:00-00:00https://ohhelloana.blog/starring-jessie/
<p>Needless to say, I am my cat's biggest fan. Literally her number one fan. She is a star in my eyes. Everything she does is cute so obviously she is the star of our Christmas cards ever since we adopted her.</p>
<p>This will be her 3rd Christmas with us although we nearly had a disaster earlier this year.</p>
<p>Earlier this year, in February, on a Saturday, I let Jessie out via the catflap as I would do every single day. She usually stays in our garden - at most she would jump next door but she would rarely stray more than one house away.</p>
<p>That day she didn't come home. I thought that maybe she went into someone's house and they took a liking and fed her and let her stay and she would come back in the morning. But I was really worried so I slept in the living room. All I wanted was to hear the catflap noise. But she didn't come home.</p>
<p>Sunday morning we decided to knock on neighbours' houses as we began to be afraid that she may have entered a high fenced garden and not be able to jump back. We also printed flyers with my phone number and put them up on trees.</p>
<p>She didn't come home that day. In fact, she didn't come home for 8 days and those were the most horrible 8 days I've lived this year (and in recent years). I wish I could say that in those 8 days the only thing that happened was missing her but it isn't true. The search for a loved pet makes you vulnerable. During that week, here is a list of things that happened:</p>
<ul>
<li>A woman was walking her dog in our street and I asked her if she happened to see my cat. Her response was to abuse me. Besides the name calling she said that I deserved to have my pet missing because if I loved my pet I wouldn't have lost it.</li>
<li>A man got so angry we put a flyer through his letter box that he left his house to not only be abusive but also to make physical threats. He said we had no business in putting our flyer in his letterbox because, to him, it was rubbish.</li>
<li>I received threatening phone calls from a man claiming to have looked for my cat and demanding money for it.</li>
</ul>
<p>I don't handle threats well, especially if made by men. And in that week I realised that I was vulnerable. Those men knew more or less where we lived, my phone number and that we were desperate to have our cat back. One of the tips to look for a cat is to look for it in the middle of the night. If a cat is scared, they are most likely to come when there are less car noises. So I was doing midnight, 3am and 6am walks around my block calling for her. So I began to be afraid of doing that.</p>
<p>We both became physically unwell and our mental health took a big hit. I got very paranoid and I began to be afraid to answer the phone. I needed to answer the phone if it was someone telling me they found Jessie, but all I could think about was the man on the phone being threatening because I wasn't giving him money.</p>
<p>But good things also happened. I received so many text messages from strangers saying that they were hoping that I would find her and that they were looking out for her too. My NextDoor post got very popular and I got to meet lovely neighbours who really cared. And from NextDoor I had two people who volunteered to come with us one night to call for her. I have tears in my eyes every time I think about how selfless those people were.</p>
<p>We also had so many people sending us photos of cats that did look like her and asking us if it was her. There was one poor cat in one particular street that was caught three times on the same day by different people. I'm sure that cat is still very confused about that weird day they had!</p>
<p>Eight days later, on a Sunday, I had officially given up hope. All I was hoping was that she didn't suffer, in whatever happened. At that point we did everything we could and we needed to get back to work. On that Sunday evening we received a phone call. Up until that point, most phone calls were about similar cats (all very well intentioned obviously) so I thought it was another one like that. I was afraid to answer the phone so I gave it to my partner and he answers it and just gets up and runs through the door. </p>
<p>Jessie was stuck a couple of numbers down in a neighbours cellar. Those neighbours have been away all week and had only just come back and saw our flyers and since something similar had happened to them, they decided to call for her in their cellar. And there was she was. Stuck underneath their floorboards and meowing through a hole in their cellar from which she couldn't get out.</p>
<p>I couldn't believe my own eyes and I couldn't stop crying. Jessie was a bit thinner but she was in good health.</p>
<p>There were other details from this bad experience. I remember when I went to a shop to print her missing flyers, my pen drive stopped working. And because I did those flyers in google docs I thought I could just forward them to the shop's email. Turns out, I couldn't open them without having an app installed. This whole situation happened while I was in tears and my 4G wasn't being fast enough.</p>
<p>I also learned that without social media, it is really hard to reach your local community. I had to join local Facebook groups and create a NextDoor account. I managed to buy a temporary number redirect but I couldn't help but still feeling exposed. I still needed my real phone number in flyers because most people use iMessage and WhatsApp.</p>
<p>Sometimes my husband had work commitments that didn't allow him to stay at home. I questioned my safety a few times when following tips from people.</p>
<p>But we had a happy ending, many people don't. This changed me so much. Before, I would take a photo of a missing pet and keep my eyes open, but now I am actually active in replying to people and hoping to give them the comfort and empathy that I once received. I volunteered to help search when my neighbour's cat went missing (another happy ending story!) and I keep an eye/am active on the groups I once joined when I needed help.</p>
<p>It is free to have empathy.</p>
<p>We would both like to thank everyone at <a href="http://hactar.is/">Hactar</a> who gave me all the time I needed to look for her and to look after her after she was found.</p>
<p>But now back to happy Jessie. She has put the weight back on! And more important than John Lewis Christmas ad: here is Jessie's 2019 Christmas card.</p>
<img src="https://ohhelloana.blog/assets/12_12_2019/jessie_2019.png" alt="Jessie posing in front of a Christmas tree wearing a Christmas outfit with the message: Merry Christmas">
<p>P.S.: You might wanna read <a href="https://developur.rs/posts/ana-rodrigues/">my Developurrs interview with Jessie</a>!</p>
2019-12-05T00:00:00-00:00https://ohhelloana.blog/hwc-11-dec-2019/Personal highlights from FFConf 20192019-11-20T00:00:00-00:00https://ohhelloana.blog/ffconf-2019/
<p>It's been a while since I've written a blog post. Life got a bit too busy and chaotic after July/August and I didn't think this would happen to me but I think I accidentally burned out. Although I was away most of October I still think I didn't fully recover. So, at the beginning of November, I started to really look forward to FFConf because every year I always leave feeling inspired and energised.</p>
<p>I've been to FFConf since I moved to the UK and <a href="https://ohhelloana.blog/the-end-of-2018">I've mentioned it in passing in previous blog posts</a>. It has been a place where I made "friends forever", where I got a lead to my current job and where conversations are natural, human and don't feel like a job interview.</p>
<p>This post will be a reflection post where I will share lots of personal thoughts and notes that I took with me so they may not reflect the content of talks. Sophie has written a <a href="https://localghost.dev/2019/11/ffconf-2019-future-friends-beside-the-seaside/">fantastic day recap</a> that may be align more with that if that's what you're looking for.</p>
<h3>Empathy</h3>
<p>In order to #EngageEmpathy we have to do a serious mental effort. Empathy is a very important topic to me because I've felt the consequences of the lack of it from people around me in the past. It was the second time I've seen a talk by <a href="https://www.communilogue.co/">Sharon Steed</a> and I was, once again, very moved by it.</p>
<p>We all have our unique perspective and background and how we interpret and feel things presented to us. Sharon told us her story about living a stutter and how often empathy wasn't there was she needed but also when it was. I have a completely different life experience from her and still, everything she said could be applied to me and my own experiences.</p>
<p>My instant reaction was to laugh when Sharon said that "empathy is the thing you should be doing not to not be the asshole". But I am sure we have all been in situations where we saw an exchange (or even participated in one) where something was said that was unnecessary and that wasn't as funny. Maybe a co-worker who once made a "joking" comment about you leaving work on time or a bit earlier didn't bother to think that you may have a personal reason why.</p>
<p>That was a mild example but unpleasant exchanges are likely to happen in a workplace where patience, perspective and connection are lacking. When I was working with people who lacked these and I made a mistake or fell short of their expectations, the "finger pointing" culture was very present and it impacted everyone's morale.</p>
<p>I'm still thinking about the definition of empathy. Sharon presented questions that I never considered: you choose empathy with how you define it so: how do I define empathy?</p>
<p>The penny dropped for me here: I've been moving what I define as empathy as I grew too. In fact, I'm pretty sure I wasn't as empathetic as I am now compared to 10 years ago. I began to think about how sometimes, some friends of mine, disappoint me because they said or acted in a way towards me that I would never do right now, but maybe I would have done/said the same 10 years ago?</p>
<p>But the good news is, and like The Good Place has been telling us, we can change and engage in empathy every single day. But at what cost? In the past I've felt exhausted and exposed from educating people about empathy, especially when explaining to them how their actions (or inactions) have impacted me.</p>
<p>I've done my personal reflections alone in the past couple of years. My personal experience with empathy had to come from within, from a lot of self forgiveness and from a lot of "letting go". I've become more empathetic towards others once I learned more about myself.</p>
<p>I admire the work of Sharon. She has made herself vulnerable so that others can learn and bring a new attitude to their workplace which will benefit so many people. Sharon shared key empathy behaviours that we can all individually practise in our daily lives, in and out of your workplace, that can have a wonderful ripple effect.</p>
<p>Imagine being able to feel safe to ask your colleagues what you need and being in an environment that puts people first? Open communicators, safe and included humans deliver wonderful things.</p>
<blockquote cite="https://ohhelloana.blog/ffconf-2019/">
<p>Vulnerability is the gateway for all kinds of things.</p>
</blockquote>
<cite>– Sharon Steed</cite>
<p>Being vulnerable allowed me to take and receive. And I don't mean opportunities (although that too). It allowed me to grow emotionally.</p>
<p>At last, Sharon said something that moved me and completely changed how I interact with my friends:</p>
<blockquote cite="https://ohhelloana.blog/ffconf-2019/">
<p>We don't listen to what people say, we listen to our opinion.</p>
</blockquote>
<cite>– Sharon Steed</cite>
<h3>Becoming a web developer in this day and age</h3>
<p>I was really looking forward to see this talk by <a href="https://www.youtube.com/channel/UCz_hjn40CqWTK9S1xrBDMVw">Amina Adewusi</a> and slightly terrified too. It has crossed my mind multiple times recently how I genuinely don't envy junior developers right now. This talk was a quick reminder how privileged I am and how I was lucky that I joined the industry quite some years ago.</p>
<p>While now more than ever there are more options to learn to code, these still don't cater to caregivers and/or people who don't have an exorbitant amount of money to pay for courses. Not to mention career changing folks who can't study full time.</p>
<p>And after all those challenges, the job search is another challenge. I share some similar stories with Amina - most recruiters don't have empathy or understanding of how your personal time works when doing technical challenges for job interviews. The first and only time I've ever used a recruiter, my phone number was shared with four other recruiters who rang me non-stop from 7am onwards emotionally pressuring me to complete coding challenges.</p>
<p>I genuinely loved how Amina gave a talk to junior developers while also giving tips to those already established in the industry about how they can help. I also recommend Jo's talk from the previous year at FFConf where the focus is how an established developer can be of help to junior developers.</p>
<p>Before becoming a web developer I considered other careers while I was in university. Sadly, these all shared a similar trait to web development: they are "new" and very gatekeeping. When I studied web and graphic design, photography and video, I started to get the impression that "new-comers" aren't necessarily welcome. Professional photographers started to get really upset when young people started to able to afford digital DSLR cameras and photo editing software.</p>
<p>People have a hard time accepting that this an industry that is changing daily and that it is very possible to be "junior" at it and be very good at it. I see this gatekeeping especially from senior folks who believe that junior developers skip "essential skills" with bootcamps and therefore shouldn't be immediately hired. People who believe this are projecting personal frustrations with their own wasted time in now obsolete technologies along with their own insecurities and fears of not being able to catch up. We are all "junior" developers the moment a new javascript framework comes out anyway.</p>
<p>I thought I'd also share some useful links that I captured from Amina's slides:</p>
<ul>
<li><a href="https://www.theguardian.com/technology/2017/dec/04/racist-facial-recognition-white-coders-black-people-police">How white engineers built racist code – and why it's dangerous for black people</a></li>
<li><a href="https://twitter.com/KeziyahL">Keziyah's twitter account</a></li>
</ul>
<blockquote cite="https://ohhelloana.blog/ffconf-2019/">
<p>You have the power to make the web a better place.</p>
</blockquote>
<h3>Work tools</h3>
<p>During the day we had three "a bit more technical" talks. One about Git by <a href="https://alicebartlett.co.uk/">Alice Bartlett</a>, a guide to use browser tools to improve performance by <a href="https://twitter.com/szynszyliszys">Anna Migas</a> and another performance talk by <a href="https://csswizardry.com/">Harry Roberts</a> leaning more towards a business/freelance view.</p>
<p>It is with some shame that I do admit that I make some things that Alice mentioned in her talk. Alice mentioned that, when doing commits, describing all the work made by linking into a ticket isn't a guaranteed method since, at any moment, those tickets or ticketing system may be deleted. This made me realise that I haven't stayed in a job long enough to have seen this happen, so I've been making that mistake for quite some time. Not only that, but until this talk I relied on pull requests to write a lot about the changes being made and I shouldn't do that.</p>
<p>This would have been incredibly useful to have on a welcome book for anyone joining a company that contribute to a project using Git. In fact, it reminded me how in previous jobs I wasn't properly informed of how the team "did their commit messages" and how a documentation guide wasn't available anywhere and yet I was still expected to have known. Empathy, am I right?</p>
<p>I love how performance talks can all be so different and you always learn something new. In Anna's talk, I was reminded of some CSS tricks that I didn't remember (like font swap!) so I really recommend catching up on her work or recorded versions of her talks. </p>
<p>Harry's talk focused on goals when working to improve performance in an angle I hadn't considered before. Until this talk, I was one of the those developers who saw performance as a final number to improve (when tackling the issue from a "done" perspective) without asking other questions. Some of the questions he asks actually make perfect sense:</p>
<ul>
<li>How do you know your website is slow?</li>
<li>What key areas of the website should I look at?</li>
<li>What will it mean for the business if your website is faster?</li>
<li>How will you measure?</li>
</ul>
<p>Harry also shared a great point that I do by default and completely forget when talking to others: capturing data is really important. Before, during and after. He also shared a good point: we need to normalise talking about performance before building something (and to me, this includes even before the design phase) as it seems like a lot of performance work is actually fixing things that were preventable (similar to accessibility).</p>
<h3>Surveillance and more horror stories</h3>
<p>It was hard to name this section since surveillance and poorly designed tech is a topic that really upsets me. As a woman, I've experienced the fallout of poorly designed features that do not take into consideration people who need to be safe while also being able to have a social life like everyone else.</p>
<p><a href="https://laurakalbag.com/">Laura Kalbag</a>'s talk (along with all her work) is really important now more than ever. Laura shared very scary facts on how some corporations have access to an infinite amount of data that although "anonymised" it can easily be "de-anonymised". It scares me that this important information is only being shared with people who are already in a very niche community and how this isn't part of broader education. As Laura pointed out, lots of people have no way to understand what they are consenting to when signing up for services. The same way I didn't give consent for Google to own my FitBit data and yet here I am.</p>
<p>I am an anxious person who usually expects the worst. I am also someone who hasn't seen Black Mirror because I find reality quite... overwhelming as it is. But it bothers me not knowing how far off are we from fiction? It bothers me not knowing when "data" can be used against me. As a woman, I immediately imagine worst case scenarios like, for example, getting different prices when you're on your period. This was an exagerated scenario... I mean, right now the worst that is happening is that these companies are messing with our democracies.</p>
<p>Laura shared some tips of how you can try to protect yourself online along with tips of how you can help have an impact in the tech world that we all develop to:</p>
<ul>
<li>Be independent</li>
<li>Be an advisor</li>
<li>Be advocate</li>
<li>Be the questioner</li>
<li>Be the gatekeeper</li>
<li>Be difficult</li>
<li>Be unprofessional</li>
<li>Be the supported</li>
</ul>
<p>And also very important: Host and own your website!!</p>
<p>Here are some useful links shared by Laura:</p>
<ul>
<li><a href="https://modelviewculture.com/pieces/technology-colonialism">Technology Colonialism</a></li>
<li><a href="https://sitejs.org/">SiteJs.org</a></li>
<li><a href="https://www.imdb.com/title/tt9358204/">The Great Hack</a></li>
<li><a href="https://shoshanazuboff.com/">The book: "The Age of Surveillance Capitalism: The Fight for a Human Future at the New Frontier of Power"</a></li>
<li><a href="hhttp://adam-buxton.co.uk/podcasts">Adam Buxton's podcasts</a></li>
</ul>
<blockquote cite="https://ohhelloana.blog/ffconf-2019/">
<p>Silence is complicity.</p>
</blockquote>
<h3>Creativity</h3>
<p>It is hard to disguise this but: this is my favourite part of the day and the one that made me fall in love with FFConf. This year we were in for another treat! It isn't often that you see a conference promoting fun projects. It is really important to me because in the past I've put off working on silly personal projects out of fear of being mocked and not taken seriously. But FFConf always bring inspiring people over who are in fact, very successful!</p>
<p><a href="https://charlottedann.com/">Charlotte Dann</a> did an amazing talk that explored her background in jewelry making and how she transferred her fantastic skills and creativity into web development. I pretty much had my mouth open the whole time seeing her process of building something from creative coding into pieces of jewelry. I wish I was as cool as Charlotte. It is hard to put into words how it re-sparkled my mind into making things.</p>
<p>And the day ended with Suz showing us how to use web apis to interact with slightly more unusual devices. In this case a game boy printer! It was amazing! I would like to give a go at something like this in the future - although I'm almost sure I've exhausted all my "cat based" ideas.</p>
<p><a href="https://noopkat.com/">Suz Hinton</a> closed the conference with an important message. She talked about big corporations are abusing and taking control of things that belonged to everyone with the example of the 900 MHz band that is designated for amateur radio. An emotional message that touched me as well. I was unaware of this particular example and it was heartbreaking. </p>
<blockquote>
<p>I want less mass-produced surveillance bulls**t and more harry potter magic.</p>
</blockquote><cite>– Suz Hinton</cite>
<p>I want the web to be a medium to create things and/or to communicate and express yourself. You know... like paper for example. To create paper planes, to draw on, to write, to send letters. I miss the wholesome web I once knew. I do not want the web to be a tool for oppression, control and manipulation. Some days it feels impossible to reach the people outside the web community.</p>
<p>I left wondering what else can I do but keen to do something.</p>
<p>Thank you <a href="https://2019.ffconf.org/">FFConf</a>. I want to see you again next year!</p>
2019-08-11T00:00:00-00:00https://ohhelloana.blog/79374/<p>Two months after the first flower 🌸🌺</p>
July bookmarks2019-08-07T00:00:00-00:00https://ohhelloana.blog/july-bookmarks/
<p>When this month started I was very optimistic. I was full of energy and keen to get shit done. Now, I am overwhelmed with this sense of productivity shame. I have two blog posts that are still on my drafts, one side project and a lot of other tasks to do. Hopefully next month it will be better. </p>
<h2>Bookmarks from July</h2>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://kellysutton.com/2019/06/19/a-vacancy-has-been-detected.html">A Vacancy Has Been Detected</a> - by Kelly Sutton.</li>
<li><a href="https://codepen.io/michellebarker/full/gNevza">Rainbow coloured grid with Splitting.js and custom properties</a> - by Michelle Barker.</li>
<li><a href="https://colors.eva.design/">Eva Design System</a></li>
<li><a href="https://voice.mozilla.org/en">Common Voice</a>- by Mozilla</li>
<li><a href="https://shkspr.mobi/blog/2018/02/this-svg-always-shows-todays-date/">SVG shows today's date</a> - by Terence Eden</li>
<li><a href="http://year-in-photos.glitch.me/">Year in photos</a> - by Barbara Yang</li>
<li><a href="http://ctrl-freaks.github.io/freezeframe.js/">freezeframe.js</a></li>
<li><a href="https://developer.paciellogroup.com/blog/2019/07/captions-and-transcripts-and-audio-descriptions-oh-my/">Captions and Transcripts and Audio Descriptions, Oh My!</a> - by Dennis Deacon</li>
<li><a href="https://full-stack.netlify.com/">Full stackers</a> - by Chris Coyier</li>
<li><a href="https://github.com/you-dont-need/You-Dont-Need-Momentjs">You don't need MomentJs</a></li>
<li><a href="https://adamsilver.io/articles/form-design-from-zero-to-hero-all-in-one-blog-post/">Form design: from zero to hero all in one blog post</a> - Adam Silver</li>
<li><a href="https://codepen.io/simeydotme/pen/PrQKgo">Pokemon Card Holo Effect</a> - by Simon Goellner</li>
<li><a href="https://css-irl.info/heatwave-animated-sun-illustration/">Heatwave: An Animated CSS Sun Illustration</a> - by Michelle Barker</li>
<li><a href="https://www.cassie.codes/posts/creating-my-logo-animation/">Creating my logo animation</a> - by Cassie Evans</li>
<li><a href="https://andy-bell.design/wrote/well-being-on-twitter/">Well-being on twitter</a> - by Andy Bell</li>
<li><a href="https://www.sonniesedge.net/posts/real-dark-web/">Real dark web</a> - by Charlie Owen</li>
<blockquote cite="https://www.sonniesedge.net/posts/real-dark-web/">
<p>Let's appreciate what the 1% does. But let's not allow the 1% to dominate the conversations and our collective headspace.</p>
</blockquote>
<cite>– Charlie Owen</cite>
</ul>
<h3>Miscellaneous</h3>
<p>Fun, cute, happy, uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/LGSpace/status/1144866505923936257">10 flowers to grow in your garden.</a></li>
<li><a href="https://twitter.com/ericlbarnes/status/1145718148643131392">A relatable feeling.</a></li>
<li><a href="https://twitter.com/killboysclub/status/1155683872891445250">CCTV footage of me during July</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section might include tweets that aren't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://twitter.com/shl/status/1145337971119276033?s=20">"It's a hundred times easier to criticize than create."</a> - Telling this to myself whenever someone mocks the silly things I create.</li>
</ul>2019-07-27T00:00:00-00:00https://ohhelloana.blog/57670/2019-07-23T00:00:00-00:00https://ohhelloana.blog/hwc-24-july-2019/2019-07-21T00:00:00-00:00https://ohhelloana.blog/39611/<p>😩</p>
June bookmarks2019-07-01T00:00:00-00:00https://ohhelloana.blog/june-bookmarks/
<p>How is it July already?</p>
<h2>Bookmarks from June</h2>
<h3>Non-tech articles</h3>
<ul>
<li><a href="https://www.theguardian.com/news/2019/jun/27/the-invention-of-essex-how-a-county-became-a-caricature">The invention of Essex: how a county became a caricature</a> - by Tim Burrows.</li>
<li><a href="https://www.irishtimes.com/news/crime-and-law/courts/criminal-court/ana-kri%C3%A9gel-murder-trial-the-complete-story-1.3929570">Ana Kriégel murder trial: The complete story</a> - by Conor Gallagher. Content warning: violence against women.</li>
<li><a href="https://www.nytimes.com/interactive/2019/04/30/dining/climate-change-food-eating-habits.html">Your Questions About Food and Climate Change, Answered</a> - By Julia Moskin, Brad Plumer, Rebecca Lieberman and Eden Weingart.</li>
<li><a href="https://www.filmsforaction.org/articles/names-and-locations-of-the-top-100-people-killing-the-planet">Names and Locations of the Top 100 People Killing the Planet</a> - By Jordan Engel.</li>
<li><a href="https://www.theguardian.com/lifeandstyle/2019/jun/14/the-mindfulness-conspiracy-capitalist-spirituality">The mindfulness conspiracy</a> - by Ronald Purser.</li>
</ul>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://extra-css.netlify.com/">Extra.CSS</a> - by Una Kravets.</li>
<li><a href="https://boffosocko.com/2019/06/02/lurking-twitter-the-commons-and-private-posts/">Lurking, Twitter, The Commons, and Private Posts</a> - by Chris Aldrich.</li>
<li><a href="https://codepen.io/michellebarker/full/XwQXGv">Scroll-snap + position: sticky + intersectionObserver</a> - by Michelle Barker.</li>
<li><a href="https://codepen.io/robdimarzo/post/rebuilding-the-solar-system-with-css">Rebuilding the Solar System with CSS</a> - by Rob DiMarzo.</li>
<li><a href="https://www.technologyreview.com/s/613606/the-ai-gig-economy-is-coming-for-you/">The AI gig economy is coming for you</a> - by Karen Hao.</li>
<li><a href="https://responsivebreakpoints.com/">Responsive Image Breakpoints Generator</a> - by Cloudinary.</li>
<li><a href="https://css-tricks.com/drawing-realistic-clouds-with-svg-and-css/">Drawing Realistic Clouds with SVG and CSS</a> - by Beau Jackson.</li>
<li><a href="https://secretgeek.github.io/html_wysiwyg/html.html">This page is a truly naked, brutalist html quine.</a> - by Leon.</li>
<li><a href="https://ishadeed.com/article/vertical-horizontal-lines/">Vertical and Horizontal Lines</a> - by Ahmad Shadeed.</li>
<li><a href="https://variablefonts.dev/">Variable fonts</a> - by Mandy Michael.</li>
<li><a href="https://mxb.dev/blog/the-css-mindset/">The CSS Mindset</a> - by Max Böck.</li>
<li><a href="https://codepen.io/michellebarker/pen/ZdpXqw">Writing modes</a> - by Michelle Barker.</li>
<li><a href="https://www.wsj.com/articles/how-13-became-the-internets-age-of-adulthood-11560850201">How 13 Became the Internet’s Age of Adulthood</a> - by Julie Jargon.</li>
<li><a href="https://medium.com/commitlog/why-dark-gray-is-brighter-than-gray-on-the-web-cab5b933ec1a">Why Dark Gray is Brighter than Gray In CSS</a> - by Casper Beyer.</li>
<li><a href="https://amberwilson.co.uk/learn/#Prebrowsing">Day 17 - Prebrowsing</a> - by Amber Wilson.</li>
<li><a href="https://github.com/carolstran/seeing-sprouts">Seing sprouts</a> - by Carol Stran.</li>
<li><a href="https://dev.to/marek/three-arguments-for-why-you-should-write-more-1no6">Three Arguments for Why You Should Write More</a> - by Marek Zaluski.</li>
<li><a href="https://codepen.io/michellebarker/pen/ydbNrX">Masking</a> - by Michelle Barker.</li>
<li><a href="https://nolanlawson.com/2019/05/29/get-off-of-twitter/">Get off of Twitter</a> - by Nolan Lawson.</li>
<blockquote cite="https://nolanlawson.com/2019/05/29/get-off-of-twitter/">
<p>You’re worried about losing your influence.</p>
</blockquote>
<cite>– Nolan Lawson</cite>
<li><a href="https://medium.com/s/story/how-to-make-your-phone-into-an-ally-not-an-enemy-5e0f4302df6c">How to Make Your Phone Into an Ally, Not an Enemy</a> - by Margaret Morris.</li>
<li><a href="https://ourincrediblejourney.tumblr.com/">Our Incredible Journey</a> - by Phil Gyford.</li>
<li><a href="https://blog.juliobiason.net/thoughts/things-i-learnt-the-hard-way/">Things I Learnt The Hard Way (in 30 Years of Software Development)</a> - by Julio Biason.</li>
<li><a href="https://github.com/M0nica/affirmation_generator">affirmation generator</a> - by Monica Powell.</li>
<li><a href="https://podcasts.apple.com/gb/podcast/tfgl2019-s2-ep8-mirror-mirror-on-the-wall/id1119197543?i=1000440826474">Tech for Good Live S2 Ep8 - Mirror, Mirror on the Wall</a> - by Tech for Good Live.</li>
<li><a href="https://webmention.app/">webmention.app</a> - by Remy Sharp.</li>
<li><a href="https://hylia.website/">A simple starter kit for Eleventy</a> - by Andy Bell.</li>
<li><a href="https://mass-incarceration-hearts-technology.glitch.me/">Mass Incarceration ❤️ Technology</a> - by Jenn Schiffer.</li>
<li><a href="https://ohhelloana.blog/june-bookmarks/every-layout.dev">Every Layout</a> - by Andy Bell and Heydon Pickering.</li>
</ul>
<h3>Miscellaneous</h3>
<p>Fun, cute, happy, uplifting content etc.</p>
<ul>
<li><a href="https://twitter.com/StrangeAnimaIs/status/1103634904359862272">A beautiful roseate spoonbill.</a></li>
<li><a href="https://twitter.com/eduardoboucas/status/1139264125291442176">Showing the state of CI with a little traffic light.</a></li>
<li><a href="https://twitter.com/SpaceCatPics/status/1141062834790510594">A smooshy cat.</a></li>
<li><a href="https://twitter.com/JesusChrysler15/status/1141737119347609601">Dog found a clam!</a></li>
<li><a href="https://twitter.com/manolo_towers/status/1142075152643108864">En el avión con Mamama</a> (i'm sorry, i laughed)</li>
<li><a href="https://twitter.com/DeletedWiki/status/1142559540564516864">This deleted wiki title</a></li>
<li><a href="https://twitter.com/daennapshyah/status/1144644344231682048">This mystery.</a></li>
<li><a href="https://twitter.com/KlutchGame/status/1144722489496473600">This dog with a cone.</a></li>
<li><a href="http://the3gi.com/shrekfest.html">Shrek Fest.</a></li>
</ul>
<h3>Made me think</h3>
<p>Content warning: This section will include tweets that aren't uplifting and happy but rather thoughts that stayed with me.</p>
<ul>
<li><a href="https://twitter.com/evaandheriud/status/1138436934748004353">This tweet explains a lot.</a></li>
<li><a href="https://twitter.com/freialobo/status/1141735837475807232">Etsy sellers being exposed to harrassment.</a></li>
<li><a href="https://twitter.com/sswyrs/status/1139653530464206849">A thread on biased sexism based on a photo in LinkedIn.</a></li>
<li><a href="https://twitter.com/eevee/status/1139926354135310336">"Callout culture".</a></li>
<li><a href="https://twitter.com/KaitlynSchiess/status/1142220099685879808">"I work better under pressure".</a></li>
</ul>2019-06-27T00:00:00-00:00https://ohhelloana.blog/81339/<p>Brighton was looking lovely today 😊</p>
2019-06-25T00:00:00-00:00https://ohhelloana.blog/67409/<p>I wanted to write a good retrospective post about my 6 and something years as a developer. But I struggled. I guess I could say that I’ve made progress but I still feel lost. 😕</p>
2019-06-09T00:00:00-00:00https://ohhelloana.blog/49701/<p>On the right: 31st of March. On the left: today 9th of June! Now I need to figure out why the bottom leafs are yellow. 🌿</p>
2019-06-09T00:00:00-00:00https://ohhelloana.blog/39213/<p>Seeds were in on the 7th of April and today I got my first flower 🌸 🌞 fingers crossed they all make it!</p>
Six talks later2019-06-04T00:00:00-00:00https://ohhelloana.blog/six-talks-later/
<p>The other week I think I retired the talk I’ve been giving about blogging and ended a one year journey. The process began at Global Diversity CFP day in January 2018. I’ve had the opportunity to contribute to their blog about <a href="https://www.globaldiversitycfpday.com/blog#ana-rodrigues">my experience</a> but it took me a while until I gave <a href="https://ohhelloana.blog/viewsource-2018">my very first talk</a> which happened at ViewSource.</p>
<p>My talks have been converted into a <a href="https://ohhelloana.blog/blogging-and-me">blog post</a> awhile back and it had a new update after my last talk. I will still update it whenever I see new content worth sharing.</p>
<p>But I have feelings and things I’ve learned in the process that I want to write down. The fun thing about feelings and emotions is that sometimes they don’t have a solution. You just have to go through them.</p>
<p>Last year I think I ended on a high (a big high comparing to myself!!)! <a href="https://ohhelloana.blog/the-end-of-2018">I did three talks</a> and I was pretty happy and proud of myself that I accomplished my goal for the year.</p>
<p>However 2019 hasn’t been the kindest to me. I have mentioned this in passing in previous blog posts but I have been having lots of bad days especially around anxiety. I freeze a lot and can’t move or think and I haven’t been too kind to myself. I would see lots call for papers being promoted everywhere and I had this (wrong) FOMO feeling all over me that would end up with me feeling like crap because I wasn’t doing “anything”. I also submitted crap talk proposals thanks to it. I gave in to the pressure and still feel like I made a fool of myself. I applied to some things outside talks proposals that were also rejected. This was a bummer.</p>
<p>I’ve set the expectations for myself too high and I have been disappointed with myself. My dissonance may be tricking me but I think I was aware it was happening. My thoughts were all around “heck, you did so many things last year and now you’re doing nothing” but I wasn’t practising what I learnt in therapy and let myself get hurt. I can be my own worst enemy sometimes.</p>
<p>Looking back, I was pretty lucky. The talks I did last year, I got them done in one month and with familiar audiences. Let me explain:</p>
<h2>ViewSource</h2>
<p>This was my very first talk in 2018. I would only have 5 minutes and 20 slides in total, 15 seconds for each slide exactly. I was informed the Sunday before the event that my talk had been selected and I was kindly asked to send my slides on Tuesday. So I did that and technically “closed” my slides on Tuesday. I was so nervous and excited especially given the format that I practised as much as I could. </p>
<p>I was a wreck that morning. I was annoying and emotional but there was a small part of me that was saying “Ana calm down. You only learned a couple of days ago that you were doing this. It is not your fault”. So after the talk was done this was the thought I was holding down to. I was thinking “you did the best you could with the time you had”. </p>
<p>It wasn’t perfect. Far from it. I saw the video afterwards and I was cringing a lot because I noticed all my arm movements and how loud and nervous I was. I learned a lot from watching that video. To my surprise the feedback I received was positive. </p>
<h2>ReactJSGirls and //TODO London</h2>
<p>These talks happened really close to each other. I was happy and comfortable that I could do my own slides and at my own pace. I had a 20 minute slot which, to me, was perfect. But also, I knew the audience well so I knew they were a safe and supportive space. I also received some good feedback on it or at least some people who related to my experience. My guess is that I was thriving with positive feelings and that helped to smile more, make jokes and have energy.</p>
<h2>Talks in 2019</h2>
<p>My positive feelings have been mostly gone (for a variety of personal reasons) and I had no idea they would impact giving a talk I have given before. My genuine thought was: “I’ve done this before, it will be okay”. And it was okay, but this year my brain re-wired itself in a bad way and I see the less nice things first. </p>
<p>Inspired by a tweet from <a href="https://twitter.com/ThisIsJoFrank/status/1091717495394832384">Jo</a>, I told myself: “I guess I need to create my own opportunities if I want to do this more”. I put out a <a href="https://twitter.com/ohhelloana/status/1105455973433573378">tweet</a> asking if anyone would be interested in listening to my talk about blogging and one meet-up was interested. I knew that it is a very niche topic and not many people would be interested in it. Not only that but also I am not a name in the industry. The outcome from that tweet was a talk booked for May so I had a couple of months to prepare. That was one of the very few moments that “I put myself out here” and I was expecting to feel as humiliated as a drunk tweet. It was fine. It obviously wasn’t a very popular tweet and but I didn’t die from embarrassment.</p>
<h3>Meet Ana</h3>
<p>Back in September 2018, in State of the Browser, I had a quick chat with Jeremy Keith where he mentioned <a href="https://adactio.com/notes/9725">drawing your inner critic</a> when preparing for talks (and that is also shared on his <a href="https://adactio.com/journal/14363">journal</a>). This was before I had done my talks so I thought “okay, that is interesting” but I had not met side B Ana yet. Until this year.</p>
<img class="float-left" src="https://ohhelloana.blog/assets/04_06_2019/evil_ana.JPG" alt="Drawing of my evil self wearing a dressing gown and holding a glass of wine.">
<p>She finally appeared in full force like the last boss of a game when I was in Leeds for <a href="https://alldayhey.com/">All Day Hey!</a> on the day before when I was rehearsing. And in the morning, and during the talk. I will never forget when I looked at my slides at saw 06:19 mark and my heart sank. I thought “I’m on stage talking about myself” and this feeling of shame took over me in a way that I don’t remember feeling before.</p>
<p>I made a crucial mistake that day. I sat alone and I allowed my negativity and my other Ana to take over me. Half way through the morning I thought: “all these people speaking today. They are so good, they are the best, the talks are amazing and I know mine is by far the worst. I’m wasting everyone’s time.”</p>
<p>People paid a lot of money to go there and unlike View Source, like side b Ana said, I didn’t have an excuse anymore. In ViewSource I could tell myself I did the best I could. Here I couldn’t. This wasn’t my first time so I should know what I was doing. With no fault of anyone but myself, I felt exposed and vulnerable. I was in front a of a really big audience (compared to a meet-up), the first row full of respected people and I was there “talking about me”. My inner critic was on fire that day and she wouldn’t shut up: “You had one opportunity to make a good impression of yourself and this was it”.</p>
<p>My second mistake was underestimating how my talk worked in that format. I had never done it in a 10 minute slot so I was optimistic in converting a 20 minute talk into 10 minutes and I now think I missed things. This crushed me because I felt like I failed and the feeling of “failure” is something I struggle a lot with.</p>
<p>I was really disappointed with myself that I decided not speak to anyone or check my phone for a while. And then I sat alone for the rest of the day and I allowed my disappointment to grow inside my head. So, don’t do this people - don’t be your own worst enemy.</p>
<h3>A small silver lining</h3>
<p>I had another lightning talk later in the month with Codebar which allowed me to transform my disappointment into something productive. I changed the talk and tried to make it fit better the 10 minutes. That one may have gone a little bit better.</p>
<p>In 2019 I ended up doing three talks and my mood wasn’t in the right place. I tried really hard but my best self wasn’t there. But given the circumstances, I did give all my best and all I had those days.</p>
<h2>Why am I writing this?</h2>
<p>After my first talk this year, I was so heartbroken that I asked around people if they ever felt like I felt. Not many people replied and few that did highlighted how important it is to learn from these experiences and improve. And I agree! It is by trying and failing that we learn something. But I am still battling this feeling “I had one opportunity to make an impression and I ruined it” so I am still working on figuring this one out and grow emotionally.</p>
<p>I need to practise what I preach though. I talked about sharing whatever you want on your blog and how it may or may not help someone. And I suppose we don’t talk much about failure, emotions and simply being humans.</p>
<p>Even writing this made me wonder “am I overexposing myself?” But I don’t think I care enough about that right now. In all fairness, writing this was therapeutic for me. Hopefully by the end of this year I can look back at this and feel like I have learned a new skill.</p>
<h2>A big thank you</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/04_06_2019/01.JPG" alt="All day hey Lanyard with my name and the title lightning speaker.">
<p>Regardless of my own personal issues I do want to say a big thank to <a href="https://twitter.com/joshnesbitt">Josh Nesbitt</a> and <a href="https://twitter.com/csswizardry">Harry Roberts</a> who were so kind to me in All Day Hey!. It was there that I got my very first “different badge”. They treated the lightning speakers like speakers and that doesn’t happen often sadly. I genuinely felt included and I will never forget that. </p><p>
</p><p>As I’ve been struggling with my mental health this year, it somehow couldn’t have happened in a better place as All Day Hey! is one of the few conferences that cares about the community and all aspects that makes us humans. </p>
<br><br><br>
<p>Also a big thank you my friend Paul who this year has attended two of my talks to support me. I really appreciate it.</p>
<p>Thank you to Inês for all your support.</p>
<p>A big thank you to everyone at Hactar.</p>
<p>And a big thank you to my fiancé who sees me ugly crying a lot and still wants to marry me.</p>
<h2>What’s next?</h2>
<p>This section is hilarious! Look at me talking about myself like i’m a thing!!! But in all honesty, I don’t know. I will not be doing any talks this year. I am taking care of myself at the moment but I am enjoying making my blog my little hidden stage.</p>
May bookmarks2019-05-31T00:00:00-00:00https://ohhelloana.blog/may-bookmarks/
<p>This month went by really quickly! It must have been the two bank holidays. And it was a busy month: I did three talks, helped organise a meet-up, attended some meet-ups too, work as usual and life! But I will explore this on another post sometime in the future. For now, this month's bookmarks.</p>
<h2>Bookmarks from May</h2>
<h3>Non-tech articles</h3>
<ul>
<li><a href="https://medium.com/@leslieyang/4-reasons-a-hiring-manager-doesnt-extend-a-job-offer-4df2c9d04720">4 Reasons a Hiring Manager Doesn’t Extend a Job Offer</a> - by Leslie Yang</li>
<li><a href="https://www.theguardian.com/travel/2019/may/05/stockholm-oslo-sweden-railway-train-wilderness-lakeside-towns-islands?CMP=Share_iOSApp_Other">Sweden by train: from Stockholm to Oslo</a> - by Catherine Edwards</li>
<li><a href="https://www.huffingtonpost.co.uk/entry/me-too-backlash-getting-worse_n_5cddd96de4b00e035b8ce786">Me Too Backlash Is Getting Worse</a> - by Emily Peck</li>
<li><a href="https://hbr.org/2019/03/4-reasons-good-employees-lose-their-motivation">4 Reasons Good Employees Lose Their Motivation</a> - by Richard E. Clark and Bror Saxberg</li>
<li><a href="https://www.autostraddle.com/i-was-trained-for-the-culture-wars-in-home-school-awaiting-someone-like-mike-pence-as-a-messiah-367057/amp/?__twitter_impression=true">I Was Trained for the Culture Wars in Home School, Awaiting Someone Like Mike Pence as a Messiah</a> - by Kieryn Darkwater</li>
<li><a href="https://www.wired.com/story/what-inspector-gadget-can-teach-us-about-transhumanism/">Transhumanism Is Tempting—Until You Remember Inspector Gadget</a> - by Rose Eveleth</li>
<li><a href="https://www.wired.com/story/influencers-creators-gender-divide/">Why Women Are Called 'Influencers' and Men 'Creators'</a> - by Emma Grey Ellis</li>
</ul>
<h3>Web development/tech related content</h3>
<ul>
<li><a href="https://www.trysmudford.com/blog/fade-out-siblings-css-trick/">Fading out siblings on hover in CSS</a> - by Trys Mudford</li>
<li><a href="https://zeroequalsfalse.press/posts/it-is-ok-to-only-code-at-work/">It is perfectly OK to only code at work, you can have a life too.</a> - by Marty Jacobs</li>
<li><a href="https://blog.chriszacharias.com/a-conspiracy-to-kill-ie6">A Conspiracy To Kill IE6</a> - by Chris Zacharias</li>
<li><a href="https://axesslab.com/alt-texts/">Alt-texts: The Ultimate Guide</a> - by Daniel Göransson</li>
<li><a href="https://dougsillars.com/2019/05/07/favicons-perhaps-the-least-understood-web-feature/">Favicons: Perhaps the Least Understood Web Feature</a> - by Doug Sillars</li>
<li><a href="https://www.giftegwuenu.com/a-practical-guide-to-optimizing-performance-on-the-web/">A Practical Guide To Optimizing Performance On The Web</a> - by Gift Egwuenu</li>
<li><a href="https://matthiasott.com/articles/into-the-personal-website-verse">Into the Personal-Website-Verse</a> - by Matthias Ott</li>
<li><a href="http://brendandawes.com/blog/permission-to-write-anything">Permission To Write Stuff</a> - by Brendan Dawes</li>
<li><a href="https://www.newyorker.com/news/news-desk/inside-the-team-at-facebook-that-dealt-with-the-christchurch-shooting">Inside the Team at Facebook That Dealt with the Christchurch Shooting</a> - by Kate Klonick</li>
<li><a href="https://medium.com/@devdevcharlie/things-nobody-ever-taught-me-about-css-5d16be8d5d0e">Things nobody ever taught me about CSS.</a> - by Charlie Gerard</li>
<li><a href="https://www.youtube.com/watch?v=oG_cYElSZwM&feature=youtu.be">Accessibility Is More Than Just Supporting Screenreaders</a> - by Seren Davies</li>
<li><a href="https://carolgilabert.me/blog/frontend-ne-2019">Frontend NE 2019</a> - by Carolina Gilabert</li>
<li><a href="https://medium.com/@tatianatmac/why-we-need-more-beginners-teaching-7b8982eb6a4e">Why we need more beginners teaching</a> - by Tatiana Mac</li>
<li><a href="https://medium.com/@andyburgindevops/building-an-inclusive-and-diverse-tech-meetup-50efc5cf81e1">Building an Inclusive and Diverse Tech Meetup</a> - by Andy Burgin</li>
<li><a href="https://carolgilabert.me/blog/impostor-syndrome">Impostor Syndrome and I</a> - by Carolina Gilabert</li>
<li><a href="https://dev.to/lauragift21/how-to-supercharge-your-productivity-as-a-developer-4kln">How To Supercharge Your Productivity As A Developer</a> - by Gift Egwuenu</li>
<li><a href="https://nystudio107.com/blog/the-css-background-image-property-as-an-anti-pattern">The CSS background-image property as an anti-pattern</a> - by Andrew Welch</li>
<li><a href="http://piccalil.li/issues">Piccalilli May Issues</a> - by Andy Bell</li>
<li><a href="https://css-irl.info/debugging-css-grid-part-2-what-the-fraction/">Debugging CSS Grid Part 2: What the Fr(action)?</a> - by Michelle Barker</li>
<li><a href="https://stac.works/articles/all-day-hey-2019-retrospective">All Day Hey! 2019 Retrospective</a> - by Josh Nesbitt</li>
<li><a href="https://vimeo.com/336343886">Take Back Your Web</a> - by Tantek Çelik</li>
</ul>
<h3>Miscellaneous</h3>
<ul>
<li><a href="https://www.youtube.com/watch?v=uE0uKvUbcfw&feature=youtu.be&t=278">Development of chick embryo</a></li>
<li><a href="https://twitter.com/WildlifeTrusts/status/1125023342472433666">A wildlife pound in action</a></li>
<li><a href="https://twitter.com/cozzi_cat/status/1124805085048049665">Possum living in the grill had babies</a></li>
</ul>2019-05-28T00:00:00-00:00https://ohhelloana.blog/hwc-29-may-2019/Instagram post2019-05-27T00:00:00-00:00https://ohhelloana.blog/50527/<p>Bank holiday walks 🦆🌿</p>
2019-05-25T00:00:00-00:00https://ohhelloana.blog/54394/<p>A month ago today I added another photo to this collection 😊💃🏻 always leaving inspired from @vesalaofficial shows ✨</p>
I finally learned how to RSVP using webmentions2019-05-21T00:00:00-00:00https://ohhelloana.blog/rsvp-using-webmentions/
<p>Sometimes I feel like I am the only one struggling with how to put together all the pieces of the IndieWeb. I think I understand them all isolated but I struggle have vision with how they all connect. I think it is related to the way I learn which may be different from the majority of the people. I saw <a href="https://doubleloop.net/2019/05/10/5392/">Neil's sketch</a> of what is happening in his IndieWeb setup and... I don't have think I have anything similar to it.</p>
<p>One thing I struggle a lot is with Webmentions. I usually joke that I have a Webmention curse. I've tried many tools to try to get Webmentions in my blog but because I would use third party tools that always do magic stuff for me, I don't fully understand them. Even with all that magic I haven't been able to get it to work. My other struggle is that most Webmentions tools out there are built in languages I don't understand.</p>
<p>While at Homebrew Website Club London I told <a href="https://calumryan.com/">Calum</a> and <a href="https://doubleloop.net/">Neil</a> that I wish I had "Webmentions working" so that I could RSVP to the event on the website. Turns out things are not that connected!</p>
<p>So, to practise what I preach, I decided to write down what I learned last Wednesday.</p>
<h3>How RSVP using Webmentions work</h3>
<ul>
<li>A blog entry or HTML page is created saying you're rsvping to an event using the correct microformats.</li>
<li>The same blog entry or HTML page is used to send a webmention to the event in question.</li>
</ul>
<h4>
Disclaimer:
</h4>
<ul>
<li>This is written based on how my blog works and it is built.</li>
<li>Assuming you already use web sign-in and webmentions.io</li>
<li>Some familarity with microformats.</li>
<li>I couldn't manage to get syntax highlighting working on my blog so I will have to link to my Git Hub files. I'm sorry.</li>
</ul>
<h3>Create your RSVP template</h3>
<p>At the time of writting this blog post I was using Jekyll but I am certain this applies to anything else. I based mine on the example available on the <a href="https://indieweb.org/rsvp">IndieWeb wiki's page for RSVPs</a>. Also at the time of writing this blog post I had not added a particular style to my template but it is available in my <a href="https://github.com/ohhelloana/ohhelloana/blob/master/_layouts/rsvp.html">GitHub</a>.</p>
<p>Note: Make sure you add date to it. I didn't and it wasn't picking it up.</p>
<h3>Create your post/page where you announce your RSVP</h3>
<p>Because I am using Jekyll, I was able to create a blog post where I choose the template to be used. In my post, I wanted to RSVP to the event I was at: Homebrew Website Club London. So I created a blog post (available in my <a href="https://github.com/ohhelloana/ohhelloana/blob/master/_posts/2019-05-15-hwc-15-may-2019.html">GitHub</a>) where I specify my RSVP (in this case "yes"), the "targetName", "targetUrl" and all the other info to match my <a href="https://github.com/ohhelloana/ohhelloana/blob/master/_layouts/rsvp.html">layout</a> (don't forget "date").</p>
<p>The reason why this blog entry doesn't appear in my home page it is because I gave it a category called <a href="https://github.com/ohhelloana/ohhelloana/blob/master/_posts/2019-05-15-hwc-15-may-2019.html#L8">"rsvp"</a> and when I <a href="https://github.com/ohhelloana/ohhelloana/blob/master/_layouts/home.html#L15">list all my blog posts</a> I am filtering them by category.</p>
<p>I now had a <a href="https://ohhelloana.blog/hwc-15-may-2019">RSVP post</a>.</p>
<h3>Testing and debugging</h3>
<p>Before I sent my RSVP, Calum advised me to test it. One way you can do it is using <a href="http://pin13.net/">pin13</a>. I'm really glad I did because in fact, <a href="https://github.com/ohhelloana/ohhelloana/blob/cb3c1e3c571a6f9353208fbbad3b9365993f98b1/_posts/2019-05-15-hwc-15-may-2019.html">my first attempt</a> was missing important details and it wasn't sending all the necessary info.</p>
<img class="post-image" src="https://ohhelloana.blog/assets/21_05_2019/pin13.png" alt="Screenshot of the pin13 website using my blog entry url and showing the resulting JSON.">
<p>I didn't know how to debug so at the time we used a working example from Calum, pasted the urls and compared both to see what was missing. If you're familar with microformats you will recognise them and how they are used when <a href="http://pin13.net/mf2/?url=https%3A%2F%2Fwww.ohhelloana.blog%2Fhwc-15-may-2019">seeing the whole structure</a>. In my case, what was missing (and it wasn't immediately obvious) was the <a href="https://github.com/ohhelloana/ohhelloana/commit/a07cbc459bc6244ddfbd8c3337bfbdd5f6c55c64">information if the post was published</a>, <a href="https://github.com/ohhelloana/ohhelloana/commit/4124a5b3d004367fb3c08d239f85620396f9125a">quotes around my RSVP answer</a> and <a href="https://github.com/ohhelloana/ohhelloana/commit/a065e85778d34f0b83b818ccfb95fb5b00ed7203">author information in the template</a> (with the correct hierarchy).</p>
<p>Another helpful way to see what and if you're missing something is to check the mentions in your target url (this way work best if you submit your Webmention and it isn't appearing like all the others). In this case I used Webmention.io for it and <a href="https://webmention.io/api/mentions?target=https://hwclondon.co.uk/meetups/20190515">checked everyone else's RSVP</a> content. This method was how we spotted that I was missing the "published" information regarding my post.</p>
<h3>Sending a Webmention</h3>
<p>Using <a href="https://telegraph.p3k.io/send-a-webmention">Telegraph</a> you can send Webmentions. In the "Source URL" I pasted my blog entry with my RSVP and in the "Target URL" I pasted the url of the Homebrew Website Club that I wanted to RSVP to.</p>
<img class="post-image" src="https://ohhelloana.blog/assets/21_05_2019/telegraph_send_webmention.png" alt="Screenshot of the Telegraph website with the two input fields filled out with both urls.">
<p>After submitting it, you should see a screen that informs you of the status of it.</p>
<h3>Celebration time?</h3>
<p>Depending on how frequently your target URL collects Webmentions, and assuming that you saw a success screen after submiting your website, all you have to do is check the target URL. After some attempts <a href="https://hwclondon.co.uk/meetups/20190515">mine ended up working</a>! If you want to change anything about it (I changed my photo caption), you would have to submit the webmention again.</p>
<h3>Further reading and useful resources:</h3>
<ul>
<li>
<a href="https://indieweb.org/rsvp">IndieWeb's wiki article on RSVP.</a>
</li>
<li>
<a href="https://indiewebguides.org/">IndieWeb Guides.</a>
</li>
<li>
<a href="https://webmention.io/">Webmentio.io</a>
</li>
<li>
<a href="http://pin13.net/">pin13</a>
</li>
<li>
<a href="https://telegraph.p3k.io/">Telegraph</a>
</li>
<li>
<a href="http://microformats.org/wiki/h-entry#p-rsvp">Microformats</a>
</li>
<li>
<a href="https://ohhelloana.blog/hwc-15-may-2019">My RSVP post</a>
</li>
</ul>
<p>Thank you to <a href="https://calumryan.com/">Calum</a> and <a href="https://doubleloop.net/">Neil</a> for all their help and patience with me! Now I need to figure out all the other bits of Webmentions!</p>
2019-05-15T00:00:00-00:00https://ohhelloana.blog/hwc-15-may-2019/April bookmarks2019-05-06T00:00:00-00:00https://ohhelloana.blog/april-bookmarks-2019/
<p>April was an interesting month. This year hasn't been great for me because, for the first time, I really can't control my anxiety. Everything I can't control have been draining me in a way that I never experienced before. Those close to me know I've been struggling a lot daily and it sucks. This month I took nearly two weeks off from work and it made me realise how much anxiety I have on a normal day. While I was on holidays I barely used social media or the news and to no one's surprise, my anxiety went down by a lot. And guess what? I didn't miss out much on tech. Was a new shiny tech thing out? Cool, I will look at it when and if I need it.</p>
<h2>Bookmarks from April</h2>
<h3>Non-tech articles</h3>
<ul>
<li><a href="https://theoutline.com/post/7267/living-with-passive-suicidal-ideation?zd=1&zi=vzn2fu6k">I am not always very attached to being alive</a> - by Anna Borges</li>
<li><a href="https://www.theguardian.com/environment/2019/mar/29/eu-bans-widely-used-pesticide-over-safety-concerns?fbclid=IwAR06d00Hle2asXhBC-3GQ7i9A8yxnHzfh49BXW1XXrzPDK4TtjqmQumpk2Y">EU bans UK's most-used pesticide over health and environment fears</a> - by Damian Carrington</li>
<li><a href="https://www.cjr.org/innovations/you-may-hate-metrics-guardian-audience-twitter-images.php">You may hate metrics. But they’re making journalism better</a> - by Chris Moran</li>
<li><a href="https://www.nytimes.com/interactive/2019/04/03/world/white-extremist-terrorism-christchurch.html">Attacks by White Extremists Are
Growing. So Are Their Connections.</a> - By Weiyi Cai and Simone Landon</li>
<li><a href="https://www.theguardian.com/travel/2019/mar/23/norway-camino-path-pilgrims-hike-walk-oslo-trondheim-st-olavs-olafs">Nordic walking: a pilgrims’ route from Oslo to Trondheim</a> - by Phoebe Smith</li>
<li><a href="https://gizmodo.com/the-gentle-side-of-twitch-1834215442">The Gentle Side of Twitch</a> - by Nicole Carpenter</li>
<li><a href="https://www.nytimes.com/2019/04/25/opinion/privacy-poverty.html">The Devastating Consequences of Being Poor in the Digital Age</a> - by Mary Madden</li>
<li><a href="https://mycreativetype.com/">Creative types</a> - by Adobe Create</li><span>P.S.: mine was "the dreamer"</span>
<li><a href="https://www.theguardian.com/commentisfree/2019/apr/29/sexual-assault-case-dropped-refused-police-phone-rape?CMP=Share_iOSApp_Other">My sexual assault case was dropped when I refused to give police my phone</a> - by Anonymous</li>
</ul>
<h3>Tech related content</h3>
<ul>
<li><a href="https://twitter.com/csswizardry/status/1113416689331441664">Tweet showing how the page load might cost you a lot of money when using roaming abroad</a> - by Harry Roberts</li>
<li><a href="https://ethanmarcotte.com/wrote/trainers/">Trainers.</a> - by Ethan Marcotte</li>
<li><a href="https://char.gd/blog/2019/you-dont-need-that-hipster-web-framework">You probably don't need that hip web framework</a> - by Owen Williams</li>
<blockquote cite="https://char.gd/blog/2019/you-dont-need-that-hipster-web-framework">
<p>But, this has all made me wonder: has the modern stack killed experimentation, and shipping bad ideas? Do weird experiments and fun ideas die on the floor, tangled in complexity, more often now? I'd hazard a guess that the answer is yes, and that you should probably skip that hipster framework—for now—as well. Just ship something instead.</p>
</blockquote>
<cite>– Owen Williams</cite>
<li><a href="https://clearleft.com/posts/design-professional-development-framework">A Professional Development Framework for Design</a> - by Andy Thornton</li>
<li><a href="https://jvns.ca/blog/2018/09/30/some-possible-career-goals/">Some possible career goals</a> - by Julia Evans</li>
<li><a href="https://andy-bell.design/wrote/break-out-of-the-echo-chamber/">Break out of the echo chamber</a> - by Andy Bell</li>
<li><a href="https://macaroni-art.glitch.me/">Macaroni art simulator</a> - by Neal Agarwal</li>
<li><a href="https://daverupert.com/2019/04/some-unsolicited-blogging-advice/">Some Unsolicited Blogging Advice</a> - by Dave Rupert</li>
<li><a href="https://paulrhayes.com/accessibility-acceptance-criteria/">Improving accessibility with accessibility acceptance criteria</a> - by Paul Hayes</li>
<li><a href="https://remysharp.com/2019/04/02/twitter-without-tracking">Twitter without tracking</a> - by Remy Sharp</li>
<li><a href="https://www.danvega.dev/blog/2019/04/11/dont-call-it-a-comeback/">Personal Blogs: Don't Call it a comeback!</a> - by Dan Vega</li>
<li><a href="https://www.nicchan.me/blog/auditing-my-own-site-for-accessibility/">Auditing My Own Site For Accessibility</a> - by Nic</li>
<li><a href="https://stephaniewalter.design/blog/color-accessibility-tools-resources-to-design-inclusive-products/">Color accessibility: tools and resources to help you design inclusive products</a> - by Stéphanie Walter</li>
<li><a href="https://www.designsystems.com/">Design Systems</a> - by Figma</li>
<li><a href="https://www.matuzo.at/blog/12-tips-for-more-accessible-react-apps-slides-react-finland-2019/">12 Tips for More Accessible React Apps (Slides, React Finland 2019)</a> - by Manuel Matuzović</li>
<li><a href="https://www.cottondroid.com/blog/exit-interview.html">I’m quitting engineering: An exit interview</a> - Olga Dominguez</li>
<li><a href="https://thehistoryoftheweb.com/postscript/april-2019-weblog-giving-the-web-its-spirit-back/">April 2019 Weblog: Giving the Web Its Spirit Back</a> - by Jay Hoffmann</li>
<li><a href="https://blog.jschopplich.com/monthly-digest-and-bookmarks-april-2019">Monthly Digest & Bookmarks — April 2019</a> - by Johann Schopplich</li>
</ul>
<h3>Things that made me smile one way or another</h3>
<p>I need to re-think this section. I really see and save a lot of memes per month on Instagram and TikTok. Not sure if all memes are worth sharing but I'd like this to be a "interesting/wholesome" section.</p>
<ul>
<li><a href="https://twitter.com/CaliaDomenico/status/1117862123625824256">This tweet showing how a camera's capture rate changes due to the amount of light being let into the camera.</a></li>
</ul>
2019-04-24T00:00:00-00:00https://ohhelloana.blog/48109/<p>Last week I went to Gem Spa for the magnets and left with an egg cream! Thanks @besteggcream</p>
Mood, doing, thinking, listening2019-04-23T00:00:00-00:00https://ohhelloana.blog/mood-doing-thinking-listening/
<p>Hands up if you were into MySpace and personal blogs in the mid early 2000s! Well, I was. I was that low-cost emo kid in school that would use HTML and CSS to change their MySpace page (and that hobby is now paying bills so no complaining).</p>
<p>When I read the recent news that <a href="https://www.theguardian.com/technology/2019/mar/18/myspace-loses-all-content-uploaded-before-2016">MySpace lost all their content</a> I had an old memory coming back at me.</p>
<p>Back then, when I was using MySpace, you were able to set your “mood” - you may be familiar with that feature because Facebook also <a href="https://www.huffpost.com/entry/facebook-mood-status-brin_b_2600255">had (has?) something similar</a>.</p>
<p>I did a little bit of searching and to my surprise, in 2007, someone did a <a href="https://www.askdavetaylor.com/does_myspace_support_moods_and_other_status_indicators">blog post about MySpace moods</a> that you can still read about today (because owning your own content is cool).</p>
<p>Setting your “mood” as a status wasn’t the main memory coming back. It was actually blogs and what teenagers were doing at the time. Back then, in MySpace you could create “notes” which were more or less like blog entries, and if I remember correctly, at the end of the post you would add something like “Mood, doing, listening, thinking”.</p>
<p>I don’t remember the “doing, listening and thinking” being particular form input fields but rather something that you would add optionally (and manually). The “mood” bit would have a specific set of <a href="https://www.answers.com/Q/List_of_MySpace_moods">emotions</a> and <a href="https://www.flickr.com/photos/schoschie/3379674840">emoticons</a> to match. So “Mood, doing, thinking, listening” quickly took over and you could see <a href="https://www.tapatalk.com/groups/kntcreations/mood-doing-thinking-listening-t6813-s480.html">forum threads</a> with people sharing what was on their minds. I remember it being a trend that I picked up on also, but it quickly transferred to personal blogs.</p>
<p>I tried to find living examples of this but it was so hard. I tried different search engines but whenever I typed “Mood, doing, thinking, listening” almost all results were about mental health even if changed the dates around the results. I still had some urls memorised in my head so I used <a href="https://archive.org/web/">Wayback Machine</a> and I looked up some blogs that I used to read and I found some real examples in the wild but sadly they do not have styling.</p>
<p>While searching for all this and to my rejoice I found a <a href="http://www.readwritethink.org/files/resources/lesson_images/lesson1113/features.pdf">lovely PDF</a> that talks about “Mood” and “Listening” being a common blog feature and I love it!</p>
<p>So because I am feeling nostalgic I’m going to bring “mood, doing, thinking, listening” back to my blog and be alone oversharing in 2019.</p>
<h2>Choosing the emojis</h2>
<p>I’ve decided to keep it simple and only add to the footer of the blog post this information. Unlike <a href="https://www.livejournal.com/moodlist.bml">Livejournal</a>, most personal blogs at the time wouldn't have a matching emoticon to their mood. But I want that. I don't have time to convert the old emoticons to svg (i'm not even sure if I could do that from a legal point view). I also remembered that the <a href="https://www.phpbb.com/">phpbb forums</a> had a smiley pack available but the last thing I want is to do requests to mini gifs. But in case you're wondering, I did download the emoticons for the memories's sake.</p>
<p>But it is 2019 and emojis are free. Maybe one day when I am an artist I could add my own drawn emoticons to my emotions. But for now emojis will do. Or maybe, one day, when I am as cool as Aaron I will take it to the next level <a href="https://aaronparecki.com/2019/02/25/9/emoji">like he did on his website</a>.</p>
<h2>How many emotions do I have?</h2>
<p>Not that many and while looking up the list of emotions that were available on My Space and Livejournal, I realised that I don't even know the meaning of some of those words. I tried to come up with own list and I can't lie, I struggled to deal with the negative words. I've been trying to tell my self to only share positive things and sometimes that isn't possible. My negative emotions exist but I think I prefer not having too many available and have a bigger variety of positive emotions.</p>
<p>The following match of emotion with emoji was mostly based on how I think my face looks like when I feel those emotions. I do realise that the name of the emotion and what the emoji is supposed to mean may not match.</p>
<table>
<thead>
<tr>
<th colspan="1">Emotion</th>
<th colspan="1">Emoji</th>
</tr>
</thead>
<tbody>
<tr>
<td>Happy</td>
<td>😃</td>
</tr>
<tr>
<td>Accomplished</td>
<td>💪</td>
</tr>
<tr>
<td>Adventurous</td>
<td>😎</td>
</tr>
<tr>
<td>Angry</td>
<td>😡</td>
</tr>
<tr>
<td>Anxious</td>
<td>😩</td>
</tr>
<tr>
<td>Artistic</td>
<td>🤪</td>
</tr>
<tr>
<td>Blank</td>
<td>😶</td>
</tr>
<tr>
<td>Bored</td>
<td>🙃</td>
</tr>
<tr>
<td>Busy</td>
<td>😓</td>
</tr>
<tr>
<td>Calm</td>
<td>😊</td>
</tr>
<tr>
<td>Confident</td>
<td>😼</td>
</tr>
<tr>
<td>Confused</td>
<td>🤔</td>
</tr>
<tr>
<td>Crappy</td>
<td>💩</td>
</tr>
<tr>
<td>Curious</td>
<td>👀</td>
</tr>
<tr>
<td>Disappointed</td>
<td>😞</td>
</tr>
<tr>
<td>Dorky</td>
<td>🤓</td>
</tr>
<tr>
<td>Energetic</td>
<td>😁</td>
</tr>
<tr>
<td>Enlightened</td>
<td>😲</td>
</tr>
<tr>
<td>Exhausted</td>
<td>😔</td>
</tr>
<tr>
<td>Fabulous</td>
<td>💅🏻</td>
</tr>
<tr>
<td>Fascinated</td>
<td>😍</td>
</tr>
<tr>
<td>Hungry</td>
<td>☹️</td>
</tr>
<tr>
<td>Hungover</td>
<td>😖</td>
</tr>
<tr>
<td>Indifferent</td>
<td>😑</td>
</tr>
<tr>
<td>Loved</td>
<td>😍</td>
</tr>
<tr>
<td>Okay</td>
<td>🙂</td>
</tr>
<tr>
<td>Refreshed</td>
<td>😋</td>
</tr>
<tr>
<td>Romantic</td>
<td>😘</td>
</tr>
<tr>
<td>Sad</td>
<td>😭</td>
</tr>
<tr>
<td>Sassy</td>
<td>😏</td>
</tr>
<tr>
<td>Satisfied</td>
<td>😃</td>
</tr>
<tr>
<td>Sleepy</td>
<td>😴</td>
</tr>
<tr>
<td>Thankful</td>
<td>😊</td>
</tr>
<tr>
<td>Warm</td>
<td>😌</td>
</tr>
</tbody>
</table>
<br>
<h2>Adding these to my blog</h2>
<p>This is where I become insecure. I'm sure there's 1000 ways to build the same thing and they are all probably better than the one I've chosen. I don't use any content editor to write for this blog besides writting my own markup. So I didn't implement this by having a drop down that selects the emotion and adds to the post. I could, but I don't have time for that. I'm satisfied with adding it manually.</p>
<p>I searched in GitHub for anything related to Jekyll and Emojis and I did <a href="https://github.com/search?q=emoji+jekyll">find a couple of things</a>. None of them seem to be exactly what I was looking for (although I could be wrong) but I am not really sure of what I looking for anyway.</p>
<p>To build this I decided to make more use of the <a href="https://jekyllrb.com/docs/front-matter/">Front Matter</a> and include a layout that will render if that information exists.</p>
<p>And that is it. I'm hoping to add more quirks to this blog and I think looking at the past isn't a bad idea. Back then we were far more expressive anyways.</p>
<p>P.S.: Always write and publish when you're happy. I've been having too many bad days in a row and that has stopped me from writing and publishing more. I can't take a nice day for granted. This small and not so important post was written in the end of March.</p>
<p>TIL: Front Matter accepts emojis.</p>2019-04-21T00:00:00-00:00https://ohhelloana.blog/49304/2019-04-21T00:00:00-00:00https://ohhelloana.blog/49082/<p>Holding on to everything because I was actually terrified 😂</p>
March bookmarks2019-04-02T00:00:00-00:00https://ohhelloana.blog/march-bookmarks/
<p>This “bookmarking” format doesn’t seem to be working for me because of the way I am doing this. It also seems that I am bookmarking more and more things and I leave all the bookmarks to the last days of the month. I feel like I don’t have enough time to give them proper treatment. I want to share my favourite quotes and my opinions on them and this method seems rushed. I might go back to my original plan of doing them every two weeks.</p>
<p>I have also decided to split between tech and non-tech related articles because I feel that the amount should be the same (and it currently isn’t).</p>
<p>Also this month went by too quickly. Too quickly.</p>
<h2>Bookmarks from March</h2>
<h3>Non-tech articles</h3>
<ul>
<li><a href="https://www.unicef.org/rosa/what-we-do/child-protection/volunteering-orphanages">Volunteering in orphanages</a> - by Unicef.</li>
<li><a href="https://www.thrillist.com/eat/portland/stanichs-closed-will-it-reopen-burger-quest">I Found the Best Burger Place in America. And Then I Killed It.</a> - by Kevin Alexander</li>
<li><a href="https://catapult.co/stories/the-weight-of-words-self-acceptance-relationships-nicole-zhu">The Weight of Words: Self-Acceptance Doesn’t Have to Be a Solo Journey</a> - by Nicole Zhu</li>
<li><a href="https://medium.com/s/story/the-poor-cant-afford-not-to-wear-nice-clothes-b015f6a79561">The Poor Can’t Afford Not to Wear Nice Clothes</a> - by Tressie McMillan Cottom</li>
<li><a href="https://www.theguardian.com/lifeandstyle/2019/mar/17/you-dont-need-more-than-a-warm-smile-to-fly-with-babies?CMP=share_btn_tw">You don’t need more than a warm smile to fly with babies…</a> - by Eva Wiseman</li>
<li><a href="https://hey.georgie.nu/discovering-minimalism/">Journey of a Fashionable Minimalist: Episode 3 – Discovering minimalism</a> - by Georgie Luhur Cooke</li>
<li><a href="https://ideas.ted.com/sorry-to-bother-you-but-do-you-say-sorry-too-much-what-to-say-instead/">Sorry to bother you, but do you say “sorry” too much? What to say instead</a> - by Daniella Balarezo</li>
</ul>
<h3>Tech related content</h3>
<ul>
<li><a href="https://hiddedevries.nl/en/blog/2019-02-23-content-based-grid-tracks-and-embracing-flexibility">Content-based grid tracks and embracing flexibility</a> - by Hidde de Vries</li>
<li><a href="https://www.scottohara.me/blog/2019/03/05/open-dialog.html">Having an open dialog</a> - by Scott O'Hara</li>
<li><a href="https://codepen.io/KristopherVanSant/post/css-shapes-resources">CSS Shapes Resources</a> - by Kristopher Van Sant</li>
<li><a href="https://ericwbailey.design/writing/2019-03-05-fighting-uphill.html">Fighting uphill</a> - by Eric Bailey</li>
<li><a href="https://whatisjasongoldstein.com/writing/help-none-of-my-projects-want-to-be-spas/">Help! None of my projects want to be SPAs</a> - by Jason Goldstein</li>
<li><a href="https://noti.st/mbarker84/R8uGoG/building-intelligent-layouts-with-css-grid">Building Intelligent Layouts with CSS Grid</a> - by Michelle Barker</li>
<li><a href="https://webaccessibility.guide/">Web Accessibility Guide</a> - by Stefan Fejes</li>
<li><a href="http://www.standardista.com/css3/css-specificity/">CSS Specificity</a> - by Estelle Weyl</li>
<li><a href="https://dev.wgao19.cc/2019-03-08__mix-blend-mode/">How I Started Reading mix-blend-mode and What They Are Creating with It</a> - by Wei Gao</li>
<li><a href="https://ethanmarcotte.com/wrote/the-web-we-broke/">The web we broke.</a> - by Ethan Marcotte</li>
<li><a href="https://accessibilityinsights.io/">Accessibility Insights</a> - by Microsoft</li>
<li><a href="https://colourise.sg/">Colourise.sg</a> - by Andrew Tan, Preston Lim and Tan Kai Wei</li>
<li><a href="https://tinkersynth.com/slopes/">Tinkersynth</a> - by Josh Comeau</li>
<li><a href="https://codepen.io/HighFlyer/pen/zwPreM">Layered parallax effect</a> - by Thea</li>
<li><a href="https://medium.com/envoy-design/how-to-design-an-accessible-color-scheme-4a13ca12c92b">How to design an accessible color scheme</a> - by Katie Riley</li>
<li><a href="https://codepen.io/oliviale/full/oVBzao">CSS Scroll Snap: How Do I Look In This?</a> - by Olivia Ng</li>
<li><a href="https://jspaint.app/">JS Paint</a> - by Isaiah Odhner</li>
<li><a href="https://sarahchima.com/blog/react-fragments/">React fragments</a> - by Sarah Chima</li>
<li><a href="https://codepen.io/oliviale/pen/moLrBq">CSS Grid: Floor Plan</a> - by Olivia Ng</li>
<li><a href="https://css-tricks.com/an-introduction-to-web-components/">An introduction to web components</a> - by Caleb Williams</li>
<li><a href="https://abc.useallfive.com/">Accessible Brand Colors</a> - by Use All Five</li>
<li><a href="https://benjamin.parry.is/collecting/thoughts/2018/03/going-offline/">Offline Homebrewing</a> - by Benjamin Parry</li>
<li><a href="http://alwaysownyourplatform.com/">Always Own Your Platform</a> - by Sean Blanda</li>
<li><a href="https://onezero.medium.com/ctrl-alt-delete-the-planned-obsolescence-of-old-coders-9c5f440ee68">Ctrl-Alt-Delete: The Planned Obsolescence of Old Coders</a> - by A. Jesse Jiryu Davis</li>
<li><a href="https://css-irl.info/becoming-a-tech-speaker/">Becoming a tech speaker</a> - by Michelle Barker</li>
<li><a href="https://davidwalsh.name/introduction-static-site-generators">An Introduction to Static Site Generators</a> - by Eduardo Bouças</li>
<li><a href="https://medium.com/@metalex9/making-generative-music-in-the-browser-bfb552a26b0b?sk=a53a22d1846fdc176a35c8cae03e958b">Making Generative Music in the Browser</a> - by Alex Bainter</li>
<li><a href="http://piccalil.li/issues/1">Piccalili - Issue 1</a> - by Andy Bell</li>
</ul>
<h3>Things that made me smile one way or another</h3>
<ul>
<li><a href="https://developur.rs/posts/ana-rodrigues/">Developurrs - #013 - Ana Rodrigues with Jessie</a> - by Andy Bell and me</li>
</ul>It's everyone's job2019-03-28T00:00:00-00:00https://ohhelloana.blog/it-is-everyones-job/
<p>A while back someone I know that has a role in a product team (so, not a developer) showed me their brand new feature. Because I had just been working on a similar feature I decided to see how they were doing the keyboard navigation of that feature (because I wanted to learn and improve mine). They weren’t. So it wasn’t accessible. At the time, it wasn’t possible to see the contents of that feature using the keyboard at all.</p>
<p>I reported back to them and explained what happened when I used it and their reply was something along the lines “that’s a disappointment - I expected our developers to do better”. They took the feedback and improved it.
When I heard their disappointment with their team, it reminded me of a quote from Mindera’s culture book that stayed with me: “It’s everyone’s job”. And I try, sometimes fighting my own blind spots, to apply it whenever I can.</p>
<p>An unaccessible feature will go live when any of these steps fails:</p>
<ul>
<li>The client/product/tickets don’t mention it in their requirements;</li>
<li>It is designed without accessibility in mind;</li>
<li>When the code developed isn't accessible;</li>
<li>When in the code review it isn't flagged;</li>
<li>When the accessibility of a feature isn’t tested in the testing environments;</li>
</ul>
<p>At any moment, anyone in team can flag that something is missing, broken or can be improved. Everyone reads the tickets/acceptance criteria, everyone sees the designs, someone develops but someone reviews the code, everyone testes it (and most of the times, they will use the ticket’s acceptance criteria as a reference of what to test).</p>
<p>It is important to be everyone’s job because no one is perfect. Because mistakes can be made but mostly because we are all learning. In every single mentioned step there could be someone who just started that particular role, for example, and they will learn from these interactions and it will become part of their routine for their next tasks.</p>
<p>Apply the "it's everyone's job" where you can and everyone in the team will learn a skill for the future.</p>
2019-03-23T00:00:00-00:00https://ohhelloana.blog/78750/<p>Big mood. Taken today at the march.</p>
2019-03-09T00:00:00-00:00https://ohhelloana.blog/76852/<p>🦖</p>
2019-03-09T00:00:00-00:00https://ohhelloana.blog/66020/<p>Today @ines_opcoelho and I got yelled at by this enthusiastic animal</p>
February bookmarks2019-03-06T00:00:00-00:00https://ohhelloana.blog/february-bookmarks/
<p>February was a complete write-off for me. It wasn't a good month but to my surprise I bookmarked a lot of things in the first two weeks of it. I also created <a href="http://vm.tiktok.com/eaf6nv/">an account in TikTok</a> as if I don't waste enough time already looking at memes.</p>
<h2>Bookmarks from February</h2>
<ul>
<li><a href="https://advice.shinetext.com/articles/we-need-to-talk-about-and-recognize-representation-burnout">Why We Need to Talk About—and Recognize—Representation Burnout</a> - by Martha Tesema.</li>
<li><a href="https://medium.com/@sara_ann_marie/dont-feel-like-an-expert-share-anyway-661f2f8cd038?sk=df7b74fe9684d0ac77dcce94f745056b">Don’t feel like an expert? Share anyway.</a> - by Sara Wachter-Boettcher</li>
<li><a href="https://exclusive-design.vasilis.nl/">Exclusive Design</a> - by Vasilis van Gemert</li>
<li><a href="https://qz.com/1525661/your-digital-identity-has-three-layers-and-you-can-only-protect-one-of-them/">Your digital identity has three layers, and you can only protect one of them</a> - by Katarzyna Szymielewicz</li>
<li><a href="https://a11y.reviews/">Accessibility Reviews</a> - by <a href="http://adrianroselli.com/2019/01/announcing-a11y-reviews.html">Adrian Roselli</a> and <a href="https://twitter.com/tobie">Tobie Langel</a></li>
<li><a href="https://yeahpython.github.io/game/game.html">ASCII renderer</a> - by <a href="https://yeahpython.github.io/">Tommy Li</a></li>
<li><a href="https://tokimeki-unfollow.glitch.me/">Tokimeki Unfollow</a> - by Julius Tarng</li>
<li><a href="https://medium.com/@tatianatmac/trust-the-process-how-to-present-your-best-when-youre-at-your-worst-166dad8cc4">TRUST the Process: How to present your best, when you’re at your worst</a> - by Tatiana Mac</li>
<li><a href="https://www.buzzfeednews.com/article/ariannarebolini/comics-work-anxiety-emotions-workplace-no-hard-feelings">These Comics About Work Anxieties Are Painfully Real</a> - compilation by Arianna Rebolini and comics by Liz Fosslien and Mollie West Duffy</li>
<li><a href="https://www.goabstract.com/blog/end-of-the-celebrity-designer/">The end of the celebrity designer</a> - by Tim Van Damme</li>
<li><a href="https://developer.paciellogroup.com/blog/2018/08/a-web-of-anxiety-accessibility-for-people-with-anxiety-and-panic-disorders-part-1/">A web of anxiety: accessibility for people with anxiety and panic disorders [Part 1]</a> - by David Swallow</li>
<li><a href="https://developer.paciellogroup.com/blog/2018/11/a-web-of-anxiety-accessibility-for-people-with-anxiety-and-panic-disorders-part-2/">A web of anxiety: accessibility for people with anxiety and panic disorders [Part 2]</a> - by David Swallow</li>
<li><a href="https://twitter.com/wesbos/status/1093167287119609858">"My background pattern resources"</a> - by Wes Bos</li>
<li><a href="https://apav.pt/apav_v3/images/pdf/Estatisticas_APAV_Criancas_e_jovens_vitimas_crime_violencia_2013_2017.pdf">Statistics - Children and Young people victims of crime and violence 2013-2017 (in Portuguese)</a> - by APAV (Associação Portuguesa de Apoio à Vítima)</li>
<li><a href="https://webcomponents.club/">Web Components Club</a> - by Andy Bell</li>
<li><a href="https://vimeo.com/312101489">The "C" is for accessibility</a> - by Evangelina Ferreira</li>
<li><a href="https://github.com/andybelldesign/progressive-vue-toggle">Progressive Vue Toggle</a> - by Andy Bell</li>
<li><a href="https://cssreference.io/">CSS Reference</a> - by <a href="https://twitter.com/jgthms">Jeremy Thomas</a></li>
<li><a href="https://codepen.io/Stefany93/post/complete-guide-to-accessible-video-and-audio-for-the-web">Complete guide to accessible video and audio for the web</a> - by Stefany Newman</li>
<li><a href="https://bryanlrobinson.com/blog/2019/02/07/bring-fansites-back-to-the-web/">Let's bring Fan Sites and webrings back!</a> - by Bryan Robinson</li>
<li><a href="https://github.com/LappleApple/awesome-leading-and-managing">Awesome Leadership and Management</a> - by Lauri Apple</li>
<li><a href="https://www.hanselman.com/blog/YourWordsAreWasted.aspx">Your words are wasted</a> - by Scott Hanselman</li>
<li><a href="https://www.cntraveler.com/story/the-best-way-to-ride-out-air-turbulence">The Best Way to Ride Out Air Turbulence</a> - by Cynthia Drescher</li>
<li><a href="https://accessibility.blog.gov.uk/2019/02/11/using-persona-profiles-to-test-accessibility/">Using persona profiles to test accessibility</a> - by Anika Henke</li>
<li><a href="https://midicity-2000.glitch.me/">MIDI CITY 2000</a> - by <a href="https://twitter.com/notwaldorf">Monica Dinculescu</a></li>
<li><a href="https://www.xaprb.com/blog/you-guys/">You guys</a> - by Baron Schwartz</li>
<li><a href="https://css-doodle.com/">CSS Doodle</a> - by Yuan Chuan</li>
<li><a href="https://frontendwiz.co.uk/">Front end wizard</a> - by Kieran Venison</li>
<li><a href="https://codepen.io/ivorjetski/pen/xMJoYO">Pure CSS Still Life - Water and Lemons</a> - by Ben Evans</li>
<li><a href="https://www.sarasoueidan.com/TIL/index.xml">"TIL" RSS Feed</a> - by Sara Soueidan</li>
<li><a href="https://www.scottohara.me/blog/2019/02/12/high-contrast-aria-and-images.html">Quick Note on high contrast mode</a> - by Scott O'Hara</li>
<li><a href="https://codepen.io/ste-vg/pen/pGJRgX">CSS Night Cat</a> - by Steve Gardner</li>
<li><a href="https://www.newstatesman.com/culture/music-theatre/2019/02/ryan-adams-misogyny-and-sensitive-masculinity">Ryan Adams, misogyny and “sensitive” masculinity</a> - by Anna Leszkiewicz</li>
<li><a href="https://blog.alicegoldfuss.com/slapping-back-imposter-syndrome/">Slapping Back Imposter Syndrome</a> - by Alice Goldfuss</li>
<li><a href="https://micrometa.jkphl.is/">Micrometa 2 demo page</a> - by Joschi Kuphal</li>
<li><a href="https://css-tricks.com/look-ma-no-media-queries-responsive-layouts-using-css-grid/">Look Ma, No Media Queries! Responsive Layouts Using CSS Grid</a> - by Juan Martín García</li>
<li><a href="https://thecolorsofmotion.com/">The Colors of Motion</a></li>
<li><a href="https://frontend30.com/css-selectors-cheatsheet/">CSS selectors cheatsheet</a> - by Nana</li>
<li><a href="https://paulrobertlloyd.github.io/indiekit/">IndieKit</a> - by Paul Robert Lloyd</li>
<li><a href="https://vgpena.github.io/using-css-grid-the-right-way/">Using CSS Grid the right way</a> - by Violet Peña</li>
</ul>
<h2>Things that made me smile one way or another</h2>
<ul>
<li><a href="https://twitter.com/EmilyFairfax/status/1097195169131024384">So what do beavers have to do with wildfire?</a></li>
<li><a href="https://twitter.com/calum_cranston/status/1096751051766747136">This person who won a Henry Hoover at bingo</a></li>
<li><a href="https://twitter.com/PavelASamsonov/status/1074701053034160128">This analogy</a></li>
<li><a href="https://twitter.com/DorsaAmir/status/1085227486869377024">This thread about the human body</a></li>
<li><a href="https://twitter.com/Peacharu_/status/1053039011307155456">A very brave mongoose</a></li>
<li><a href="https://twitter.com/bendhalpern/status/1092070010745319428">Client-side validation</a></li>
<li><a href="https://m.tiktok.com/v/6657125743564164357.html">"Do you ever look at someone and wonder what is going on inside their head?"</a></li>
<li><a href="https://twitter.com/zoewhiite/status/1091526702864482304?s=21">Synchronised dog</a></li>
<li><a href="https://twitter.com/WelshMountainZo/status/1091262802617081857">The photo of this PSA</a></li>
</ul>
2019-02-16T00:00:00-00:00https://ohhelloana.blog/62725/<p>Portuguese lunch with my Portuguese girl @ines_opcoelho 😻</p>
My only note about the B word2019-02-09T00:00:00-00:00https://ohhelloana.blog/about-the-b-word/
<p>I feel nothing but anxiety at the moment. I have little energy to describe what I am feeling and explaining why everything is bad regarding Brexit. But I have one note that has been bothering me. Whenever I tell people that I am worried about Brexit, the response is usually: “don’t worry, you will be fine”.</p>
<p>In the past two years, when there are discussions about Brexit and how its campaign was around immigration, and when I tell people that I am an immigrant and it affects me, I hear back “yes but you’re one of the good ones and this wasn’t about people like you”.</p>
<p>As well meant as it can be, I need people to understand how dehumanising this statement is. To me, it means that in “their eyes” I’m still “one of them” but accepted because I’m “good”.</p>
<p>This is what “good” means: I speak English, I always had a job, I don’t claim benefits or use the NHS. This is what people perceive “as a good immigrant”. All this plus my skin colour and country of origin privilege.</p>
<p>For the past two years I’ve been biting my tongue but all I want to ask you is: what happens when I stop being a “good one”?</p>
<p>What happens when and if I have an accident and may not be able to work ever again?</p>
<p>What happens when and if I have children and I need support?</p>
<p>What happens when I get older and need to use the NHS?</p>
<p>Is this my new status of constant probation? I am not fine. I am worried for everyone. I need people to stop telling me to stop worrying. Everyone who says this has absolute no experience in discrimination or exposure to the lengths people go to hurt other humans. </p>
<p>P.S.: I hope it is implied that I don’t believe in the concept of “good” or “bad” immigrants and I don’t believe “I am one of the good ones”. Please don’t bother arguing with me and denying that the campaign was mostly about immigration.</p>
2019-02-03T00:00:00-00:00https://ohhelloana.blog/57291/<p>Artsy fartsy</p>
January bookmarks2019-02-02T00:00:00-00:00https://ohhelloana.blog/january-bookmarks/
<p>Maybe these "bookmarks posts" will a monthly thing. I realised my life isn't that eventfull in terms of bookmarking.</p>
<h2>Bookmarks from January</h2>
<ul>
<li><a href="https://www.slideshare.net/TanyaReilly/being-glue">Being glue</a> - by Tanya Reilly</li>
<li><a href="https://veerle.duoh.com/">Veerle's blog</a> - by Veerle</li>
<li><a href="https://charity.wtf/2019/01/04/engineering-management-the-pendulum-or-the-ladder/">Engineering Management: The Pendulum Or The Ladder</a> - by Charity</li>
<li><a href="https://yoksel.github.io/svg-gradient-map/#/">SVG Gradient Map Filter</a> - by @yoksel_en</li>
<li><a href="https://julesforrest.com/a-refactor-with-css-variables">A refactor with CSS variables</a> - by Jules Forrest</li>
<li><a href="https://mxb.at/blog/syndicating-content-to-twitter-with-netlify-functions/">Static Indieweb pt1: Syndicating Content</a> - by Max Böck</li>
<li><a href="https://cathydutton.co.uk/posts/why-i-stopped-using-sass/">Stepping away from Sass</a> - by Cathy Dutton</li>
<li><a href="https://dcurt.is/when-to-stop">When to stop</a> - by Dustin Curtis</li>
<li><a href="https://knowbility.org/blog/2019/links-opening-new-windows-no-warning/">How to Stop Opening Links in New Windows without Warning</a> - by Nicolas Steenhout</li>
<li><a href="https://docs.google.com/presentation/d/1RpQ7lQ4XIX8D451YfwFAMsaUJ6hw-mcwk8N7-C3UBJ4/edit#slide=id.g35f391192_00">Impostor Syndrome, Perfectionism, Anxiety and Learning to be Kind to Yourself</a> - by Jo Franchetti</li>
<li><a href="https://personalsit.es/">Personal sites are awesome!</a> - by Andy Bell</li>
<li><a href="https://codepen.io/notwaldorf/full/omXwzw">CSS only morphing blob</a> - by Monica Dinculescu</li>
<li><a href="https://www.theguardian.com/technology/2019/jan/23/conspiracy-theories-internet-survivors-truth">Trapped in a hoax: survivors of conspiracy theories speak out</a> - by Ed Pilkington</li>
<li><a href="https://codepen.io/kathykato/pen/omxPap">WordArt</a> - by Katherine Kato</li>
<li><a href="https://www.richardwestenra.com/repeater/">Repeater</a> - by Richard Westenra</li>
<li><a href="https://medium.com/@owltastic/new-year-new-website-7065afa64057">New year, new website</a> - by Meagan Fisher</li>
<li><a href="https://rachelandrew.co.uk/archives/2019/01/30/html-css-and-our-vanishing-industry-entry-points/">HTML, CSS and our vanishing industry entry points</a> - by Rachel Andrew</li>
<li><a href="https://jarredsumner.com/codeblog/?r">Why isn't the internet more fun and weird?</a> - by Jarred</li>
<li><a href="https://github.com/sturobson/myRSS">myRSS</a> - by Stuart Robson</li>
<li><a href="https://www.wsj.com/articles/new-york-insurers-can-evaluate-your-social-media-useif-they-can-prove-why-its-needed-11548856802">New York Insurers Can Evaluate Your Social Media Use—If They Can Prove Why It’s Needed</a> - by Leslie Scism</li>
<li><a href="https://www.globaldiversitycfpday.com/blog#ana-rodrigues">My experience at Global Diversity CFP Day</a> - by me!!!</li>
<li><a href="https://www.reddit.com/r/MapPorn/comments/acn2d6/night_trains_in_europe_2018/?st=JQJAG9OG&sh=0203d925">Night trains in Europe</a></li>
<li><a href="https://www.swyx.io/writing/learn-in-public/">Learn in Public</a> - by Shawn Wang</li>
</ul>
<h2>Things that made me smile one way or another</h2>
<ul>
<li>Catwalk documentary on Netflix</li>
<li><a href="https://twitter.com/FluffSociety/status/1088855830613520385">Cat that only wants to be brushed on the neck</a></li>
<li><a href="https://twitter.com/nocontexttgp/status/1089299868122865664">This screencap from the good place</a></li>
<li><a href="https://twitter.com/kenradio/status/1088489509757554689">What it looks like landing at the Nuuk Greenland Airport</a></li>
<li><a href="https://twitter.com/aussiesdointhgs/status/1088856332084674561">Australian Shepherds “wigglebutts”</a></li>
<li><a href="https://twitter.com/feross/status/1088525872636854272">How camera lenses change your shape</a></li>
<li><a href="https://twitter.com/ItsTheShadsy/status/1086829036976914432">1995 Multimedia Cats</a></li>
<li><a href="https://twitter.com/AmyLGalles/status/1086364646947188736">Exchange in reddit</a></li>
<li><a href="https://twitter.com/anna_debenham/status/1082274734014951425">This dog trying to take home to biggest stick ever</a></li>
<li><a href="https://twitter.com/kassy/status/1081179862109511681">Four generations meme</a></li>
</ul>
2019-01-27T00:00:00-00:00https://ohhelloana.blog/47073/<p>Brunch with the birthday boy 💖</p>
2019-01-26T00:00:00-00:00https://ohhelloana.blog/85151/<p>She is done with me</p>
2019-01-26T00:00:00-00:00https://ohhelloana.blog/75569/<p>??</p>
Bookmarks of 20182019-01-20T00:00:00-00:00https://ohhelloana.blog/bookmarks-of-2018/
<p>A while back Twitter stopped allowing users to access all their likes unless they paid for it. This means that I have officially lost access to things I liked. Before they released their bookmark feature, I was using the "likes" feature as a bookmark to read later. I know it wasn't ideal and it was pretty lazy of me and it obviously backfired. I clearly haven't learnt my lessons and I started to use their bookmark feature instead of something else. If I learnt anything from this experience is that I shouldn't completely trust this free feature. </p>
<p>As I mentioned in one of my previous posts, some people started to post their bookmarks on their website to save them forever. I like that idea but I wouldn't necessarly like to see the exact same implementation on my blog and social media accounts. In my old blogs I used to have "link packs" similar to what <a href="https://www.swiss-miss.com/link-pack">Swiss Miss</a> has in their blog and I also enjoy newsletters that do the same. I like to have time to read things and leave my own comments and be in control of how it looks like in my blog.</p>
<p>Because of all this, I decided to do a clean up of my Twitter bookmarks. I know I have other bookmarks spread around my browser and slack and I will try to include those in this post too. From now on, I intend to do link packs every week or every two weeks and will add those to my <a href="https://ohhelloana.blog/bookmarks">bookmarks collection page</a> (this page is a work in progress).</p>
<h2>(some) Bookmarks of 2018</h2>
<ul>
<li><a href="https://codepen.io/jensimmons/pen/PQVwjq?editors=1100" target="_target">Simple Demo of Vertical Centering</a> - Simple demo of vertical centering by Jen Simmons.</li>
<li><a href="https://amberwilson.co.uk/blog/apartfromcode/" target="_target">Apart from Code</a> - by Amber Wilson</li>
<li><a href="http://ashton.codes/preload-google-fonts-using-resource-hints/" target="_target">How to preload Google Fonts using resource hints</a> - by Chris Ashton</li>
<li><a href="https://noti.st/ericwbailey/QxdLmO/slides" target="_target">Designing for Inclusion with Media Queries</a> - by Eric Bailey</li>
<li><a href="https://docs.google.com/presentation/d/1odRjIKD8AN5m3TY1AjjeTymI6hNh16wJN6TPH0larjQ/edit?usp=sharing" target="_target">Logging Off</a> - by Valerie Woolard Srinivasan</li>
<li><a href="http://bradfrost.com/blog/post/i-dunno/" target="_target">I dunno</a> - by Brad Frost</li>
<li><a href="https://codepen.io/collection/DamKJW/" target="_target">Text Effects Collection</a> - by Mandy Michael</li>
<li><a href="https://keithjgrant.com/posts/2018/06/resilient-declarative-contextual/" target="_target">Resilient, Declarative, Contextual</a> - by Keith J. Grant</li>
<li><a href="https://noti.st/lisi/vWbgvW/from-pen-paper-to-svg-animations-an-illustration-adventure" target="_target">From Pen & Paper to SVG Animations. An Illustration Adventure</a> - by Lisi Linhart</li>
<li><a href="https://indiewebguides.org/" target="_target">IndieWeb Guides </a> - by Calum Ryan</li>
<li><a href="https://glitch.com/culture/you-got-this-zine-2/" target="_target">Making Web Apps with React</a> - by Glitch Team</li>
<li><a href="http://uigoodies.com/" target="_target">UI Goodies</a> - by Jess Eddy</li>
<li><a href="https://github.com/yuanchuan/CSS-at/blob/master/README.md" target="_target">CSS-at</a> - by Yuan Chuan</li>
<li><a href="https://robinrendle.com/notes/i-dont-believe-in-full-stack-engineering/" target="_target">I don't believe in full stack engineering</a> - by Robin Rendle</li>
<li><a href="https://medium.com/@nodunayo/so-you-want-to-speak-at-tech-conferences-but-you-have-nothing-to-talk-about-771ac9e32a3d" target="_target">So you want to speak at tech conferences but you have nothing to talk about…</a> - by Nadia Odunayo</li>
<li><a href="https://roadtrip.glitch.me/" target="_target">Road trip</a> - by Malte Ubl</li>
<li><a href="https://codepen.io/burkeholland/details/yEEdMQ/" target="_target">Real time moon</a> - by Burke Holland</li>
<li><a href="https://codepen.io/meowwwls/full/djYgRY/" target="_target">GeoStack SVG Generator</a> - by Melissa Em</li>
<li><a href="https://medium.com/s/story/data-violence-and-how-bad-engineering-choices-can-damage-society-39e44150e1d4" target="_target">Data Violence and How Bad Engineering Choices Can Damage Society</a> - by Anna Lauren Hoffmann</li>
<li><a href="https://github.com/lauragift21/awesome-learning-resources" target="_target">Awesome Resources RoadMap</a> - by Egwuenu Gift</li>
<li><a href="https://hbr.org/2018/07/why-women-volunteer-for-tasks-that-dont-lead-to-promotions" target="_target">Why Women Volunteer for Tasks That Don’t Lead to Promotions</a> - by Linda Babcock, Maria P. Recalde and Lise Vesterlund</li>
<li><a href="http://www.disambiguity.com/what-walls-are-for/" target="_target">What walls are for</a> - by Leisa Reichelt</li>
<li><a href="https://slides.com/cassiecodes/deck-1" target="_target">Limitation breeds creativity</a> - by Cassie Evans</li>
<li><a href="https://thehistoryoftheweb.com/" target="_target">The history of the web</a> - by Jay Hoffmann</li>
<li><a href="https://code.likeagirl.io/toxic-jobs-low-self-esteem-interviewing-6c4650a3c28a" target="_target">On Toxic Jobs, Low Self-Esteem, & Interviewing</a> - by Rachel Thomas</li>
<li><a href="https://medium.freecodecamp.org/the-complete-illustrated-flexbox-tutorial-d35c085dbf35" target="_target">The Complete Illustrated Flexbox Tutorial</a> - by JavaScript Teacher</li>
<li><a href="https://joelglovier.com/about/#site-credits" target="_target">Site credits list</a> - by Joel Andrew Glovier</li>
<li><a href="https://a11ywins.tumblr.com/" target="_target">A11y Wins</a> - by Marcy Sutton</li>
<li><a href="https://moritzgiessmann.de/accessibility-cheatsheet/" target="_target">Accessibility Cheatsheet</a> - Moritz Gießmann</li>
<li><a href="https://nostalgic-css.github.io/NES.css/" target="_target">NES-style CSS Framework</a> - by @bc_rikko</li>
</ul>
<p>Between all these there were a lot of favourited tweets, codepens, videos, instagrams. So many. I know I missed quite a few bookmarks too. Hopefully by having a weekly or bi-weekly compilation I can be more granular and also share lots of content not related to web development.</p>
Colours of 20182019-01-15T00:00:00-00:00https://ohhelloana.blog/colours-of-2018/
<p>In one of my trips to Helsinki in 2017, I visited <a href="http://www.designmuseum.fi/en/">Design Museo</a> and in it there was an exhibition of the work of <a href="https://margretheodgaard.com/">Margrethe Odgaard</a> which investigated colours and patterns. It included a colour diary of various locations where colour combinations found in many places were captured.</p>
<p>The exhibition terminated in a room where the visitor could create their own colour diary in a piece of paper and colour it by hand. Recently I stumbled upon the drafts I created and I decided to transform the drafts I painted that day into a digital memory for myself but of the year 2018. The fact that it is digital and doesn't use tools like pencils, removes the possibility of having a natural pattern creation but netherless I find it visually interesting. </p>
<p>I strongly recommend seeing the original piece of work by Margrethe Odgaard. And thank you for inspiring me to look at the colours of my life.</p>
<p>But this got me thinking about what was the criteria to decide three top colours of each month so I decided to do two things: the top three most used colours of the photo decided by "a computer" and my hand picked choices. This method ended up revealing a couple of things about me.</p>
<p>I don’t like re-inventing the wheel so I looked up if there was any package that was already automatically choose the dominant colours of a photo. I found a package called <a href="https://github.com/lokesh/color-thief">colour thief</a>.</p>
<p>For simplicity purposes (and because I had no idea what to call it), I will first show the three most dominant colours given by the "color-thief" package which I will call "computer" and my hand picked colours, via a color picker, I will call "my selection". Also the colour names are approximate colour names and not completely accurate. I wanted this to be as accessible as possible but I am not sure if using strange colour names that I don't even know would be helpful at all.</p>
<h2>January</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/january.JPG" alt="My living room with a dinning table, a yellow and grey canvas painting on the wall, a plant in the corner next to grey curtains.">
<p>I couldn’t do this from memory so I turned to my phone and opened my phone gallery. I was pretty disappointed at myself. I wanted this to be an exciting task but instead I only found repeated photos of my cat. For example, the whole month of January, on my phone, is 95% photos of my cat. Is that really representative of what my January was like? I decided to pick a photo that I took when I bought a canvas for my living room and a plant. It is a nice photo because it represents the joy I feel when I make my house feel more like a home.</p>
<p><span class="hidden">Colours selected by the </span>Computer: beige, brown, blue.</p>
<p><span class="hidden">Colours from </span>My selection: dark mustard yellow, light beige and dark green.</p>
<div class="month-cards">
<div class="month january computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month january mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>February</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/february.PNG" alt="Garden table with snow on top of it and cat in the background surrounded by bits of snow.">
<p>I love snow. It never snowed where I grew up so I've always been fascinated by it. I know every Londoner hates when it snows but I really don't understand why. I built a little snowmen, drew on the snow, did a snow angel and it was so lovely to see my cat's reaction to the snow! </p>
<p>I picked my colours and compared them to "the computer". I couldn't help but notice that I aimed at the snow and bright colours. It becomes more noticable in the rest of the months that green is also a top pick for me.</p>
<p><span class="hidden">Colours selected by the </span>Computer: light brown, light beige, dark brown.</p>
<p><span class="hidden">Colours from </span>My selection: white, green and dark red.</p>
<div class="month-cards">
<div class="month february computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month february mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>March</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/march.JPG" alt="Me in Berlin with the TV tower behind me.">
<p>In March I did my first visit of the year to Berlin to visit a good friend of mine. I always appreciate that even though I am a nervous flyer, it doesn't stop me from going where I want.</p>
<p>I suppose that on this photo it was hard not to have similar colours to "the computer".</p>
<p><span class="hidden">Colours selected by the </span>Computer: light blue, dark pink, dark red.</p>
<p><span class="hidden">Colours from </span>My selection: light blue, dark pink and dark red.</p>
<div class="month-cards">
<div class="month march computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month march mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>April</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/april.JPG" alt="Ana holding her black and white cat while wearing a black and white shirt.">
<p>April was a long month but it was also one of the month I took the least amount of photos. I have a silly thing: whenever I feel good about my looks I take a photo with my cat. Don't ask me why but I just do it! Also I love that in this photo we are "matchy matchy".</p>
<p>Now looking at the whole page, it is clear that I'm very biased to find the colour green where I can.</p>
<p><span class="hidden">Colours selected by the </span>Computer: brown, beige, dark beige.</p>
<p><span class="hidden">Colours from </span>My selection: dark grey, beige and light green.</p>
<div class="month-cards">
<div class="month april computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month april mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>May</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/may.jpg" alt="Yellow house in Sweden.">
<p>I was torn between this trip or my second visit to Berlin to CSSConfEU. I chose this particular photo because I love the colours of it and how the sky was so blue throughout the whole trip. I love visiting scandinavian countries.</p>
<p>How was yellow not the winner of this photo?</p>
<p><span class="hidden">Colours selected by the </span>Computer: light grey, dark brown, medium brown.</p>
<p><span class="hidden">Colours from </span>My selection: caramel yellow, light blue and medium green.</p>
<div class="month-cards">
<div class="month may computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month may mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>June</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/june.JPG" alt="Wooden walkway between trees.">
<p>Took this photo when I went to Portugal in June. It was an odd month and I needed some time out of London too. I did this walkway with my dad at the time and went to the beach.</p>
<p>I love the many shades of green it has and how me and "the computer" picked different ones.</p>
<p><span class="hidden">Colours selected by the </span>Computer: dark green, light yellow, medium green.</p>
<p><span class="hidden">Colours from </span>My selection: light green, medium green and dark green.</p>
<div class="month-cards">
<div class="month june computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month june mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>July</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/july.JPG" alt="Ana pointing at a road sign that shows a place called Beer two miles away.">
<p>I'm a bit of an idiot sometimes and I usually can't resist to take photos of things that make me laugh (even if I'm the only one laughing!). In July I spent a weekend in Brandscoombe by the beach where I saw many crabs, swam in the English sea for the first time and got a small tan line!</p>
<p>I am not gonna lie. At this point of the challenge I started to be more mindful of my colour selections so I decided not to pick green! I wanted to find other bright colours in it so I chose my flip flops, the road sign and the house.</p>
<p><span class="hidden">Colours selected by the </span>Computer: dark green, light red, light blue.</p>
<p><span class="hidden">Colours from </span>My selection: dark blue, yellow and pink.</p>
<div class="month-cards">
<div class="month july computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month july mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>August</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/august.JPG" alt="View from Arthur's seat in Edinburgh.">
<p>A very special memory for me. Walked all the way via the "hard path" mostly because I didn't know there was an easier one! In August I went to the Fringe for the first time and I loved it! It was a very long and hungover week.</p>
<p>Similar to March, "the computer" and I were on the same page.</p>
<p><span class="hidden">Colours selected by the </span>Computer: light green, light blue, light yellow.</p>
<p><span class="hidden">Colours from </span>My selection: light yellow, light blue and light green.</p>
<div class="month-cards">
<div class="month august computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month august mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>September</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/september.JPG" alt="Small yellow kitten behind a sign warning visitors not to feed the venue's peacocks.">
<p>I love cats and this photo was taken at a wine cellar in Portugal.</p>
<p>I don't remember that month very well (which is weird) but my phone is again 95% photos of my cat.</p>
<p><span class="hidden">Colours selected by the </span>Computer: medium green, light grey, light yellow.</p>
<p><span class="hidden">Colours from </span>My selection: light yellow, medium green and light red.</p>
<div class="month-cards">
<div class="month september computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month september mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>October</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/october.JPG" alt="Ana being held up in the middle of a crowd in a concert.">
<p>This month was so hard to pick a favourite photo! It was my birthday and I spent it in Salzburg. Besides doing amazing walks I also saw one of my favourite bands live! </p>
<p>On that night I discovered that I really like hazelnut schnapps! I had an amazing time singing out loud all of my favourite songs.</p>
<p><span class="hidden">Colours selected by the </span>Computer: dark brown, light brown, medium brown.</p>
<p><span class="hidden">Colours from </span>My selection: blue, medium brown and dark brown.</p>
<div class="month-cards">
<div class="month october computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month october mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>November</h2>
<img class="float-left" src="https://ohhelloana.blog/assets/15_01_2019/november.JPG" alt="Crowd in the O2 holding their phone's flashlights.">
<p>I chose this photo because I was mind blown by how beautiful the O2 looked when everyone turned on their phone's flashlights. The photo isn't amazing and it was one of those things that you had to be there but visually it felt so cosmic and magical.</p>
<p><span class="hidden">Colours selected by the </span>Computer: dark brown, beige, light brown.</p>
<p><span class="hidden">Colours from </span>My selection: dark grey, beige and light green.</p>
<div class="month-cards">
<div class="month november computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month november mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<h2>December</h2>
<img class="float-right" src="https://ohhelloana.blog/assets/15_01_2019/december.JPG" alt="Garden table with snow on top of it and cat in the background surrounded by bits of snow">
<p>For the second time in my life I didn't spend Christmas with my parents but that didn't stop me from hosting it. We had my sister and her husband come over and I cooked a vegan nut roast from scatch. I was really pleased with myself, especially with how I bought everything in advance and decorated the house! (basically I'm happy that I did normal adulting)</p>
<p>Red is one of my least favourite colours but it was Christmas so I felt like I had to pick it.</p>
<p><span class="hidden">Colours selected by the </span>Computer: brown, beige, medium brown.</p>
<p><span class="hidden">Colours from </span>My selection: red, beige and light green.</p>
<div class="month-cards">
<div class="month december computer">
<p class="month-title" aria-hidden="true">Computer</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
<div class="month december mine">
<p class="month-title" aria-hidden="true">My selection</p>
<div class="top"></div>
<div class="aside-right"></div>
<div class="aside-left"></div>
</div>
</div>
<p>I enjoyed doing this even though now it looks a bit boring. I'm clearly very biased in the colours I like and the photos I choose but also it made me realise that maybe I don't take as many photos as I should. Maybe I should capture more things that got my attention because the years go by really quickly and we don't even notice and then I will forget tiny things that were nice. I need more colour variety in my life too I see.</p>
<p>I had completely forgotten about the photo I took in November but once I re-opened it I remembered the feeling I had when I was there live. So for that, this was worth it. However, this made me realise that I need to do some learning regarding naming colours. My vocabulary on that is pretty weak and I need to learn more especially in how it plays out in accessibility.</p>
<p>P.S.: I am not reducing the amount of photos I take of my cat.</p>
Overthinking my blog2019-01-04T00:00:00-00:00https://ohhelloana.blog/overthinking-my-blog/
<p>In 2018 I began to participate a lot in the IndieWeb community and that gave me a lot of confidence to work on my blog. I told myself sometime last December: "I'm going to make sure that over this Christmas break I do x, y and z so that my blog has more IndieWeb stuff.".</p>
<p>Well, that didn't go to plan. I did write a bit and made some small changes but I didn't make major developments like I would like. I was catching up on Netflix instead. In the past few days I began to feel this bizarre sense of disappointment in myself and a weird feeling of not feeling that I acomplished much. I was falling back into old habits of expecting too much of myself.</p>
<p>The other day I was reviewing my bookmarks so that I could clean them and I thought: "Oh! I should use this as an oppportunity to finally have bookmarks on my blog... like everyone does.". I embarked in this task and decided to experiment using a micropub client to automatically publish into my blog so that I could save time by not adding the markup manually. I decided to experiment with <a href="https://quill.p3k.io/">Quill</a> and out of the box, it worked fine. I styled it and it lives on my new <a href="https://ohhelloana.blog/bookmarks">"bookmarks"</a> page. But I was not satisfied. I began to check what other people were doing and I got dragged into this feeling that I've made it all wrong.</p>
<p>The micropub endpoint that I am using works great but it publishes straight to my "posts" folder in my Jekyll project. This meant that I couldn't have fancy urls. I thought: "hummm I think it would be prettier if when opening an individual bookmark entry it would have /link/ before the bookmark slug.". This meant that my current implementation wasn't doing the job.</p>
<p>I realised that if I wanted that, apparently, I should have used the collections feature from Jekyll. But my micropub endpoint isn't specifically creating bookmarks and publishing them into a specific directory. This lead me to come to terms with the fact that I would have to create my own micropub endpoint if I want to have fancy things built for my specific needs.</p>
<p>TIL: that is called <a href="https://indieweb.org/selfdogfood">selfdogfood</a>.</p>
<p>"Fair enough" I thought. I looked up "how to build micropub endpoint" and after all the articles about how to create a mini bar, the technical ones weren't matching the level of my knowledge so I felt hopeless. I was sad cooking my dinner and thinking how I am so disappointed at myself that I want fancy things for my blog and feeling technically inadquate and way behind my IndieWeb peers.</p>
<p>I carried on my search (still looking for anything micropub related) and I stumbled upon <a href="https://adactio.com/journal/6801">this journal entry from Jeremy Keith.</a></p>
<blockquote cite="https://adactio.com/journal/6801">
<p>I have to admit, I really don’t care that much about the specific technologies being discussed at indie web camps: formats, protocols, bits of code …they are less important than the ideas. And the ideas are less important than the actions. As long as I’m publishing to my website, I’m pretty happy. That said, I’m very grateful that the other IndieWeb folks are there to help me out.</p>
</blockquote>
<p>And there it was. I had lost track of my purpose and I was too focused on building it correctly and catching up with everyone. I need to listen to myself too: it doesn't matter if I only dump HTML in here. It is my blog and I should build it as I can and as I want.</p>
<p>But what is the source of this unsatisfaction? Is it because I made my github repository public? Maybe.</p>
<p>I am being harsh on myself. I am learning lots here already. When a job ago I was only doing javascript this blog was one of the very few places where I was doing HTML and CSS for example and I've learned loads from it. I'm still behind on all the <a href="https://indieweb.org/principles">IndieWeb principles</a> but I will get there. Could 2019 be the year I finally have webmentions? Let's hope so but I will probably need help.</p>
The end of 20182018-12-30T00:00:00-00:00https://ohhelloana.blog/the-end-of-2018/
<p>This may be the first time that I am writing a year review before the year actually ends so it is a good sign. Also, It’s really hard to create blog post titles so I decided to go dramatic.
I had a couple of goals for this year. I wanted to work on my wellbeing, do a talk at a meet up, go to the gym and declutter. I’m happy to share that I did more than that.</p>
<p>This was a long year and lots happened during it. I started 2018 by joining Hactar.is and I am so happy to say that this was the first Christmas that I wasn’t thinking about searching for a new job. I finally had a Christmas break where I was relaxing and not thinking about work.</p>
<p>It’s been a year of unexpected learnings. For example, I learned that when I’m happy in my job, my mind starts looking for other things to be worried about. Surprisingly, this led me to do therapy for my anxiety and my confidence.</p>
<p>I’m very lucky and privileged to have been able to do weekly sessions and it was, without any doubt, the most well-invested money I spent this year. I was able to talk about and rationalise emotions and traumas I’ve had that I never dealt with and I feel like I got to know a side of me that has always been quiet. Doing these sessions led to different consequences especially around relationships and confidence. Had it not been for those sessions, the majority of the things I’ve done this year wouldn’t have happened.</p>
<h2>Global Diversity CFP Day</h2>
<p>In February I signed up for the Global Diversity CFP day workshop in London. I had set my mind to do a talk at a meet up and I wanted to learn how to propose myself for it. To my embarrassment I ended up crying in it. I felt overwhelmed and ashamed of myself. My mind was telling myself that my bio wasn’t great and that I don’t have anything interesting to tell people. I was bottling up these feelings and when it came to the last exercises I couldn’t stop the tears falling from my face. I didn’t have anything technical. I wasn’t coming up with anything revolutionary or brand-new. I felt as if I was wasting everyone’s time. Inside my head I can’t thank Sareh enough for being incredibly supportive on that moment that I broke down. Despite everything, when I arrived home I had a bio and a shy idea.</p>
<h2>Codebar</h2>
<p>Sometime in June I saw a tweet saying that Codebar Monthlies were asking for volunteers and I decided to apply. It felt adequate because I was grieving with emotions related to things that happened to me in the beginning of my career and, to me, I see the Codebar project as a community that I wish I had found when I was a junior developer and I wanted to contribute to it. Little did I know I would actually gain so much from it.</p>
<p>Long story short, in the last 2 years, without me realising, I lost my confidence in communication tasks such as emails. I used to be full hands on but in the last two years I began to question and doubt everything I would write and it became an extremely anxious task. I couldn’t even reply to emails from my neighbours. I would re-read many times and then give up and ask my boyfriend to do it instead of me.</p>
<p>I only realised how bad it got when I had tasks at Codebar that involved approaching venues to host and I was in panic and feeling anxious. Although the team had prepared a couple of email templates that did help out to start, I still would have to follow up on conversations and make decisions! After a couple of months, when I was approaching venues to the career panel that I was co-organising, I realised that I was replying without hesitation and booking venues for the following year. This is something that I wouldn’t have done just a few months before. The side of me “that gets things done” was coming out so quickly and had it not been for me volunteering it may have not come out!</p>
<p>In December I signed up as a coach in a Codebar Workshop for the very first time. I was so nervous… for nothing! It was as relaxing and as welcoming as people say it is. I learned a lot from it especially around my choice of words when explaining something to a code newbie. I’m looking forward to doing it again next year!</p>
<h2>Conferences</h2>
<p>This was the year I attended the most conferences: All Day Hey!, CSSConfEU, State of the Browser, IndieWebCamp (I think it counts as a conference) and FFConf! When I was in the State of the Browser I looked around me and noticed that I was seeing many familiar faces but also became fully aware of the fact that I have been carefully picking conferences that I perceive as friendly, inspiring and welcoming and not necessarily attached to particular languages in the front end domain. There were particular types of talks that I really connected to. I started to grow confidence to admit that I know that I can look up technical stuff anytime via any search engine or a book. Technical talks are amazing, yes…but they were going straight to my brain… whilst some talks were going straight to my heart.</p>
<p>This year I saw one talk that makes me smile every time I think about it: Tim Holman’s at FFConf. It was exactly what I needed to see and it happened at the same time I was doing my talks at meet-ups. It really inspired me to embrace this dormant side of mine of things that I love that can be side projects. I’ve been telling myself “your side project doesn’t have to be an npm package or a future mini start up” but seeing Tim’s talk and laughing along side everyone really solidified this thought. We should be embracing our experiments and not do “CV driven development” (stole this one from Charlie’s awesome talk at State of the Browser and FFConf).</p>
<p>(PS.: All the conferences mentioned were 10/10. Do look up their videos).</p>
<h2>Meet-ups</h2>
<p>In July I decided to try and apply to do a talk based on my shy idea from February, and with the help of Heather (for my usual proof reading and grammar suggestions), I crafted a talk proposal and submitted it to a local friendly meet-up called //TODO London and submitted to MirrorConf too. I was obviously rejected from MirrorConf. I knew I was going to be rejected but since the “no” was guaranteed anyway I wasn’t really going to loose anything.</p>
<p>After a couple of months, a date for November was arranged so that I could give my talk in //TODO London. But around the same time I was told that ViewSource was looking for lightening talk submissions so I decided to apply for it at the very last minute with the same topic. I was in bed about to sleep when, a week before, I received an email that my lightening talk had been accepted. I was shocked especially because I had written the talk title and description by myself. But I was very happy! It happened before my originally arranged talk so that was my first trial of it.</p>
<p>In both events the talk was well received. I talk about this in a couple of posts already but I was so afraid of making a fool of myself while putting my heart out. While I was at FFConf, I received a message from ReactJSGirls asking if I wanted to do a talk. I did, again with the same topic, and it has since all been written down on this blog in a previous blog post.</p>
<p>My goal was to do one talk this year but I ended doing two and a lightening talk all in the space of a month. It retrospective, I’m glad that I left this towards the end of the year when I accumulated a lot of inspiration from the conferences I attended, and when I had more coping mechanisms for my anxiety and more trust in myself from volunteering in Codebar Monthlies.</p>
<p>Around summer I attended a lot of meet ups and I began to feel the same I feel about conferences. I realise that I prefer to attend friendly and inclusive meet ups who focus on inspiration and personal side stories rather than just tech.</p>
<h2>Gym and declutter</h2>
<p>I sucked at both. I failed once again to get back into a gym routine. But don’t worry, between Christmas and new year I have already been to the gym two times! I also bought some clothes this year. My home office and cellar needs a proper declutter and organisation and I have been procrastinating. So hopefully next year.</p>
<p>Bonus cool things:</p>
<ul>
<li>I got a paddling pool.</li>
<li>Got plants for the flat.</li>
<li>Played in the snow in London.</li>
<li>Got two haircuts and one hair dye.</li>
<li>Visited Berlin x 3.</li>
<li>Visited Sweden.</li>
<li>Visited Edinburgh.</li>
<li>Visited Salzburg.</li>
<li>Flew my parents to see my flat for the first time.</li>
<li>Only broke my phone once.</li>
<li>Found a cheap wine that I like in the supermarket.</li>
<li>Received my UK Resident card (not cool and booo to it but at least I didn’t get rejected).</li>
<li>Saw The Rasmus live twice.</li>
<li>Only cried a little bit when I flew on a propeller plane for the first time.</li>
<li>A year of good memes.</li>
<li>In February I discovered that my forehead breakouts were due to my shampoo and changing shampoos has done miracles for my skin.</li>
<li>Met dogs that I follow in instagram in real life.</li>
<li>Hosted Christmas Eve vegan dinner and made a nut roast from scratch.</li>
<li>My nails are grown and I only relapsed into bitting once.</li>
</ul>
<p>Next year: WEDDINGS! But also:</p>
<ul>
<li>Get in the gym routine.</li>
<li>Work a lot on my blog and “side projects”.</li>
<li>Reduce alcohol consumption by a lot.</li>
<li>Read 10 books.</li>
<li>Continue to work on my mental wellbeing. There is still a lot to do.</li>
</ul>
<p>I admit that I would like to talk in a conference but… I’ve done a tour of my shy idea already and I don’t have anything else… which sucks. So maybe it is best I don’t put pressure on myself on this one. </p>
<h2>Nice links</h2>
<ul>
<li><a href="https://youtu.be/-v-eSzgX9BU">Tim Holman's talk at FFConf</a></li>
<li><a href="https://youtu.be/WYXSck7TyVM">Charlie Owen's talk at FFConf</a></li>
<li><a href="https://www.youtube.com/watch?v=D9d1WrARqvI&index=1&list=PLXmT1r4krsTq3yrg4t14hPUbO1OsrA1Hx">FFConf 2018 playlist</a></li>
<li><a href="https://www.ohhelloana.blog/blogging-and-me">My blog post about my shy talk</a></li>
</ul>
Overthinking Instagram2018-12-19T00:00:00-00:00https://ohhelloana.blog/overthinking-instagram/
<p>I very rarely share online if something isn’t going well in my life. I’ve always treated my social media the same way most of us do: we only share the good bits. I thought I was doing that but nowadays, I look back at some photos of what looks like an excellent time of my life but now I know very well that it wasn’t like that at all. I suppose that at the time of posting them I was too numb to see what other bad stuff were surrounding that moment. I particularly hate seeing photos that remind me of previous jobs. Now that I’ve processed and understand many things that happened to me that were wrong, my heart sinks scrolling through my instagram timeline for example. I can’t even handle opening photos to delete them because it ruins my day.</p>
<p>Something similar happened in 2017. I had my first and only Facebook account since 2009. That account had lived through a lot. I actively avoided opening my Facebook account because at that point I had accumulated a lot of people who just reminded me of pain.</p>
<p>I used to struggle a lot with boundaries and defending myself. I hated (and still do) confrontation. I would allow lots of people to win arguments because I couldn’t handle the stress of standing up for myself. I was petrified of upsetting people and always been too apologetic. The fact that I couldn’t stand up for myself damaged me so much. Opening a website and see lots of people who caused that damage was a constant reminder of sad times. For those reasons as well, it takes a lot from me to block or remove someone from social media. It is really bizarre but I am always afraid that, if I do remove someone from my social media, that person could ask me why and that would lead to confrontation especially if it is someone from your work place. Unfortunately, as a woman, after some years I’ve accumulated some people who I had to block and because of this, I became very obsessed with privacy settings.</p>
<p>Everything hit the fan when in 2017 I used the marketplace option in Facebook when I was moving houses. I needed to sell some furniture so I thought it was ideal. The user experience was amazing - I quickly added photos, location, price and soon after I received my very first message. The thing about marketplace is that strangers could send you a message to talk about the item you are selling. A person who was not friends with me on Facebook (an innocent stranger) messaged me and since I was using my laptop at the time, I quickly clicked on the notification and opened Messenger. I saw, in front of my eyes, my previous clean Messenger inbox with only around 5 different conversations going on, be flooded with previously deleted messages… including from people I had previously blocked. I saw them all loading in front my eyes and be reminded of names I really did not want to see. I also saw my Messenger settings be reset. It unblocked people I had blocked and anyone could send me a message. </p>
<p>I started to shake, cry and in panic. I was physically frozen. I couldn’t delete my messages manually because that meant that I had to see them. I couldn’t manually block those people anymore because it was too much. I decided to delete my account all together. </p>
<p>I already knew that “deleted” messages don’t mean “deleted” in Facebook’s servers. I figured that it was a bug and I think that in the moment I allowed someone who wasn’t friends with me to message me via a brand new feature it must have reset the status of previous messages and profiles in relation to me. I didn’t report the bug as I was too shaken up. I only deleted the account and moved on. Probably this is fixed by now but I don’t want to try or test it myself.</p>
<p>Today I am feeling the same with Instagram in regards to bad memories. Especially because I don’t recognise the person I was that posted 6 or 5 years ago and even before that. I changed so much. I want to give younger self a big hug but I also want to erase that person.</p>
<p>Some people I follow, although they never did any harm to me whatsoever, they accidentally remind me of someone or an event that I don’t want not be reminded of. But because they never did any harm to me, I can’t bring myself to unfollow them because I don’t want to be harsh so the cycle continues.</p>
<p>I never open my own profile in Instagram but I want a blank start. I do like Instagram. I like following friends and inspiring people. I love seeing colours and even memes so I still want to have an account. Unfortunately, I read that I can’t delete an account and use the same username. So I am at loss of what to do. </p>
<p>I will be more mindful of what I share online too. I will make sure to only post photos of something if it is a 100% positive memory. It isn’t to show off to other people - it is for my own sake. I want to be able to use it like a photo album. Open it and smile - instead of anxiety, panic, remorse and tears. Maybe during this Christmas break I will find the guts to do a purge but I know that it will be a "fake purge".</p>
<p>I should also bring up something important to me that is the catalyst of these personal notes (including my talks about blogging). This year was a very important year to me because I did therapy. As my previous post mentioned I went though some rough patches in my life that I never properly processed before. Perhaps it is because the year is about to end but I have been thinking a lot about what I’ve learned about myself and how I worked on my mental health. It has been a process of forgiving myself and rebuilding my confidence but in order to do that I had to face many repressed feelings I had and it wasn’t easy. I may or may not do one or two more posts with some tangents on this topic but I am happy to finally let it all out and be honest to myself.</p>
<p>I’m not going to waste bytes talking how social media, the way it is today, is a shit hole. I’m not going to waste time either explaining why deleting social media is a privilege. So this is just a rant from someone who is somewhat upset that someone else' server will never forgive and forget your past.</p>
<p>Note: I mentioned these social media platforms but it applies to any other platforms. I really like a lot of people who work at the companies mentioned and I know that these companies have created a lot of amazing things too.</p>
2018-12-16T00:00:00-00:00https://ohhelloana.blog/51641/<p>Visiting my “niece” 😻🎄🤶🏻</p>
2018-12-15T00:00:00-00:00https://ohhelloana.blog/42469/<p>Showing off my cat who loves to pose for Christmas cards 😍 #caturday</p>
Blogging and me2018-12-14T00:00:00-00:00https://ohhelloana.blog/blogging-and-me/
<p>Last updated: 26th November 2019. Total updates since original publishing date: 2</p>
<p>In the last month or so I gave three talks about blogs and me: one lightening talk at <a href="https://ohhelloana.blog/viewsource-2018">ViewSource</a>, one at <a href="https://todo-london.com/">TODO London</a> and another one at <a href="https://twitter.com/ReactJSgirls">ReactJSGirls</a>. Although I had applied for them at different times, they all happened close to each other and with <a href="https://ohhelloana.blog/indie-web-camp-berlin-2018">IndieWebCamp</a>, FFConf, organising a career panel and a work deadline in between it is fair to say that I had a busy November so only now I’ve had time to convert my talk into a blog post.</p>
<p>Note: This post will be a mixture of all three talks. They were all sightly different from each other but the core message is the same.</p>
<p>If you’re reading this, you are now at the most recent home for my blog: ohhelloana.blog but this isn’t my first rodeo. Blogging as been a part of my life since my privileged bum got a computer and internet in the early 2000s. For some reason I really thought the whole world should read what I had to say about myself and The Wayback Machine is there to remind me that everything you do on the internet, stays on the internet forever.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/wayback_machine.png" alt="Screenshot of Way Back Machine of three different blogs between 2008 and 2011"></p>
<p>I don’t remember all the URLs I had but I was a big fan of moving around and it means I lost some content (a blessing in disguise) but I do remember some from 2007 ~ 2008. So when I was preparing for my talks I read things I wrote 10 years ago and it was as bad as it sounds. It’s safe to say I’ve come a long way.</p>
<p>I think this an accurate timeline of my blogging life:</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/timeline_overview.png" alt="Timeline view from 2004 to 2018. After 2012 the line goes down and a scribble happens between 2012 and 2018"></p>
<p>Until 2007 I had done it all: Geocities, FreeWebs, self hosting with cuteNewsPhp, phpBB forums, Coppermine Galleries, Wordpress, dot TK domains etc. I learned so much! I was always building things. I remember loving Dynamic Drive - (yes, I wanted a dinosaur cursor on my website and yes my scrollbars had the colours customised). I was just a kid who was building things for fun on the internet.</p>
<p>More towards university I had a somewhat popular blog - I even had students recognising me for writing in it and it was weirdly fun.</p>
<p>But obviously, as my timeline shows, something went wrong in 2012 and the answer to that is unfortunately easy. In 2012 I got my very first job in tech and everything stopped being fun.</p>
<p>At that point I deleted everything and my interest in blogging a new chapter of my life died too. I felt like I was the only junior developer in the world. And I was very junior. I didn’t come from a computer science course and all I knew, I learned by myself. I remember the laughs and the mean responses when someone asked my background and I said “I learned by myself from doing X”.</p>
<p>I figured that if I wasn’t as intelligent as everyone else, I needed to make sure people liked me. You can’t be dumb and unliked - those things get you fired. So, unconsciously, I started to ignore my interests in order to fit in with the rest.</p>
<p>I began to feel guilty for having fun in my free time - one time, one co-worker asked me what were my plans for the weekend and when I said it, his reply was: “maybe you should stay at home reading a javascript book”. Needless to say I didn’t do anything that weekend. I was in bed all day without energy to lift up any book.</p>
<p>I was good at hiding how depressed I was (or at least I think I was). I was functional and would only break down at home. But because I would breakdown at home and just spent my evenings crying and not reading javascript books I began to punish myself because I just couldn’t keep up with the “tech world” and my co-workers.</p>
<p>Being invisible was the safest option. I just didn't want to get fired at that point. All the joy I had was gone. But most importantly: I thought I was the only one feeling like this and because I was indeed the most junior person, I really believed that the problem was me.</p>
<p>This is what paused my “blogging life” but more things were happening around me. Social media was growing a lot in those years especially with the quick evolution of smart phones.</p>
<p>Anyone could simply create an account and share thoughts, photos and videos. The responsiveness was there and the ability to instantly share from your camera. Most (if not all) blogging platforms took too long to become responsive.</p>
<p>From my perspective I was seeing blogs and forums closing down or stagnating. And again, from my perspective:</p>
<ul>
<li>Instant/mobile/short sharing gave me the fake impression that my peers were constantly coding and reading tech content. Blog posts probably take a bit longer to craft compared to a tweet, for example;</li>
<li>Sharing became intimidating as it could be blown out of proportion really quickly. It’s safe to say that the stage from your own little blog to social media is a bit more scary;</li>
<li>I started to feel that I wasn’t allowed to ever miss a day of social media (tech news FOMO);</li>
</ul>
<p>“How come these people have time to read and do everything after work?” I thought. My naiveness and inexperience created this thought inside my head that I wasn’t worthy and I should just give up.</p>
<p>This tech news FOMO was exacerbated by my feelings of guilt for not keeping up. I began to feel that if I was offline for any reason (holidays or my own mental health) I just couldn’t find things people shared anymore. Also, it is really hard to find anything on social media unless you know what you’re looking for. And, on top of that, my timeline was deciding what I should see.</p>
<p>At the time I just felt that I had to sign-up for every new cool social media thing just in case. If I was stressing out over this I can’t even imagine what someone, who choses not to have social media or simply live in a country that doesn’t allow them, would think.</p>
<p>In my terrible timeline drawing, the bit that went off rails can be described personally as a combination of toxic job/people + perception of success via social media + pressure to learn constantly and fear of missing out.</p>
<h3>Now back to blogs:</h3>
<p>Sometimes I wonder if I am like this.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/old_man_yells_at_cloud_meme.jpg" alt="Meme of old man yells at cloud"></p>
<p>When I was feeling low and alone I would recall how happy I used to be before I was working in tech. I would remember my silly fan sites, my experiments, my blogs and everything that I loved so much that made me become a developer.</p>
<p>But, thanks to social media, I very slowly started to find some people that would tweet things I could finally relate to. The following ones are more recent examples posted this year. There were a few more tweets from other people that were very important to me but because they were posted around 2013 -2015 I just couldn’t find them anymore. Nether-less, this is a beautiful example of someone sharing something I so much related to:</p>
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/tweet01.png" aria-labelledby="tweet01">
<p id="tweet01">
<a href="https://twitter.com/sarah_edo/status/1013427276350873600">Tweet from Sarah Drasner</a>: “I miss the useless web. I miss your grandpa’s blog. I miss weird web art projects that trolled me. I miss fan pages for things like hippos. I wish I didn’t feel like the web was collapsing into just a few sites plus a thousand resumes.”
</p>
<p><a href="http://www.patrickrhone.net/4480-2/">This post</a> by Patrick is exactly how I feel, especially this quote:</p>
<blockquote cite="http://www.patrickrhone.net/4480-2/">
<p>Seriously, I want to bookmark this, print it, share it far and wide, especially with people who are not on a twitter because, well, it’s an increasingly bad place for those who are mental illness survivors to be.</p>
</blockquote>
<p>So, now more than ever I’ve been finding more and more people that I agree with! We should blog more and we can also have social media. These aren’t mutual exclusive!</p>
<h3>So, why am I not?</h3>
<p>I found a tweet (actually a thread) that puts it into better words than I could:</p>
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/tweet03.png" aria-labelledby="tweet03">
<p id="tweet03">
<a href="https://twitter.com/Fox0x01/status/951047110618689537">Tweet from Azeria</a>: “I regularly get messages from people who are afraid to publish their own technical blog, because they’re afraid to be judged or think people will say it’s useless bc it’s nothing innovative or elite.”
</p>
<p>Eventually my life moved on and things improved and I slowly started to think about blogging again. I wanted to share what I know about tech. Unlike my teenage years this became my occupation for about 8 hours per day but I would always stop myself because I was junior. I thought anything I would say, it would be already known my everyone. Which leads me to my very own FAQ:</p>
<blockquote>
<p>Everyone already knows this!</p>
</blockquote>
<p>This is the number one thought that ran through my mind every time I considered writing anything technical on my blog. It was an array of “everyone already knows this” to “everyone will make fun of me because of it”. It took me a lot of time to work around this thought, but one way that worked for me was to abstract myself from the scenario (or this fear) and ask myself: realistically, what do I do if I am looking for something?</p>
<p>The realistic answer is: I use my search engine, look for what I need, open 20 tabs, check each tab and if it isn’t the answer I am looking for I just close it.</p>
<p>That’s it - there is no other consequence. I’m overthinking something that is very unlikely to happen and has stopped me from writing things that may have been helpful to someone else.</p>
<p>This advice from Jeremy Keith to A Book Apart also puts it perfectly:</p>
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/tweet04.png" aria-labelledby="tweet04">
<p id="tweet04">
<a href="https://twitter.com/abookapart/status/1017760817838788608">Tweet from A Book Apart quoting @adactio</a>: “Share what you learn. And the best time to share is while you’re learning it. (You’ll have a voice in your head saying ‘Everyone knows this already’... Ignore that voice.)”
</p>
<p>Not only that, but your learning voice is unique and different people learn better with different mediums. I, for example, struggle a lot to learn from video tutorials. If everything out there were videos, I would struggle a lot. But the following tweet from Angie Jones puts it into better words.</p>
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/tweet06.png" aria-labelledby="tweet06">
<p id="tweet06">
<a href="https://twitter.com/techgirl1908/status/1128407469808660480">Tweet from Angie Jones</a>: “If you've ever considered writing a blog post but didn't because it was already covered by other people, please reconsider.
I'm searching for a tutorial on a topic and have passed on about 5 of them so far because their style doesn't resonate with how I learn.
We need options 😊”
</p>
<blockquote>
<p>I’m X of my content!</p>
</blockquote>
<p>I’ve lost count of how many times I said something like this regarding something I wanted to share. Replace that X with words like “shy” or “embarrassed”. Ironically, I only thought this when I thought of sharing something not tech related. For example, a blog post about a holiday but I do enjoy reading about these on someone else’s blog. If I enjoy reading other people’s posts, why am I so harsh and insecure about mine?
While I’m at it who told us that enjoying anything not related to tech is bad? You’re more than your job title! You’re a whole person!</p>
<p>The reality is a little bit more positive than what our brains trick us into thinking. And being realistic, I don’t even get enough visitors on my blog to justify being afraid of posting anything here. It is tricky but all it takes is to practise the realistic consequences on your brains.
These thoughts, these fears, they pop in your head, and you know they are there, you can recognise them. They are with you as a “survival skill” and to warn you about the worst consequence. But you shouldn’t ignore them. You should work alongside them.</p>
<p>One of my fears is having someone mocking my English skills. In this case I use my fears as a tool to make sure I won’t publish mistakes on my blog. I don’t want to let it stop me from writing altogether. I want to use it as check point. I will ask some people to proof read before publishing instead. Your fears are part of who you are and use them to your benefit.</p>
<blockquote>
<p>No one is going to read it.</p>
</blockquote>
<p>Treat it like a hobby. If your hobby is cooking, you don't expect to have an audience in your kitchen whenever you're baking right? Treat your blog the same way. Do it for yourself.</p>
<blockquote>
<p>I don’t have time to keep a blog.</p>
</blockquote>
<p>I am not going to lie: probably the most consuming task would be to set it up in the first place. But after that, there is no contract that expects you to publish daily, weekly or monthly. The same way you don't feel pressure to publish on social media (hopefully).</p>
<blockquote>
<p>It's scary.</p>
</blockquote>
<p>It can be. Blogs may be associated with diaries and the feeling that once something is written down, it is forever. Sharing on social media has this "feeling" that the action is more lightweight and less serious. Nowadays big announcements (usually not nice ones) are shared on companie's blog posts while happy announcements are all over social media.</p>
<p>Depending on how you run your blog (if you have a CMS behind it or not), it may take some extra time to delete something we have regretted publishing. This may be beyond my pay grade but you may have to ask yourself what exactly are you afraid of and work around it. If anything, when in doubt, keep it in your drafts and sleep on it.</p>
<br>
<p>Okay, so I’m feeling less intimidated with posting on my blog. Now, where do I even begin?</p>
<br>
<h3>Community</h3>
<p>Things are changing, or as I prefer to say, slowing going back to what they used to be. Parts of the tech community have been getting together and talking about owning your own content. Two quick examples are the IndieWeb community and the #newwwyear hashtag.</p>
<p>I discovered the IndieWeb around a year ago and I found a place that would support me into beginning to publish again. I started to attend my local HomeBrew Website Club and even attended the IndieWebCamp. The #newwwyear hashtag even has a slack channel where you can ask some questions or get some feedback.</p>
<p>My point is: the community is here for you. You’re not alone. If you’re new to tech you can also potentially find a local community that helps you code, such as codebar.</p>
<h3>Connect with like minded people</h3>
<p>Last year I went to View Source and I saw <a href="https://www.youtube.com/watch?v=VvYK-K0jWng">Jeremy Keith’s talk on building the blocks of the IndieWeb</a>. I knew about IndieWeb at this point but I had never seen anyone on stage talking about it. When I got home I started to “dig in” and I found more people talking about blogs. I felt so happy! I was not alone! If you have a moment, also see <a href="https://youtu.be/DNwaChz8xRY">Georgie Luhur Cooke's talk "Your blog ≠ everyone else’s blog"</a>. I reckon these two videos combined represent a big part of what I believe. This part is closely connected to “find a community” but when I finally had the courage to say “hi” to these people that helped me a lot. It made me feel less alone.</p>
<h3>Do the tech bit</h3>
<p>Tech wise, it doesn’t matter. No one cares what you use to publish your blog. As far as I’m concerned having an HTML that only has links to other HTML pages counts as a lot to me. Whatever you choose as a blogging platform is right because it is the right one for you and in this process, only you matter.
Nobody has time to check your code source and almost nobody cares. If anyone does inspect your code, it is probably because they are curious how you built your site. So that they can learn something.</p>
<p>If you're keen into building your own thing, do check this <a href="https://www.staticgen.com/">list of static site generators</a>.</p>
<h3>Don’t overthink your content</h3>
<p>As I said before: you’re more than your job title. Don’t know what to post? Here are some ideas: Today I learned, travel, cooking, job stuff, thoughts, “retrospectives”, experiences, just photos. EVERYTHING IS VALID.</p>
<p>If you need an extra push, read this amazing <a href="https://www.sarasoueidan.com/desk/just-write/">article from Sara Soueidan called “Just write”</a>. She is spot on! One of the greatest tips I got from it was removing analytics and comments so that I don’t overthink about it. Not knowing if people visit my blog allows me to feel free to be myself without censorship.</p>
<h3>Write something when you had a good day</h3>
<p>I have bad days quite often and I don't choose them. Sometimes I say to myself "Sunday morning I will write about that thing I thought about in the tube" but many times Sunday ends up being a not so great day.</p>
<p>I guess others can relate to this by using the idea of "writer's block". Other times it is my own mental health. My advice would be to write something, anything if you had a good day. If you're having a "not so great day" it will be easier to edit a draft instead of writing from scratch.</p>
<p>When I have bad days I am demotivated and my own worst enemy and biggest critic so I found that this helped me a bit more.</p>
<h3>Be comfortable with your voice</h3>
<p>Some people say "find your voice" but I don't think that is the most important bit. I really think people need to be comfortable with their voice. A while back I wrote a draft and when I read it back it just didn't sound like me. I hated it. I was trying to sound something I am not. One of my immediate thoughts were "if someone close to me reads this, they know I don't speak like this" and I felt embarrassed. I re-wrote it. Now it probably sounds like a chat you would have with me in the pub, but hey, at least it is more real.</p>
<h3>Embrace it</h3>
<p>Doesn’t fit in 280 characters? You probably want to blog it then. If you thought it would have made a good tweet, it is worth existing elsewhere too.</p>
<h3>So, about blogging...</h3>
<p>A while back I found the following tweet:</p>
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/tweet05.png" aria-labelledby="tweet05">
<p id="tweet05">
<a href="https://twitter.com/HeyChelseaTroy/status/1051854037417635841">Tweet from @HeyChelseaTroy</a>: “I started a blog years ago to record what I learned about programming. As I have advanced, my posts have begun to give me credibility with technologists I don't personally know. That blog has given me a writing voice. But it has also protected my speaking voice.”
</p>
<p>I believe you should blog because you want to, not because you think you must. And yes, while you do it some great consequences can come out of it (like the tweet above points out).</p>
<p>Blogging can:</p>
<ul>
<li>Solidify what you’ve learned;</li>
<li>Give you a voice;</li>
<li>Empower you;</li>
</ul>
<p>Bonus:</p>
<ul>
<li>Searchable;</li>
<li>Memories that you own and are in control of;</li>
</ul>
<p>NOTE: you don’t need a blog and/or social media presence to be amazing at your job. My talks about blogging were mostly for people who already wanted to do it but needed an extra push.</p>
<p>Back to this:</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/13_12_2018/timeline_2.png" alt="Timeline zoomed in between 2012 and 2018 giving emphasis to the scribble in between">
</p>
<p>The line went up. I left places that weren’t good for me. I unfollowed people that weren’t good for me. This didn’t happen from one day to another. My current blog was created in 2014. Very slowly.</p>
<h3>But, what also helped me…</h3>
<p>A while back not many people were sharing a lot unrelated to tech. But it was reading and seeing things unrelated to tech posted by a few people that made me realise that my peers are not code/design machines but humans like myself who also have doubts, fears, joy and experiences besides their job. Reading about how relatable all of you are, keeps the community going, fosters empathy and stops the culture of overwork.</p>
<p>I promise that doing these talks was a lot more fun than writing them now in a blog post. I managed to add some jokes in there and sound a bit less sad so perhaps I express myself better in person. I'd like to thank everyone who took some minutes to message me on social media. It really meant a lot to know that some people relate to this experience and that I am on the right path to connect with like minded people.</p>
<h3>Useful links:</h3>
<ul>
<li><a href="https://indieweb.org/">IndieWeb</a></li>
<li><a href="https://www.patrickrhone.net/4480-2/">Your "thread" should have been a blog post</a></li>
<li><a href="https://www.sarasoueidan.com/desk/just-write/">"Just write"</a></li>
<li><a href="https://www.staticgen.com/">StaticGen</a></li>
<li><a href="https://www.youtube.com/watch?v=VvYK-K0jWng">Jeremy Keith’s talk on building the blocks of the IndieWeb</a></li>
<li><a href="https://youtu.be/DNwaChz8xRY">Georgie Luhur Cooke’s talk: Your blog ≠ everyone else’s blog</a></li>
<li><a href="https://dev.to/kaydacode/5-reasons-you-should-write-that-blog-post-24ib">5 Reasons You Should Write That Blog Post</a></li>
<li><a href="https://dev.to/elizabethschafer/a-starting-point-for-writing-technical-blog-posts-n2o">A Starting Point for Writing Technical Blog Posts</a></li>
<li><a href="https://dev.to/helenanders26/welcome-to-2019--you-should-write-that-blog-post-41km">Welcome to 2019! You Should Write that Blog Post</a></li>
<li><a href="https://medium.com/jobteaser-dev-team/being-an-ace-tech-blogger-98e208b2c3f5">7 Reasons to Panic When Writing a Tech Blog Post — and What to Do About It</a></li>
<li><a href="https://daverupert.com/2019/04/some-unsolicited-blogging-advice/">Some Unsolicited Blogging Advice</a></li>
<li><a href="https://www.danvega.dev/blog/2019/04/11/dont-call-it-a-comeback/">Personal Blogs: Don't Call it a comeback!</a></li>
<li><a href="https://personalsit.es/">Personal websites are awesome!</a></li>
<li><a href="https://ladybug.dev/episode/blogging-101/">Ladybug podcast: Blogging 101</a></li>
<li><a href="https://matthiasott.com/articles/into-the-personal-website-verse">Into the Personal-Website-Verse</a></li>
<li><a href="https://www.giftegwuenu.com/the-benefits-of-owning-a-personal-blog/">The Benefits of Owning a Personal Blog</a></li>
<li><a href="https://twitter.com/CoralineAda/status/1193216045210906625">Tweet from Coraline Ada Ehmke</a></li>
<li><a href="https://twitter.com/char_bone/status/1196016667761037312">Tweet from Charlotte</a></li>
</ul>
IndieWebCamp, Berlin 20182018-11-29T00:00:00-00:00https://ohhelloana.blog/indie-web-camp-berlin-2018/
<p>Last weekend I attended my very first <a href="https://indieweb.org/2018/Berlin">IndieWebCamp</a> in Berlin. I planned it very last minute and was lucky that flights were still at an acceptable price. I’ve been wanting to attend one for a while. I found out about the IndieWeb because somehow I stumbled upon a list of blogs that were created in a previous IndieWebCamp and that’s how I discovered one of my favourite blogs: <a href="https://julieannenoying.com/">JulieAnnenoying</a> (Julie Anne was the photographer for the event. The photos are available <a href="https://www.flickr.com/photos/tollwerk/sets/72157703142292825">here</a> and <a href="https://www.flickr.com/photos/tollwerk/sets/72157703054537654">here</a>).</p>
<p>It was so much fun! I loved meeting people that I had only “met” via twitter before, the discussions and the opportunity to work on my blog and being able to ask for help.</p>
<p>Speaking of my blog, on the second day of IndieWebCamp (the code day), I made my instagram posts automatically post into my blog while saving a copy in my GitHub. That would trigger a build and deploy to Netlify (where my blog is currently hosted).</p>
<p>It isn’t perfect yet - in fact I would like to change the way they render but it is working.</p>
<p>Since I actually took some time to figure out how to make it work and because I “should practise what I preach” here is the blog post of how I did it, what went wrong and what should be better.</p>
<h3>What did I do?</h3>
<p>Now, whenever I post a photo to instagram it is automatically picked up, publishes to my GitHub repo which then triggers a build in my netlify account.</p>
<h3>How?</h3>
<p>Using <a href="http://ownyourgram.com/">OwnYourGram</a> and a package called <a href="https://github.com/voxpelli/webpage-micropub-to-github">“webpage micro pub to gitHub”</a>.</p>
<h3>But, how again?</h3>
<p>Right, in order to have this working I had to have <a href="https://indieauth.com/">IndieAuth</a> on my blog so that I could even use OwnYourGram.</p>
<p>I’m a bit embarrassed to admit this but it took me too long to figure out that the process was WAY more simple than I thought. When I opened some pages about the IndieAuth I spent too much time trying to figure if I needed an access token and how to generate one. This was mistake number one. Instead of just copy pasting code and poke it, I spent too much going around all wiki pages and just feeling lost.
For this particular case it wasn’t needed at all.</p>
<p>As it turns out all I had to do was to add the following:</p>
<pre>
< link rel="authorization_endpoint" href="https://indieauth.com/auth">
< link rel="token_endpoint" href="https://tokens.indieauth.com/token">
</pre>
<p>I would then have to enter OwnYourGram and follow the steps to test it. When you’re missing something, OwnYourGram informs you of what you’re missing so that was really useful. After getting my IndieAuth working I realised that I also needed to have a micropub endpoint.</p>
<p>I should have learned from my first mistake, but because I didn’t, I spent too much time reading the wiki about micro pub endpoints and at this point I was feeling a bit frustrated and feeling a bit dumb.</p>
<p>Impatience got the better of me so I decided to add to my < head > the following and just poke and see what happens:</p>
<pre>
< link rel="micropub" href="https://www.ohhelloana.blog/micropub">
</pre>
<p>And yes. It failed. I had no idea what I was doing but it was worth giving it a go.</p>
<p>At this point I decided to search “Jekyll micro pub endpoint” and I found <a href="https://github.com/voxpelli/webpage-micropub-to-github">this repository</a>.</p>
<p>Ding ding ding - everything I wanted: works with Jekyll, does a mysterious thing for me, pushes to GitHub automatically!</p>
<p>I want to say that I went straight to the ReadMe but that would be lying. I did the classic:</p>
<pre>
npm i “assume name of thing there” —save
</pre>
<p>It didn’t work. So I went to the ReadMe. There was no npm. So I thought “I don’t know what I am doing and I should know what I am doing”.</p>
<p>The fantastic bit about IndieWebCamp was being surrounded by people who know what they are doing. So I asked for help. Turns out, what I had to do was to click on the purple Heroku button.</p>
<p>At this point I FINALLY understood what the repository did. I forked my own version and re-added it to Heroku.</p>
<p>As per ReadMe, I added the config variables in the Heroku panel and added to my < head > the following:</p>
<pre>
< link rel="micropub" href="https://ohhelloana-micropub.herokuapp.com/micropub/main">
</pre>
<p>I finally had a micro pub endpoint! So I signed in again to OwnYourGram, followed all the steps (now I already had all the requirements) and tested it. I chose one of my existing photos to be published. That worked! So I decided to take a photo, post on instagram and see (after a while) if it would publish automatically (it did).</p>
<p>Here’s when things got more complicated: Everything was (and is) working as I expected but when I opened it on my blog, I didn’t like the URL. I wanted to create a specific URL and following the suggestions in the ReadMe didn’t work. I spent quite a few hours on this but eventually it resulted in creating a <a href="https://github.com/voxpelli/webpage-micropub-to-github/issues/81">gitHub issue</a> in the original package (also my very first gitHub issue).</p>
<p>Another issue I found is that when trying to share an instagram post that has more than one photo, my Heroku app times-out and I need to restart it. This can probably be fixed by upgrading my account but I can’t afford it right now.</p>
<p>But, in all fairness, the micro pub repository that I used is likely not even ideal for this type of content (media content from instagram) so my “issues” may not be real issues as it wasn’t designed to work with it. But it was my very first attempt and it allowed me to understand how it works. Maybe in the future I may create my own micro pub endpoint or use something else more suitable for instagram content.</p>
<p>When that happens I could potentially be even more fancy and, like a friend suggested, automatically generate smaller resolutions of my instagram posts so that I can load them in my main post list instead of the original size ones and save on data downloaded and improve performance. </p>
<p>Unfortunately, I also have to manually add alt descriptions to my images.</p>
<p>It is far from perfect but it is something.</p>
<p>I am happy that I did something productive in those hours in IndieWebCamp and I am for sure very inspired to build more things for my blog. I am just upset that I may not have the technical skill or time to do everything.</p>
<h3>This is what I accomplished:</h3>
<p>If I post a photo on instagram, it publishes on my blog too and I will host a copy of said image in my blog.</p>
<p>This was my first <a href="https://www.ohhelloana.blog/39019">"official post"</a>. I deleted the test ones. The stickers in that photo allowed me to discover <a href="https://indiewebcat.com/">IndieWebCat</a> ❤️.</p>
<h3>Issues:</h3>
<ul>
<li>No alt text;</li>
<li>Currently isn’t handling more than one photo in a post;</li>
<li>URLs are not customised;</li>
<li>Images only available in full resolution;</li>
</ul>
<p>I want to plug my Twitter into my blog and add webmentions too. Hopefully for this year’s #newwwyear</p>
<p>Thank you everyone at IndieWebCamp. I had a wonderful weekend!</p>
<a data-flickr-embed="true" data-footer="true" href="https://www.flickr.com/photos/tollwerk/45698785541/in/album-72157703142292825/" title="IndieWebCamp Berlin 2018 | Day 1"><img src="https://farm5.staticflickr.com/4905/45698785541_b00e74a5da_c.jpg" width="800" height="534" alt="IndieWebCamp Berlin 2018 | Day 1"></a><script async="" src="https://embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>
<a data-flickr-embed="true" data-footer="true" href="https://www.flickr.com/photos/tollwerk/45670456452/in/album-72157703054537654/" title="IndieWebCamp Berlin 2018 | Day 2"><img src="https://farm5.staticflickr.com/4911/45670456452_a5d9b199b3_c.jpg" width="800" height="534" alt="IndieWebCamp Berlin 2018 | Day 2"></a><script async="" src="https://embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>
<h3>Useful links:</h3>
<ul>
<li><a href="https://indieweb.org/">IndieWeb</a></li>
<li><a href="https://herestomwiththeweather.com/2017/11/27/jekyll-indieweb-and-micropub/">Jekyll - IndieWeb and MicroPub</a></li>
<li><a href="https://indiewebcat.com/">IndieWebCat</a></li>
</ul>
2018-11-06T00:00:00-00:00https://ohhelloana.blog/46919/<p>Tiff came to visit us 🐶💚</p>
2018-11-05T00:00:00-00:00https://ohhelloana.blog/63489/<p>Postcards from Berlin</p>
2018-11-04T00:00:00-00:00https://ohhelloana.blog/39019/<p>Spending this weekend in Indie Web Camp in Berlin - and I got some indiewebcat and OAuth cat stickers 😻</p>
View Source 20182018-10-30T00:00:00-00:00https://ohhelloana.blog/viewsource-2018/
<p>Last Friday I had the fantastic opportunity to give a lightening talk at <a href="https://events.mozilla.org/viewsource2018">View Source 2018</a>. However, I would only have 5 minutes and 20 slides in total, 15 seconds for each slide exactly. I decided to apply for it very last minute and to my shock and surprise, my talk proposal was accepted.</p>
<p>This was my first talk in four years and I was incredibly nervous. Since the slides would move on automatically, I knew that If I had a hiccup (and I did) it would be hard to recover and speed up. I was terrified of leaving things unsaid or not expressing myself correctly.</p>
<p>My talk was related to the indie web, and how I wish our community would blog more and about my fears that make me blog less. The whole morning I was dreading it like I dread waking up at 6am for the gym but in the end the feelings were quite similar. After I finished my talk I was overwhelmed by this sense of relief and of “glad I’ve done this” - similar to the gym.</p>
<p>But then I was so happy and thrilled when I had people coming to speak with me based on the content of my talk and the feedback I received. I tried to cover this in my talk but I am a very anxious person who expects the worst by default. When people were really nice to me and supportive my heart was/is so full. I didn’t even consider that could happen and it is giving me a lot more energy to do other things I want to do.</p>
<p>All the speakers were people I really admire and it was a joy to see their talks. They were amazing and everything I aspire to be. If you didn’t have the chance to attend the videos of the talks are already on <a href="https://youtu.be/gjlBcsSNEpU?t=317">youtube</a> (including mine!).</p>
<p>The event was captured a lot in twitter using the hashtag <a href="https://twitter.com/hashtag/ViewSource?src=hash">#ViewSource</a> and the photographer, Paul Clarke, has made lots of photos available in <a href="https://www.flickr.com/photos/paul_clarke/45568759611/in/album-72157702834970015/">Flickr</a>!</p>
<p>And since my talk brought up the indie web, I also had a kind mention in their <a href="https://indieweb.org/this-week/2018-10-26.html">newsletter</a>!</p>
<p>This talk was also from me to me. It is a bit ironic that I tell people “embrace your fears and blog more!” when my blog isn’t the most active one. The response I’ve received and the people I’ve met because of it highlighted how I am not alone and I’m on the right path to surround myself with positive people. </p>
And to all of you who responded to my message and sent in your blogs, I am humbled and so grateful. Thanks to this experience I discovered really nice blogs:<p></p>
<ul>
<li>
<a href="https://deliciousreverie.co.uk/">Delicious Reverie</a>
</li>
<li>
<a href="https://rickbutterfield.com/blog/">Rick Butterfield's blog</a>
</li>
<li>
<a href="http://blog.danielleavincent.com/">Danielle A. Vincent's blog</a>
</li>
</ul>
<p></p>
<p>I’d like to thank everyone involved in View Source for this opportunity, everyone who supported me in the days leading up to it, everyone who told me on the day “you can do it”, everyone who took a little bit of their time to give me feedback afterwards. I really appreciate it. </p>
<p>Now, next stop: <a href="https://indieweb.org/2018/Berlin">IndieWebCamp</a> in Berlin and I will be giving a longer version of this talk at <a href="https://www.meetup.com/todo-london/events/255724958/">TODO London</a> on the 7th of November!</p>
Nearly halway through 20182018-04-23T00:00:00-00:00https://ohhelloana.blog/nearly-halfway-through-2018/<p>Four months later I finally write the usual “new year post”. Unlike last year’s, this time I can finally say that sometimes when time flies it could be because you’re having fun!</p>
<p>I can happily say that 2017 was a great year. I moved house, finally adopted a cat and ended the year signing the contract for a new job!</p>
<p>Speaking of adopting a cat: Jessie is the word I said the most in 2017! We adopted her from Battersea Dogs & Cats Home and now my life (and my phone’s photo gallery) revolve around her and I actually think she loves me back!</p>
<p>In last year’s post I had listed a couple of goals and I was able to do some of them. I clearly missed the “post more in this blog” but I’m happy to say that I’ve significantly worked on reducing my social media usage, being more environmental friendly and work on being more thankful (although this one is still a work in progress).</p>
<p>During 2017 I’ve tried to adopt a form of minimalism. I read a couple of blog posts and books on the topic especially on decluttering. My wallet thanked me and so did charity shops and now I actually have space for everything I own. There is still a lot of room for improvement: I need to be more tidy and store things away in their places immediately after use. I’m sure that there are a lot wonderful other books and resources but I did enjoy reading Marie Kondo’s book on decluttering. In her book there were a lot of situations that I identified with and it did help me to do a big clothes declutter and give it away to charity. </p>
<p>It was also a year with lovely travels and breaks. I visited Iceland, Finland (again!), Cuba, Spain (again!) and some cities in England. I also gained more confidence, I started attending more meet ups and conferences. </p>
<p>For 2018 I have some goals:</p>
<ul>
<li>Actually go to the gym;</li>
<li>Work on my wellbeing (especially mental wellbeing);</li>
<li>Be a speaker in one meet up;</li>
<li>Continue my declutter;</li>
</ul>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/23_04_2018/jessie.jpg"></p>
Stonehenge, Castle Combe and Bath in one day2017-02-02T00:00:00-00:00https://ohhelloana.blog/stonehenge-castle-combe-and-bath-in-one-day/<p>Time flies and it doesn't mean you're having fun. This post has been on my drafts for months now and it is a shame that I barely use my personal laptop after work, but here it is. Back in October, my partner and I took a day off and did a <a href="https://citywonders.com/london-tours/stonehenge-tours-from-london">really cool tour</a> that started in London and went to Stonehenge, had a lunch stop in the Cotswolds and then to Bath all in one day!! I know it sounds exhausting but believe me it was well worth it. I rarely go outside London and when I heard about this tour I knew it was my opportunity to cross some stuff off my checklist.</p>
<h3>Stonehenge</h3>
<p>The day started really early, as one would expect, and we arrived to Stonehenge as soon as it opened. It was quite empty at that time (lovely for photos) and it was really cold.</p>
<p>The tour includes access to the site and visit the museum and it was a great insight to a remarkable monument that everyone knows that exists but no one really knows much about it.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/31163887311_7b46bd1e50_z.jpg" alt="Stonehenge"></p>
<p>We took off from Stonehenge and because we made a good start and we were ahead of schedule our amazing tour guide took the liberty to make an unplanned stop in Lacock. This stop is not announced or offered in the tour and, like he explained, only when there is time for it, it might happen. I couldn't believe my luck!</p>
<h3>Lacock</h3>
<p>Lacock is a gorgeous village that looks like it has stopped in time (in a good way). One of the reasons why it is so popular it's because some scenes of Harry Potter were filmed there.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/31278740915_214880a37b_z.jpg" alt="Lacock" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/32085293330_400f654043_z.jpg" alt="Lacock" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/7.jpg" alt="" width="640" height="427"></p>
<p>Did you spot the cat behind me? During this stop, our guide (his name was Guy) showed us where, many years ago, people would sleep if they were too drunk from the pub and kept sharing curiosities about the village.</p>
<h3>Castle Combe</h3>
<p>The next stop was Castle Combe, also known as 'The Prettiest Village in England'. This was only a lunch stop (the lunch is in a local pub and is included in the tour) and it was a nice chance to talk to the other people in the group. As expected, we were the only "tourists" that lived in the UK. The village has been used as film sets before. We didn't explore too much and we stayed around the pub. It is indeed gorgeous and I wish I had taken more photos.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/31163646971_ef6301be11_z.jpg" alt="Castle Combe" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/30470387313_a13ab38c73_z.jpg" alt="Castle Combe" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/31134013022_1f692bda13_z.jpg" alt="Castle Combe" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/30910494340_0dfbfe8641_z.jpg" alt="Castle Combe" width="640" height="427"></p>
<h3>Bath</h3>
<p>We knew that Bath can't be visited in just a few hours but it was still worth to get a glimpse of it. When I went to Weston-super-mare, the train made a stop at Bath and I could tell from inside the train at the time that Bath was gorgeous. I wasn't wrong.</p>
<p>We did a walking tour around the city (with a bunch of history and curiosities being told by our tour guide, Guy) and we had time to have a Bath bun and afternoon tea in the <a href="http://romanbathssearcys.co.uk/">Pump Rooms</a> - and buy some Bath buns to take home from <a href="http://www.sallylunns.co.uk/">Sally Lunn's</a>. By this time I was getting pretty tired so all photos were taken with my phone.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/02_02_2017/55272.jpg" alt="" width="640" height="427"></p>
<p>I'd like to go back to Bath and spend a weekend there. I don't think it will happen this year but we'll see. In total we spent 12 hours away and like it was really exhausting but it was really worth it. I want to do more days like this and I'll try to find more "one day" tours to cities like Oxford or Cambridge.</p>
Oh Hello 20172017-01-15T00:00:00-00:00https://ohhelloana.blog/oh-hello-2017/<p>As <a href="https://ohhelloana.blog/goodbye-2015">promised</a>, 2016 was the year I signed up to the gym. This is likely to be the biggest change in my life last year since it made me to start making more conscious decisions regarding the food I ate and my health. It had an huge impact in me.</p>
<p>Last year was shit. I moved to London in 2015 (because my partner is English) and last June was a proper kick in the stomach. Half of the population reduced me, an immigrant, to a sterotype that they themselves had built (the TV show about living on benefits is a great example) and all my contributions (taxes, donations etc) were nothing. Moving here was emotionally hard but I did settle. Unwanted here, yet staying.</p>
<p>Politics in 2016 turned me into quite an angry person. An angry person with no power to change anything. No tweet of mine, blog post or petition signature will change anything so I have just given up on all that. I've deleted Facebook from my phone and I've only been using Messenger, Whatsapp and Instagram. I do use Twitter for the sake of tech posts.</p>
<p>During the whole year I had anger, fear (of my future) and anxiety building up to a point that even sleeping became difficult and by the end of the year I resigned at my job to try to have a fresh start of 2017 somewhere else.</p>
<p>But not everything was bad. I keep bringing up my two trips to Finland (<a href="https://ohhelloana.blog/i-was-in-finland">post 1</a> and <a href="https://ohhelloana.blog/vesala-live">post 2</a>) as the best moments of 2016. Besides that, it is really hard to mention any highlight of 2016.</p>
<p>As for 2017, I have a couple of goals:</p>
<ul>
<li>Learning more about minimalism: my word for 2017 is declutter. Own the minimum I need and avoid buying stuff to the maximum possible;</li>
<li>Reduce social media usage;</li>
<li>Be more environmental friendly;</li>
<li>Post more in this blog;</li>
<li>Do volunteering;</li>
<li>Continue to go to the gym;</li>
<li>Be more thankful;</li>
</ul>
<p>I wish everyone a happy and healthy 2017.</p>
Vesala Live2016-11-22T00:00:00-00:00https://ohhelloana.blog/vesala-live/<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/30161954546_d3921a67ef_z.jpg"></p>
<p>Nearly three months after, I finally post here the photos of the Vesala gigs I saw in September. I travelled to Helsinki on purpose to finally see her live (I've been a fan for over ten years now).</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/30197182935_21b9dc239a_z.jpg"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/29567419453_0ca88431d4_z.jpg"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/29901097910_df4e830cce_z.jpg"></p>
<p><a href="https://www.flickr.com/photos/anarodrigues_/albums/72157671480033234">Full album here</a></p>
<p>This woman is unstoppable: music, theatre, acting, writing. Like <a href="http://dailybruin.com/2016/11/22/finnish-voice-actress-student-paula-vesala-debuts-original-play/">she said, she can do whatever she wants</a> and that is exactly what I want for myself too. I don't want to stop: doesn't matter if it is as developer or not.</p>
<p>And why am I posting this? <a href="http://vesala.la/">Vesala</a> comes to my mind in every job interview I go to and the interviewer asks "why did you become a developer?". Well, over ten years ago I taught myself how to program and I built a small website about her, because she is who I admired a lot at the time (and I still do).</p>
<img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/pmmp-site.jpg" alt="pmmp-site">
<p>my first websites were about PMMP (around 2005)</p>
<img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/paula_vesala_fan_sites.jpg" alt="paula_vesala"><p>the only screenshots I was able to recover from ten years ago when I built a fansite about Vesala</p>
<p>I have on my drafts a very long post that will cover how I first learned to program, but for now I will leave here these. I do smile a lot looking at these screenshots: I was 15 years old and I was learning CSS and HTML on my own after school.</p>
<p>And ten years later, I was meeting one of the people that, by accident, contributed a lot to how my future was being shaped at the time.<br>
So thank you Paula, and sorry for crying when I met you.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/22_11_2017/ana_and_paula.jpg"></p>
I was in Finland2016-08-09T00:00:00-00:00https://ohhelloana.blog/i-was-in-finland/<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28549407240_648f04c7a7_z.jpg" alt="Helsinquia"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28729146302_b312634234_z.jpg" alt="Heinola"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28218781573_642ed0b028_z.jpg" alt="Heinola"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28802414806_2d311878f3_z.jpg" alt="Heinola"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28218192883_daaab7600d_z.jpg" alt="Helsinquia"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28833214425_2c3eaa354d_z.jpg" alt="Helsinquia"></p>
<p class="p-img"><img src="https://ohhelloana.blog/assets/09_08_2016/28756940521_0a61e66d21_z.jpg" alt="Helsinquia"></p>
Goodbye 20152016-01-01T00:00:00-00:00https://ohhelloana.blog/goodbye-2015/<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/01_01_2016/2015.png"></p>
<p>And so I say goodbye to 2015. A year full of emotions and unexpected adventures. As any ordinary person on the final day of the year I reflected on everything that was left to do but also the achievements I managed to complete. At the end of the day it's the good things that are worth celebrating.</p>
<p>In 2015 I moved to London and started a new job. The early months were a huge emotional challenge. Leaving my parents, friends and family (and all my crap too) and going to one of the biggest cities in the world and starting a social life (nearly) from nothing was an exhaustive process.</p>
<p>Very quickly I started to hate public transport, crowds and everything involving the city. It was painful emotionally, for me, to plan anything because I didn't know anyone and trying to work out the best way to get to a particular place in the city was a nightmare.</p>
<p>However, time passes and I got to know new people who took me to visit new things and have new experiences which I wouldn't put myself through in my spare time, and now I know the transport network better than the back of my own hand, a journey of 45 minutes changing trains three times doesn't scare me anymore. I took almost four months to start to like London. Now I love it.</p>
<p>Changing jobs didn't leave me with many days to take off as holiday but nevertheless I managed to travel a little bit. For those that have read this blog may have seen posts about Tenerife, Amsterdam, Brugge and Copenhagen. Not to mention visiting Portugal a few times and other places in England (Brighton and Weston-super-mare).</p>
<p>I don't yet know what 2016 will bring, but signing up to the gym is definitely on my list!</p>
<p>Happy New Year,<br>
Ana</p>
Copenhaga2015-11-29T00:00:00-00:00https://ohhelloana.blog/copenhaga/<p>Há duas semanas atrás fomos visitar Bruges e Copenhaga. Planeamos esta pausa há alguns meses atrás mas demasiado tarde para sermos mais ambiciosos. Eu pessoalmente gosto de viajar no inverno mas pode ser um bocadinho mais complicado para estar devidamente preparado para o frio.</p>
<p>Decidimos partir de Londres (usando o Eurostar) para Bruxelas, daí apanhar um comboio para Bruges e voltar dois dias mais tarde a Bruxelas para apanhar um voo para Copenhaga.</p>
<p>Copenhaga é uma cidade particularmente interessante, no entanto não me cativou como Bruges. Eu prefiro cidades "paradas no tempo" onde posso sentir que estou também a viajar na história. Com grandes e belos novos edifícios, Copenhaga é excelente para apaixonados por arquitectura, mas é um pouco mais moderna do que esperava.</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/29_11_2015/23399040855_fba5821e5f_z.jpg">
<img class="post-image" src="https://ohhelloana.blog/assets/29_11_2015/23399458745_7504d2781b_z.jpg">
<img class="post-image" src="https://ohhelloana.blog/assets/29_11_2015/copenhagen.jpg">
</p>
<p>Dois dias não foram suficientes para fazer tudo o que queríamos. Fizemos tours de autocarro e barco mas infelizmente as nossas visitas a museus foram muito limitadas (o que é pena dado que os museus em Copenhaga são, na sua maioria, gratuitos).</p>
<p>Passamos uma tarde no Tivoli: um dos mais antigos parques de diversões.</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/29_11_2015/23316932831_8ba7d2bef8_z.jpg">
<img class="post-image" src="https://ohhelloana.blog/assets/29_11_2015/22772362143_163c6c7b5a_z.jpg">
</p>
<h3>Recomendações:</h3>
<ul>
<li>Comprar Hop on - Hop off tours (autocarro e barco) - se visitarem numa altura em que os canais estão congelados pode não ser a melhor ideia;</li>
<li>Visitar o Tivoli é mais caro às sextas-feiras - informem-se antes de visitar;</li>
<li>Não visitem o Guiness world records!</li>
</ul>
<h3>Comida e bebidas (esta lista foi feita por um amigo meu que viveu na Dinamarca):</h3>
<ul>
<li>http://cofoco.dk/da/restauranter/hoest/</li>
<li>http://www.madklubben.dk/bistro-de-luxe/</li>
<li>http://halifax.dk/restauranterne</li>
<li>http://torvehallernekbh.dk/</li>
<li>http://llamarestaurant.dk/</li>
<li>http://cofoco.dk/da/restauranter/oysters-and-grill/</li>
</ul>
In Bruges2015-11-21T00:00:00-00:00https://ohhelloana.blog/in-bruges/
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/21_11_2015/canal.jpg" alt="Bruges" width="640" height="427">
<img class="post-image" src="https://ohhelloana.blog/assets/21_11_2015/22809013499_8aa035ac7c_z.jpg" alt="Bruges" width="640" height="427">
<img class="post-image" src="https://ohhelloana.blog/assets/21_11_2015/23150994756_02768393a2_z.jpg" alt="Bruges" width="640" height="427">
<img class="post-image" src="https://ohhelloana.blog/assets/21_11_2015/22782793567_465ce34866_z.jpg" alt="Bruges" width="640" height="427">
</p>
<p>Bruges is a small city in Belgium it might be a little bit more known because of the movie <em><a href="http://www.imdb.com/title/tt0780536/">In Bruges</a> </em>but it is also a very popular destination for a small romantic break. In every canal and chocolate shops there is a piece of history and it is really easy to fall in love with the city.</p>
<h3>Recommended bars and restaurants:</h3>
<ul>
<li><a href="http://www.brugsbeertje.be/index_en.htm">'t Brugs Beertje</a> (Bar)</li>
<li><a href="http://www.tripadvisor.co.uk/Restaurant_Review-g188671-d3540282-Reviews-De_Belleman_Pub-Bruges_West_Flanders_Province.html">De Belleman</a> (Bar)</li>
<li><a href="http://www.denhuzaar.be/">Bistro Den Huzaar</a> (Restaurant: kitchen closes at 20h)</li>
</ul>
<h3>Recommended activities:</h3>
<ul>
<li><strong><a href="https://bezoekers.brugge.be/nl/belfort">Belfort</a></strong> (I have vertigo so I couldn't go to the very top - but I recommend! PS.: everyone who is under 26 has a discount);</li>
<li><strong><a href="https://www.historium.be/">Historium</a></strong> (immersive experience! Great to learn about Bruge's history. PS.: our hotel gave us a map that included a discount for this tour);</li>
<li><strong>Horseback carriage</strong> (find them in the main square. They will take you on a romantic tour to the old city - 44€);</li>
</ul>
<p>Since our visit was in November, the canal boat tours were not operating but the city was full of Christmas decorations and Christmas markets (which made the city even more beautiful). Sadly it is a very expensive city and it is very easy to spend a lot of money (especially in food and souvenirs).</p>
The Cat Village2015-11-08T00:00:00-00:00https://ohhelloana.blog/the-cat-village-2/<p>This past week I visited another cat cafe, <a href="http://www.londoncatvillage.com/">The Cat Village</a>. The idea is simple: a cafe with cats. It is possible to request what you would usually request in a cafe but here you get to play with the existing cats. That are some rules that are announced upon your arrival but other than that all you need is to book your visit on their website.</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/08_11_2015/london_cat_village_01.jpg"></p>
<p>All the 14 kittens were adorable, playful and very kind so interacting with them was really easy.</p>
<p>Unlike the other cat cafe that I visited before, this one has a better playground for the cats to sleep and climb.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/08_11_2015/22885154691_1717207fec_c.jpg" alt="London Cat Village"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/08_11_2015/london_cat_village_03.jpg" alt="london_cat_village_03"></p>
<p>It's 5£ per person and per hour and the last time to visit it is at 20h00, which allowed me to go after work.</p>
<p></p><h3>Useful links:</h3><p></p>
<ul>
<li><a href="http://www.londoncatvillage.com/">Cat Village</a></li>
</ul>
One day in Amsterdam2015-10-26T00:00:00-00:00https://ohhelloana.blog/one-day-in-amsterdam/<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/21879102354_2bb465ecf8_c.jpg" alt="amsterdam_01">
</p>
<p>
One of the greatest advantages of living in London is how easier it gets to travel anywhere else. Every time I travelled from Portugal, I knew that it would take at least two hours so imagine how happy I got when I realised my flight to Amsterdam would only take 45 minutes.
</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/22314106790_6c54726c33_m.jpg" alt="amsterdam_02">
<img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/21879308994_777ea802e0_m.jpg" alt="amsterdam_03">
<img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/22476136006_2efd8afb3f_m.jpg" alt="amsterdam_05">
</p>
<p>
This was all arranged very last minute and it was all so that I could spend at least a day with my best friends from Portugal (who I haven't seen in too long).
</p>
<p>I've already visited Amsterdam before but I still made sure that I had a map of the city in my phone (an offline version). In the very first hours of walking, all the streets look the same so it's easy to get lost.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/22502033675_fd35ac1c2a_z.jpg" alt="amsterdam_04"></p>
<p>And of course... I visited the cat museum again.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/26_10_2015/amsterdam_cat_museum.jpg" alt="amsterdam_cat_museum"></p>
Um fim-de-semana em Weston-super-mare2015-09-19T00:00:00-00:00https://ohhelloana.blog/um-fim-de-semana-em-weston-super-mare/<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/19403187933_17b24d6ecd_z.jpg" alt="Welcome to Weston-super-mare"></p>
<p>
Em Julho fomos visitar Weston-super-mare! Localizado a sudoeste de Bristol, é uma pequena cidade costeira que, recentemente, tornou-se mais popular por causa da Dismaland de Banksy. Infelizmente, esta visita foi realizada antes dessa exibição abrir.</p>
<p class="p-img">
<img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/20917761814_06bf836f9a_z.jpg" alt="Weston-super-mare pier"></p>
<p>Quando eu era mais nova, e antes de alguma vez ter visitado outro país, eu tinha um fascínio pelos <em>piers</em>. Este encanto vinha de muitos filmes americanos em que mostravam as atracções, carroceis, jogos e comida que existiam neles. E, como nunca tinha estado num, em Brighton fiz questão de visitar um pela primeira vez e, desta vez em Weston-super-mare, voltei a fazer o mesmo. Ao contrário de Brighton, neste <em>pier</em> paga-se entrada (£1). É inteiramente coberto (óptimo nos dias chuvosos) e, na minha opinião, muito mais divertido. </p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/20918122704_f23ec2514f_z.jpg" alt="Weston-super-mare Pier"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/19836206970_a5a3a91a29_z.jpg" alt="Weston-super-mare low tide"></p>
<p>Sabiam que Weston-super-mare tem uma das maiores diferenças entre marés do mundo? Enquanto está maré baixa é possível caminhar por muitos metros dentro mar, no entanto existe o perigo de ficar preso e ser necessária ajuda para sair da areia.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/21529816962_068106fdc7_z.jpg" alt="Weston-super-mare tide"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/21352924290_018db5fdc6_z.jpg" alt="Weston-super-mare tide"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/21529769842_269de55362_z.jpg" alt="Weston-super-mare Pier"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/19403387023_4b5170b5a8_z.jpg" alt="e_IMG_3728"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/21352861720_ab212704ae_z.jpg" alt="Weston-super-mare"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/19_09_2015/21549675251_eec32b4887_z.jpg" alt="Weston-super-mare Pier"></p>
<h3>Recomendações:</h3>
<ul>
<li>
Hospedagem: <a href="http://www.booking.com/hotel/gb/savoy-b-amp-b.en-gb.html">Savoy B&B</a> - Um B&B em frente ao mar, excelente vistas e o staff mais acolhedor que alguma vez conhecerão
</li>
<li>
Pub: <a href="http://www.tripadvisor.com.br/Restaurant_Review-g191282-d6856701-Reviews-The_Ship_Inn-Weston_super_Mare_Somerset_England.html">The Ship Inn</a> - seja refeição ou apenas umas bebidas recomendo este pub! PS.: <a href="https://instagram.com/p/5UMK3_oPLu/">Existe um cão</a><p></p>
</li>
</ul>
BowlingJS2015-07-06T00:00:00-00:00https://ohhelloana.blog/bowlingjs-2/<p>There is plenty to do here in London! What I lack is energy after work. Meet ups! I love meet ups. I have published about some meet ups in this blog in the past and when I moved to London I was looking forward to attend them. Sadly I don't have time or energy for all the daily activities and sometimes the desire to just arrive home is bigger.</p>
<p>A few weeks ago, before I went on holidays, I went to <a href="http://bowlingjs.github.io/">BowlingJS</a>, this time in Elephant & Castle and the same says it all: bowling and meet more people to like/use javascript.</p>
<p>We were a very small group but a really fun crowd... and hey... I only finished last on the first game!</p>
<p>Inês Teles shared a photo of the group in <a href="https://twitter.com/iteles/status/611639759333662720">Twitter</a></p>
<p><strong>BowlingJS:</strong> <a href="https://twitter.com/BowlingJS">Twitter</a> && <a href="http://bowlingjs.github.io/">website</a></p>
Switzerland (2014)2015-06-08T00:00:00-00:00https://ohhelloana.blog/switzerland-2014/<p>In August 2014 I visited, for the first time, Switzerland to visit a friend. I had never considered this country has a holiday destination and it wasn't on my plans either. I guess destiny and last minute plans allowed me to discover a beautiful country that wasn't even on my top choices.</p>
<p>We rode on a motorcycle from Zurich so I didn't have the change to take photos of the landscape along the way which, by the way, are breathtaking. Never I had seen such green grass and breathed such fresh air.</p>
<p>I spent most of the weekend in Interlaken and Jungfrau. If you plan to visit the top of europe prepare to pay quite a big sum for it (but it is worth every penny). The train to Jungfrau leaves from Lauterbrunnen and you will have a nice chocolate as a souvenir.</p>
<p>Funny enough, on the top of europe they sell a lot of swiss watches! You will find a luxury store dedicated to swiss watches and a nice restaurant with a panoramic view to the glaciers.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15336034185_74508df15b_z.jpg" alt="IMG_2701" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15336074665_e8cb72135a_z.jpg" alt="IMG_2703" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149456048_3cfd785ffd_z.jpg" alt="IMG_2717" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149300439_b0c21ebd92_z.jpg" alt="IMG_2720" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15313034116_c3830b89f5_z.jpg" alt="IMG_2721" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15332872611_2bab1aa47e_z.jpg" alt="IMG_2725" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149329460_4ca8997b1b_z.jpg" alt="IMG_2730" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15313031826_d53a0af5aa_z.jpg" alt="IMG_2759" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149332240_bdc644d411_z.jpg" alt="IMG_2758" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149334840_04e8d8fb04_z.jpg" alt="IMG_2768" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149348240_d75b12c889_z.jpg" alt="IMG_2838" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15313018956_be954e6258_z.jpg" alt="IMG_2836" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15332890571_156ce0351c_z.jpg" alt="IMG_2842" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15149473128_68718a2cb4_z.jpg" alt="IMG_2846" width="640" height="427"></p>
Um fim-de-semana em Brighton2015-05-25T00:00:00-00:00https://ohhelloana.blog/um-fim-de-semana-em-brighton/<p>Este último fim-de-semana prolongado decidimos passar em Brighton. Não era local desconhecido para ele, e nem na totalidade para mim, mas Brighton é uma das paragens obrigatórias quando se vive em Inglaterra.</p>
<p>Conhecida por ser uma cidade despida de preconceitos e localizada no sul de Inglaterra (45 minutos de Londres - viagem de comboio), esta cidade oferece muito entretenimento e diversão e, quem sabe, nos dias mais quentes, uma ida à água.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17467724384_36811a6e33_z.jpg" alt="Brighton Beach" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17902674840_026ea4b2aa_z.jpg" alt="Brighton Pier" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17902756020_3e0bd274c8_z.jpg" alt="Brighton Old Pier" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/18064516876_aa32b01c40_z.jpg" alt="Brighton Pier West" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/18090998665_cfd9777139_z.jpg" alt="Brighton Pier with view to the old pier" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17903262340_957a4f42b3_z.jpg" alt="Fudge Shop" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17903221910_0cf3831e29_z.jpg" alt="Brighton Beach souvenir Stand" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17903180650_a05fa4ce75_z.jpg" alt="Brighton Beach souvenir" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17903134060_a0fc9d2906_z.jpg" alt="Brighton Beach Souvenirs" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17904548279_f9e766e022_z.jpg" alt="Brighton Palace" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17468154654_d8e072145b_z.jpg" alt="Brighton Pier and Beach" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/17902775608_e0f173f1db_z.jpg" alt="Brighton Pier Entrance East View" width="640" height="427"></p>
<h3>Comida</h3>
<p>Embora o nosso hotel não tenha correspondido às nossas expectativas, o factor mais importante para mim (a comida) não me deixou nada desiludida! Utilizo a aplicação Foursquare há mais de um ano (embora reconheça que não seja a mais popular) para escolher restaurantes em todos os lugares desconhecidos que visite e, foram raras as ocasiões que não acertamos na escolha. Desta vez voltamos a ficar surpreendidos!</p>
<p>Almoçamos num restaurante tailandês chamado <strong><a href="http://www.spalace.co.uk/">Sukhothai Palace</a></strong>. Foi muito barato e delicioso! O sumo de manga era exatamente como bebi há uns meses na Tailândia! No inicio, senti-me tentada para escolher o clássico Pad Thai mas decidi aventurar-me em algo que nunca tinha experimentado e não me arrependi!</p>
<p>A surpresa do fim-de-semana foi o jantar. Eu adoro sushi e acredito que conseguiria comer sushi todos os dias (aliás esta semana comi sushi três dias seguidos) mas não estava preparada para esta experiência. Já paguei muito dinheiro por sushi e senti que não valia a pena, mas desta vez valeu cada cêntimo. Chama-se <strong><a href="http://www.sushigarden.co.uk/">Sushi Garden</a> </strong>e recomendo vivamente a visita caso estejam por Brighton.</p>
<p>Para começarmos o dia seguinte em excelente forma optamos por um brunch. A app voltou a ajudar-nos e escolhemos o <strong><a href="http://bills-website.co.uk/">Bill's Restaurant</a></strong> para o pequeno-almoço. Só mais tarde descobri que se trata de uma cadeia de restaurantes e, pela primeira vez, encontro uma cadeia de restaurantes com boa qualidade. Agora que sei que também existe em Londres vou sem dúvida voltar!</p>
<p>Adicionei imensas fotos no meu <a href="https://instagram.com/ohhelloana/">instagram</a>, incluindo fotos da comida, pubs e souvenirs!</p>
Tailândia2015-01-04T00:00:00-00:00https://ohhelloana.blog/tailandia/<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15578868613_a676acae6c_z.jpg" alt="Big Buhda" width="640" height="427"></p>
<p>Uma das últimas viagens de 2014 foi em Novembro a Phuket na Tailândia. Foi a primeira viagem que fiz fora da Europa e o meu primeiro carimbo no passaporte. Tão cedo não me passaria pela cabeça ir a um destino tão longe, mas a convite da minha irmã para o casamento dela levou-me lá.</p>
<p>A minha estadia ficou em Karon (mais<a href="http://katatranquilvilla.com/"> precisamente aqui</a>) e com o carro que tínhamos foi possível deslocarmos-nos por grande parte do lado oeste da ilha. Como apenas fiquei uma semana não foi possível visitar a ilha inteira o que, obviamente, deixa-me com muita vontade de voltar um dia.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15845430787_a0df983f74_z.jpg" alt="IMG_3065" width="640" height="427"></p>
<p>É um destino incrivelmente paradisíaco, com cheiros, cores e toques únicos. Acordar de manha com uma temperatura alta, com o ar húmido e um cheiro tropical foi uma experiência incomparável. Este post vai apenas falar das praias. Existe imenso a registar e a partilhar sobre esta viagem que tornaria este post demasiado longo.</p>
<h3>Praias</h3>
<p>A minha irmã sempre foi uma pessoa mais organizada que eu e, felizmente, pude contar com ela para criar um belo guia de locais a explorar. Uma das óbvias escolhas foram as praias. Andamos em busca de algumas praias secretas mencionadas em blogs e eis que sim, encontramos algumas delas!</p>
<h4>Ao-Sane</h4>
<p>Uma das praias secretas foi Ao-sane e quase que foi um segredo chegar lá. Para chegar à praia foi preciso atravessar um local ainda em obras e por momentos estivemos quase certos que aquela estrada nos levaria a lado nenhum. Felizmente, tivemos uma surpresa: encontramos uma pequena praia com um restaurante e bungalows.</p>
<p>O único restaurante num raio de alguns kms não deixou muito a desejar e nesta viagem estive especialmente concentrada em experimentar comida nova e nunca repetir pratos. Escolhi uma salada de peixe que era divinal e os típicos batidos de fruta. Caso visitem Ao-sane e pretendam fazer snorkeling levem o equipamento de antemão visto que o que existe para alugar... não tem as melhores condições.</p>
<h4>Paradise Beach - Patong</h4>
<p>Se eu achava que para chegar à praia anterior tinha sido um desafio, para chegar a Paradise Beach foi realmente uma aventura. Mas valeu a pena! Após uma subida e descida muito agreste (e já agora, se tiverem alugado uma mota vai ser preciso alguma técnica para sair de lá) encontramos o paraíso... que neste caso tem um preço! Para aceder a esta praia é preciso pagar 100 baht que faz com quetenhamos acesso a uma cadeira com colchão e guarda-sol. Tal como na praia anterior, podem encontrar um pequeno restaurante com a típica comida tailandesa e ocidental.</p>
<p>Apesar de ser, de facto, um paraíso visual não foi a praia que mais me conquistou. É uma praia com imensas rochas e quando os turistas vão para dentro da agua concentram-se todos na mesma área sem rochas que pode tornar-se um pouco mais aborrecido. No entanto por ter imensas rochas e corais é excelente para snorkeling.</p>
<h4>Karon</h4>
<p>A praia de Karon foi a primeira que visitei e foi também nessa que me despedi da Tailândia. É exatamente aquilo que esperamos quando pensamos em praias paradisíacas: água quente, caminhar até não conseguirmos mais e areal branco e suave.</p>
<p>A norte da praia, mesmo no início dela, podemos encontrar um pequeno mercado de comida onde é possível apreciar a verdadeira comida de rua tailandesa, que é também, a mais deliciosa.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15845421817_d298db0ab7_z.jpg" alt="IMG_2962" width="640" height="427"></p>
<p>Uma grande parte do meu tempo foi a passear em alguns dos locais mais recomendados da zona. Estive em zonas muito turísticas e com tempo limitado e talvez por isso não haverão muitos segredos a revelar por aqui.</p>
<h3>The Big Buddha</h3>
<p>Num dos pontos mais altos da ilha, e visível de quase todos os lados está o grande Buddha. Uma visita quase obrigatória e que proporciona uma vista geral da ilha. A entrada é gratuita mas as mulheres têm de tapar os ombros para lá entrar.</p>
Se viajarem com o vossa alma gémea podem comprar uma espécie de sinos em que podem escrever os vossos nomes e deixar lá pendurado.<p></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/16072165707_c86f9c9a11_z.jpg" alt="IMG_3110" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/15845422407_d8cef92b1a_z.jpg" alt="IMG_3121" width="640" height="427"></p>
LXJS 20142014-07-02T00:00:00-00:00https://ohhelloana.blog/lxjs-2014/<p>Para os que não conhecem, o <a href="http://lxjs.org/">LXJS</a> é um evento que decorre em Lisboa e que reúne todos os interessados nas novidades do mundo do javascript e este ano tive a oportunidade, graças à <a href="http://www.blip.pt/">Blip</a>, de participar no LXJS. O evento decorre durante dois dias, este ano numa localização fantástica, com várias conferências e workshops.</p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/14541337593_a70677eb63_z.jpg" alt="IMG_2439" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/14541337283_5460fcbdf3_z.jpg" alt="IMG_2441" width="640" height="427"></p>
<p class="p-img"><img class="post-image" src="https://ohhelloana.blog/assets/14541335003_ddd05548d4_z.jpg" alt="IMG_2455" width="640" height="427"></p>
<p>Apesar de todas as talks terem sido óptimas, ficou-me particularmente na memória a talk de <a href="https://twitter.com/lalamaguire">Angie Maguire</a> sobre como o nosso corpo comunica, um assunto que me interessa desde que me recomendaram <a href="http://www.ted.com/talks/amy_cuddy_your_body_language_shapes_who_you_are">este vídeo</a>. Devo também acrescentar que a Angie é a fundadora do <a href="http://www.ladieswhocode.com/">Ladies Who Code</a> que esperamos que tenha algum evento em breve em Portugal.</p>
<p>Este ano o evento contou com cerca de 200 participantes de 27 países, todos eles entusiastas pela tecnologia. A energia e vontade de partilha de conhecimento é algo que, felizmente, tenho encontrado em quase todos os eventos que participo. De lá trouxe muita vontade de aprender mais, boas memórias e excelente contactos/pessoas.</p>
<p>Saibam mais no <a href="http://2014.lxjs.org/">site oficial</a>, onde estão colocados os vídeos das talks e no Twitter!</p>
Rails Girls - Porto2014-06-02T00:00:00-00:00https://ohhelloana.blog/rails-girls-porto/
<p>No último Sábado pude participar no evento das <strong><a href="http://railsgirls.com/">Rails Girls</a></strong> no Porto. Apesar de não utilizar esta tecnologia no meu dia-a-dia, não pude deixar escapar uma oportunidade gratuita de aprender e conhecer mais raparigas com interesses semelhantes.</p>
<p>Para quem não conhece, o <a href="http://railsgirls.com/">Rails Girls</a> <strong>nasceu na Finlândia</strong> e tem como objectivo fazer chegar a raparigas, de forma gratuita, workshops de iniciação à programação com Ruby on Rails e despertar o interesse por tecnologia.</p>
<p>O dia terminou com um encontro das <strong><a href="http://www.geekettes.io/">Geeketes</a></strong>. As Geeketes é uma comunidade internacional cujo objectivo é ajudar e dar a conhecer mulheres na tecnologia. Com presença em vários países e cidades, incluindo Portugal, é responsável por vários eventos em que não só partilham casos de sucesso, como oferecem ajuda a todas as ambiciosas mulheres nesta área ainda tão dominada pelos homens.</p>
<p>Não faltou nada :) Espero que em eventos futuros encontre ainda mais meninas.</p>
<p><strong>Links para mais info:</strong></p>
<ul>
<li><a href="http://railsgirls.com/">Rails Girls</a></li>
<li><a href="http://www.facebook.com/RailsGirlsPortugal">Rails Girls Portugal</a></li>
<li><a href="http://www.geekettes.io/membership/">Geeketes Membership </a></li>
<li><a href="https://www.facebook.com/portugalgeekettes">Geeketes Portugal</a></li>
</ul>
<p>No próximo Sábado haverá outro workshop de Ruby on Rails e outro encontro das Geeketes em Lisboa.</p>