Trap or Trade-off? What small businesses should know before getting a website

Play Video: Trap or Trade-off? What small businesses should know before getting a website
Published:

Show Notes:

Here's the presentation slides. Below is the text version.

What Small Businesses Should Know Before Getting a Website

The website builders market was worth 3.06 billion dollars in 2025.
It is projected to reach 6.68 billion dollars by 2030.

Hand-coded websites have declined from 76% in 2011 to 33% in 2022.
They are expected to be under 9% by 2030.

58% of web designers have been in business fewer than 6 years, with 40% in their first 3 years.
This is a much higher “newness” rate than most professions.

Web design is the number one freelance skill (offered by 36%).
72% of workers in 2025 have considered a freelance side hustle.


Web Design Is Changing

WordPress dominates the CMS market with a 60% share.
Approximately 60% of WordPress sites use a commercial page builder.
Elementor is 30% of that.

Wix dominates the dedicated website builder market with a 45% share.

Wix reports that DIY builders account for 73% of active sites, while 27% are managed by “professionals”.
80% of active Wix sites are owned by small businesses with fewer than 10 employees.


Hand-coding Wins on Quality

The web was invented (initially for scientists) to make information-sharing around the world easier.
It used simple document tags so everyone could use it.

Seeing commercial opportunities, the “brochure” website appeared.
This advanced the web, but brought significant problems.


Understanding the Web

Mimicking print layouts involved complex code hacks, which made learning CSS difficult and led to the commercial WYSIWYG builder.

WYSIWYGs always fail eventually because, unlike print, the designer has no control over what the end user sees.
It depends on the user’s device and preferences.

It created a back-to-front understanding.
The web is not a visual vehicle into which content is added, but a flexible vehicle for content that can be visually enhanced.


HTML First

HTML is a website’s structural foundation.
It defines content and allows it to be shared and understood by people with disabilities as well as machines for search engines.

It is simple, yet over 90% of sites do not use it correctly.


Meet Paul Brown

Paul (a plumber) is one of the 25% of small businesses who did not have a website.

He contacted professional developers, but they were too expensive.
He tried DIY builders, but got confused.

A friend reminded him that a web page is only a document of content.
Start there.

Paul looked at his competition.
Most sites were an overwhelm of animations, stock images, and sales brags.


Paul’s Process – Part One

Paul decided his authenticity was his main selling point.

He looked up the basics of writing web copy, got a few photos of him working, and created a Google document.

He next found free resources on how to turn this into HTML, which he did with the VSCodium editor.

With a few lines of added CSS this was presentable, not well branded.


Paul’s Process – Part Two

Paul created a logo using a free Canva account.

For now, a one-page site is enough to establish his presence.
He knows he can get free hosting and uploads his HTML to GitHub where he can edit his site and collaborate should he need a professional.

Knowing his HTML is semantic, he gets an LLM to add CSS.
Knowing AI is not intelligent, he asks a CSS coder to check it.

He goes live!


Paul’s Site

  • Website URL
  • GitHub repository
  • Google Doc

Paul Learned

The web is a form of communication, not a funfair of carousels or a game of hide and seek.

HTML is the easy part.
Finding empathy and making the message clear and understandable is the hard part.

CSS styling can be easy if the HTML is right and the design is simple, but is best overseen by an expert.

He did not need a minimum of 5,000 dollars to get started.


Branding, SEO, and UX Design

Branding (The Soul):
The emotional, visual, and verbal identity that makes you memorable and fosters trust.

SEO (The Bridge):
The process of optimizing your site so search engines and users can find you easily.

UX Design (The Experience):
The structure and functionality that makes interacting with your brand easy, enjoyable, and efficient.


Brand Guidelines

  • Brand Story & Core Values
  • Logo Guidelines
  • Colour Palette
  • Typography
  • Imagery and Visuals
  • Voice and Tone
  • Formatting and Layout
  • Application Examples

Trap or Trade-off?

Trap

  • Vendor lock-in
  • The “90% done” problem
  • Performance and SEO limitations
  • Hidden long-term costs

Trade-off

  • Speed and time-to-market
  • MVP (Minimum Viable Product)
  • Budget and resource constraints
  • Standardized use cases (templates)

Research:

Transcript

[00:00:06] Nathan Wrigley: Hello there and welcome to the No Script Show. In our last episode, we talked about unification, how we are losing our agency to big tech, and how we might reclaim it through the indie web. Now, the indie web is popular with influential developers as well as hobbyists using platforms such as neo cities, yet its growth is considerably outpaced by commercial, no-code platforms that dominate the spaces where small.

And local businesses seek website advice. In this episode, we're looking at how these types of businesses might get a website that avoids the lock-in and quality trade-offs that come with no-code platforms. You can find our show notes and supporting resources over on the website. The URL for that is no script show slash 28.

So that's the numbers two eight. And if you're watching this on YouTube, the link for that will be the first comment just below the subscribe and the like buttons. And as always, I am joined by David Wamsley. Hello David.

[00:01:08] David Waumsley: Hello Nathan. yeah, so do you know what I was looking at? search results? I was, pretending I was, A new person, a new small business, trying to look for a website, and it was really quite stunning. I tried different search engines as well.

[00:01:24] Nathan Wrigley: Okay.

[00:01:24] David Waumsley: It was almost entirely all the things that I saw were almost entirely focused on getting us to adopt a commercial platform. There were either sort of ads to get on something for free affiliate content that was.

Given you the different options or indirectly, and I was checking these out. There were, web designers who effectively are upselling. The, builder that they used to clients had to go and check. 'cause they weren't saying, oh, I see, okay. Around this thing. So I checked on their portfolio and thought, yeah, and I really, HTML, the thing that powers all websites and belongs to all of us is now, I think it's concerning that it's now just increasingly falling behind a paywall.

So businesses, yeah, I think businesses have two basic choices. They still have these, which is either. I'm calling the corporate web where you are offered freedom from code for the price of locking, or you've got the indie web, which is offering freedom from locking for the price of having to wrangle some code and.

I think, well, you and I both know each other from builder communities, so

