Become a Creator today!Start creating today - Share your story with the world!
Start for free
00:00:00
00:00:01
Making the web more whimsical with Sara Joy
584 Plays3 days ago
✅ Follow Sara: https://front-end.social/@sarajw | https://bsky.app/profile/sjoy.lol
✅ Sara's site: https://sarajoy.dev/
✅ Whimsica11y: https://whimsica11y.net/
✅ Sara’s CSS Joy web ring: https://cs.sjoy.lol/
✅ NeoCities: https://neocities.org/
✅ Yesterweb: https://yesterweb.org/
✅ Mellonland: https://forum.melonland.net/
✅ 32-bit Cafe: https://32bit.cafe/
In this episode, I sit down with Sara Joy to explore her passion for CSS and the critical role of accessibility in web development. We dive into her journey from a hobbyist to a professional, discussing the latest CSS trends and the challenges of making the web accessible for everyone. Join us for an insightful conversation that blends creativity with functionality!
Recommended
Transcript
Introduction & Guest Background
00:00:00
Speaker
Hello, my front-end friends, and welcome to my podcast, General Musings. My name is Kevin, and in this podcast, I talk about whatever is front of mind for me in any given week, usually in some way that's related to front-end development. And this week, I'm actually really excited because I have a guest joining me, Sarah Joy.
00:00:14
Speaker
Sarah, welcome. Thank you so much for joining me. Thank you. Now, for those of you listening who don't know Sarah, she's a friend and developer who a bit like me got into the web as a hobby in the late nineties, and then later came back to it as a career.
00:00:27
Speaker
ah She enjoys using modern HTML and CSS, especially when it means ripping out a little bit of JavaScript that you might not need along the way. And she's also quite passionate about web accessibility. And one thing I want to say really quickly is, Sarah, you only agreed to come on as a guest if I made it really clear that you're early on in your web development journey. You said you're still a junior. And so I've done that now. We've got that out of the way.
00:00:52
Speaker
ah But that's actually one of the reasons that I wanted you on to talk to you is first of all, I think, when when was it that you got back into it or you switched into web development as a career?
Switch to Web Development
00:01:04
Speaker
Hmm. Like, I guess I kept dipping in and out for a long time, but um it was after a couple of maternity leaves with my kids and they had to take me back up to the law, um but they there wasn't really much for me to do.
00:01:21
Speaker
ah kind of...
00:01:24
Speaker
spent that time trying to decide what I actually wanted to do. And I was like, you know what was fun before? Before all these other things and university and the other stuff I went to do ah quite like making websites and then tried to um teach myself in like 2021, guess.
00:01:44
Speaker
Got stuck down tutorial hell with all the different, um like, should I learn that? Should I learn that? Oh, my my God, there's all these stacks. And what is NPM? And I have no idea what's going on. um Started a boot camp, um kind of got halfway through it and then applied for a job and managed to get my way in as a junior.
00:02:03
Speaker
Yeah. I'm still amazed that worked somehow. um But yeah, I mean, that was the end of 2022.
Front-End vs Back-End Discussion
00:02:10
Speaker
So I guess some people are shooting up ah senior positions at this point.
00:02:16
Speaker
And maybe I shouldn't call myself a junior anymore, but ah imposter syndrome is strong. um I can relate to that. Yeah. And when you're quite front-end-y, I feel like there's a lot of this kind of Nobody says that back end's harder necessarily, but like there seems to be a bit more kudos to the people who are digging around in the back end.
00:02:44
Speaker
I don't know. And everyone has an opinion on front end. So you never feel like you're getting it perfectly right because there's someone telling you they want it different. but um Yeah. So whether junior or not, I don't know, but I still have this feeling that having you interview me is kind of wrong, but I'm happy to be here.
Community Engagement & Networking
00:03:04
Speaker
Well, that's sort of why I wanted to talk to you though, is you've only, you know, it 2021, 2022, you're coming into it, looking at it as a career, but you've been super involved with the community basically probably since go just because like you've already done conference talks, uh, you stayed at the browser. You did, um, ah there was another one too, that I is escaping me at the moment. Uh, you've, you know, you're on this podcast now.
00:03:31
Speaker
uh at css day when we got to meet you were like you knew everybody there it seemed like i'm like i don't know who those people that sarah is talking to and i'm like if they oh that's that you know uh it's you just seem to like have not only sort of you know just been active in the community which is awesome but like you seem to make a splash also like your blog post was there you're active you started you have whimsically which we'll talk about in a little bit but like Yeah, I'm just curious, I guess, you know, how that happened, because I wouldn't have known that you were like new in everything, considering how involved you seem to be with a lot of it.
00:04:12
Speaker
Yeah, it's a good question. And it feeds into the imposter syndrome again. I'm just like, I really talk the talk, but am I walking the walk? I don't know. Yeah. I don't know. I think in 2021, Twitter was like really aflame with particularly front-end people just like hammering all these boot camps and 100 devs and 100 days of code and all this stuff. It was like... um And I became slightly addicted at that point because there was there was a lot of messages pinging to Unfrag, like loads and loads.
00:04:48
Speaker
And it was... Really nice. There was quite a buoyant group of people at my kind of level and my kind of followership all like interleaving with each other.
00:05:03
Speaker
And then there's people like you and the kind of people up here in web standards and accessibility and all the things was starting to find interesting. And I was like, oh, follow them, follow them, follow them.
00:05:15
Speaker
um I couldn't ever make a conversation happen because I was a drop in the ocean. And when you've got like more than 10,000 followers on Twitter, it was just like, I don't think it was possible for anyone with that many followers to engage with new people. It just didn't didn't really work like that.
00:05:34
Speaker
um And then the whole Elon bringing his sink in happened. And loads of people jumped to Mastodon at the same time. And I jumped at the same time.
00:05:45
Speaker
and somehow everyone was follow back happy like all these people who are just like suddenly like we were all following each other back and i i guess they just wanted people on their feet i don't know but suddenly i was enmeshed with them in this new place and i feel like i just happened to do everything at the right moment to become friends with these people um And then, i don't know, I guess I just like Twitter because of its stupid algorithm. You'd get used to posting and posting and posting and posting and posting because it was all about being consistent to, i don't know, get the algorithm to boost you or something. It was rubbish. It it wasn't even worth my...
00:06:30
Speaker
energy really but I got stuck in there um and that just kind of hasn't really died. I'm still posting like crazy now on Mastodon and a bit on Blue Sky as well and when you talk a lot you you end up having replies a lot and It's great.
00:06:46
Speaker
I've made friends with these people and have got to be part of events. And they're just as encouraging as the people much further down the chain were on Twitter. um It feels like pure luck to me, just timing.
History & Evolution of Web Development
00:07:02
Speaker
I mean, I could see how that would help accelerate it with that first. And that was like that first exodus from Twitter, that first time when people we're were heading over to Mastodon, we didn't even have blue sky then.
00:07:14
Speaker
i could see how that could help. But at the same time, if you, you know, you're contributing to that, it's not pure luck. Because if if it was pure luck, it's ah sort of like with my YouTube channel, I feel that way and in some ways, because when I started it,
00:07:28
Speaker
ah Even looking back now, I'm like, wow, like the content wasn't that great. um But it was obviously decent enough that like you know and looking at my channel, it was it still amazes me that it's got to where it is now. And people are like, well, you you know...
00:07:44
Speaker
They're always reminding me that it wasn't just luck they got there. Part of it might be luck that the algorithm picks it up or whatever it is. But there's also the work and energy you're putting into it. And it's not just random conversations. Like it's the contributions you're making towards that, that you know, make you interesting to talk to and want to reply back to. And you have the cool projects you're working on and other stuff, too. So don't don't undercut yourself.
00:08:06
Speaker
No, ah brains are always pushing up. rubbish and like we stick to the dirty nonsense the stuff that that is telling us we're not so good you know that's a really sticky yeah yeah i can definitely relate to that yeah um
00:08:26
Speaker
So just to circle back a little bit to when you first started on the web, ah I think it was 98, 99 that I read that you were first poking around. and That's when I was first playing around too.
00:08:37
Speaker
So ah a fun time, the web at that point. I'm curious. I had, I don't remember the exact timeline. My memory, like once you go past like a year, I have no idea anymore, but I definitely had a couple of GeoCity sites. I was slicing things up in Photoshop and and mucking around in that. I'm curious what you were up to back then.
00:08:54
Speaker
My first site, I planned it while I was on... My dad had a boat back then in Sweden, and I was hopelessly addicted to the internet. And I had the powder squared paper.
00:09:07
Speaker
I started drawing the alphabet with the cool S, you know, the whole the whole thing, where you just do it with the diagonals or whatever. um And in the end, I made buttons for my site in that paper. And then when I brought it back, I scanned it.
00:09:20
Speaker
It was like painted in highlighter colours with black background. And it it it was on the the left column nav in the frame set. um And I'm fairly sure there was a sparkly space background for a while. It was like an Andy Warhol-based selfie thing going on.
00:09:40
Speaker
um It was full of overshare. i had a picture of me in my school uniform on it. and's And until at some point someone made the point like, if someone wants to find you, they will.
00:09:51
Speaker
So I was like, um it i can find that site's frame set on the archive, on the on the way back machine.
00:10:03
Speaker
yeah But the frame set won't load what's in the frame. And it's probably for the best because of all that overshare. It's long gone. But yeah. Were I 15 then? I guess I was 14, 15, something like that.
00:10:19
Speaker
um At some point later frame sets were not so cool and and then I went to a paradigm which I stuck with for ages which was having a kind of nice little border, nice little white border with my links in the top and everything opened in the iframe inside.
00:10:35
Speaker
And I think I kept that for ages, ah ages and ages. um And it was really responsive and stuff. Not that we had phones that could open that stuff, but it was all right in any window.
00:10:47
Speaker
Yeah. And then I did a ah uni university module, which had a website part of it. And then then I had a fixed, like, this looks best in, I don't know, 800 by 600 something. Yes. yeah But it was cool.
00:11:01
Speaker
Yeah. was just going to say before you're saying responsive. I remember, I don't remember what the site was, but it was like the first site. It was like every, it was, i think used percentages for everything. And it was the first time when you're like resizing and every, it was just the layout just got smaller and the tech, like it got to, it was kind of ridiculous thinking back on it, but it was so cool that like you can resize the browser and it adapts like that. That was just like this mind blowing thing ah when that first started coming up. Yeah.
00:11:27
Speaker
Yeah, like I remember CSS and Garden being new and staring at it and being like, this is amazing, I was at the same site.
00:11:37
Speaker
So you took from from that, I guess, did it just stay a hobby for quite a while? Yeah, um I think I had my own website until...
00:11:51
Speaker
until I went into teacher training. And at that point, teenagers and the internet, and I was like, I'm locking everything down. but This isn't going to be up. um And at some point, that phase of my life ended.
00:12:02
Speaker
ah And i got back into it. But at that point, I think it was at that point that I started doing my usual like view source to see what was going on, like websites I like the look of.
00:12:14
Speaker
And at that point, it might already have been like 2013, 2014. And Stuff started being injected with JavaScript and being minimized and I couldn't see what earth was going on and I was confused. And I think I remember sometimes hitting F12 and DevTools popping up and me being so weirded out by it. Like it's big and complicated and what on earth did I just press? And I'd close the browser and hope it would go away.
00:12:39
Speaker
um Then I started just using Like Tumblr? Tumblr was quite good. You could pick some themes that you could really go in with the CSS and really shift it around without worrying about hosting and all that stuff.
00:12:53
Speaker
Yeah, so I just sort of disappeared into...
00:12:57
Speaker
platforms, I guess, because that's all there was. um In my previous job, there was some point where we had this little web interface showing a bunch of systems we had online and red and green dots and stuff.
00:13:13
Speaker
But they were literally like going into a HTML file in a table and editing it per hand to bring a new one in. I'm like, this could be so much easier. yeah I started learning access, then realized that access could output some data which you could suck into HTML.
00:13:31
Speaker
And then I was like, wait, if we put this on the Internet, maybe I can make a form that inputs the stuff that then goes into the HTML. And then suddenly I was learning MySQL. And in the end, we still used access for the inventory, i think.
00:13:45
Speaker
Even that might have gone into SQL. So in the end, we had an inventory and then these computer camera systems. And you're from your inventory, you could pick parts to build a camera system and say where it was going to go. And it would pop up as one of the items that was originally this hand hand-coded thing.
00:14:02
Speaker
So in that job, I kind of taught myself just because it was such a stupid... waste of time basically that they had and they really needed like a hub especially as they had from they were going from like 30-40 systems to I think 150 of bird side miles gone um um Yeah.
00:14:22
Speaker
And that brought me back in probably. And I played with PHP before then, but not really. And I'd played with a bit of JavaScript then before then, but not really, just like copy paste.
00:14:33
Speaker
um yeah And that that was like, that was full stack effectively, I guess. So I guess you sort of had an idea that the web had changed at that point since e a little bit.
00:14:47
Speaker
At that point, because it was only going to be internal for us and the company, it kind of didn't matter how I did it. Yeah. um So I was hacking stuff together until it worked.
00:14:58
Speaker
Yeah. I think when you finally decided to like, okay, I'm going to make this a career switch, then was it like, oh, this is so well, you're you sort of mentioned that at the beginning of like, oh, there's NPM and this and that, like all these new things that have come up.
00:15:15
Speaker
ah Was it not what you were expecting? Or did you have a feeling that it was going to be a bit of ah a jump into like new stuff? I think first I just, first I tried to build myself a website, just got some cheap hosting, did a MySQL database just with like info that I'd then suck up into cards and plop on a page and looked pretty cool actually. Um, even if I say so to myself, um,
00:15:44
Speaker
and I tried to apply to a few places and I actually managed to get a couple of interviews because I'm quite good at cover letters and actually lots of places were really trying to get people in at that point.
00:15:56
Speaker
Um, but I was clearly under trained and they were like, why, how can we trust that taking on and training you is going to bring us anywhere? Cause that's going to be quite expensive.
00:16:08
Speaker
Um, And then I was like, okay, so web designers aren't really a thing anymore. but It's not just web design. There's all these other things. What's a front-end developer?
00:16:20
Speaker
what What is the inner? I had to pick it all apart and then research. um And I guess I followed a few tutorials um because you kind of have to, especially when ah you you're suddenly in the command line, which is quite unfamiliar. I'd played with it before. like it's It's not too scary to me using the fact command line, but it's... I don't know. I'm really a UI person. I like being able to click around and explore.
00:16:52
Speaker
um And just having to remember commands and type them in and stuff. Yeah, so I followed a bunch of tutorials. um And in the end, I was like, okay.
00:17:03
Speaker
So... There's so many ways to skin this particular cat. And that's me understanding that they're these stacks. And you kind of had to choose one, at least to begin with.
00:17:14
Speaker
um And that's at the point that I signed up for a boot camp because i was like, I need someone to guide me through this because it's just too much. I think I played a bit with Svelte.
00:17:25
Speaker
And my website is currently on Astro.com. and I understood that React was this thing that i was going to have to learn and then that was encapsulated in the boot camp within Next.js and ah I still find all of it a bit bewildering to be fair but But yeah, I mean, it's obviously very different from 1999. Yes, definitely.
00:17:51
Speaker
ah And you like CSS. I'm curious, was there anything that you got when you started getting back into it that you were very excited about? Or was it just like, oh, wow, this is completely different. And I have a whole bunch of stuff to learn.
00:18:04
Speaker
Yeah. i mean, I'm trying to think if... I think I must have found some new CSS while i was doing that thing in the company. I've got a vague...
00:18:18
Speaker
It was all based on my inline blocks. So it was just a whole bunch of tiles. um yeah Didn't know anything about Flex or Grid at that point. That came later. But I think that was becoming new and the guides were coming out from like CSS Tricks just at that point.
00:18:34
Speaker
um And like 2021 was just at the point that all the interop stuff was getting big. And so there are announcements all the time. Look what we can do across the board now. Look what we can do across the board now. Here's your newest guide.
00:18:47
Speaker
And so was just like, you know, was just like lapping it up. um so was There wasn't so much like fear or, oh, my God, it's different or anything like that. It was just, give it.
Modern Web Development Challenges
00:19:00
Speaker
Yeah, when when I first started getting back into it, I was sort of, i think it was just after CSS3, because there was like all the CSS3 stuff had just landed, because there's like the CSS3generator.com or something like that. So it's like, oh, you can make box shadows and round corners and then generators for like all of that stuff. It was, yeah, it was like, and i' like always laugh now because I'm like compared, like looking at all the new stuff coming now. And i'm like, we were so excited that we could do a ah round corner at one point. its Yeah. Yeah.
00:19:29
Speaker
Yeah, it's kind of funny. I feel like those there was a, sorry, like almost a backlash against that being easy. Like as soon as the round of corners and the shadows were easy, all the designers were like, we're going flat.
00:19:42
Speaker
Yeah, now that we can do it, we don't want to do that anymore. yeah Too easy. I am curious because I hear from a lot of people and their viewpoints on on where the web is now. And just because I guess since you've gotten back into it, the speed, like there was a lot of change.
00:20:00
Speaker
But I almost feel like in that time from, say, you know, maybe not the full 20 years, but if you look at it from like, say, the from when you worked, you did some of the work on your company's website and say there was a five year gap or something like in, in that timeframe, the change, there was a lot of change. And as you said, react. and then you're also having to learn the parts of the web that you didn't know. But I feel like in the last five years, the pace of change has been insane.
00:20:29
Speaker
And I hear from people, some people are like, let's take a pause, get all the browsers just to catch up on everything. Let everybody else catch up to everything and then you know fix the bugs and then we'll start moving forward again.
00:20:43
Speaker
And then I have the other end that people are complaining, saying that browsers aren't implementing all these new features fast enough. We need to go quicker, you know, and all of that. I'm curious if you have any thoughts on either end of that spectrum or I kind of agree on the pause because I've had complaints about... I'm not going to name any browser names.
00:21:06
Speaker
Safari. um But the... ah they're They're really good at jumping on the new shiny, I think, all the browsers across the board. But then, like you say, there's there's bugs in the implementations of things that really should be there by now.
00:21:19
Speaker
um And that's a problem. um And that leaves everyone uncertain about when something's ready to be used. Like, yeah, we've got caniuse.com, which is great.
00:21:35
Speaker
And then you can decide on some kind of percentage at which time you think it's safe enough to to use a feature. And then there's this new baseline, which I like a lot.
00:21:47
Speaker
But it's not based on percentages, I think. So you've got the newly available, which is when all the big browsers go, yeah, we've got this thing, it's out. and And then the widely available, as far as I know, it's just a 30-month ticker after that. Exactly, yeah. Yeah.
00:22:06
Speaker
That feels a little bit ick. Like it's it's an easy thing to give to your company boss and say, yeah, we can use this now. Look, it's widely available. um But it feels a little bit icky knowing that there's still the odd bug here and there. So maybe be like the the actual main feature parts are basically done, but there'll be some random bit of implementation that's just a bit sticky and doesn't quite work in Firefox or something.
00:22:32
Speaker
um Or Chrome. Yeah. And yeah, the idea of a pause is quite nice.
00:22:41
Speaker
Yeah, I do feel like there, like you said, there is a lot of pushing on new features without necessarily looking back on some of the old ones. I do think the interop going on now is helping to address that, but it doesn't seem quite perfect because we're still, there's some old bugs that are still around. that would they wouldd be nice if they would fix And I just saw, actually, I've had two people yesterday asking me on the new iOS version on, um, it's broken.
00:23:13
Speaker
it's not broken, but like no, on iPhones, you have like the safe areas on the top and bottom list. So like, you know, where the camera is, So like the website by default doesn't go behind that, but you can make it go behind it. So it looks more like a native app. Anyway, if you have position fix stuff now, it doesn't go behind it, even if the website is set to go there. And i'm just like all these, you know, you get this update and then all of a sudden it causes more problems sometimes in unexpected ways too, which can be annoying. Yeah. It's like, it'd just be nice if we can get these working properly because it's a basic feature.
00:23:45
Speaker
yeah.
00:23:48
Speaker
But yeah, circling back a little bit to, I guess, the the old web ah bit, ah you seem to have done a lot to bring back some of the energy from the old web.
Web Search and Content Discovery
00:24:00
Speaker
Or maybe not a lot, but there's there's certain things that you seem to embrace. Like you you do have the CSS web ring, which I guess I'm kind of embarrassed that I didn't sign up for that, but I haven't touched my website in like four years, so it's not completely my fault.
00:24:11
Speaker
Yeah. um But like, I mean, first of all, like, I think there's probably a lot of people listening that have never heard of a web ring. Do you want to explain what it is? Oh, gosh. Okay. um The idea of a web ring is, yeah, you've got a group of somehow like minded people who run websites, I guess.
00:24:31
Speaker
And they could be any topic. And my one is so literally just CSS or the joy of CSS. Yeah. And yeah, either you can, sometimes there's like an index page where we can go and see everyone who's in that group, or you can randomly hop from one to the other, or the whole web ring part of it is that they connect one by one.
00:24:55
Speaker
you can press onward arrows wherever they are in that website and click. Visit them all in a circle. um I actually need to audit mine. And um I know at least one website where it's ah the the link won't work anymore. So I need to fix that.
00:25:09
Speaker
um So, yeah, so if you jump out of it, if a website's gone, then the link, the web ring is down effectively. some You can't traverse the whole thing. And i like I like that the people should be able to traverse the whole thing.
00:25:21
Speaker
um Yeah, and I guess they were more popular on the old web because our search engines weren't so good. um So there was a lot of hand curation, like even early early Yahoo was more like categorized bunch of lists, right? um
00:25:39
Speaker
Yeah. So it's one of the one of the old web ways of finding similar sites to the one you're on. Yeah, it's like thinking of it back then, like i ah definitely found websites in the old days through WebRings that you're like, oh, this is a cool site. And like you'd you'd go back to it. And I actually just before jumping on this call with you, i was recording something that had started as laughing at an ai article that ended with me being a little bit depressed about the current state of the Web ah just because it was an article that like came up in my news feed on my phone.
00:26:15
Speaker
And it was just AI slop that was terrible. and like And you know search now seems to be getting deprioritized. And these, you know i'm like I'm looking at it, I'm like, there's all these good publications putting out quality content.
00:26:29
Speaker
And my newsfeed by Google is surfacing this crap. And they should be good because they had a good search engine and they had an algorithm that knew what it was doing. They had its faults, but it was more you know better than most things or everything else that was out there.
00:26:45
Speaker
And now it seems to be like that side of things is going away and maybe the web rings are, an you know, a potential side or solution to that. Maybe not a solution because I don't think everybody's going to be jumping on adding web rings to their websites necessarily.
00:27:03
Speaker
um But just that idea of having different ways of discovering sites, I think, is going to become more important again. Yeah. Yeah, I agree. um I mean, in the end, it turned out it wasn't very broad profitable to um keep sending people away from your website.
00:27:19
Speaker
um Right, yes, yeah. Google were just like, oh, well, maybe our search shouldn't actually send people straight to the link because we want to keep them. um There's many articles about that, I think.
00:27:31
Speaker
um But yeah, I once... What was it? I think it's because of the webring I sent ah set up. And I say I set up. There's a guy in Australia who runs the webring hosting, if you like.
00:27:46
Speaker
All the back end is there. um i just I just need to add new links to it and make sure there's no dead links and stuff like that, um which is wonderful. It saves me having to deal with the whole...
00:27:59
Speaker
the whole um script side of it, although there are some really good ones that you can just copy. I think Max Bock has done one. Yeah. um Where was I going with that?
00:28:14
Speaker
Oh, yeah. So while I was, while people have just been finding it, they're just finding it. And I get emails um because I just say contact me and they get choice of how to contact me.
00:28:26
Speaker
um And it's just random people. Here's my website. Can I join your CSS web ring? And I'm like, Cool. some Every now and then I have to say no, because they're just a little bit too, not safe for work, but dangerously safe.
00:28:39
Speaker
Not dangerous. Not quite my thing. I'm trying to be really diplomatic. No, there's not not been anything dangerous that's made me scared, but just things I don't want people to land on, by surprise.
00:28:55
Speaker
um Anyhow. it It has opened my eyes to this whole world of hobbyists that are still there, and i I don't think they ever went away, I think. My pet theory is that the rest of the internet, these silos, Facebook, Twitter, all the platforms that are much easier...
00:29:16
Speaker
all the blogging platforms, the the things that allow people to just start typing and posting. And I'm not against that because I'm happy that the world has got on the internet. I think it's a good thing. um But I think there's just as many hobbyists and people making their own websites as there ever was.
00:29:34
Speaker
like in numbers. I don't think it's gone down. I think it might even have grown. um And I'm seeing more and more web rings lately, possibly because search has gone worse.
00:29:45
Speaker
I'm seeing a lot more of these little 88 by 31 pixel banners, like popping on over the bottom of websites. um People are more likely to put up blog rolls. Yep.
00:29:58
Speaker
And slowly, i think people are relearning how to surf the web, which was that term, right? We surfed the web. and We're surfing the information superhighway. um And it seems kind of old-fashioned, but also...
00:30:14
Speaker
I think to find new things that really are us and that aren't slop, we're going to have to just search and go from link to link and maybe that's a web ring or maybe that's an 88 by 31 pixel button or whatever.
00:30:30
Speaker
um Or we are still using like Macedon or Blue Sky or some still X. Although links on X presumably are still pushed down just like they were at the end of Twitter.
00:30:43
Speaker
um But the the the new social medias that are popping up are not pushing down the links. They're there and we're finding each other. And I feel like RSS is coming up again as a thing. Yeah.
00:30:59
Speaker
Yeah, i'm I'm quite, I guess I am quite positive about the state of the hobby web, the indie web, the non-siloed web, right?
Project 'Whimsically' & Accessibility
00:31:09
Speaker
Mm-hmm.
00:31:11
Speaker
Yeah, I think that transitions nicely to what I wanted to also talk to you about, which is ah Whimsically, yeah which I think goes quite well with the the idea of the indie web and and everything else. um So for those listening, its you started Whimsically, which is ah combination of Whimsical and A11Y, which is short for accessibility.
00:31:32
Speaker
Do you want to briefly describe what your goal with it is? Yeah, because it's still a work in progress, um that's which as somebody in the part-time job and kids, I'm just i'm just failing to get further with it.
00:31:46
Speaker
I think it's one of those things that it's so easy to jump on a project. um It's so hard to finish. um Anyway, partly because of all these sites that I saw on my web ring and in other places, some of them are very proudly like this is not for mobiles, this this needs to be viewed on desktop.
00:32:07
Speaker
And that's kind of fine with me. A few of my web ring are like that. It's it's a choice. um and But ah that a lot of them just have all kinds of random scripts that are pulled in from other places. Some are fine, some are possibly not so fine. And actually a lot of them are really...
00:32:30
Speaker
ah These websites are run by really diverse people. Like, they're not all... They're not nerds. They're not gamers. the The majority of websites I've seen are run by queer people, neuro, untypical people...
00:32:48
Speaker
And very proudly part of some kind of subculture, quite often, or, you know, non-mainstream demographic. and And none of them want to shut out disabled people, none of them, as far as I can see.
00:33:01
Speaker
um And a lot in their interest in accessibility. But if you go searching for that stuff, you get really... corporate-based advice, like the advice that banking apps should follow or, um you know, the the the stuff that people thinks is really think are really restrictive and think makes for boring websites. and and then was like okay but we want our bank websites to be boring and actually if the navigation of a personal website is all over the place and not straightforward and inefficient that's half the fun um and so i wanted to try and make a accessibility guide for people who are just building for fun for each other and for themselves um
00:33:52
Speaker
But part of the reason it's stored is that that's, oh, I'm so worried about being called out for advising something really wrong how without realizing it.
00:34:05
Speaker
um
00:34:08
Speaker
Yeah, and that's it. And at some point I'll jump back into it, I'm sure. And I just need to take my opinion and run with it, I think, and then see what comes back. Yeah. But yeah, I feel like these communities really want accessibility advice, but searching for it is hard and you end up on the WCAG website and you just got this whole page of really mentally inaccessible stuff, right?
00:34:33
Speaker
And it's a lot and it's terrifying. And somebody who starts looking that is just going to go, eat you know what? I'm never going to get it right. I'm not even going to try. Yeah, it's, it's intimidating. And it's, I remember when I first started learning about accessibility and being like, oh, this is a thing.
00:34:51
Speaker
Okay, let's, let's learn more. And you're just like, you start trying to work on something and you find, okay, I'm going to do this. And you find something on WCAG or somewhere else and you start following it. And then you see another blog post or something from an expert and it's not quite the same information. And you're sort of like, oh, okay. And then you look somewhere else. And I was just talking with Sarah Suridane not long ago. And she sort of said the same thing that like, you know, you'll, one of the most,
00:35:17
Speaker
The hardest things for people is often that you can find conflicting information from two experts on it. And you're just like, for people that are just trying to get into it, that can be very frustrating. Yeah.
00:35:29
Speaker
Yeah. or And like you said, they'll give up on it. I am curious, rewinding just a little bit in that I saw on your site, one of the earlier blog posts was called how we all benefit from accessibility.
00:35:42
Speaker
And I'm curious, because for me, it was very, it took me a long time to even like hear about the term web accessibility. I'm curious, like how you heard about it and what made you so interested in it in the first place?
00:35:57
Speaker
Actually, that blog post at the moment is still on my side, but I push it down a bit because I feel like I'm almost embarrassed that I made it about us and not about the people who need the accessibility, if you like.
00:36:09
Speaker
But then I'm also slowly coming around to the whole idea that i I'm temporarily like abled myself and my eyesight's getting worse. And every now and then I do something stupid, I fall over, and then I'm physically disabled for a little while. and like um Yeah, so ah somehow I find that title a bit icky.
00:36:29
Speaker
um How did I get across it? I think maybe it came by osmosis. Like the people who are most into CSS... are often really, like, on the web platform, you know?
00:36:44
Speaker
And the people who are really into CSS might also be really into HTML. um It might have been someone like... um Manuel, I'm going to screw up his surname, Matusovic,
00:36:59
Speaker
um and his HTML, HTML hell site, yeah and all these bad examples of HTML and why they're bad. um i i think, I feel like ah it it just trickled in somehow. I don't remember an epiphany.
00:37:16
Speaker
um But every time someone asks me why I'm so excited about accessibility, I'm like... You know what? I'm not that excited about it because if I had my dream job, I would be just noodling with CSS all day, seriously. um But the accessibility part of it, it's a heart thing. you just It's wrong not to make sure it works for everyone.
00:37:45
Speaker
it's It's a duty thing. It's a heart thing. It's not a fun thing necessarily. Even though I feel like I've had the people who I've connected to in the accessibility slash CSS slash web platform circles, they all overlap so heavily. I feel like if people are into web standards and and like CSS, then accessibility is just there.
00:38:10
Speaker
um i guess performance is in there somewhere as well. like They seem to be the people that care the most to make sure everything works as well as possible for the most people.
00:38:23
Speaker
yeah um Yeah. And the other thing is that people say, why are you so excited about it? I'm just like, Pandora's box is open now. i I have learned to care that everyone can be involved and I can't now decide to ignore that.
00:38:39
Speaker
it's It's way open. There's no way of closing that now.
Balancing Accessibility with Creativity
00:38:42
Speaker
When it comes to accessibility of like you were talking a bit before about like how on a personal website or on something that's, you know, not meant to be a banking app, a lot of the time, part of that joy of using those is the discovering and having a weird navigation or having to you figure out how to navigate it.
00:39:03
Speaker
um And I guess that is,
00:39:08
Speaker
When it comes, were saying you're but worried about giving the wrong advice, I guess, or or saying something on your site that would it be in terms of like how to handle that type of situation?
00:39:20
Speaker
And like, because, i you know, do you make it? So visually you have that whimsy that's going on, but behind the scenes, if someone were were to be on a screen reader or accessing it a different way that it is easier, or does that make it a different experience? Because then all of a sudden the person who's using the assistive technology not actually getting the same experience as the person who is able to.
00:39:46
Speaker
Yes. No, i agree. um i don't know if you actually made something that I supposed to agree to, but yeah. And that was a lot of what the talk whimsically was about um in that, great, you can have a site that looks visually extremely interesting and whimsical. can have all sorts of interesting stuff making vibes, like these whimsical vibes happen. And um it could look amazing.
00:40:17
Speaker
I started talking about vibe transmission. I i think vibes is such a weird term, but it just, it's, I don't know, some sites just have a vibe and you can get that visually just in seconds.
00:40:27
Speaker
um And if you're not transmitting that somehow, into a way that accessible tech can receive it, then it's just a page with headings and text and stuff in it.
00:40:43
Speaker
like I mean, one of the things I'd like i'd like to say is that um if you've got this big, beautiful image on your website and you're really proud of it, maybe it's some art you've made or a beautiful photo you've taken or it's your family or whatever it is, you you don't have to do like an alt text, which is within 240 characters or something.
00:41:02
Speaker
You could go go to town and really explain it. if If it's something that means a lot to you, write about it and add that in. um And yeah, I've sort of been musing about how you could bring the vibe of a website to someone who's not looking at it and that could be audio um or you could go to town with some a hidden text here and there or maybe your writing style is so interesting and different anyway that it doesn't matter that they're not seeing the things because there's some clear character coming out through what you've written anyhow um
00:41:43
Speaker
Yeah, and and i think that's I think we sometimes get stuck in this kind of, well, it's accessible as long as the content is available. but and Like, yeah, what is surrounding your content? What's making your site special? um And if it is like a rabbit's warrant of navigation for a sighted user, it may as well be the same for a non-sighted user.
00:42:04
Speaker
um Yeah, I mean...
00:42:10
Speaker
We're talking about non-site because it's the easiest example. But like, yeah um if... But it even feels like, say somebody, like another one that we always, well, we don't ignore, I think we pay attention to, but like say keyboard navigation or there's other ways of navigating. And it's like, does that just become the cheat code of your weird navigation? Because you tab through and it just goes...
00:42:33
Speaker
Yeah, interesting, right? Because my first thought was like, well, obviously everything that's clickable should be focusable. But where's the mystery in that? But maybe maybe it's okay if ah you shouldn't, but maybe if the order bounces around the page, would be kind of fun, you know?
00:42:49
Speaker
um But yeah, this is this is then you're talking about art instead of business or services or like... Really important now to be accessible is government services or big services like banks or e-commerce, I guess, or anything that if you can't access, you are ah like disadvantaged.
00:43:14
Speaker
So obviously all those things should be accessible and efficient and easy to use and familiar and convenient as possible. um But yeah, when we're talking about arty, weird, personal, random websites, and also because they are personal and people are hobbyists and they're they're making it up as they go along, like,
00:43:36
Speaker
ah you it's okay for them to be broken for a while and they shouldn't be in a perfect completely usable tole state and they often barely are even for a completely able-bodied users um and that's okay um I think sometimes I've imagined it like your house.
00:43:54
Speaker
Like my house has got steps up to the front door. We have steps all the way up the house. We've got like a basement and three floors. We've got really narrow house. just goes um It would be awful for someone who was had a mobility problem.
00:44:11
Speaker
But it's our house. So that's probably okay for now. um And I guess I see the personal websites as your house.
00:44:23
Speaker
um And how you form it depends on who you want to welcome into it. Like if I suddenly had a best friend who used a wheelchair, I'd have to figure something out.
00:44:34
Speaker
Yeah, that's a really good point. Um, w w as you were talking, one of the things that did make me think of is I don't just because with accessibility in general, there are, you know, there's different points of views on, on the right way to approach things a lot of the time to begin with, even when it is for a bank or something and trying to make it as efficient as possible that I think.
00:44:56
Speaker
you know, instead of, an it's obviously there's, you have a job and kids, so I don't want to put the pressure on because I know what that's like. But if you, when you do decide to revive it or put more time into it, instead of being like, this is how to do it is just giving, you know, here's ideas on how it could be done.
00:45:14
Speaker
And one thing, like you said, from like our community is fantastic and that people are very willing to talk and have discussions and not just be No, you're wrong. That's not how you should do it.
00:45:25
Speaker
Right. um And I think there's a lot of ah for me, what I love about the idea in general is just opening that discussion because you never hear anybody talking about that side of things of the, you know.
00:45:40
Speaker
Other than this thing that has to be efficient because we need everyone to be able to use it and and do that. Like when we start getting into the more creative side of things, how does that work? And you never hear any discussion on it or at least in the circles I'm in, there's very little going on on that side of things. And I think just...
00:46:00
Speaker
having content on there that's discussing that or just the site existing for that purpose, but then just to sort of invite conversation rather than give prescriptive things on like, here's in this situation, do this. Cause I don't think there's ever really a hard and fast rule, but just, you know, I think it could be a nice place to sort of kickstart conversations in terms of how different things could be approached.
00:46:26
Speaker
Just like you said with like, how do we approach hard to navigate websites in these different things and and things like that i think they're important things and could lead to really good discussions yeah no you're right leaving it open-ended may be a good ah ah a good way to go through yeah no you're right i mean i'm i'm saying like i'm already giving the advice go on put lots of alt text um yeah i like that idea And I think one of the hard things too with accessibility is that the last piece of the big piece of advice that every accessibility expert will give you is do user testing. And I'm like, that's great for everybody working at a company that has a budget that can do user testing. a lot of the time people don't. And then you can put things out there to the community and ask, you know, just for user feedback and things like that.
00:47:19
Speaker
But I think it's probably the same type of idea here is of, you know, asking for user testing and input from people that are interacting with the web in different ways is probably the, you know, using it as a sort of a springboard for that type of thing could be pretty cool, I think.
00:47:34
Speaker
Yeah. Yes. I mean, the last thing i I have contacts who are using various forms of accessibility accessible tech, tech. Yeah.
00:47:44
Speaker
assistive I fumble this every time. um And I try and stop myself from going, you know, here's this thing I've built.
00:47:56
Speaker
ah can Can you just check it works? that You know, thats that's work and I should pay them for that. um Sometimes I put like an open question out on Macedon whatever and I purposefully don't tag in the people who I most want the answer from because...
00:48:13
Speaker
That's work. Yeah, and it's it's hard. But then there are quite a lot of communities on the internet now for, like, Geocities, I guess.
00:48:25
Speaker
What? I'm not sure if Geocities had, like, a social aspect, but I know Neocities kind of does. And there's this, um it is a big web ring, but also a forum by the Melon King. It's called Melon Land.
00:48:40
Speaker
And it's bonkers but brilliant. And it's it's kind of um also whipped up with this web revival in mind. And they've got a huge, don't know if it's PHP BB or VBB or whatever, but it's a forum.
00:48:53
Speaker
It's like a classic forum. um And there's all sorts of people chatting in there about their websites and what they want to build and how did you do this and how did you manage that and oh I want to do this is this a good idea whatever those conversations are happening and they're there and there's there's some of that on Mastodon as well um not as much as there was for the whole hundred devs explosion and in 2021 but there's there still are these conversations what the other ones oh yes to web indie web
00:49:27
Speaker
a Is it 32-bit cafe, think? I think it's 32. I don't think it's 64. um But yeah, there's there's there's communities everywhere. So I think in those places, it's also good to ask and chat and converse about these things.
00:49:45
Speaker
And even if they aren't currently talking about accessibility, having a few people ask might springboard it. Yeah. Um, for anyone interested in any of those, I'll make sure to get links to everything in the, the show notes as well as, uh, for whimsically and, your web bringing as well.
00:50:05
Speaker
Um, Yeah.
Rapid-Fire CSS Discussion
00:50:08
Speaker
I'm going to let you go in a minute, just because I've already taken a lot of your time. But I always do five rapid-fire CSS questions for everybody. ah Anytime I'm on someone else's show, they always have CSS questions for me on this sort of time. And I'm really bad at coming up with answers for them. So I'm trying to see what other people think so I can...
00:50:27
Speaker
steal their homework. ah ah We're going to start off with with with all the, we were talking about it earlier, all the new things coming to development in general. I'm curious if you have a favorite new CSS thing.
00:50:39
Speaker
It could be like from the past few years that you just use a lot or something that's cutting edge that you're just really excited about. I think... I was asked to do like ah my pick for the CSS, um the state of CSS thing. i was like, no, I don't know. And then I was like, ooh, light dark.
00:50:58
Speaker
So the the light dark function, um which is is limited. So like it's only color based. You can only put glibus in it. But once you've used color scheme, depending on whether you've got light mode or dark mode active, you can say in light mode, I want this color. In dark mode, I want this color.
00:51:16
Speaker
Brilliant. um And i I'm in a bunch of GitHub discussions. Sorry, you wanted this to be quickfire, didn't you? It's all good. i I usually preface it saying that it's quickfire, but if you want to ramble, I'm more than happy to let you ramble.
00:51:31
Speaker
Okay, yeah. So um there's some discussions about what you'll be able to do with if function and what else might be possible with... Yeah, so what would be nice is that if you could query whether it's going be dark mode or light mode and then do anything based on that.
00:51:50
Speaker
Like prefers color scheme, which isn't really connected to color scheme property in in ways that annoy people a lot. um But yeah, i'm I'm following quite a few GitHub discussions on where that's going to go And color scheme, the flip-flop light-dark in that was already so good. And then light-dark came along and it's like, oh, that bit's so much easier now.
00:52:16
Speaker
Yeah. Now I want more. It definitely solved the problem of the media query. Plus then if you wanted a manual toggle, like now you could just toggle the color scheme and it just works. And you're like oh, fantastic.
00:52:29
Speaker
And a whole bunch is done for you. like Yeah. Um, that's a good thing with CSS. Is there anything that drives you nuts with it still, or there like i'm a most hated or annoyed thing?
00:52:42
Speaker
css thing I think every now and then i run into some random problem that drives me nuts until I realise my element isn't a block level element.
00:52:54
Speaker
And it's in line. And i I'm just like, display block and everything works perfectly. Yeah, the first time I found out that transforms don't work on inline elements, I was just like, that took me half my day to debug, and I'm very mad right now that that that's a thing.
00:53:13
Speaker
Yeah. ah Do you have a favorite unit? Ooh. Ooh. That's a really interesting question.
00:53:24
Speaker
I think I found quite useful when doing responsive stuff is vmin. Mm-hmm. So like if you want a page to just kind of breathe in and out, depending on how big your window is, instead of just always doing it on width, you do it on the minimum, whether it's width or height.
00:53:45
Speaker
um And then your spacings are all kind of. just about right for most situations like because otherwise if you're only on width and you've got a mobile phone you turn sideways it can be really fat text and you've got like three lines or something um yeah theme in yeah that's a good one you're the first person to answer that i like that um is there a css best practice that you disagree with
00:54:16
Speaker
i I would be surprised if I knew any of the best practices, to be honest. Or we could say like common advice that, you know, if there's nothing you can think of, that's fine.
00:54:28
Speaker
I mean, I know there's a bit of discussion right now because it's new is the whole nesting versus not nesting. And nesting is lush, basically.
00:54:40
Speaker
It makes stuff quite nice to read. um But it is not very backward compatible. And i I just, yeah, I guess I just want it to be more backward compatible because it's so good.
00:54:53
Speaker
um But that is a bit of a discussion, I think. Oh, the other advice is like, i I also saw a discussion about saying, well, you know, if if you're using layers, you're not doing the cascade right.
00:55:07
Speaker
And I thought, really? Let people use layers and be okay with that. Layers are good. But I don't know how backward compatible that is either. It's probably widely available. i was Layers is one of those ones that I was like waiting to find sites in production that were using it.
00:55:29
Speaker
And now I've actually started seeing it. It was just like, oh, there it is. it's it's People are they're willing to take the chance on it. and Because I figured until you could use it in production, we'd never see there'd never really be any like good advice on how to use it because everything is just theoretical. up to Like there's people doing their personal sites with it, but they're always smaller scale. You're not working in teams.
00:55:52
Speaker
Uh, then you have, you know, it's just, it's a bit more niche. Everyone's following that like basic demo that everybody's doing where it's just like your reset, your base, your, you know the components, the layout.
00:56:02
Speaker
And it's like, how is this actually getting it used in production? I'm very curious. So I'm, I'm, I figure I've seen a few sites now. I figure it'll start slowly leaking in and we'll start seeing more though. What's beautiful is in my current company, I'm working in a team where we're doing and a web app for internal people, for our support staff.
00:56:23
Speaker
We know their computers. We know that they have the latest browsers. We know basically exactly what they've got. So we're just using everything that's available. Why not? That's awesome.
00:56:33
Speaker
Awesome.
00:56:37
Speaker
uh last one this is the hardest question that i always get so if you don't have a good answer that's fine uh but if you could add one feature to css that we don't have right now what would it be oh gosh i mean i think it might be coming with this if function thing but and it's semi there with has i guess but being able to change What styles you show based on um content would be really cool.
00:57:16
Speaker
There may be some weird circularness that I don't understand, which would stop that being a thing. I think If could open that up. Because I really wanted HTML includes until I kind of understood that they can be nasty and circular and maybe that's just never really going to happen. Even I really want it.
00:57:38
Speaker
Yeah, I think that could happen with if. is luck Because with if you can query custom properties, but even on that element, that must be able to do something with that.
00:57:51
Speaker
see We'll see what happens. it's one of the Some of these newer ones are always like like, once the smart people get their hands on us and show us the weird, crazy stuff you can do with it, then like, you know, it's... Oh, gosh.
00:58:01
Speaker
Yeah, like... um
00:58:05
Speaker
Is he called Roma? I've forgotten his name. Yeah. Yeah. And Anna Tudor and these people who just, yeah i you know, no idea. i was I was listening to the Odd Bird on a show on YouTube and they were chatting with Roma and going through some of the, they were talking about custom functions and something else.
00:58:26
Speaker
And then like, you know, he's just pulling up his a blog posts on like the theoretical stuff they could be doing if with this implication and or implementation and stuff. And I was like, Wow. Like he's thinking of things on such another level. and and like Anna, like you said too, and it's just like, yeah, some of the stuff they're up to is nuts.
00:58:42
Speaker
Yeah, absolutely amazing. but Anyway, with that, I just want to say thank you so much for joining me. It was a pleasure chatting with you. Thank you. appreciate your time. ah Yeah, I hope you enjoyed yourself.
00:58:54
Speaker
Yes. Other than, i'll put links to everything down below, but ah you've already mentioned Mastodon. Is maybe the best place to follow you? Is there anywhere else if people want to see what you're up to?
00:59:06
Speaker
I'm on Blue and crossbows quite a lot. So if you really don't like Mastodon, you can follow me there. um I think my profile on there also links to the the the bridged one from Macedon anyway so like if that's the preference that's fine.
00:59:23
Speaker
Macedon is like my home if you like yeah that is probably the best place to find me. Awesome well thank you so much I really appreciate your time and thank you everybody else for listening and that's it for this week so thank you and until next time don't forget to make your corner of the internet just a little bit more awesome.