WDD LIVE 028 – Web Design Critiques, Quick Tuts, and Q&A

More about this video

Join me LIVE every Wednesday at 11am Eastern for in-depth web design and development critiques, plus spur-of-the-moment mini-tutorials based on our discussion!

WANT TO GET YOUR SITE CRITIQUED? SUBMIT YOUR URL AT https://geary.co/critique-application/

Through the critique process, you’ll learn tips, insights, and best practices for things like:

  • UX Design
  • UI Design
  • Technical SEO
  • On-Page SEO
  • Copywriting
  • Content Marketing
  • Conversion Optimization
  • Offer Strategy
  • Technical Development Best Practices w/ DOM Inspection
  • And more!

Video Transcript

Hello, hello, hello, everybody. Welcome back. Another episode of WDD Live. When you arrive.

. . Whoa, whoa, whoa, what are you doing in the background? My gosh.

YouTube, always trying to just hop into the stream. Okay. Ruben is in the house. Andrew, Derek, Charlie’s here, Peter’s here.

I did not send out an email today as I normally do. So the only people that will be on this stream are the real OGs of WDD Live. Sheldon, good to see you. Albert, Jaroslav, good to see you.

Okay, I will do a quick little round of updates while YouTube algorithm goes and collects a few more viewers and brings them in. Quick one, well the obvious one, Automatic CSS 2. 6 dropped yesterday. Very big update.

A lot of substantial workflow improvements in 2. 6. A lot of substantial Gutenberg improvements in 2. 6.

And more importantly, or I guess to coincide with that, tomorrow I’m doing an ACSS live stream. This will be over on the Automatic CSS and Frames YouTube channel. If you’re not subscribed to that channel, highly recommend it. Even if you’re not an ACSS or Frames user, we are going to be doing some, we’ve already done one of them, a real page build.

We’re gonna be doing more real page builds with Automatic CSS just so everybody can see the process. We’ll be doing them on that channel over there. So it’s just good to be subscribed and to keep an eye on things over there. But if you are an ACSS and Frames user, absolutely you wanna be subscribed to that channel.

So that’ll be tomorrow, ACSS 2. 6 exploration of all of the new features live on the channel. Good morning Kevin, good morning Tobias, good morning Steve and D123 and Cello and Daniel. Paul is here.

Excellent, excellent, excellent. Justin says he’s currently watching on his phone while they get our power back on. Okay, so that So that is the first announcement. Second announcement, the automatic CSS, the new automatic CSS website is getting very close to being done.

I wanted to release that with ACSS 2. 6, but we still have a few things that we need to button up. And then there’s also actually a bug in the latest Bricks update that affects autoplay videos. And I have a couple autoplay videos on the homepage because they demonstrate some of the features.

And those are not autoplaying. So, you know, that’s a problem. So we’re gonna have to maybe wait on a fix for that, or I may have to just try to downgrade it, I don’t know. But I still have a couple other things to button up anyway.

I’m excited about getting that new site out. And that new site is going to also be the gateway into finalizing all of our official documentation for automatic CSS and some other goodies that we’ve got planned in the future. So, and we’ll do a walkthrough of the new site. So as soon as the new site is live, we’ll do maybe on a WDD Live, we’ll do a walkthrough of the new site and talk about some things.

Okay, I think that’s it. That’s it for announcements. Let’s go ahead and dive in. We’ve got two websites to look at today to critique.

We will do some Q&A as well. In fact, I have a hard stop in 90 minutes. We cannot do a marathon today. Okay, we can’t do the marathon WDD live today.

Hey Siri, set a timer. She’s not even here. Look, Siri’s never here when you need her here. Hey Siri, sometimes I got to yell at her.

Look, she’s still not, it’s, she has no idea what I want. Hey Siri, set a timer for 90 minutes. Okay, it did it. She’s still not talking.

I don’t know, I, she mad at me. I don’t know what Siri’s got to add it to today. Okay, when that alarm goes off, when that timer goes off, we have to stop. All right, got a hard stop today.

So we will do these two in-depth critiques and then we will take as many Q&A’s as we can fit in. Let’s get to it. I don’t even know, let’s see what screen we’re gonna be sharing today. Screen share, okay, yeah, that’s the right one.

That works. Okay, so we’ve got tier one copper. We’re going to be doing our no scroll test to get started. So I see IOCG experts and leaders in mining exploration.

Together, we are unearthing future possibilities. Get in touch. Okay. And I see in the background, we’ve got some excavators and such doing some work in what appears to be a large mine.

Okay. So I get it, it’s a mining company. Tier one copper, I don’t know what IOCG is, but I imagine that in this industry, people coming to the site probably know what IOCG is. But it says it right here, and it says it right here and though it’s actually in the logo I don’t know what that is so let’s go IOCG iron oxide copper gold okay all right well makes sense now there’s not much else to look at here so let’s go ahead and I mean I guess I we could just take a minute to talk about the font choices.

I’m not sold on this font pairing. Let’s say that. I’m not sold on this font pairing. I don’t, and I definitely don’t like this font.

I don’t think this font fits like a mining company necessarily. This is a very like techy, codey kind of font, right? Doesn’t seem to really match up with mining all that much. All right, I’m going to go ahead and you know the yellow color is nice and vibrant.

So that’s good. I’m going to start scrolling down. Unearth the potential. I’m also not sold on this boxing of some keywords here.

What do you guys think? Drop your, remember this is an interactive experience, you know, WDD Live. So you get to put in your own opinions. Unearth the potential of IOCG deposits.

Not the most captivating headline. Discovering IOCG deposits is, are you trying to rank for IOCG? Because it’s starting to feel a little SEO-ified if you get my drift. Dismentioning IOCG like every three words.

The value of IOCG, IOCG deposits, IOCG deposits, I don’t know, I’m starting to feel a little, it’s encroaching on the readability of the of the copy. Discovering IOCG deposits is more than just unearthing minerals, it’s about unlocking opportunities. These deposits rich in iron or copper and gold are catalysts for growth and prosperity in the mining sector. At Tier One Copper, our advanced exploration techniques and industry expertise will turn potential into profits.

Partner with us and together we’ll transform IOCG discoveries into tangible success for your business. Very corporate copy. And I have something to say about that in just a second. We will come back to it.

This, this photo, does this photo do anything for anybody? Not so sure. I don’t, I don’t think, uh, I don’t think it’s doing anything for this section right here. I mean, you’re, you’re really talking about, well, yeah.

Yeah. It’s, I wouldn’t say it’s doing anything for me. Exploring excellence in iron, ore, copper, and gold deposits. We specialize in developing targets for IOCG mining opportunities.

Okay, so this is really what you do right here. I was trying to get to that, right? But well, I don’t know. Do you specialize in developing targets?

Because up here you said you have advanced exploration techniques. I don’t know, I guess maybe that coincides with finding targets. With our advanced geophysical modeling capabilities and a team that brings over 240 years of combined industry experience, we’re exploring for excellence and helping our clients do the same. I touched on this last, I don’t know if it was last live stream.

I don’t even know. I do too many live streams and videos to remember where I said such things. But this is one of my biggest pet peeves in copywriting, in marketing. And you’ll often see this in law offices and stuff.

A lot of maybe technical fields that are team-based almost. But it’s this idea of combined experience. It’s, this has never made sense to me ever. What like, never has it made sense.

So and I’ll just prove this to you now. Let’s say you have an industry that is two years old. So the industry itself, like AI maybe. Now I know AI is, just follow along with the example.

Don’t dig too far into the details. Let’s just say that AI was two years old and I assembled a team of AI specialists. And each of those specialists had two years of experience. They’ve been studying AI since AI existed.

We’re just pretending that AI has only been around for two years. So do they have 20 years of combined experience in an industry that’s only been around for two years? I’ve never understood this combined industry experience thing where you just take as many people as you can hire and then add all their years up together. Shouldn’t it be like a, like a, an average, right?