[00:02:35] Nathan Wrigley: Yeah, we do. Yep. Yep.

[00:02:36] David Waumsley: A decade ago I saw code or no code solutions, that kind of fair trade off between cost and quality. but I think as more builders seem to get, and ified and browsers allow us to do more with less, I'm changing my opinion on that, which is where this is really leading to.

And, I think if we to do it based on merit, you would expect to reverse in the trend. We'd expect more people to be talking about HTML these days, but we're seeing a wider division, so I think we need to look at both parts of web design. For this one, we need to look at the. Web, which is the technology that's needed.

So, and I think ideally we'd follow the W3C's role of lease power and start with what we can first achieve with a website using just simple HTML and. If anything, really, if there's a takeaway from this show, it would be for me that HTML, which is getting forgotten, is the web. And if we own our own HTML, then we effectively own and control our own digital space.

So we probably don't wanna give that away. prematurely. and design is the other bit that we should look at in web design, which is I think some of the appeal with a lot of the no code solutions is the templates. And even though that's the opposite of design, it's beats a blank page, which is what a lot of people who want a website is stuck with.

Really, how do I get started? So I think we'll need to look at this at, just ways to get an effective online brand. But first, shall we start? I've got a whole bunch of statistics me to read. Help Nathan. yeah, look, yeah, look at this, unregulated industry. We call web design, which isn't at all shark infested.

[00:04:32] Nathan Wrigley: Okay. So just before I launch into these, web design is changing statistics, just say, it'd be curious to poll the owners of websites. And so by the owners of websites, I don't mean agency people, the people who literally have paid to have the website for their business, for their whatever it is that they're doing.

It'd be interesting to poll those people and ask them what is their website made of. And I'm sure that the answer will, that will come out of their mouth, will be the paid for platform. That they're using. So, the Squarespace and the Wix and the page builder or whatever, whether it's WordPress or something like that, as opposed to, it's HTML and CSS that you, I just think it's been so wrapped up, commoditized, and, We're trying to get us back to something a little bit more, a little bit more straightforward. Okay. So with that in mind, here we go. I shall just read these four bullet points, some stats about the, changing nature of web design. First one is the website builders market was worth 3.8 billion.

Gosh, dollars in the year 2025 and over the next five years, that's projected to more than double. So by 2030 go up to $6.68 billion blind. That's interesting. Hand coded websites have declined from 76% in 2011. To 33% in 2022. And is, it is expected to be under 9% by 2030. So Wow. So I'm going from three quarters of the market down to less than a 10th over the next period.

That's interesting. Third,

[00:06:15] David Waumsley: just adds start something on that one that, that bit of research, it's all creditable. And I'll put the links actually in the show notes. but that one is actually before chat, GB. T came out and then we got all the vibe code and things. So yeah. Anyway, sorry. And

[00:06:31] Nathan Wrigley: that is trending south even more than, the 9%, which sounded pessimistic, but probably is rather optimistic.

Okay, so STAT three 58% of web designers have been bus, have been in business fewer than six years. 40% in their first three years, a much higher newness rate than most professions. That's also curious. And then the last one for now, web design is the number one freelance skill. Oh, I did not know that.

Offered by 36%. 72% of workers in 2025 have considered a freelance side hustle. Wow.

[00:07:10] David Waumsley: Yeah, so it, it's painting this newness, it's newness is an actual proper term, for how you measure industries and yeah, it's very high. I've actually got some more stats for you to read through this. The last ones here on the builders,

[00:07:24] Nathan Wrigley: oh yeah, sorry, there was a further slide.

I forgot about that. So three more. Here we go. so about WordPress. WordPress dominates the CMS market with a 60% market share. Approximately 60% of WordPress sites use a commercial page builder, Elementor is 30% of that. Wix dominates the dedicated website builder market with a 45% share. That's curious.

And last stat we've got is again about Wix. Wix reports that DIY builders account for 73% of active sites, while 27% are managed by professionals. 80% of active Wix sites are owned by small businesses with fewer than 10 employees. All of these stats paint a picture. Which is not ideal for the lovers of HDML

[00:08:15] David Waumsley: and css and certainly anecdotally, backing up what weeks are saying.

I know. from my time in the builder community, a lot of people were reporting, that they were getting more customers, the people just selling the sort of builder software. Were getting more customers that were coming from actual businesses themselves, DIY rather than the developer who was using it as a tool to, yeah.

But, sorry. I've got a whole long bit, which is my interpretation of these statistics, and they support what I think. I saw as somebody was originally a no co, sorry, a hand coder who, became an early adopter of page builders, how we met and, yeah, I was active in those communities. So initially when I, this, we're going back to sort of 2014, most of the people when I joined the builder that I did, were experienced coders who were adopting a page builder because of its main selling point that allowed for cheaper and quicker websites.

Builds for certain types of clients, and a way also for those clients to be able to alter their own content. And, but this was also at a time back then when CSS was really cumbersome. It was starting to change. We responsive sites were still new. We didn't quite have that. And when you could still find builders that weren't too bloated, what I noticed was fairly quickly that the page builder.

Peers that I had at that time changed to professionals, people who were making sites for people who were non coders. And they generally demanded more and more flashy stuff from their builder subscriptions. 'cause you're paying for that yearly. And I. I, I always felt uncomfortable because with less experience that these people had who were coming in, they were unaware of the sort of technical debt issues that you get and the UX issues that come from the types of requests that they were asking for.

But I also noticed that builders would have to keep adding them or appease them as otherwise their competition. Do that. So it's regardless really, because most of the people I know who started on that no coder route, have swapped their builders multiple times anyway. But I think most concerning for me, being in that sort of arena was that, What's really what entered the no code builder market were these sort of lifestyle gurus, if you like, business gurus who were promoting value pricing to get website clients to pay upfront the highest amount that they could get out of them really on the promise of results, and they encourag. New developers to reframe the no-code builder tools as professional tools that clients don't really need to know about.

