Episode 003

Claire and Steph discuss the Web, and why it is absolutely crucial to know your Web fundamentals. Inspired by a recent issue on the CSS Working Group's GitHub, we bring it back to the basics.

Check out the Episode 003 Notes

Transcript#

Claire:

Hey.

Steph:

Hey there.

Claire:

I'm Claire.

Steph:

And I'm Steph.

Claire:

And this is Word Wrap.

Claire:

On today's episode, we're going to talk about why the web is the way is - as in, why we have the fundamental languages of HTML, CSS, and JavaScript.

Unfortunately, it seems like every few months on Twitter we rehash one or another of these languages and how they're insufficient. And let's be honest - we're just going to keep doing that.

These discussions seem to have one thing in common: an unwillingness to learn fundamentals which can also mean missing time-honored solutions baked into the semantics.

This discussion became on the forefront of my mind again because of a recent issue that was opened up on the CSS Working Group's GitHub, and if you're familiar with the discourse that's been happening on Twitter in the last couple of days - you might know what I'm talking about. Essentially, there was a desire to unite all three languages - HTML, CSS, and JavaScript - to be essentially within JavaScript. And I'm not going to dogpile on just the idea in general - because I think it's important for us all to explore different methods of thinking and challenging those things we see as industry standards.

We're all human - we all make mistakes - but I find it particularly interesting that the standards that we have - HTML - for example, is based upon, or is an implementation of, XML, which stands for eXtensible Markup Language. So it quite literally was built with the idea of being extended - I mean, XML you can write any tag and that is the whole point of it. And the whole idea of HTML, CSS, and Javascript didn't all come together at the same time. HTML was arguably the first - CSS was kind of worked on separately a couple years later. And so was JavaScript. JavaScript was actually something Netscape brought up - and then Microsoft decided to do JScript, and then they figured they weren't doing it as well as Netscape was, and if you know the history of the web, you know the rest of that.

So it all - it wasn't always like this - the way - the way that it is now that everyone and everything is kind of not necessarily in harmony. But they, you know, they kind of go, you know they're peas in a pod and and so it's understandable to question the root reasons of why we have these things. However, I'm of the camp - and I think Steph is of this camp, too - that these things should be separate. I mean, they are three different languages so they should be separate and as much as possible - like, you can throw CSS and HTML through a JavaScript pre-processor, whatever that doesn't matter - but the code itself should be in separate files.

And the reason why that's important - I think we'll get to in a little bit. But in my mental process these things are just separate in general. Like HTML is the structure of the page. It is - you know, when we think about accessibility we think of document structure. We are quite literally creating a document and so that's why you can't put two h1 tags on a page, for example, it's just not good. I mean you can do it. Let me - before everyone's like "oh you can't do that? you can do it!" - but you have to do it in a - in a specific way.

CSS on the other hand isn't necessarily baked into HTML. It's not something that has to go one to one with the HTML code and neither is the JavaScript.

You know, when we talk about Design Systems - we talk about components, you know, it's understandable that some folks want to you know - really combine these things so that they're all in one file. And you know, it's easy to essentially ramp up onto you know, whatever system you're creating and that's understandable.

I've been in both situations where you know, you have files next to each other and then you have files completely in different code bases even. You know, maybe even a git submodule here and there; But one thing that has been mentioned in this particular proposal was the JavaScript was faster than HTML when it comes to like being parsed by a browser and that is quite literally not true.

HTML has - it is the one - it's the first thing that's, you know, interpreted on the page and that's kind of for a reason because you need structure to build a page. And JavaScript is quite literally the worst thing for performance. You know, some people will make jokes about how, you know, you keep adding JavaScript to your page and your page gets slower and more JavaScript isn't always the solution and stuff.

And that's true. Like, you know, I mean, that's why you have Eleventy (11ty). You have a bunch of static site generators that are - that are becoming popular again. Like they just ship HTML and CSS and sprinkles of JavaScript. But you know that doesn't preclude JavaScript from being in the process. I mean Eleventy is quite literally built on JavaScript. You know, I think that there are places for all of these things, but I would argue that JavaScript does not need to be the only thing that renders in a browser.

Steph:

So I think when these discussions come up, what I think we can agree on as builders of the web is that if nothing else - we all love to tinker, right?

So it's natural that once you pick something up - even if you've learned it pretty in-depth - you probably find things you want to change. That's human, right? We're never satisfied with the answer. You know, we are as developers, we constantly joke about you know looking at code from even ourselves weeks or months ago and just being able to identify how much we've grown.