Like what’s the average experience of somebody on your team? Oh, well, the average experience of somebody on our team, in that AI example, is two years. Like, you know, it’s that’s relevant. Okay, you don’t get to add everybody up and then be like, Oh, yeah, we have 8000 years of experience.

It’s just Yeah, it’s anybody else? Is that a pet peeve for anybody else? Because, you know, it’s the same like, like a law office, for example. They’ll have like eight lawyers, and it’ll be like, well, there you go, 240 years of combined experience.

It’s like, none of y’all have been doing lawyering for 240 years. If I had one person who actually had been doing lawyering for 240 years, and then your team, I’d pick that one person, because they have a lot more knowledge than y’all do, because y’all are just adding these numbers up as if that means something. Okay, let’s move on. Anyway, I just never use this.

Never use this combined industry experience thing. I stay away from that. Ixnay on that. Alright, we’re going to come back and talk about this copy, because it’s very nebulous, very nebulous copy.

Specialists in IOCG discovery and development. Founded with a vision to revolutionize the mining industry. Our team has been at the forefront of IOCG discovery and resource development at a local and global scale. Our journey began, okay, let’s touch on this because we’re starting to see a pattern emerge.

We’re looking for, I look for patterns in copy a lot. And one of the, you know, there’s not a lot here with the design, you know, it’s very basic, right? So we can focus on some other things perhaps, like the copy, we can go into a little bit more detail here. One of the rules of copy is that you wanna talk about the target market more than you talk about yourself.

And we call this like you focused copy instead of me focused copy. You want to write you focused copy, copy that’s focused on others. You don’t want to write copy focused on yourself. And so we come down here, we start at the top, right?

We’re, all right, and it’s experts, that’s, they’re talking about them. This is me focused copy. We’re experts, we’re leaders, we’re unearthing future possibilities. There’s nothing speaking to them, the target market here.

And then we come down here and you talk a little bit about the opportunity, I guess, but then it’s right back to at tier one copper. Hey, don’t talk about you too long, we got to come back to talking about us, okay? Our advanced exploration techniques partner with us, right? We’ll transform, all right, and then we come down, we specialize, this is the pattern that we’re seeing, it’s like every section of the page has been made into an opportunity for me-focused copy.

Like, hey, let’s talk about how great we are, let’s talk about how awesome we are. And this is not this is not an approach that really connects with the target person, the target visitor. Our advanced geophysical modeling we’re exploring, and it just keeps going, right? We’re founded with a vision to revolutionize our journey.

We have grown, right? It’s just like, literally every section of this page is like, we’re fucking awesome. Okay, like that’s all you need to know. You don’t need to know what IOCG means, you don’t need to know about really our advanced technology, you just need to know that we have it, we’re awesome.

Like there’s no real details here, but we’re just, by the way, did I tell you we’re awesome? Because we’re pretty awesome. That’s the general like gist of the copy. And that’s, by the way, you know, this is not nitpicking, this is probably the number one copy mistake that is on like every website And and if you turn copy production over to the client 99% of the time you will get me focused copy they will just Every paragraph will be about how awesome they are And their history and their favorite color and their cats name and everything else nothing that really matters to the target visitor, it’s just a big celebration of the company and the person.

And this is why you wanna avoid getting copy from clients because it’s always like that. And then you wanna, if you’re not getting copy from the client, you wanna avoid making that copy for them because it doesn’t work. Transforming research into results, prospects, sales, and promotion. We use cutting edge tech.

There, man, it’s every, every turn. It’s like, we cutting edge. We’re just, we’re awesome. We don’t just find opportunities.

We create them. Tier one copper currently holds numerous exploration licenses covering da, da, da, da, da. Okay. All right.

Project, I’m going to click on project generation. What’s the over under on the, that the sentence starts with we or us or something else. Okay. We can start taking bets.

Through proactive exploration, our project generation service involves identifying, inquiring, promising. So we can do a whole, we need to do like a masterclass on how do you rewrite me-focused copy into you-focused copy. We could do, that maybe should be an inner circle training. We could do an inner, I’m gonna make a note here, my phone.

Let’s make a little note. I think that would be a beneficial training, because that’s a very practical thing. You can take, because the me-focused copy might be, you know, talking about some legitimate topics. The problem is it’s just me-focused, and we can rewrite it to make it good.

Where’s my notes app? Here we go. Okay, let me just make a little note. All right, so we’re doing inner circle training on rewriting me focus copy.

Okay, I think that would be good. All right, good. Exploration project management. Our comprehensive project management services ensure your exploration projects are completed on time.

OK, we’re going to go here. We employ exploration is a complex process that requires careful planning execution. Our exploration logistics. OK.

Partner with pioneers. Hey, did we mention we’re fucking awesome? Did I? Did we mention that yet?

OK, we are. Our tailored services, deep industry knowledge and commitment to innovation. OK, proven record of discovery events. Okay.

All right. You see how it gets a little tiresome. Our success. Our success.

We don’t need to talk about you right now. We’re talking about us. Don’t interrupt. Okay.

Because we’re fucking awesome. We need to keep telling you how awesome we are. Our expertise in advanced modeling. Okay.

This is just how it starts to come off. Right. I’m just, you know, this is for entertainment purposes. I’m not actually saying that this was what they were trying to do just letting them know this is how it starts to come off okay all right all right got some you know I don’t know this is a one-page website yes okay so one-page website all right that’s fine then I would like to see some people.

You know, I would like to see, can we put some faces to the names? That’s always good. Let’s, let’s take a look at this from a, uh, let’s, let’s shift away from copy and just look at visuals. Now we see cold gray dirt.

We see dirty equipment, more dirt, more equipment and dirt, more dirt, lots of dirt, big dirt. It’s just where are the people? Where are the people? Okay, so here’s a number one rule of imagery on a website.

We’ve already violated the number one rule of copy, we might as well continue to violate other primary rules. And a primary rule is that people connect with people. And so if you show people, you know, it’s it’s likely to be more successful. And you know, this so you can show dirt and all this but show workers, you know, where are the people at?

I don’t see any people. And then down here where there was an obvious, where is it? Obvious opportunity to show faces and human beings. We didn’t we didn’t capitalize on it.

There are no faces, there are no human beings here. So I would say if you can at least at minimum, get some photos of these fine people right here and add them to the grid. To low hanging fruit opportunity to show some humanity, right? Ready to unearth the potential of IOCG deposits.

Yeah, I think a lot of these headlines need to be rewritten a bit. You know, I’m not honing in, I’m not able to hone in on, who is your target market right like what kind of company is is the target market for this? This would be a great like example of how to take here. Here’s what was given Now let’s do the master class the copy and messaging master class.

It’s in the inner circle if you guys don’t know about that Let’s let’s go. Let’s hop over here real quick This is one of this like this is one of the most valuable thing. I mean there’s a lot of valuable stuff in the inner circle let’s but this is like one of those that’s It just it’s it’s so so tremendously valuable. Let’s go into Let’s see SEO training Agency training I Think it’s in discovery.

There you go offer messaging masterclass this right here. Okay, it’s got a PDF that comes with it. It’s almost a 90 minute masterclass on how to get your copyright, get your messaging right, get your narrative right, make sure you’re hitting on all the important things. And if you do this training, not only are you going to be able to really help your clients in this regard, but you’re going to get paid to do this with them every single time for every single client.

I mean, we’re talking about adding thousands of dollars in revenue just by adding this as a deliverable at the front of your process. So you’re going to make more money if you follow this. Your clients are going to get better results. And by the way this doesn’t just apply to their website.

If they’re running ads it’s going to apply to the ad campaigns that they’re doing. It’s going to apply to literally everything that they’re brochures. Everything that they do that is messaging related, this is going to influence and impact and they’re gonna love you after you do this masterclass with them because it’s gonna be very enlightening and eye-opening, number one, as to what they’ve been doing wrong with their messaging in the past, but also a lot of the opportunities that they’ve been missing out on that they can now capitalize on. So this is a perfect example of a website where we can go from like just corporate, boring, me-focused nonsense to very impactful copy and messaging that actually connects with the target person.