So it always concerned me because effectively they were repackaging the skills that went into their software as their own. And then armed with, typically these gurus would give you sales scripts. They were able to charge more than what you'd have to pay for a coder and, Yeah, for me, we talked about this before and now.

Other podcasts that we were doing. and it reminded me of the South African Independent State website back in 2011. They were charged the equivalent of, $15 million for design and development of that site. And what they got was a $35 WordPress template.

[00:11:45] Nathan Wrigley: I remember I read that yesterday as I was preparing for this episode, and that is.

Insane. Such a bizarre statistic.

[00:11:57] David Waumsley: I know, and it, I mean it's seen as corruption in it, but to a value pricer, that's a good deal, isn't it? That the client got what they asked for. They delivered what they want. Yeah, exactly. That was the result they wanted. But for the rest of us, we think, that, it must have probably spent the more, they must have spent more time.

Writing and signing the contract than they did actually developing the site, but Right,

[00:12:20] Nathan Wrigley: right.

[00:12:26] David Waumsley: Yeah, but I think also, one thing to be aware of and you're not in those circles, is that enterprise and public bodies have long learned not to pay these upfront budgets on web projects because things need to change. You don't know how they're going to work out, and we have. Agile, which has been around, for what, nearly 25 years now, is the process that people adopt dealt where they start with the minimal viable product, the thing that they can first put out there, and then they improve it with ongoing iteration.

So effectively they're paying for it as results come in, which of course if you're. A value pricer, you want the money upfront and you promise the results. So, and I suspect really that the reason why we're seeing a lot more companies, DIY in it is because of the lack of trust that there is in the industry.

We can't trust, web designers necessarily to. To guide you in the right direction on this thing. So I think a lot of people are just moving to DIY, but this again, causes a problem. It solves the issue of not getting ripped off and they have more control, but with a lack of understanding of how websites actually work.

We just see, I think it's almost provable now that websites are generally getting a lot worse and owners are completely unaware of why they're worse, so, which is leading to us. Yeah. Yeah.

[00:13:49] Nathan Wrigley: it's, so, it's a self-fulfilling prophecy in a sense, because if, you are the. if, let's say you've got a, small business, there's a few of you running that business.

There's 10 of you and you're all heads down doing the busy work that you have to do to make that business work, and the website is just an appendage. It's just something you know, that you've got to have and then somebody displays to you, okay, here's the finished product. You're looking at it like a magazine, you're looking at it like, oh yeah, that looks great.

But with, how would you understand the process that the magazine had in order to be put on the shelf, all of the graphic designers that needed to be done, the, paper that needed to be ordered, the ink that needed to be ordered, and so on and so on All the things that make that.

the magazine possible. Well, it's the same thing in this arena. All of the things that will make it successful are the things which are hidden underneath that have got not, well, not nothing, but certainly there's a lot, there's many more layers beneath it than just what it looks like on the front end.

Accessibility, whether it's optimized for, search in the correct way, and so on and so forth. But, we've taught our clients just, there it is. Does it look good? Are you happy with the way it looks? Yep. Great. Sign the dotted line. We're done.

[00:15:03] David Waumsley: Yeah, I know. and in a way that's why, it's really mostly in Europe, but this is why we're having to see things like legislation for GDPR because what people aren't thinking about whether data's going, they're not thinking about accessibility.

So we've got new laws for that. It's happened to be enforced because websites are just getting generally worse on the whole.

[00:15:22] Nathan Wrigley: Right.

[00:15:23] David Waumsley: but let's just move, I'll just quickly, this slide didn't need to be there, but, there's nothing ready to read here, just a little. For those who are on the audio, it won't be meaningful.

But there's just a little slide that is showing the results of someone who tested a no-code solution or low-code solution. I'm lumping them together, element against using, hand-coded using Astra. So it's basically just HTML and CSS and it just shows there's a massive difference in the sort of performance.

So the sort of lighthouse scores that you'll get. Page speed from Google and everything, they're very low and the page size is what's 300? Sorry? 3,200 on this one where it's 180 for a Handbuilt site. So it's so much heavier. Than it needs to be. But I think, always hand coding is going to be on quality.

It's always been about the expense thing. there's, there are other concerns as well about accessibility, on the limited flexibility you get with no code stuff. So, and I think particularly those in the EU have to be concerned about the builders that they use now because of these things. Because even though there's.

for marketing purposes, most software will talk about their co compliancy, but they generally are not, they will sell where they are compliant, but they won't tell you where they're not really Right. Right. And most of it's a little bit like, lipstick on a pig. It's bolt on solutions to improve the performance or improve the accessibility.

Anyway, I'll move on. But I think really Okay. What, I wanted to say was just that I think most of us in the industry, and that definitely includes me, I've been caught up in this, I've tended to undervalue the unique reach of the web.

[00:17:32] David Waumsley: Okay. Yeah. I think most of us in the industry have undervalued the. Unique reach of the web, how easy it, when you've got text on the web, how it can be translated.

And we've reverted a little bit to knowing what we already understand, print, we understand visuals as a way of communicating on that. So we tried to recreate that online. But often in doing that, we've often excluded kind of billions of people with permanent, temporary, or situational disabilities over the time, so we're not watching out for that.

I'm as guilty as anybody for this kind of stuff.

Anyway, I'll, we'll move on. Let, I think we need to cover a little bit about understanding the web, so I'll leave it. You Nathan to read this?

[00:18:16] Nathan Wrigley: Okay. I'll just read what's there and then we'll hand it back to you. So, here we go. The web was invented initially for scientists, I guess over at CERN is what I'm guessing.

Yeah. You are thinking there to make information sharing around the world easier. It used simple document tags so everybody could use it. See in commercial opportunities, the brochure website appeared this advanced the web, but brought significant problems such as. Number one, mimicking print layouts involve complex code hacks, which made learning CSS difficult and led to the commercial.

What is what you get builders, which we were talking about earlier, number two, wizzywig. So what is what you get. Always fail eventually because unlike print, the designer has no control over what the end user sees. It depends on the user's, device and preferences. That's such a profound point.