So like it's natural that if you can see your own growth process that you would also be forming new opinions, new processes. And not only that, but you also - we're going to experience changes in teams, changes in workplaces - and all these things contribute, of course, to how you view the web. And particularly, you know, it's important to keep in mind that people are always entering the field of web development, right?

So when you first enter (the web) that context with which you enter the web is going to color your experience for a considerable amount of time.

For example, myself: I started learning web development with Flash but my first professional experience with it was at an advertising agency. And advertising and marketing were the environments that I experienced web development for a significant amount of my career. And that gives me a completely different lens of how I view these tools then somebody who has always been in product development, for example. And I think that when these things come up on Twitter or what not and we're like, "oh the web should change" its like - those are important discussions to have. I think what usually gets everyone into trouble is forgetting that everybody does have that different context and that different lens with which to view the web. And so what should be and could be productive conversations quickly devolves into that dogpile. So the context is important.

As Claire brought up, you know, there's also some times that lack of understanding of those fundamentals. So learning those fundamentals - if you came from a boot camp you again have a different that entry path in is going to affect when and how you learn the fundamentals versus being solo versus being in a very structured computer science program.

But, at the end of the day, the hard and fast truth is that HTML and CSS - and occasionally a sprinkle of JavaScript - are what make up a webpage.

This - this is true. This is going to continue to be true. The languages will evolve - we've seen the languages evolve. That's why we have HTML5 and CSS3! And you know, I don't think we're numbering things anymore. But still the point being the web is evolving.

There's a really great project even to further democratize being able to give your opinion to browser makers. It's called The Web We Want and I encourage you to check that out and you can actually take part in surveys and it's another avenue that's open to you to give your opinion on the way the web should move.

So it's something where it's not necessarily - sometimes it's specific to technology and you know, the languages. So finding the appropriate forum to have these discussion is highly encouraged. We totally encourage that. We'd love to have those discussions with you too, you know.

We're starting a new segment called "listener questions". So feel free to toss us those questions. We'd love to continue discussing these types of things on the show.

Claire:

To back up on one of Steph's points - you know that we're always learning and these languages are always changing - that was the entire point of the web. You know, people knew that this wasn't going to be you know, the end all be all.

There are several tags, for example in HTML, that are not used anymore that are quite literally said do not use this it will break the web. My favorite is <xmp>, which was supposed to be an example tag for maybe code or whatever.

It's what you would use <pre> or <code> for now, but <xmp> quite literally tells the HTML parser to stop parsing. And so anything after it just is - just plain text. So you can imagine how that could break something.

You know and JavaScript is so vastly different than it was 10 years ago, and it's so much better to work with. I mean jQuery was founded based upon the fact that it was so hard to do certain things in JavaScript and JavaScript has taken so much of that and made it a standard, you know that works in every browser. So if you have an idea where you know, you don't think that something could work this way, you know, you should go ahead and create something.

I mean and that's kind of the beautiful thing. Like Node - think about Node. Node was like people - when people thought of Node for the first time they're like - wait JavaScript running a server? That sounds crazy. Now it's - I mean, you know, we make jokes about node_modules and - and stuff like that.

So, you know, there's a lot of room to grow the Web and to use the Web in many different ways.

I think this topic is something that I'm really passionate about because I find the Web is one of those things that is actually constructed in a way that it can continue to grow. And you know, one of its fundamental points is to be backwards compatible - that, you know, anything that was thought of 30 years ago will still work.

Now, you know that - that's fantastic like that. Think of any system. Think about Apple over 40 some years in existence. It's changed architectures like four times: Motorola, PowerPC Intel, and now ARM. So four times. That's bonkers - like, and none of that stuff is backwards compatible and yet the web has been around for three quarters that long and everything's backwards compatible.

Obviously the newer things don't work.

But you know, you can load the Space Jam website from 1997 and it still works and it's beautiful and it should be archived forever.

But yeah. That's just near and dear to my heart and you know to think about just doing away with that 25-30 years of progress is you know... At first, I was not necessarily offended - I was just like taken aback. But you know it got me thinking of like - we still need to have some conversations like this because, you know, makes us invest in this more. And you know, if there's anything that anyone needs to do in their career, it's just get invested in it from a passion standpoint.

Steph:

So I think in summary of our discussion today, we would advocate that everyone takes a little more time to learn about the fundamentals that make up the Web so that we can all be better advocates for its future and have more productive conversations to move the web forward.

If you have any suggestions for topics to discuss on Word Wrap show, let us know by mentioning us on Twitter at @wordwrapshow.

Thanks for joining us on another episode of Word Wrap. Be sure to subscribe on your favorite platform, or pick up the RSS feed on wordwrap.dev. You can also catch us as @wordwrapshow on Twitter. Until next time!

Review the Episode 003 Notes