So I would say to take that step as the next step. Okay, I think we’re done with this one. I mean we could look at, you know, everybody does say, they keep reminding me, they’re like, you never look at the mobile. You never look at the mobile.

All right, well, let’s look at the mobile a little bit. I mean, we don’t really have to, you know, on a lot of sites, there’s bigger fish to fry. I mean, it’s what you would expect, right? All works.

So there’s nothing crazy going on on the mobile device. The one thing I will say, I guess, that I didn’t mention earlier, I don’t know that I would do tabs here, or if I did tabs, find a better way. Like the tabs are gigantic, you almost never see the tabs being gigantic and the content being small. It’s always the other way around, right?

Like the tabs should kind of be small, and the content should be the focus, like when I click on the tab. So this feels a little off balance here. Balance here But again, you know, it’s like there’s not a lot of information here so This was almost like feels like a situation where it’s like well I mean, why did we put it in tabs? Well because I could because I there’s a tabs element.

I figured you know tabs would be Something a little different. It wasn’t like well We put it in tabs because it’s a lot of manageable information and we didn’t want to make the page gigantic You know by not using tabs. This was just situation gigantic You know by not using tabs. This was just situation.

It feels like well. Well we could use tabs So we use tabs, but it wasn’t like tabs were necessary for this situation and if tabs aren’t necessary I wouldn’t use them because General principle is don’t hide content from the visitor. This is all hidden content Sometimes you have to when there’s too much content, and you really need to put all that content into like one focus section there’s just no way around it so you use tabs or accordions or something like that but if you don’t have to hide content then don’t hide don’t hide the content. Alright that’s enough of that one this is going to be our second one for today.

We haven’t done this one yet right I was trying to remember I was like did I I just looked at it briefly when it got submitted? I’m pretty sure we didn’t do this one. Drop in the chat if you anybody recognize this site, have we done this site before? Or does it just feel familiar to me because I looked at it and you know, so I’ve seen it before.

I’ll wait to see. Also, does anybody have any questions? You can drop any questions in real quick. We’ll do a quick Q&A, a little break, before we go on to website number two.

I also want to look at some comments here that are strolling in on that website. Too much text in people cards without paragraph breaks. The people are mining. They don’t have time to be on the website.

Too bad most people can only quote story brand talking points, but don’t actually listen to what the author is saying. A lot of people are good at repeating talking points, but ignoring it in practice. All right. The yellow does not always match.

Hmm. Were they using different shades of yellow? I didn’t notice that. Doing a search on the page for we, our, you, your is very interesting, yes.

Story brand framework is about you, you, you. I mean, you know, StoryBrain was not the first to come up with the idea of you need to speak to the actual target market and not just talk about yourself. Companies love to talk about themselves, but it’s the biggest mistake. Yep, yep, yep, okay.

I’m so glad Kevin reads this out. I can’t see anything on this tiny, oh, yeah, you’re on your phone aren’t you now that you pointed out okay that was back to there all right Oh Steve says yes we did it okay all right let me see if if we did that one let’s take this I’ve got too many got too many things going on all right listening to music all right Alright Listening to music. Alright, so what we’re gonna do here now, come on bring this back over here Let me go into my drive. Let’s find I’ve got another one lined up because I was like maybe Maybe we did that one I just got to go into the correct gmail account here.

Alright, so we’re gonna do We’ll do one agency site. It’s been a while since we’ve done an agency site. So I found that this one was submitted. All right, let me get my chat back up.

Okay, so we should be able to see this now. Somebody said increase readability and make sure there are enough paragraphs, preferably every four lines. Question, how do you know when to use more than one page? I’ve been building sites for service-based businesses and I can’t find a reason to use more than a homepage and a contact page.

That’s actually a very, very good question. Daniel has another question as well, which is, which are the best practices on using background videos? Okay, well, let’s, Ruben said looks new, but Derek said we saw it. Suzanne says, no, we haven’t.

All right, I don’t know. Nobody can agree on whether we’ve seen that site before or not. It’s Manny’s site. I think Manny’s here.

Manny, are you here today? Have we done that site, Manny? Let me know. Okay, when do you use background videos?

Best practices on background videos. So, I try to avoid background videos at all costs. It’s just, it’s not a great thing. It’s too much motion most times.

It’s obviously adds to the load time of the page sometimes tremendously. It’s not usually relevant to the visitor. It’s just for like an aesthetic. You can’t put relevant content really in the background video because nobody can hear any audio associated with it.

And it’s not like they can control the video either. They can’t rewind it, they’re auto-playing. So it’s just, it’s for aesthetic, it’s like, all right, do we want the page to load longer and do we want a lot of motion? And then it’s like, you’re putting text on top of it, is the readability affected?

There’s a lot of challenges with it. And it’s just not worth it, in my opinion, for the benefit, whatever benefit there may be, it’s just not worth it. You can do something else and you know get the job done. So I tend to avoid them.

All right so let’s do Nolte Music’s question now. How do you know when to use, this was a good question, more than one page? I’ve been building sites for service-based businesses and I can’t find a reason to use more than a home page and a contact page. Well the one, the number one reason to build multiple pages for a service and you use the service-based business as an example.

The number one reason is SEO. You’re not going to rank a one-page website in a competitive niche. That’s just plain and simple. Ok the home page may rank for you get like one term one target term make the home page rank for it probably possible but it’s a service-based business.

As you said, I imagine they have more than one service. If they have two services, three services, four services, five services, every service needs its own page. Every service is gonna have its own target term and its own group of target terms. You need to go after those by creating a dedicated page for that service.

So by default now, we have a homepage and we have a page for each service. Then you’re gonna need a services overview page to kind of provide a menu to link all of those pages together. And then now that we’re creating multiple pages, you might as well make an about page. So now there’s an about page in the mix.

You might as well make a dedicated contact page. Now we have a dedicated contact page. And then maybe that service business operates in multiple service areas. That brings us into service area pages.

Now we need a directory page for all the service areas, and every service area needs its own individual page in order to rank for a target term in that area, or multiple target terms in that area. And so suddenly it was like, I can’t find a reason to do more than one page, well I just gave you a reason to have maybe a 20 page website for a site that just had one page a minute ago. And by the way this is when you structure you know sites like this now this it all comes down to affordability. So let’s talk about affordability because even though we could create 20 pages doesn’t mean our client is can afford 20 pages, doesn’t mean that our client can afford 20 pages right now maybe they can afford 20 pages but they can’t afford 20 right now so maybe we build we have to tailor and this actually came up in the in our inner circle class yesterday so we were doing a live stream off monthly office hours in the inner circle and we talked a little bit about this but pricing when But pricing, when you’re on the phone with somebody and you’re trying to figure out what this person can afford and you’re using price bracketing and things like that, maybe we decide, okay, this person can afford a $5,000 website.

For me, that’s one page. That’s one page. We’re getting a one page website for $5,000, okay? We can’t do any more than that for that budget but we can get you started.

We can get you a one-page website. Now is that website going to rank your business? Well like I said we get one target term, we got that one page, maybe we can get it done. But if SEO is important to you, we’re obviously going to need a phase 2.

Now phase 2 can come later on down the line. Ok, what can we do with that one page right now? Well it turns out we can still do a lot of things with it, not SEO related. We could do PPC campaigns all day for that one page.

Maybe we tack on a little hidden landing page that nobody can see for a specific PPC offer. That’s always a possibility too. And we can get you a lot of business just with PPC and a main page and maybe a hidden PPC landing page. Okay.

And then we can get you results and we can get you growth and all of this. And then when you’re ready to move into phase two we start taking a look at how to break this one page website into maybe a seven page website now. So now we have an about page and a contact page and five services pages and now we’re actually starting the beginning of your SEO right and then phase three will happen at some point. Phase three is going to be all about that service area page network so that we can actually start to dominate in these different service areas.

So see how we have somebody on the phone. Now, that’s if they can afford $5,000. If they can afford $15,000 or let’s just say let’s just say $10,000. So they can afford $10,000.