And number three. This all created a back to front. Understanding the web is not a visual vehicle into which content is added, but a flexible vehicle for content that can be visually enhanced, nicely put. I like that.

[00:19:22] David Waumsley: Great. no, I think that's really, and definitely that's the way I see it because you started with the brochure site and the only thing that people are concerned about is how pretty it looks.

And then you end up, and we've just got so used to that and it's taken me, coming back to HML the second time round and, listening to what people said to realize that, well, everybody already knew that the visual. Website builder never worked in theory right from the beginning, but it has worked for limited time in practice.

So the first wave of these, things like expression, web and Dreamweaver, they died as soon as devices changed. As soon as we got the mobile web taken off and we got devices there, suddenly the way that you designed around visually around those pages didn't work for that. But

[00:20:09] Nathan Wrigley: Right, right.

[00:20:10] David Waumsley: There's such a delay because, they still made money because the majority of people still.

Thought that was the tool they would get to make the visual web and would be unaware of the people who were damaged as a result of the way they're making their websites. So, it took over a decade for these to close their shops. There were still money being made on it, and I think the present ones are having to deal with a similar thing because we now have over 2000 different unique view port sizes to deal with.

Yeah. All new

[00:20:37] Nathan Wrigley: nty, that's a naughty. Statistic.

[00:20:41] David Waumsley: I know. It's it's incredible. We've got so many different devices and so many new user preferences. We've got black and white screens and all this. So hence, I think people in the industry are realizing, you'll see a lot of the builders are now pivoting towards, code 'cause a lot more other long term no coders have realized that they need to learn some codes, so there's more of that or AI or both of these.

But I suspect it's a little bit like the gold rush where more people sold. Solve the shovels at the end of the gold run when there's nothing to get that we're, we're peak. This is the way markets go. We're peaking. So all these planned where we think that builders are going to be in the future, how they're going to take over is based on the projection and the peak we're on at the moment.

I think things will have to turn around, but rather than blame the builders, I think we, we have to look at it. Realistically and say that the real problem is the HTML and CSS, that it, even though it was given to us for free, for us all to be able to use it, didn't meet our expectations, at least as sighted people who are what we wanted from the web and as an open language, that only progressed.

Based on the cooperation of everybody in the industry and big players in that other browsers and those browsers at war with each other, it was slow to adapt. And I think why we've seen a sudden change and why really this show has been created because of the fact this change is the fact that we now have browser interoperability agreement between the major browsers that they're going to work together on this.

And as a result, since about. 2018 HTML and CSS has advanced more in a few years than it has in all the previous dec decades. Yeah. So, yeah, so I think, the real point of that one is if we want resilient sites now we really need to start to turn around that original mistake we made of seeing things as visual rather than something that's content that we can make visual.

we'll need to start putting HTML content first in it. I've got

[00:22:46] Nathan Wrigley: you have indeed. So this one labeled HTML first, which is obviously what you were building up to. Nice segue. three bullet points here. HTML is a website, structural foundations. I hope that you knew that, dear listener or watch. if you didn't, there's a lot of Googling to do, around the letters HTML go and have a fun time with that.

it defines content and allows it to be shared and understood by people with disabilities as well as machines for search engines, it's simple, yet over 90%. Of websites do not use it correctly. And I would go back to your point earlier, David, when you said, maybe a fourth bullet point here is it's totally free.

Yeah. It's just completely and utterly free available to everybody. You just need to learn it. yes. Bits of it. So over to you.

[00:23:36] David Waumsley: I know. Well, the name doesn't help, does it? Hyper architectural markup language doesn't.

[00:23:40] Nathan Wrigley: No, not really. I never thought about that. That's true. It's a rubbish name isn't It?

Ought to be given some sort of, slightly more, I don't know, user pronounceable, less intimidating name. Simon.

[00:23:55] David Waumsley: like that. Well, actually, yeah, his. His products actually since the thing that, Tim Burnes Lee's been working on. I've gotten friendlier names, but, but I, like what, Bruce Lawson calls it.

He is one of the, early people, web standards and he calls it How To Make Loveliness.

[00:24:14] Nathan Wrigley: Oh, that's nice. Yeah, I love it. I love that. I love it. Okay. Right. Anyway, we wound you up. No go.

[00:24:24] David Waumsley: Yeah, there's a few, there's lots of statistics out there, but Web Aim does a yearly look at the, I think, top million websites.

So in. 2025. This is relating to the last point about over 90% of sites are not using HTML correctly. They've got it as 92.8% of websites still use non semantic div based layout. So basically it's HT ML, which isn't making sense of the content, but it's there for styling and they also. Come up with a figure that 73% of accessibility issues could have been resolved with proper HTML markup language.

Now, this is so simple stuff, but the problem is we've been focused so much on the visuals that CMSs and builders are really where the problems found, because that's where everybody's concentrating on the visuals and not what the content is and how it's marked up on there. Yeah.

[00:25:19] Nathan Wrigley: Can, you remember 15 years ago or something, you would go to websites and the whole point.

Of the markup was about getting the pixels to go in the places like, you'd wrap everything. You'd put a div round a div, and then a span here and a bit of, CSS there, and there was no consideration whatsoever to the content. It was purely about making it look nice that was like the whole point of HTML was how it looked.

And, and we forget that literally isn't the point.

[00:25:51] David Waumsley: Yeah. Yeah. And, really it's so simple. If we get h tml right, then we are largely getting accessibility for free. We get better. SEO, we get performance all around. That's better. And actually it makes it easier to make sites attractive as well if you use the right markup.

It actually, so in future episodes, we will, we're, gonna go step by step with the process of creating some different types of small business sites. So we're gonna. Keep going through this sort of process, but here, just to give an example here, obviously this is mostly audio, so we can't cover too much.

We're just gonna start with a simple example of a minimal viable product website. So again, I've got a slider for you.

[00:26:33] Nathan Wrigley: Oh, here he is. Meet John Brown. No, it doesn't even say that. It says Meet Paul Brown, so I can't read. so there he is. He is a plumber in Lincolnshire by the looks of it. He's a, chap that needs a website.