Well, they can get started right away with the home page, the about page, the contact page, all the services pages, copy for all that, okay, and then that’s where they’re starting. If they can afford more let’s just say 15 we’re just making up numbers 15,000 now they get the home page the about the contact all the services pages and they get all the service area pages all to get started right so you’re able based on deliverables to tailor toward their budget if their budget is only 5,000 we start phase one one page website. Oh budget 10,000 look at that Well, we can do the eight page website or whatever it needs to be based on how many services that they have Oh your budget’s 15,000. Oh good We can do all of this all at once and launch it and then we can start managing it going forwards Okay, so that’s how you’re tailoring the offering.

So just because a website needs 20 pages doesn’t mean they all have to be done now now. Do whatever the person can afford now and then build additional phases later and everybody wants to talk about things like recurring revenue and things like that. You know this is recurring work. It’s not like a subscription, ok, but it’s recurring work.

We do a phase one and then later on we’re going to do a phase two and then later on we’re going to, maybe I’m working for this client for a full year and there’s gonna be some breaks in between the phases. So you have one client that you’re doing work for for an entire year, getting revenue all along the way. It’s a good model, right? Everybody wants to just, oh, what can you afford?

And then it’s like a one and done type situation. Like, oh, you can only afford a one page website, that’s where I’m gonna build you and then we’re never going to talk again. I feel like that’s always the method that people follow or something. I think the number one thing we have to communicate to clients is websites in the modern era are like a living breathing thing.

It’s not that we finish it and launch it and then nobody’s allowed to touch it. No, don’t go near it. Don’t go near it. It’s done.

Okay, step away. It’s done. I don’t know, that seems like clients seem to assume that. You know, like clients always like, they want everything to be perfection before it goes live.

It’s like, you know we can edit this like at any time, right, like it doesn’t have to be like, oh, wait, wait, wait, we’re still waiting on the perfect copy. No, it can go live and then we can just edit it. I mean, that’s a possibility too. But also I see when people are selling projects, they tend to sell with this mentality of like, no, I gotta sell them on everything they need right now.

Why? Why? They can’t afford everything that they need right now. Just sell them on what you can do right now to get them started, to get them going in the right direction.

And then we can do phase two and phase three and phase four and five and six and seven and maybe I’m doing work for them for the next five years. If I’m good and I’m getting them results and I build trust and all of this and you want to plant that seed in their head you want them to know hey this is something we’re going to be working on all the time I mean a real website look at any legitimate marketing website that’s doing SEO is doing PPC that’s doing all the right things these are actively managed websites these are websites that are constantly updated these are websites that are constantly iterated on. They are doing split testing. They are doing, they are running new campaigns.

They are creating new landing pages. They are doing offers and da da da da da da just keeps going. They’re always doing something with it. They’re using it as an actual tool.

Too many of our clients are stuck in the in the mode of brochure website. Thank thank you for the shiny brochure that you gave me. I’m gonna let it sit here for the next three years. Why?

Why are we, why? That’s not how this works. That’s not how online marketing works. The brochure needs to be doing things.

And we need to be doing things with the brochure. We’re not just building a brochure and just letting it sit here and like checking the box. Your clients need to know that. If they know that, things need to be happening with the website they’re going to ask you a very important question what should be happening with the website and when you answer the answer is always some sort of deliverable oh well SEO or PPC or Facebook ads or a TikTok campaign or YouTube or whatever more offers split testing we can go down any path pick any path that you want to go down.

But if you’re in the mindset of, if your client is in the mindset of, I need a brochure website, and you’re in the mindset of, I build brochure websites, you are not doing your client a service, and you’re not doing yourself a service, because you’re going to be stuck in that mode of, I just do a project and then I move on to the next person. I do a project, I move on to the next person. Where it should be, I do a project for this client, and then I keep working with this client on that project as long as I possibly can to do as much stuff for them as I possibly can. Then it’s going to work out better that way.

Okay hopefully that answers the question in detail. Let’s do this site and then we’ll do more Q&A to wrap up. So this is workb. design.

So I’ll tell you right off the. . . what’s the cursor doing okay oh look look the cursor gets stuck over there all right hmm let’s just play with the cursor all right nope you can’t get me nope all right I does anybody do do people like these cursors what are your thoughts let’s just get a group opinion group opinion on my on the cursor here I like I do find it interesting that the yellow dot at the end of work be is the yellow cursor dot You know, I’m making that little connection right there, but I want to see what people think about these interactive cursors I’ve got I always feel like it’s a mixed bag, right?

But I will say this. Where’s my annotation tool and annotate. Here we go annotate screen You’ve got a lot, oh dear, that’s the wrong tool. You’ve got a lot of white space going on right here.

And it’s not doing anything for you, and it’s also not even. So that white space is not equal to this white space right here. And so it’s just kind of a little pet peeve of mine. You’re way off balance with your white space.

And, you know, this is I can’t select the text like, Oh, this is like animated to. I don’t know. It’s like, why do you have an animated cursor? Because I can?

Why do you have an animated hero heading button? Because I can. It doesn’t seem to be for any purpose. It’s just for like, it was a setting, it was a setting I could turn on or something and so there it is.

But I feel like this is stacked too much, right? And then the word vision being capitalized when nothing else is capitalized. Not sold on that. And then we will build your vision on the the wrong way because unless you’re in some sort of industry where the client knows what the hell they’re doing their vision is the last vision that I want to execute on most of the time.

99. 9% of the time the client’s vision for a website is the last vision I want to see executed on. So we’re starting off by basically saying, this is, this I would say maybe is, this is the classic headline of a pixel pusher, okay? It’s like, hey, you got a vision, Mr.

Client? I’m ready to push some pixels around the screen. Just tell me, tell me what to do. And so we’re immediately with your hero, it’s like, I’m just gonna step out of the consultant role here and defer to you, Mr.

Client, and just tell me what we need to build, and that’s what we will put together. So I don’t know about that, I would rethink that. I think you’re deleveraging yourself right from the jump. You don’t need a, oh, I don’t know about this.

What is this, interaction? This is not interactive, this is not a link, this is not, it’s just things, just wow. The cursor’s like getting large and it’s acting like I should be able to interact but I can’t interact. You don’t need a website, you need a high performing website, okay?

These two extra words make all the difference between a visit and a sale. High performance in a website goes beyond just its appearance while a visually pleasing design first thing. I would like to check here Let’s go to Just because I don’t want to forget about it. Let’s bring up some polypane Where is all right polypane you taking like three business days to open all right, it’s over here.

Oh I’m glad I didn’t open on the screen I’m sharing because it’s the new automatic CSS website. We don’t wanna show that yet. Okay, let’s bring this over here and scroll down. Okay, it does pass.

I was wondering if that was gonna pass. It actually does quite well on the contrast. Sometimes it’s hard to predict what’s gonna pass or fail on the contrast color checks. It doesn’t like, I don’t, I think that label is, no it doesn’t like that.

That makes no sense to me. It makes no sense how this small light text on dark background is passing but the large white text is failing. This is why we use the tools I guess. I don’t know, I feel like it’s calculating that color wrong or something.

Okay. I just wanted to give it a quick little check. All right. While a visually pleasing.

. . Let’s all read this because we’re all in this industry and let’s just all grade this copy together. High performance in a website goes beyond just its appearance.

While a visually pleasing design is important, it also involves other elements that can contribute to its overall success and effectiveness. Your website can be a powerful tool for attracting and converting customers through the use of strategic design and marketing. A well-designed website can establish you as a trusted authority in your industry, while an effective marketing strategy can help potential clients find and engage with your business. If you want to stand out from the competition and have a website that generates leads 24-7, let’s connect and discuss your goals in a complimentary 30 minute call.

Book a discovery call is the call to action, which does work as a link, but there is no indication other than that, you know, I don’t get the little hand thing. Your cursor is kind of blocking me from realizing that that’s, I mean, it is a button, so it’s kind of obvious. But let’s point out the big disconnect though, because there is a big disconnect between this. Okay.