So here's our sort of MVP, the, let's set the stage for what's gonna happen here. So Paul Brown Paul, who is a plumber. Is one of the 25% of small businesses who do not have a website already. So he's, primed. He is ready to go. He wants to be on the web. He's got a business. He contacted a professional, some professional developers, but they were too expensive, so he decided I'm gonna try a DIY builder.

But that was all very confusing. bear in mind, he's busy, he is got other things to do and his skillset is not necessarily being online. He wants to do plumbing for people. So a friend reminded him that a webpage is only a document of content. Start there. So he looked at the competition.

Most sites were overwhelming in their animation, stock images, and sales brag. I dunno if you wanna say anything before we move on.

[00:27:39] David Waumsley: No, I'll move on to talk about what you did. Yeah,

[00:27:42] Nathan Wrigley: yeah. So I'll, shall I just read these out quickly? Yeah,

[00:27:44] David Waumsley: yeah, please.

[00:27:45] Nathan Wrigley: so he decided that his authenticity was his main selling point.

So we're stepping away from the markup and the HTML. He's just trying to figure out what it is that he wants to do. By the way, that is the point of it, isn't it? It is that when you, want a plumber, you don't want a plumber's website. You actually want some person who's gonna show up who is actually credible and who knows how to fix leaks and put pipes into, plumb toilets in and basins and bars.

That's what you want. so he looked up the basics of web. Writing web copy. Got a few photos of him working and created a Google doc. He next found free resources on how to turn this into HTML, which he did with the vs coded editor. Should that say code? But let's go with code. Is it vs. Coded?

[00:28:35] David Waumsley: well I tell you, I swapped that one because I've studied you vs.

Coia, which is vs code without Microsoft being involved, so.

[00:28:42] Nathan Wrigley: Oh, interesting. Okay, well let's go with that then. vs. Coia editor. And with a few lines of added CSS, this was presentable, not well branded.

[00:28:52] David Waumsley: another slide.

[00:28:54] Nathan Wrigley: Okay, here we go. Paul created a logo using free, a free Canva account. He's doing all right, isn't he?

Considering how Yeah. How busy he is. for now, a one-page site is enough to establish his presence. He knows he can get a, some free hosting and upload his HTML to GitHub where he can edit his site and collaborate should he need a professional knowing his HTML is semantic, he gets an LLM to add CSS.

Knowing AI is not intelligent. I'm just gonna repeat that. Knowing AI is not intelligent, he asks the CSS coder to check it and he goes live. He's doing very well, all the while on the picture. Still busy underneath the basin. Right over to you. I guess we've got three things here. Website, URL, GitHub, repository, and Google Docs.

I'm guessing they're the three things that he really needed to get himself up.

[00:29:42] David Waumsley: Yeah, and I think we'll just need to pause and we'll bring up my screen, so we'll look at his work. So we just pause a second.

[00:29:49] Nathan Wrigley: I'll pause it back in a sec.

[00:29:51] David Waumsley: Yeah, so here is Paul's site. It's not gonna win any awards, but, as a sort of a job he could do himself.

It's there, it covers all of the main things he's. Main, call to action is over here. So what he did initially was that he got some web copy tips, which was right for scanners, not readers, focused on the benefits. go for clear rather than clever, no fancy words. Try and build some trust on it.

One action per page and consider some of the keywords, but don't stuff it. So that's basically the advice he got. And then all he did was get a few of his photos that he could add here. And followed that started with the most important stuff on the top and. Pretty simple and then he could turn that into H TM L.

Now there are various courses and I've put them, actually, lemme just go over to here where he's got them on GitHub, I've put them over here. Couple of resources for anybody wants to do that. It's a great four hour video, which really goes into everything about HML. Probably you could do two hours of this.

And one hour in fact of this. And you could probably know all that Paul needed to know. and there's HTML for the people, but anyone can do that. And this is on, that's such a great name for a resource, isn't it? HTML for the people. I love that. I know. It. It, and it's. It really is about what this is about as well.

trying to get people to reclaim it and use it as a, tool that they can use to, enhance their own lives as Paul is doing over here. what else do I want to mention? So I mentioned that I should mention the, particularly as the last episode we were talking about vibe coding and the use of ai.

So this was AI did it, he did the, the. Code, and let me just show you that first. Actually, if I go in here, okay, you can actually, because he's uploaded it to GitHub, and GitLab is an alternative to this, which I'll probably be using more often. And if you go in here, so Paul could work this way, create his H TM L, upload it to here, and then collaborate with anybody when he needs a professional.

So if you need somebody to do the coding rather than. Relying on AI to give him some CSS help. He could do that. And it's quite simple 'cause once you've done it here, you've also got an online editor. So effectively it's like having your own little, CMS really. So if I just go into here. I can just quickly show you that the code is simple.

Now there is literally about as simple as you can get with this. There are no CSS classes in this HTML. Let's just see if I can, there, it's coming up there. oh. Everything's collapsed here, so that's okay. Only really? Yeah. So what is missing? When we were talking about, what we are saying is that very few people are using the proper.

Tags to mark things up. And you've got, you put, obviously you need a body else, nothing shows up, but you use these headers for the header area. They're the main area and then different sections, he's got over that in his, and then the main and then the footer. simply having these basic things is enough.

And when you use something like VS Code or vs. Codem, which are the same thing, it's pretty easy to write. So when you want to write anything, you'll write in a paragraph. You put P here. You just tap here, it gives you the tabs you write in there. So anything like this was pretty easy for anyone, I think, to understand.

there are a few more things about how to add in images, but again, you get guided with something like this. You've typed image, it starts to give you the code. Yeah. When it's so uncluttered like that. When it's just so bare bones, it's so, yeah. it's, to call it human readable is a bit of a stretch.

[00:33:36] Nathan Wrigley: I'm sure that for some people, e even that is too much. But I would imagine somebody with a, with an hour of application, most people, many people would be able to just look at that and say, okay, I get how this has worked. I get how the nesting affects things. I get that if you put things inside of other things, that has an impact on where they will be viewed and so on.