And this. So it’s like, here’s why design is important. Here’s why a well designed website is important. Here’s how here’s here’s how data like all this like technical stuff about like, if you want to be successful this is what you need to do and then a minute ago you were like well we’ll just build your vision on the web you see how there’s just a major disconnect right there it’s like which one are you doing are you building high-performance websites that are well designed and have all this stuff baked into it or are you building the clients vision I’m a little confused, okay?

So that’s why this whole hero situation, just scrap, rework, rewrite, okay. The other thing I will say is, I mean, I’m almost, I almost got a full screen of White Space. Like that is a lot, that’s a lot. I understand what you’re doing, you know, like you want them to see maybe a section of content at a time, okay?

But, you know, it’s a lot. Oh, gosh, oh, dear. All right, well, we’ll talk about that in just a second. All right, so we’re coming down here.

This is testimonials, what our client says. There’s a little typo there about our work. And, hmm, oh, wait a minute. Is this supposed to be a carousel of some sort?

Because there’s no controls for the carousel, but I can drag this as if it’s a carousel. And there’s only one testimonial. Maybe that’s because you only have one testimonial. I don’t know.

But this is not. We have. Don’t don’t don’t. You’re bringing me down here with all this white space.

And I finally arrive at the testimonial section. It’s like I just got one for you. Just just one. Just one.

That was a lot of scrolling. It’s like a lot of, you know, build up to one testimonial. You know, I would expect to see definitely if you’re gonna and especially if you’re gonna have a carousel here. I mean, we’ve got to have more things in the in the carousel.

All right, I’m gonna keep scrolling. See how Oh, see, it’s I’m not doing anything. It’s just it’s going to do this as I scroll, it’s gonna start me on a horizontal journey to our process.

Discovery call, okay? Design phase, build phase. If there’s any accessibility experts in the house, I do believe this is not accessible. Launch phase, fairly certain on this.

It may be, I don’t know, I guess it depends on how it’s structured. Oh, this is oxygen. Interesting. Okay.

It’s, it’s, where did that? Oh, here we go. Spect. All right.

And we got a lot of divs going on here. Okay there’s a card so I guess yeah I don’t that’s that card. Does anything change? Okay the are the others in sections of their own?

Man this is it makes it really hard to inspect when it’s like that. I’m guessing that that’s another one off screen that we can’t see. So these are not semantically, if each one is in a section, which I gather it is, because this says section one, ID equals step one, the others don’t have an ID. Yeah, these are not sections of content semantically.

You also have your sections inside of a div, which are inside of another div, which are inside of another div. So I think, you know, we’ve got definitely some DOM issues going on here at the minimum. Mm, mm, mm, mm. Our process is not a div.

You have an empty div. Empty divs are always fun. And we’ve got H1s just tucked away in here. And now, so I’m now seeing, I guess, every card has an H1 heading in it.

Let me make this a little bigger for everybody. I can zoom in a little bit too. Oh, that’s too much. Okay, what are we, what, oh gosh, we have another, is this another, no, this is another one.

I wish I could see this. I wish this was on the screen to see what we’re looking at. You’ve got two H1s in the same card. Not to mention they shouldn’t be H1s at all, but you’ve got two H1s in the card.

And then all of this text is in a div. This should semantically be a paragraph. So a lot, lot of DOM issues here, lot of DOM issues. And then I’m also looking at, let’s see, where is the actual section so you have an ID on here but there’s really no class on here of controlling the card let’s go back to the card that we can actually see and inspect that real quick all right I can see build phase let’s inspect no no it scrolls away scrolls away when I try to inspect it it doesn’t want to be inspected I don’t blame it I don’t blame it honestly if I look like that under the hood, I wouldn’t want to be inspected either.

Okay, well now launch phase is floating out here. I’m gonna refresh the page, I don’t know what has happened. All right, let’s go down. This is just kind of a, I don’t know, you’re like forcing the user into this crazy interaction.

I’m not sold on that section right there. Okay, about us, we create, oh, we, we. Can we do the we focus copy test? We.

Okay, down here you actually had you focused copy. Look at that, you don’t need a website, you need a high performing website. This was the best content section and it’s kind of obvious why, right? You’re talking about you, you, you, you, you.

And actually what matters to the person. Everything else though kind of talks about we. We’re a team of professionals. What can we see you?

You know, can we, can we see you? Our team is made up of talented designers who work together to create visually stunning solutions for our clients. We believe in the power of collaboration and strive to create a positive work environment where everyone can thrive. Gosh, this is like the most corporatey corporate.

Like every, every bit. So let me go back to, if everybody can say it and everybody does say it, don’t say it. Don’t say that thing, all right? Yeah, it doesn’t mean anything.

Like, all right, yeah, collaboration, great. It’s just like buzzwords. Like, let’s check off the buzzwords collaboration got it positive work environment got it everyone can thrive got it we take pride in relationships got it okay like it’s just check check corporate speak check got every it’s like there’s a quota for how many how many corporate terms we have to use and feel good nonsense whether you’re looking to refresh your website create eye-catching graphics or elevate your brand’s visual identity we have the experience and expertise to help you achieve your goals thank you for considering us for your design needs. We look forward to working with you and helping your business thrive in the digital world.

Okay. Portfolio, CRWorks. Okay, we’ve got another little interactive thing here. I’ve seen these before.

Again, not a fan. I mean, it’s cute. It’s cute, right? But it doesn’t do anything from a user experience standpoint.

It gives me a little preview of the link, but you should have given me the preview just in a thing I can actually see. Like you know a grid would have been just fine. Yeah, so we can click on one of these maybe. It wouldn’t allow me to open it.

See because of the cutesy nature of it, I can’t open it in a new tab. So it has deterred the user experience, right? Like I wanted to open this in a new tab I didn’t want to stay in the same tab. So I tried to right-click and because of the cutesy effect I’m not allowed to open this in a new tab so that would be a Downside to that from a user experience standpoint Okay, and this takes the person to the actual website, which I wouldn’t really recommend doing I would maybe have like a case study page for that and take them there.

Okay, how much longer do we have? Oh, we’re still we’re still all right on time. I do I do we have four minutes and then we’ll we need to do q&a. Let’s get started contact.

Okay, a modern creative agency. We got a little lazy as we got to the bottom. It’s just like, hey, all right, let’s get started. A modern creative agency.

And then we got a simple little footer here. Alright, so we’ve done a little bit of a DOM inspection. Let’s check out the navigation. Alright, I got a little full screen nav action here.

It is a simple navigation. Hmm. Okay, it’s basically a one page website. So everything here is going to be an anchor link.

I didn’t see any FAQs though. Oh, yeah, see, you have a link in your nav to a section that does not exist. So that is something you can definitely work on. And this is a separate page.

I don’t, oh, dear, okay, let’s go back to the contact. Let’s talk about that for a second. So I’m looking for, and I’m supposed to select one of these I don’t know that every Potential client is going to realize what needs to happen here, especially because these are like gigantic flat like, you know bullet things And because the cursor, you know is a little distracting Okay, so they click here. What’s your name?

Liam Stonebridge? Well, that’s what that’s what I wanted me to type That’s what it that’s what it suggested for me. What happens next? What’s your email?

Okay. All right. Let’s do name at workb. design.

And then your message. Okay. So we have like a multi-step form. Does it need to be?

No. Why is it? I don’t know. Because we could.

Thought it was cute. But you know, a regular form probably would have got the job done there. It’s kind of like, you know, that it’s gonna be a discussion of, is the art getting in the way of the user experience? And to what degree is the art getting into the way, in the way of the user experience?

Some of it’s a little subjective, I guess. For me, I would just, I find that the straightforward things usually have the best user experience and the best conversion Outcomes the more fancy you make it the more hurdles you put in place the more cutesy you get with it You tend to see the conversions drop a little bit Definitely something to test though. Definitely something to test Okay, so to what are here? I’m gonna read some comments about this website.

I Admit, I like the orange spot animation. Okay. Kevin’s suggestion, Hans Zimmer-esque inception sound for the board. Oh, oh, the Hans Zimmer-esque inception sound for the board.

What’s the inception sound? I don’t know. I’d have to look that up. You can, you feel free to send me any sound clips that you want.

Like, you know, we got the little Kevin Hart. We got the womp womp. We got the, oh, pause. We got, like any, if you guys have a good idea for a sound effect that you wanna see on WDD Live, go ahead and submit it.

Just send me the little audio snippet. I’ll plug it right in. Scott McKay says, too minimalist. Cello says, corporate, blah, blah, blah.

That contact button is too dark, says Derek. Tobias says we 47 times you 36 times ratio 1. 3, but I don’t know if that’s good or bad value. Was that on this website right here?

That was surely is this website right here, not the last. The last website we saw, I would say we 8,000 times and you like maybe once. You can never have enough h1 tags. That is true Div section although design is minimalist those moving parts produce a lot of distraction in my opinion, okay Don’t see any accessibility there.

I was just about to say it was developed with oxygen builder. I’m disappointed There isn’t a single hexagon anywhere as well I would use a yellow background CT. Yeah. Yeah, I think I think so let’s inspect this real quick and just take a look at Is it me or did this footer get white all of a sudden when I when I inspected the page?

What’s going? Whoa. Whoa. Hey, whoa.

Oh, is there like a What is that what is happening here, I don’t know what’s going on with that let’s let’s leave that alone. There’s something, something has been set with a viewport height on here and it’s causing massive problems now. Because now I’m shrinking the viewport height and the website is just losing its absolute mind. It’s auto-scrolling, I’m not even doing half of this.

All right, let’s inspect this button. Button, button, button. Oh no, no, no, no. Oh no, no, no, no, no.

See, this is where you gotta bring out the Kevin Hart. I mean we’re just dropping this is a button I mean a button is a button is a button is a button is a button this should be controlled with a one CSS class it’s a solid button there ain’t anything fancy about this one CSS class on all of your buttons gets the job done this one’s got a manual height of six rim put on a lot what is going on there what is happening there we don’t need this height of six rim the background color is set at the ID level for this one instance of this button it’s got a margin top of three rim on it oh dear oh dear you making me clutch my pearls right now I don’t know I don’t know what’s why why what’s this one got going Please tell me one of these have a class on it. Oh gosh! Choking me up my friend.

We got that height six rim again. Hey, do you guys see dry? Don’t repeat yourself. Don’t repeat yourself.

And then this is even worse. We’ve got, and these don’t even do anything. There’s a border that’s being over there’s there’s multiple border instructions that are that are conflicting with each other because when I turn this border top width off there’s still a border top my friends there’s still it’s still right there so you’ve got conflicting and so I mean this is just a button that’s all this is one class pop it on move on and and no we’ve we’ve we’ve just decided now we’re gonna style every single button and what what is 95 dot CSS don’t tell me that’s in WP code box that we actually took this ID over to WP code box and wrote all this manually no oh wait we got the presence of some variables down here it was like well we’ll use variables for the border color and nowhere else. Who needs tokens anywhere else?

This is where I do want to bring the person onto the stream if we could. Number one for a public noodle lashing, they got to get their noodle lashes in, okay? But number two, just for an explanation of like, what was the thought process here? You know, like, walk me through it, walk me through it.

How did this come to pass right here I just want to know I just I’m always curious because it’s like you know even if even if you assume that the person is a like you know let’s say it’s there it’s day one day one of you know website design this requires a lot more work and effort than just a class with you know styles on it. It’s like, why did we go the route of just doing a lot of extra work? Yes, it’s, let’s see what everybody else has to say. Okay, hi, is there any way to add the data attribute value into that element class, I’m not sure what you’re talking about.

Ruben says, we’ve got to rebuild this website. Okay, a web design company that doesn’t really show signs of a web developer for copywriting. I know of a few people. Okay, let’s see, let’s see.

Jerry says he’s getting motion sickness. It needs the UI UX design course love from Gary Simon. It’s in desperate need of some UX UI loving not a fan of this site says Ruben definitely not the golden ratio for good copy okay noodle lashing be careful might YouTube my flag man you is that a is that a not the correct term anymore is I don’t know all right we’re gonna move into Q&A that was a yes there’s a lot of things that we can learn from, from this website right here. And, you know, it just, it, it, it goes to show, right?

Like, a lot of the stuff that we talk about. Clean DOM, tokenized design, best practices for scalability, maintainability, user experience. A page builder can give you tools to do things like fancy cursors and animated headings and auto-scrolling horizontal cards and but if that if we allow those things to be the important focus of a website you see that we often I guess what I’m getting at is don’t do those things don’t touch those features unless you have nailed everything else is actually important important. The copy, the UX, the UI, like the underlying code structure, the scalability, the maintainability, the accessibility.

Nail all of that stuff and then you can get cute. Okay, if you want to get cute, nail all the other stuff first, then you can get cute. Don’t start by getting cute and then forget about all the stuff that actually matters. That’s kind of like, that’ll be my main takeaway from that.

Tobias says, I wouldn’t have the guts sending in a website for review, having styled most part of it on the ID level. Well, you can fix it. You can fix it and then you can submit.

I like the overall look of the site, but I would make some things larger and reduce white black space. Too minimal, no images of the person, it looks unfinished.

So much white space, yes. Okay. Because a beginner doesn’t even think of using a pre-designed class and use it over and over and over again, I don’t think of that too for a long time. This is true, this is true.

And this is why I get onto page builders about the approach that they take. I mean, let’s be honest, page builders encourage users to style things at the ID level. Even bricks, even oxygen, you open bricks, you open oxygen, you add an element to the page, you go to style it, it’s encouraging you to style that at the ID level. Even though these are class first workflow builders, they do encourage, like by default, if you just click on something and start styling it, you will be styling at the ID level.

Now, what is the solution? I mean, you know, if Elijah’s here, if Thomas is here, their objection is going to be, well, I mean, we can’t make classes for the person and that wouldn’t be helpful anyway, would it? No, it wouldn’t be helpful. What would be helpful though is education.

And so, in the getting started guides, I mean, we could just ask this, you know, if I, the getting started guide for oxygen, the getting started guide for bricks, I would imagine like the first lesson, take PB one on one as an example. Like if I, if I had, if I had a page builder and I wanted to create like a, how to use this thing, then it would be like, I would have created PV one on one to go with it. Right. So those two things pair together.

I mean, PB101 does a fantastic job of selling bricks, if you haven’t noticed. Like, lots of people buy bricks after watching PB101. That does nothing for me, by the way. Like, bricks doesn’t have an affiliate program.

You know, I don’t care all that much about affiliate commissions. I just promote bricks because it’s the builder that I use, and because it’s the builder that I think is currently the best builder. It’s not to say that Bricks is always going to be the best builder. We don’t know.

We can’t predict the future. But notice that a lot of people buy Bricks after watching PB101. That goes to show that if you are a page builder developer, like creating content like that is a good way to sell your page builder. It’s also a good way to teach people how to do best practices in a page builder environment.

But again, I think a lot of these page builder developers have this idea that people don’t want to use classes, they don’t know how to use classes, we don’t need to teach them, they just let them do what they want to do. I don’t know. I don’t know what the thinking is. But it does a disservice as we can see on WDD Live, after WDD Live, after WDD Live of websites that are styled at the ID level, that aren’t scalable, that aren’t maintainable, that just have a lot of problems.

A lot, a lot, a lot of problems. We need more education, that’s what we need. We need more education, and it would be nice if the documentation inside, they’re not gonna look to me necessarily, when somebody buys Bricks, they’re not gonna go look up necessarily, like the first thing they’re gonna look at is the Bricks documentation. So it would be nice if the BRICS documentation talked about a class first workflow and the benefits of that.

And if you can’t, if you’re not going to create the videos, then link to videos that are relevant, at least, you know, point the people in the right direction. Oxygen should probably be doing the same thing. Okay. And I will just go through these questions as quickly as possible.