It. Yeah, really nice and simple. And I think actually, when you think how difficult it can be to learn a page builder and a UI to get to HTML to change, if Paul had just got somebody to write his HT ML phone and he kept it simple like this with, that wouldn't work if you wanted.

[00:34:16] David Waumsley: To rely on a framework like Tailwind or something, which crams the HTML full of all sorts of instructions, how to, lay out the CSS. But if you keep it here, there's no classes in this, at all. So you can read it. So I think anybody could go into the section that they needed and go, oh, that's a paragraph.

I want to change the text here, or I want to add. So again, so if he wanted on his design here to add in this new little, details and summary thing, 'cause he's got something else he wants to add to it. Well, it wouldn't be too much hard work for Paul to come in and go down to his details and just take this and copy it.

Create a new one. Yeah. And then change it. So I think it's as simple as a page build out when you keep it like that. So that's really what I wanted to show on this. is there anything else? Oh, I'll just show you just for interest, I think on this. So. I'm not a big fan of AI being used anyway, but it's a tool that can be quite helpful if there's expertise behind it.

And obviously Paul doesn't have that with it. So I think if you got something AI generated this, you would definitely need to get it checked out. But I did do, and I'll just go onto inspect so you can see them quickly. There are in here, but just go to the head. There are a few other styles. So something you might do if you did a HT ML course anyway.

Oops. Let's just click in this so I can get to this. If I just go and. Change this to style here. you might get told this is just a few lines of CSS just to center this and give it a background. That's what you get with Hasty Mel on its own with really very little styling. Yeah. Yep. What I did, so anybody could probably create something like that.

I did get, various ais to do different versions of it. So another one, which is okay, wouldn't have said keep it simple. Is this one. Which just basically made it look a little bit like a website over here. Pretty much the same thing. Okay. That's, and then I said, yeah. I said, why not do something a bit crazier?

So I said, okay, give us a brutalist look of modern brutalist look. And, if I can get this to change. I was gonna say, can you, all you can't do is get your mouse in there. Here's the car. Yeah, there you go. It. If I go to three, we will see We've got, oh, now actually, sorry. You'll see this is buggered up and, sorry, I'll put it on dark mode here, which I wouldn't normally be in.

It looks fine like this and quite interesting what it came up with. But here's, I put this in and I didn't change it on purpose, just to show you that if somebody came in dark mode, this is what it gave us. You wouldn't be able to see. Yes, I saw that there was, there was, you can't the text. The text, wasn't it?

[00:36:55] Nathan Wrigley: Yeah. There you go. Yeah, so ai, is not something you would want to trust. And I did one final one, if I can just get to it here, which is not very interesting, but I'll show it anyway. there we are. Just one. I said give us a sort of. Old fashioned newspaper. Newspaper, yeah. Newspaper feel, that's right.

Yeah. Yeah. So he did that. So, but, the ones that was there, but they will AI on this one generated and needed. So if Paul went to and had to pay somebody, they would probably only charge an hour of their time if that, to be able to correct something. Very simple because it works in this case, rather than vibe coding.

[00:37:34] David Waumsley: 'cause usually vibe coding, what you're doing is you're losing control of the HTML. You're saying Create me this whole thing and it will not give you some anti HTML by default. It will give you a sort of bunch of styling with divs and it'll probably use something like Tailwind. Whereas if you've got the HTML set up and it's meaningful, everything's put into.

Has a meaning to it. This is the head of stuff. This has got a proper meaning actually with the content. It gives it quite a good cue. good idea what to do. Yes. Anyway, I think that's probably all wanted to show. It was just to show that you could make a fairly simple one page, which I think. Given what given.

I actually looked at Paul's competition would be around and I wasn't, inflating it. When I say most of the sites that you'd be competing against are just a blur of animations and boxes all over screaming for your attention, salesy nonsense. I think I'd probably go with this simple site to pull over any of those.

[00:38:33] Nathan Wrigley: So he is got a fighting chance right out of the gate just by doing it, making it simple. Isn't that interesting? Yes. For a morning of really working out what he wants to say as his message and then turning that into simple HTML and that. Yeah. So yeah, that was it. I think I'm done with this. We'll go back to our slides, so we'll need to pause again.

Okay. I'll pause the video and we will return in a moment. Okay. So here are some learnings that Paul has had, after his experience with HTML. the web is a form of communication, not a fanfare of carousels. Or a game of hide and seek. I like that description. HTML is the easy part. Finding empathy and making the message clear and understandable is the hard part often overlooked.

That's interesting. CSS styling can be easy if the HTML is right and the design is simple, but is best overseen by an expert. And finally, here's the important bit for Paul, at least anyway, he did not need to spend a minimum of $5,000 to get started. Over to you, David.

[00:39:35] David Waumsley: I know this is probably what's prompted this.

There's so much in this sort of builder industries about people you know, particularly with the value pricing that you know, they're not sensible. Don't need a website unless they can spend all of this good money on the whole thing, but actually just get something help. is the Yeah. The way to go no cheaply.

[00:39:55] Nathan Wrigley: but also it's like such an impediment, maybe if, you're starting out in business, if Paul has just decided to become a plumber, he doesn't have 20,000 pounds burning a hole in his pocket, he needs to make the first 20,000 pounds so that he can employ somebody to take over his website if that's what he wants.

So, exactly.

[00:40:14] David Waumsley: And it's the minimal viable product. He's got a very simple one column thing, which says all that. It needs to say probably easier than most of his competitors do, and then he can expand on that. there was a little thing I didn't mention on it, which I think is the way that perhaps, with the indie web going is that.

It. He is, he had a little slot where he is doing sort of bathroom redesigns and that which he does with somebody else. And I think there needs to be a lot more of that where people start to promote each other in their own trades, in the same way that I'd expect, if we're going to compete with things like b bookings.com than hotel, people are gonna have to team up, I think, and promote each other in different places and say, well, they have a good one in a different location that you might wanna check out.

Yeah. That sort of thing. Yeah. So I think, that's the way. Future, the future of the web as far as I'm concerned. Anyway, sorry, let me just go back on this. So we've really focused on just the technical side, the web bit, the HTML and what you can do with that. Keeping it simple. But there are other aspects of course, and that's the design thing that we're talking about, which again.

Any client has to get involved with, regardless of, the technology that's used anyway. So we'll move on to the sort of design bit and,

[00:41:26] Nathan Wrigley: okay. Yeah. So now we're moving on. I guess we're approaching the end. So he's He's finessing things now, really, isn't he? So this is more about branding s.

CO and UX design. So branding, which you've put in brackets, is the soul, the emotional, visual, and verbal identity that makes you memorable and fosters trust. I suppose that once, once you've actually reached the page, that's the bit that is gonna convert you into. Into one of Paul's customers. However, in order to find that page, you need a bit of this, SEO, which is the bridge as you've described it.

Oh, I like these. The process of optimizing your site, so search engines and users can find you easily. And then finally, UX design, which you've called the experience well. This is the structure and functionality that makes interacting with your brand easy, enjoyable, and efficient.

[00:42:18] David Waumsley: Yeah, and I think Paul, he obviously is made up and he's done it instinctively.

So he's recognized that he is the brand and he's shown a photo of himself right at the front, because guess his competitors, even the ones with the, who are by their name, they are the brand. There's no photo of them. It's the first thing they're gonna want to know. So he knows, he's kept the, web copy, simple and honest.

He's used, SEO friendly semantic, h. TML all the way through that's gonna help him anyway to be found. Whether it's with, Google or whether it's with now ai, both of them want semantic HDML, which is missed by people and he's put keywords in his titles. His design was kept simple. So there's none of this kind of fairground antics left to, Move around things to find your content all over the place. And it is designed with the AI still gave him some consistency in color and spacing so it doesn't jar with people on that. So he's there. But perhaps a better way to start for him would be to create a sort of comprehensive brand guideline document and.

this is something I'm gonna stop doing 'cause I never did. I used to skip over this and I've got another slide. You do? Yeah. Maybe you'll read out. Yeah. Okay. Maybe you'll read out the key things in that.

[00:43:30] Nathan Wrigley: Yeah. So, brand guideline again. Yeah, I'm with you. I never did this kind of stuff. I just either adopted what they already had or ignored it altogether.

So, it's made up the brand guideline. It may be made up of some of these following things. Brand story and core values, logo guidelines, color palette, typography, imagery, and visuals. Voice and tone, formatting and layout and application examples as well. Okay.

[00:43:56] David Waumsley: Yeah. And I would also into that I would add, some SEO keyword research and competitor analysis.

So when you're starting this, so it might be a better way to start. And honestly, I used to skip this, because of the fact that most of the time you're getting people to sign off on a, if they had no branding at all, you're getting them to sign off on your website. So you'd create my website. I've come to realize this is problematic with, for myself working out that we must start with HDML and we must start using the modern techniques of making the design fit around the content.

So you, are effectively needing to design a little bit in the way that the browser works rather than in a set rigid image. So what a brand guideline does, I think it's good for a lot of things because. What it does is, well, it sets out why a website is being built, so most never formalize why they're in business at all enough to be able to convince other people to buy from them.

So, so they tend to fall back on cliches, he could have done where family run businesses, blah, blah. Just the same stuff here on every page because they don't know how to do it. And I think. That's the bit that I think businesses do. And that's where I think there's tensions often when they get designers in.

'cause it's very difficult for a designer to do that unless they've been able to go through that process. the other thing is, I think this is key for me, still doing the designs, is that it allows you to get the look and feel without setting these absolute. In what your website should look like, so you get the sense of how the brand looks because in making one of these documents and you can borrow them, which already nicely beautiful.

The. Branded anyway, so you can steal a lot of their stuff, but you get your typography, your colors all in a document anyway, so you get the look and feel of what a website might look like without pinning down that this is the absolute size of the header and this is this box for this bit of text here.

It gives you that ability to be able to start to style around the content. Rather than the other way round.

[00:46:01] Nathan Wrigley: Yeah,

[00:46:02] David Waumsley: which I think is the wrong way round. This is what we need to change now for our whole industry has been based around the idea of, look at our portfolio. We're gonna make your website that looks like this, sign off on this, and then we have to force the browser to work whatever device is put before it to honor this.

And that's what causes much of the problems that we have with the designs not being very good. So, so you do lean into

[00:46:27] Nathan Wrigley: a particular tool to get. Those kind of brand guidelines you are using, I dunno, Canva or something like

[00:46:32] David Waumsley: that?

[00:46:33] Nathan Wrigley: yeah.

[00:46:34] David Waumsley: I think, we'll do this, we'll go through these in next episodes and Canva's the one, I started when we did some earlier ones using Figma, which is more, I guess the professionals use.

But Canva, if you were trying to encourage people to do it for themselves a little bit or show how they could. Pre prepare, even if they get a professional in later with getting the stuff Canva's much more friendly because you can do lots of stuff, create your logos there. style your photos and, cut and paste them and that kind of stuff.

[00:47:03] Nathan Wrigley: Yeah. So, yeah.

[00:47:03] David Waumsley: But yeah, and I honestly, I think this is where we missed that. We know they, we've talked about this before about the longstanding issue that we have. If you are a designer with a client where you present something, so that. Meal comic where it shows this process, which is very memorable.

Where it shows, yeah, the client and the new designer laughing at the old one going, yeah, that's rubbish. And then he comes and crates and they say, yeah, it's brilliant, but just one thing, change it, and

[00:47:31] Nathan Wrigley: on

[00:47:31] David Waumsley: it goes and on it goes until you get the mess. Well, I think if you've got this sort of stuff there, everybody then works around a framework.

It works around a framework of. Gets to your core values, what you're trying to do, what's different about you, to your competitors and what reflects it. So at least you've got some, it reduces the likelihood of it going awry and everybody hated each other.

[00:47:54] Nathan Wrigley: Yeah.

[00:47:54] David Waumsley: So,

[00:47:55] Nathan Wrigley: yeah.