I will try to be concise. Kareem said, really Kevin Geary, no email or notification for this live? Yes, I did not send out an email for this particular live.

But we still have 85 OGs here, right? No email and we still got 85 people here. Question, that was one I answered earlier. All right, question, what do you think about a checklist in the inner circle?

The idea is when you join, you find out your something, something, and have afterwards a roadmap. Paul, it has a, it cut off your word or something, I don’t know, I don’t, you find out your, is stand, I don’t know, I don’t know what that means. Rewrite your question, Paul, and then I will answer it. Nicholas says, you’ve said this before, Webflow proved people want to do things more professionally.

The concept has been proved, but for some reason people dismiss it. Exactly, exactly. Yeah, that’s exactly what Webflow did. They created a professional tool and then they spent a lot of time and money and effort on documentation showing people how to use it according to best practices.

Oh, see, actually stand. So when you join, you find out where you actually stand and have a roadmap. I still don’t know. You mean like you find out your ability level, like you do an assessment maybe on what you know or don’t know or where you need to start?

I guess that’s what you’re getting at. I mean, we could do that. It’s just, it’s tough. You know, like, we could create a roadmap for suggestions on where to start, but it’s like, if you’re coming in for SEO, here’s where you could start.

If you’re coming in for web design best practices, here’s where you can start. I mean, we could do something like that, I guess. I’d have to think about it. Have you played with the new components features in, oh, that was to at Netrunner, okay.

Let’s see, let’s see, let’s see. I genuinely wouldn’t develop sites for customers until new builders like Bricks and Tools, ACSS Frames, proper markup done correctly. I, oh, you’re talking about if you are a developer that was still learning and so on and so forth, you wouldn’t take on actual clients until you really had like the basics and fundamentals down pat. Yeah, you know, let’s talk about that for a second.

Like, if you don’t really know what you’re doing, I don’t have a problem with you selling websites to people, actually. I have a problem with you selling websites to people if you make believe or make pretend like you know what you’re doing. So you can come up with, there are legitimately lots of companies out there who don’t have two dollars to rub together. And so, there’s a situation where they still need a website.

They’re obviously, they can’t afford like a legit agency to build them a legit website, right? But hey, if somebody is learning and they make it known, hey, your budget’s low, I’m learning, I’m gonna make some mistakes when I build this website for you. But it’s gonna be a lot better than having nothing. And so this allows you to get involved with client interaction, this allows you to get involved with things like processes and communication and contracts and the actual business side, and it allows you to learn some things and that’s perfectly fine if you’re up front with the fact that look I’m not I’m learning I’m a student more or less you’re hiring a student ok and you make that known up front and you charge accordingly charge student rates there’s a lot of companies out there who they can’t afford like a true professional and so they should hire a student knowing that ok it’s not gonna be perfect.

There’s gonna be some issues with this site, but it’s a lot better than not having a website. And it’s a lot better than I can probably do in Wix or Squarespace or something. And it frees up my time and I get a deal on it. I mean, as long as everybody’s honest and upfront and open, you do have to start somewhere.

You do have to start somewhere. Nobody, I’m not anyway, I’m not saying oh you should be you should pass some sort of professional like get a certification and then you can start getting those clients. No I mean you can get clients anytime you want. It’s a free country, free world, go get your clients just be honest with them.

Hey I have a year of experience this is not going to be a perfect website but it’s better it’s I can do better than what you have now or if you have nothing is better than having nothing. And you’re going to get a discount and because you know you’re going to pay basically a student rate. Just be up front and honest about it and gain experience and then as you gain experience and make mistakes and learn to fix your mistakes and you keep studying and you keep getting better, your rates go up. And then you can start after two years, three years, start probably looking like a professional, hopefully.

Okay, so that’s the route I would suggest people go. All right. Questions, questions, questions. I’m going to scroll back up.

How much do you rely on natural search engine indexing? No, it does take a lot of time usually, but lots of sites, I just don’t see most of their site indexed. I’m not sure what you mean. If you make a website and it’s indexable and it’s linked to, you know, Google’s gonna find it and Google’s gonna crawl it and Google’s gonna index it.

Now whether it’s indexed, indexing is separate from like ranking well. So I don’t know if you’re asking about ranking well or if you’re asking about simple indexing. Indexing is just going to happen naturally. Are you wondering, like, do I submit the website to Google?

Like, go into Google Search Console and say, hey, Google, this website exists. Yeah, absolutely. Absolutely. Every website, set up a Google Search Console, submit the sitemap through Google Search Console.

And I think we all know that’s going to help Google find it faster and index it faster. But that’s not gonna really have anything to do with where that website is ranked. So I don’t know if your question is about indexing or is about ranking. Da da da da da, looking for more questions.

You talk about page building, but I’d like to know your idea of best practices when it comes to blog posting on Gutenberg? Do you just use plain basic blocks or generate blocks? Well, that is a good question. I mean, we can look at, you know, an actual website.

And I would say this is reflective of 90% of my, 95% of my websites that I’ve ever done. So let’s go into posts. So first of all, we can see what this looks like on the front end. So we’re gonna go to blog, and we’re gonna go to, I mean, these are all fairly in depth.

I’m wondering five actionable steps. I wonder if this uses my, we can look at this one. Be interested in seeing this. Look at the structure over here.

Looks like that one was done manually. I’m finding one, I wanna find one specific thing to show you guys. So I was actually gonna do this as a training, as a little tutorial.

I think this one’s manual too. I wonder if I’ve done any auto ones on this website. Milestone payments, five, five. I just wanna check this one just to make sure.

Almost positive this was done manually. Yeah, it was, okay. I don’t think I have any auto ones on this website. I do have a training though where we auto number the headings.

Okay, but anyway, let’s look at that one. So here’s here’s what it looks like on the front. So we’ve got a block quote right here. We’ve got images that break out.

Okay, so this is the content width of the of the actual template and these images break outside of the content width. And you see it’s a it’s a lot of small paragraphs make it very very readable a Lot of internal linking and external linking and such A lot of times I’ll use lists Like actual like bulleted lists inside of things then we have our comment section down here so now let’s look on the in the actual block editor and You’re gonna see nothing it’s all These are just I put a class on these so post There’s block advanced I didn’t even have no I didn’t even put a class on these I used global HTML.

So it probably somewhere in Style sheet I just targeted images that are inside a blog post and I made them break out there So I didn’t even need It really what the reason why I probably did that is you don’t have to remember to put a class on every single image. It’s just every image is going to break out that’s in body content is going to break out, have that breakout effect on it by default. So it’s literally just raw Gutenberg content. That’s it.

There’s no generate blocks in here. There’s no nothing fancy going on. And why? The question is why?

The fancier you make a blog post, the more there is to manage, the more there is to scale later, the more there is to, if you ever want to change your template up, more problems can be caused by it. And so the question I ask is, what is the benefit of all of that? If I can rank number one, we know that blog posts, the number one thing about a blog post is the content of the blog post. So this goes back to nail the most important thing before you get cute.

I don’t ever get cute in blog posts because I don’t need to. I wanna focus on the things that actually matter. The things that actually matter is the content in the blog post. Now there are some times where you, let’s say you were gonna have a rating site and you’re gonna do a review site or something and you want review stars.

Now what we’re talking about is not actually, like never in a million years would I say, oh, well, add generate and make a star rating block and make a custom star rating block and bring that in. No, no, no, no, no, no, no, no, no. Then we’re going a review template and we’re going custom fields and we’re still using raw Gutenberg content. So at that point, I’m just mixing raw goo.

I almost never want to bring in blocks if I don’t have to. If I don’t have to bring in blocks, I ain’t bringing in blocks. I’m gonna try everything else to not have to bring in a block. Because the minute I bring in a block, that’s a dependency.