[00:47:55] David Waumsley: Yeah. So that's it. So that's really what we're going to do next time.

Shall I just, I think

[00:47:59] Nathan Wrigley: Final slide. Final slide. Yeah. Okay. So I guess we're summing it up here. So at the beginning. Trap or trade off, came up. So here's the, here's the two different things summed up the trap in all of this, I guess would be, vendor locking. What you're calling the 90% done problem performance and SEO limitations and hidden long-term costs.

Do you wanna do, you wanna dig into that a bit first and then I'll do the trade off bit?

[00:48:25] David Waumsley: Yeah, sorry. obviously the vendor lock-in is what I started with the 90% done problem. You still see people talking about that often with the AI now about the fact that it gets you 90% there and then it's such a nightmare.

Getting

[00:48:38] Nathan Wrigley: the

[00:48:38] David Waumsley: final 10% The system Yeah. That it takes more than final

[00:48:41] Nathan Wrigley: 10% is actually the 90%. Yeah,

[00:48:43] David Waumsley: exactly. Exactly that. And obviously we know about the performance in SEO limitations that come with anything else that's third party on there that's not custom and the hidden costs. And the next things are what are commonly the trade offs.

So do you wanna read those? Yeah. Okay. So,

[00:48:58] Nathan Wrigley: speed and time to market. MVP, minimal, minimum viable product budget and resource constraints and standardized use cases. So for example, templates. So over to you.

[00:49:09] David Waumsley: Yeah, so people say, it's fine because if I need speed, I need it to market quick.

If I need just something that is a minimal viable product, then you know, it's okay. A builder again, if the budgets are low, this is good. And, if you've got standardized use case, maybe. In most cases, if you were running a shop, they have a similar format, a template where you might just borrow one of those and that's fine.

But when it comes to talking a real message, I think it's a bit different. But what I would argue, or what I hope I've shown partly through this, is that most of the things that we now accept as trade offs are largely illusional when it comes to the simple sort of small business side, which is powered by HD and CSS.

It's no. It's no quicker to use a builder. I'd say slower now. the way that CSS and HTML got a lot easier, to, so the builder's not saving you, I don't think on anything. Time to market.

[00:50:04] Nathan Wrigley: Yeah.

[00:50:05] David Waumsley: A minimal viable product. We've just shown one. So you could probably do that without having to have a builder, and the budgets are not there.

Really, I think overall, given that many people who are selling you a website. Using a builder, a non code builder are going to charge you probably the same as a coder would to come in. I don't see there's a saving there and standardized use cases, unless you ask something like e-commerce, if you really want to get over your personality, you want to design that for yourself.

It's gotta be your words and what you think is most important showing and that needs to be semantic there. So, so what I've argued is that basically most of the trade offs that we accept for simple sites are really ought to go into the trap. Category, really. There's

[00:50:49] Nathan Wrigley: Okay.

[00:50:49] David Waumsley: Unless you need to. Yeah. there's no reason.

No, I think that was,

[00:50:53] Nathan Wrigley: yeah. Sorry. Go on.

[00:50:55] David Waumsley: no. That was it. I, it was just really, it's just about not getting more than you need following that rule of lease power. If you can start simply with HML, do that, and then you could always upgrade. It's difficult to downgrade.

[00:51:09] Nathan Wrigley: Yeah, that's right. I think you've made a fairly compelling case.

Obviously, we laid out the case of all the things that you really need to do, and in many cases they are very limited. What you actually need to do is, very small amounts of things. It doesn't need to have whizzbang, this, that, and the other thing, just something like, like the website that we saw there for the plumber, whose name I've already forgotten.

Was it Paul Forgotten? It was Paul

[00:51:33] David Waumsley: Brown.

[00:51:34] Nathan Wrigley: Yeah, they go Paul Brown. that's all that person probably needs. you can take them on a journey after that, after they've got their first few clients through the door. And, so yeah, I think you've made a fairly compelling case for that, David.

[00:51:48] David Waumsley: Okay. Thank you. And, I think, you know what? What we've done and we all fall for it. we see, builders, produce lots of really wizzy stuff that looks great and you think, ah, that's gonna show me off so much. But it really, most of the time, it just gets in the way of the user who needs the information and it causes them problems.

But there's also one other point I think when it comes to local businesses, if you are one of them. Why not just give your business to another local, somebody who works with HDML and CSS? 'cause I'm sure the tech billionaires in Silicon Valley are not going to starve without your data and money, so,

[00:52:23] Nathan Wrigley: good point.

Good point. also just leading into what you just said, when was the last time you hired somebody Because they had a flashy website, and the answer is literally never. It's because. The, what they say speaks to you. Yeah. It's not because there's an animation. The animation never sold anything to anybody.

Never. So, keep it simple. Stupid. Yeah. As they say.

[00:52:50] David Waumsley: Yeah, exactly. So next time I think, we'll just do some hands-on. It'll probably be over. We'll take one site, maybe we'll take pause and turn him into a bigger site with a new design and we'll go through this hole.

Branding exercise, which is quite new to me, and we'll see how that works out. we might have to do it as a visual only, because I dunno if it'll work on audio, but I think that's what we'll do next time.

[00:53:13] Nathan Wrigley: All I can say is I hope Paul's paying you $20,000 for this. David, he's getting a lot of, he's getting a lot of free work and you're giving him a lot of value.

So value pricing, no, that's the antithesis of what we're talking about. So I guess. I'll stop sharing the screen unless you've got one more slide. I see there is one more slide. No, but we probably,

[00:53:33] David Waumsley: yeah, that's, no, that's just a print out for our thumbnail.

[00:53:36] Nathan Wrigley: Okay. Ideal. In which case you'll see the last slide in just, well at the beginning of this video on the thumbnail.

Yeah. we will see you back here soon when no doubt Paul, the plumber will receive some kind of update to the website that they've already got. Okay, David, nice to see

[00:53:52] David Waumsley: you. Thanks very much. Yeah, you too. See

[00:53:53] Nathan Wrigley: you soon.

[00:53:54] David Waumsley: Bye. Bye everyone.