If I bring in a generate block, that’s a dependency. Now if you’re gonna build the whole site with generate blocks, that’s one thing. But if you’re not building the site with generate blocks, the minute you bring in, even if it’s just, I just need one block from Generate, now you’re dependent on Generate blocks for that site going forward. And remember, we’re talking blog posts, there could be a hundred of these, there could be a thousand of these things.

So you’ve just had a dependency added for a thousand pages or however many there’s gonna be. That’s not a thing I wanna do. I don’t wanna do that. Think about how many people, how many people have added a block pack, a block system for a table of contents block?

Raise your hand, raise your hand if that was you. I’m pretty sure it’s a lot of people, a lot of people. I’ve made that mistake in the past. Now you have a dependency and you have this table of contents block and if you ever decide or that block, maybe that block author gets hit by a bus, right, whatever, stop updating the block, you now have to go to every post where that table of contents block was added and remove it.

If you remove the plugin, you know what you’re going to be left with in every single blog post? We all know, say it. Starts with an S. Say it.

Say it. That dirty word, that dirty word, shortcode. Shortcode. You’re going to be left with a shortcode just sitting there in your blog posts.

We don’t want to live that life. We don’t want to be in that situation. So for me, blog posts are blog posts. Like, nail the content.

Don’t get pretty, don’t get cute if you don’t have to. And if you do have to get cute, find a way to templatize it. The last thing you should do is bring in a block. That’s the last thing you should do.

Gun to my head, I’m bringing in a block, OK? But if no gun to my head, I’m finding a different way to not need a block. That’s just how I feel about it. Question you talked about using templates for blog posts in PB 101 to L 15.

Yes. What is the what is the rest of the question? You probably hit enter before you were ready. Why no table of contents on your blog you had one before on your old site?

Oh oh good question hang on hang on hang on let’s make sure that’s clear. I didn’t say don’t have a table of contents. I said don’t use a table of contents block. So when I use a table of contents it’s in my blog post template hard-coded into the template.

Right so the table of contents is dynamically filled. You could use frames as a table of contents element. The difference is I’m not using that as a block in every blog post in Gutenberg, I’m putting that one table of contents element in the template that is rendered on every post, but it is in one, there’s one source of truth for it. So if I ever decide that, hey, that frames a table of contents, I’m getting the job done, or I don’t want a table of contents anymore, I open the template, delete, save, move on with my life.

Now, I don’t care if there’s a one blog post or a gazillion blog posts, they all just updated instantly. So there’s a big difference between doing something with a template and doing something with a block. We don’t wanna do it with a block, we wanna do it with a template. Question, is it possible to add advanced custom fields text to the class attribute of a div within a repeater and oxygen builder using an attribute feature my gosh you’re making my head spin let me read this very slowly is it possible to add advanced custom fields to the class attribute of a div within a repeater in oxygen using an attribute feature okay okay okay okay i think Okay, okay, okay, okay, I think I know what you’re getting at.

I think, I think I know. We could probably answer this fairly quickly. Oh, come on, man. Oxygen local, don’t do this to me.

There we go. Okay, pages. All we need to do is open a page. All we need to do is get to the editor.

We can answer this question. Twiddle your thumbs. Okay. Let’s get rid of that.

Add a section. Add a. . .

All we need. . . Oh dear.

Gosh. Let’s. . .

Oh gosh. All these buttons are in the wrong place according to my my bricks brain is clicking on the wrong things Okay div and so we’re going to use it We’re gonna have to add a class first and then see if we can and see how oxygen actually handles Handles this. Okay, so This will just say test. Oh god.

There’s already a test class. Okay My test. All right, and then we’re gonna make the size and spacing. Let’s just add a width of 400 and I just need I just need to be able to see it on the page Okay, and then we’re gonna add a background color to it Background color red.

Okay giant red box always a good place to start So then we’re gonna go to the front end and we’re just gonna inspect. This is all just a learning Exercise here and what we see is div ID equals and then class equals ct div block my test. Now if we go in what he’s asking is about these attributes right uh which are right here add attribute okay and so you can really add anything like you could say data my attribute this I’m just you know giving a little extra explanation just so everybody can follow along because if you’re not familiar with attributes what the hell is going on right now. Okay, hello.

So data my attribute equals hello. Now I save, and we can go inspect what this actually outputs on the front end. And you see data my attribute equals hello. Okay, well, many of you may not know this.

You can also add custom CSS, right? You can do background color like blue here. And see, ooh, magic, magic has happened. And then we go see that this actually puts in inline styles.

So I can effectively manipulate the HTML with these attributes. Now the class that what was asked is, can I dynamically add a class based on an ACF custom field? Because the other thing you can do here is this little data badge means I can pull data from custom fields all day. The question is, what happens when I tell Oxygen that this is supposed to be a class?

And so this is gonna be my test class. And so we’re gonna apply. And I think we just got our answer. Our box just disappeared.

It actually went back to, okay. It did not handle that well. Because there can’t be two class declarations, right? It can’t be class equals this and then again, class equals something else, right?

It’s all the classes need to go right here in this one declaration. Now, what I guess we might want to ask oxygen to do is to like parse this and add this class to the list of classes that are on the element. That might be what we would expect to happen. And then the answer would be yes, but it appears that the answer to your question is no, because the minute you try to do this, now you could do it with JavaScript.

Yes, you could do a JavaScript, but you asked about doing it with attributes and the answer with attributes appears to be no, because the minute you do that, it’s just ignoring it. It’s just saying, no, we’re not going to do that. Now I will go to the chat real quick and see if anybody else has any ideas for that. Okay.

Sylvia says, I mean, you no longer use any TOC on your posts. Um, I do. I just, it depends on the design. It depends on what I want to do.

It depends, you know, I’m not, I’m not opposed to table of contents. Once we have inline styles, we should consider using tables, too. Not really. Not really.

There is a actually a strong case for inline styles in certain situations. In fact, I use inline styling on the new automatic CSS homepage, but it’s for a very specific use case and that can be something we look at when we do the when we do the look-see at the new automatic CSS homepage, there is a very, when you’re using JavaScript is another time where you may want to inline style something. It’s dynamic situations, a situation where things need to dynamically change. Inline styles can actually come in very handy.

Okay, I’ve only used third-party blocks for a CTA block to my affiliate link for my blog post. Is this something I can do via the blog post template any quick trainings? I’ve only used third-party blocks. It depends on where the CTA block is for your, to my affiliate link.

Yeah, I need to see it in action. If I see it in action, then I can say, all right, that’s probably the only way to do that. Or I can say, no, no, no, no, no, let’s do it this way. But it’s one of those things that I have to see.

Yes, I like the idea, so brought it up hoping to improve. Okay. Andrew is gaslighting Andrea right now. Okay, any other questions that we missed?

The alarm is about to go off. I mean, is each his own level of knowledge, probably has several topics to learn, any base on the knowledge level would have a roadmap, next logical steps to further educate themselves. Yeah, I mean, that kind of thing can always be built. It’s a possibility.

I’ve got enough, I talked yesterday about planes on a runway waiting to take off. We got, this airport is full currently, on a runway waiting to take off. We got this airport is full currently and there’s a lot of planes waiting to take off. Taxiing, they’re stuck taxiing.

I’ve got to get the current planes in the air and then we can start tackling other things. Okay we’re going to call it today. Thank you everybody for coming in. I hope you found this valuable.

I feel like there was a lot of really good stuff that was discussed on here today in this episode. Again no email notification was sent out ahead of time and we still had a really really great showing I think over 90 at one point. So you guys are our OGs for sure. A lot of you I can tell have set your schedule like you have it on your calendar there is a WDD live on Wednesday at 11 a.

m. and I am going to be there and that is absolutely fantastic. I appreciate you and I will see you again very soon. Do not forget, do not forget tomorrow the ACSS 2.

6 walkthrough live event. We’re gonna have some fun over there talking about a lot of the new features with ACSS, talking about the future of ACSS, answering ACSS questions, a lot of good stuff. answering ACSS questions, a lot of good stuff. So I will see you guys again tomorrow, peace.

 

My Cart
0
Add Coupon Code
Subtotal