Is Your Website Page Builder Legit? 20 Mandatory Features Every Page Builder Must Have!

More about this video

There are a ton of page builders available for WordPress (Elementor, Divi, Oxygen, Bricks, Beaver Builder, Zion, etc.) and even many popular page builders outside of the WordPress ecosystem (Wix, Squarespace, Webflow, etc.).

How can you possibly know which builder is right for you?

Is it all personal preference?

NO! It’s not personal preference. There are objective ways to measure whether or not a page builder is legitimate, but first you need to know where you stand when it comes to your goals and objectives.

My channel – Digital Ambition – is geared toward freelancers and agency owners or people who aspire to be a freelancer or agency owner. In other words, it’s geared toward professionals or people who want to be a professional. At the very least, it’s geared toward people who are serious about the craft of web design and development.

If that’s you, then my position is very clear: regardless of your currently skill & knowledge level, you should be using a website page builder that has professional features and you should refuse to use a builder that does not support the needs of professionals.

This video covers TWENTY (20) MANDATORY features that every page builder must have in order for it to be a legitimate option for professionals.

Why are these things mandatory? Simple! Because when these features don’t exist it encourages you to go against best practices, puts severe limitations on what you can create, and ultimately makes your website less dynamic, less scalable, and more difficult to maintain.

This is why I say it has nothing to do with personal preference. Some builders are objectively not adequate. The only time personal preference enters the picture is when you’re comparing two tools of equal flexibility.

The three builders I currently recommend are:

Oxygen (WordPress): https://oxygenbuilder.com
Bricks (WordPress): https://bricksbuilder.io
Webflow (Non-WP): https://webflow.com

Join my Inner Circle for in-depth tutorials on web design / development best practices, building a 7-figure agency, and digital marketing: https://digitalambition.co/inner-circle/

0:00 Intro
01:31 The Purpose of a Page Builder
02:06 What is Our Goal With Websites?
03:02 Professionals vs Amateurs
04:17 Web Designers vs Photographers Comparison
08:32 Who This Channel is For
10:33 Amateur Tools vs Professional Tools
11:38 Why The 20 Features Are Mandatory
12:24 A Blank Div (1)
14:57 Classes, Pseudo Classes, Pseudo Elements (2)
17:57 Sections (3)
19:04 Header & Footer Templates (4)
20:18 Custom HTML Tags (5)
24:04 Code Blocks (7)
24:39 Repeater or Query Loop (8)
28:39 Dynamic Data (9)
29:53 Conditional Logic (10)
30:18 Clean HTML Output (11)
35:21 Flexbox (12)
38:19 CSS Grid (13)
39:01 Accessible Menu Builder (14)
40:32 Reusable Components (15)
42:02 SRCSET Images (16)
42:31 HTML Attributes (6)
44:28 Custom Units (17)
45:43 Decent Structure Panel (18)
46:40 Shortcode Execution (19)
47:28 Customizable Breakpoints (20)
47:46 Wrap-Up

Video Transcript

0:00:00
What’s up everybody welcome back to the channel this is actually my first video back since all of the oxygen slash breakdance drama went down and this is not going to be a traditional training video we’re not going to be doing any screen sharing this is just going to be a conversation between you and me off the cuff about a very very important topic and something that I wanted to touch on for a while now. But all of the drama in the oxygen slash breakdance thing going on makes this an even more relevant and more important conversation to have right now and that conversation is this when it comes to page builders. What is the true role of a legitimate page builder how do the different page builders stack up against one another is there such a thing as a legitimate page builder and an illegitimate page builder and what are the like mandatory features I’ve actually got a list of 20 mandatory features so that you can grade page builders. We’re also going to do a little bit of talk between the amateur camp and the professional camp because there are two different camps in this space like there are in many different industries and I think it’s very important for us to distinguish you know people in one camp versus people in another camp and what the two camps need from a page builder. So let’s get in first to page builders and what a page builder should actually help us do a page builder should help speed up our workflow and make our workflow easier and if we don’t know certain things page builders can help fill in those gaps. But here’s what a page builder should not do the page builder should not lead us to making bad decisions. It should not lead us to doing things that are against best practices and I think that’s another area that we have to get into with what is the goal for the websites that we are building. Are we trying to build websites that are easy to maintain? Are we trying to build websites that help our clients achieve their objectives? Are we trying to build websites that are dynamic? It’s easy to manage the content on these websites. It’s easy to manage the style and design from a global standpoint. We’re not getting stuck in a situation where it’s very hard to change parts of the design because for example we have to copy and paste styles. We’re not using classes. I don’t want to get into all the details. We’ll get there in a minute when I talk about the mandatory features. But the end result should be a website that is easy to maintain that’s scalable, that’s dynamic and that you have global control over. Especially if you’re a professional. Here’s the thing about professional versus amateur. You can be an amateur which means to me an amateur is you’re building a personal site for yourself or you do it as a hobby. You do it on the side but when I say on the side it’s like for you’re donating your time maybe if you’re doing it for other people. If there is an exchange of money you are entering the professional realm and it is my opinion at that point that you should act like a professional.

0:03:33
What it means to act like a professional is you work to hone your craft. You look out for the best interest of your client. You try to build the best website that you can possibly build and that goes back to it’s scalable. It’s dynamic. It’s built on a great platform that’s not going to go away in two to three years. Those are the things that I’m looking for and that’s the distinction that I want to make and I think when people are hiring people and they’re paying the money. There’s an underlying you know that obviously clients should be doing due diligence. But there’s an underlying assumption that you know what you’re doing. And this is where we get into the page builder realm and for this discussion I am going to use photography as an example. I was a photographer. I mean I’m still am a photographer and I am a true student of photography. So look at photography versus web design in the sense of page builders versus cameras and Photoshop. Photographers professional photographers they look at a camera as a tool of means to an end. It’s a tool that helps them create the art that they’re wanting to create the picture that they have in their mind of their posing somebody. They are setting up technical lighting manipulation that could be off camera flash that could be studio photography. They are using other light modifiers like reflectors or blackboards for negative lighting. There’s a lot of different options that they can go into. They understand their camera.

0:05:16
That means ISO aperture shutter speed. They fully understand the file format that they’re shooting in JPEG versus raw for example. So very technical very technical when it comes to cameras just as page builders are very technical to web designers and developers. The other side of cameras is they’re extremely advanced and you can have people who are like no I choose a camera because it gives me the things that I need to do to make the photo I want to make it gives me the ultimate control. I can put that camera in manual mode I’m going to set the shutter speed I’m going to choose the aperture I’m going to choose the ISO I’m going to shoot in raw I’m going to set up my lighting the way that I want to do it I am going to use these tools to craft my art. That is a distinct philosophy that is tied to professionals and if you’re hiring a photographer. Almost certainly you would want to hire a photographer that acts and behaves and makes those decisions and uses the tools that enable them to better make those decisions and better make the photos that they’re trying to make would you agree I think I think we could all agree on that right. Then there’s the other camp the amateur camp or the pseudo amateur camp where it’s the photographers who buy an expensive DSLR and their goal is to have the camera do almost everything for them and whatever the camera can’t do Photoshop and filters will do it for them presets as they’re called and those might be in light room instead of Photoshop but that’s neither here nor there. So they buy a camera they sell their photography but really they’re an amateur philosophically they’re an amateur and I think that’s another important distinction there’s a philosophical professional versus a philosophical amateur that’s really the most important thing here so philosophically they’re an amateur and again they are looking to the tool to do everything for them so they take photos on auto mode or even a pseudo auto mode like aperture. They’re a shooter priority or shutter priority or something like that and they then take those photos into light room or Photoshop and they assign presets to these photos that take care of the color of the contrast and all of this is is done for them they haven’t even made the presets themselves in a lot of cases they’ve purchased preset packs online. So somebody else did the art of the preset and the camera did the art of the photo and the amateur slash pseudo amateur simply framed it up which by the way takes some skill to frame a photo but you’re taking lots and lots and lots of elements of this artwork out of the process all the photographers doing is clicking the button and maybe doing some posing which posing is by all means that’s important okay but still it’s like you’re doing 20% of the work the tools are doing 80% of the job for you that brings us to my channel so my channel is for professionals that is true professionals who are actively selling their craft or philosophical professionals these are amateurs that are deeply interested in the art side of this the technical side of this the there’s a difference between somebody who wants the tools to do everything for them and somebody who wants the tools to help them but they also want to learn and understand they’re interested in honing their craft that is a philosophical professional so we all obviously start in the amateur camp you have to start in the amateur camp because you have to start somewhere and somewhere is usually nowhere you don’t know anything you’re completely green if you’re an amateur that seeks to move to being a professional whether that’s a true professional or a philosophical professional my channel is for you I’m going to help you bridge the gap the reason I’m hitting on this discussion so much is because there is going to be when I go through this list of 20 mandatory things that a page builder should have there’s going to be a lot of disagreement there’s going to be a lot of pushback there’s going to be a lot of people saying no it needs to be this way or that way and what I think you’re going to find and this is where a lot of the toxicity and the argumentation and the confusion comes from in these discussions where we have all of these different builders and you’ve got people in the element or camps you’ve got people in the divvy camps you’ve got people in the break dance camp now in the oxygen camp in the bricks camp and they’re all saying this no this builder that I happen to use is the absolute best builder and we have these similar conversations in photography where it’s canon versus Nikon but you know what happens is the professionals in photography will often acknowledge you know what the using canon versus Nikon at this point in the game is a completely personal choice and the same is true for builders in some regards but not others there’s obviously amateur cameras and there’s professional cameras guess what there’s amateur builders and there’s professional builders and so I believe if you are a professional whether you are a true professional charging money or a philosophical professional you should absolutely 100% be using a professional builder or a builder that has professional tools and you should not I believe it is objectively wrong for you to be using an amateur builder now what are what are the differences how do we know what the differences are if a builder does not have this is 20 mandatory things that we’re about to go through if a builder does not have one or more of these features it is suspect if it doesn’t have a good chunk of these features it’s an amateur builder and it is a no go in my book it’s not it’s not used it is not legitimate in my book here’s why this is such a big deal and in my opinion not even an argument it’s not not arguable because the absence of some of these features creates the situation I talked about in the beginning the absence of these things forces you to do things improperly it forces you to not have a dynamic website it forces you to not have a scalable website a website that’s easy to maintain and to iterate on it forces you into that paradigm and that is the wrong paradigm for almost anybody who wants to build a website but certainly for people who consider themselves to be either a true professional or a philosophical professional so what are these 20 mandatory features I’m just going to roll through them as fast as I possibly can number one is a div it has to have a blank unstyled container and it is amazing to me and why is this okay div is the a div is like the most fundamental part of HTML everything in web design is based on the box model okay we’re putting things in boxes and then we’re styling those boxes we’re moving those boxes those boxes are positioned relative to other boxes everything is based on boxes divs are simply boxes those boxes are divs so you have a builder like divi for example there was another one I was trying out the beaver builder I was looking at beaver builder the other day so we have divi beaver builder they don’t have a div element so they don’t have the most basic fundamental aspect of HTML and web design and web development they just don’t have it it’s not an option you can’t simply add a blank container to a page and then add things to it and style it the way that you want to style it this is a fundamental gap that you can’t cross it’s once you don’t have a div available to you this is not a legitimate builder because what happens is and you know Lewis for example so fly break dance makes the case of we need to make the builders like break dance more approachable to amateurs and the problem with that is in doing so you need the amateur into a bad scenario a bad paradigm where they’re building websites that are not scalable not the any of cards maintain and not truly customizable but then when that amateur who has aspirations of becoming a professional is finally introduced to the div they have to learn everything all over again they feel completely lost because they don’t know what to do with this blank container and that’s a huge problem I will also say this you know you are not an asset to your client if you’re building websites and you don’t know what it is or what it’s for or how to use it and you and you’re using a tool that doesn’t give you the div in the first place you are not in that you are a liability to your client this is not even a pro feature this is just the fundamentals right number two classes pseudo classes and pseudo elements very extremely important this is another thing that so many builders either don’t have or put on the back burner and this is another you know again mandatory feature divi does not allow you to put classes on elements they have their own proprietary way of trying to maintain global control over components and you know divi does use classes it just doesn’t give you access to the classes can’t make your own custom classes all that stuff elements or I believe let you add classes but they’re kind of hidden away there’s also the question of can you add a class and then style the class with the builder or can you only add classes that you have pre styled somewhere else by writing custom CSS the builder should allow you to style the custom classes that you are adding it is my opinion but again I don’t think this is even arguable that a professional builder should be a class first div first builder that should be the most important things does it give me a div and does it give me the ability to add classes those are the two most important things classes obviously give you that global control over your styling you can watch any of my tutorial videos using classes you can watch my tutorial on BIM classes are like divs in the sense that they are fundamental to CSS the first thing that you will learn in CSS is what is the difference between an ID and a div just like an HTML you’re going to learn what a div is very very early on in the process of learning CSS to save it a builder is more friendly to amateurs by not having classes and not having divs is basically saying that they shouldn’t learn at all that they should just be able to throw websites together not have no idea what they’re doing and and apparently come to an end result but we all know what that end result is it’s a website that’s not scalable not tiny and it’s hard to maintain it fails the third time that you can see the result is not a good thing fails the three things that any client is going to want from their website beyond does the website convert right does the website get me leads and sales that’s primarily what they care about but it’s a huge huge problem if they can’t change it easily can’t maintain it easily can’t iterate on it easily because websites in this day and age that is a must have so div in classes which also includes pseudo classes and pseudo elements for example can you change the hover style pseudo elements can you add a before can you add an after can you target first child last child can you do that kind of stuff in the builder and with so many builders element or divy beaver builder you cannot do these things those are amateur tools for amateurs and if you are a professional in any sense of the word or you’re an amateur that hopes to one day move towards being a professional then you should not be using those amateur builders period number three is a section element section element is a fancy div it’s a div that actually has a semantic HTML section tag but it also has an inner div inside of it it is my opinion that the builders should give you access to that inner div as well oxygen does not that is a big down side of oxygen sections bricks does give you access to the inner div of a section that inner div is your website with it is auto margin to be aligned to the center so that you just add a section element and you can immediately start out in content into that section and everything will be in perfect alignment everything will look good on mobile devices as far as a side gutter goes a section element is very very very important and it follows the div first philosophy of web design like I mentioned it is fundamentally blank it does not try to create any sort of layout for you like column based layouts or grid based layouts or anything like that it simply gives you a double container system an outer container an inner container and default alignment and default padding number four is header and footer templates does the builder give you the ability to sign headers to different pages globally footers to different pages globally can you mix and match the headers I don’t like how oxygen oxygen does templates honestly it asks you to combine headers and footers and then you put an inner content in between them and you can still assign headers and footers to different pages but it’s just not the workflow that I would choose if I was creating my own builder you have divvy which does allow you to do headers and footers globally and they do it right in my opinion where you can create a global header assign a different places create different global headers then you can have global footers which are separate and then your page content is going to go in between in any case but it’s separated out headers and footers are not tied together like they are in oxygen as much bricks same thing gives you access to headers and footers independently from each other very very important but even the way oxygen does it is workable so the real question here is and I think almost all builders are getting to the stage where they give you header and footer templates but I still wanted to note that it is a mandatory feature number five is custom HTML tags you should be able to change the tag of an HTML element for example if I had a div to a page but I wanted to be a section I should be able to change the tag from div to section I should be able to add a div in a grid and change that div from a div to an article for example so I should be able to make it have the article HTML tag I should be able to add a div and change it to an unordered list the UL and then I should be able to put divs inside of that and change them to L.I. so that their list items child items of that unordered list these are all things that oxygen allows you to do they’re all things that bricks allows you to do because these are tools for that are suited for you to do it.

0:20:56
So I think that’s a good example of what I think is the tools for that are suitable for professionals amateurs don’t even know this is a limitation most amateurs don’t know anything about semantics HTML and this is an example of where toxicity will creep into these discussions and you’ll have argumentation that is illegitimate argumentation in the sense that amateurs don’t know what they’re talking about but they won’t hesitate to voice their opinion in these groups they’ll come into oxygen and insist that classes aren’t that important they’ll insist that having a div is not that important. They’ll insist that you do changing the HTML tags of an element is not that important why are you guys worried about that you’re already seeing this in the bricks group there are a lot of amateurs in the bricks builder group thankfully they haven’t gone off the deep end with it and they’re they’re still providing and still listening to professionals still providing tools for professionals and listening to the input from professionals doing things the right way bricks is a div first class first builder that’s fantastic absolutely fantastic but there’s still a lot of amateurs and they’re still doing it. There’s still a lot of amateurs in the bricks group I’m not insulting the bricks group I’m not insulting anybody in particular in the bricks group I’m just saying that this is the fact of the matter there’s a lot of amateurs in the bricks group we’re going to say classes aren’t that important we need to be able to hide the classes box I don’t even want to see it right that’s an amateur saying that that’s not a professional saying that we’re trying to bring some of the professionalism of oxygen to bricks because we want to see that stuff because it’s very important and amateurs push back against that and they say no no no we don’t need those things we don’t want to see that. We don’t need those things we don’t want this to be like oxygen when they say that it’s an illegitimate statement because they’re basically saying we don’t want it to be suitable for professionals but really it’s like why like we’re in the web that we’re trying to build websites like you want to build the website the right way whether you’re an amateur professional at least that’s my opinion that should be the case right I’m not just some rando trying to slap together the quickest website I possibly can. Shit if that’s you go use wicks go use square space go use one of these other like we have there’s plenty of illegitimate amateur builders out there that you can choose from bricks has the ability to be a tool for professionals and thus we should make it so because the other tool that we had for professionals has trip and fell on its own face and this is you know in the process of picking up their teeth so it would be good to have another option and I would love to see bricks be that. Second option we have Zion Zion is another potential option here where you’re going to see a lot of these boxes are checked that I’m going over but Zion is not a diff first class first builder it does not have classes front and center and it doesn’t have dives front and center that’s a major red flag for me being hurdle now that doesn’t mean it’s always going to be the case Zion is still early in the early stages they may take the feedback they may understand that hey building a class first diff first builder is the way to go because it’s not going to be a lot of people. So first diff first builder is the way to go because that’s the fundamentals of what design and development I go back to this it’s not even an argument in my opinion like how are you going to say we should skip the fundamentals skip the most important things and suddenly we’ll have a better builder that doesn’t make any sense to me seven is code block can I add a code block to the page can I add PHP to that can I have JavaScript to that even if I’m not a PHP developer there’s going to be points at which you need custom PHP code executed on the page. Even if you’re not a JavaScript developer there’s going to be points when you’re working with clients so you’re professional in any sense of the word there’s going to be points where you need to be able to execute JavaScript on a given page or throughout the website does the builder allow you to do that yes or no if it doesn’t it’s not a it’s an amateur builder and it’s not legitimate for professionals a period end of story. Number eight is a repeater or a query loop this is absolutely another fundamental word press is a content management system it is a you’ll hear the term CMS right stands for content management system so we’re organizing content in the back end using things like custom post types and custom fields and taxonomy so we’re categorizing things you can watch my video on when you’re building a website for a business having some kind of a business. Having services be a custom post type having reviews be a custom post type having service areas be a custom post type having locations be a custom post type having the portfolio be a custom post type these are ways we use the CMS to our advantage we then use taxonomies to add additional categorization and filtering options to those pieces of data. When we do such things as professionals we an amateurs by the way maybe not they don’t know what a custom post type is they don’t know what custom fields are they don’t know how to do these things they’re going to end up building a much less scalable website whereas a professional can now use query loops and repeaters they’re basically the same thing just depending on the builder you’re using to query that information onto specific pages in a specific way. And thus if you have a services page and your services are all queried so you’ve designed cards for each service right and you’ve used classes to style those cards you now have global control over the entire the website is so much more scalable and perhaps you even have a template created for a service page you have a service page single post template. Going and adding a new service when the clients says hey we have another service we want to add is as easy as going to the services custom post type clicking add new filling out the custom fields filling out all the media perhaps doing the SEO optimization and then hitting publish and that service shows up in a card format on the services page automatically people click on it the service page looks great automatically because it’s inheriting the service page template and it’s automatically queryable filterable it can show up in many different places on the website automatically it’s fantastic that is a dynamic scalable website somebody that doesn’t use query loops or repeaters because either their builder doesn’t offer it divvy element or I think maybe element or is adding this I don’t know beaver builder okay it’s it’s a huge problem and huge limitation and they think oh well yeah I sped up the design and development of the website because I didn’t have to fiddle with that repeater thing I didn’t have to learn the repeater I didn’t have to make custom fields and custom post types but now you have a website that is very difficult to maintain very difficult to scale and is not dynamic so you’re in a worst position it’s it’s always the case of like if we can just do a little bit more work up front which you know again I argue it’s not even more work what’s more work is doing it wrong and then being involved in a website where everything is done wrong you want to talk about a lot of work that’s a lot of work that’s a lot of work we’re looking this is one leg of the race in a 10 leg race right so if leg one takes me longer but I’ve set myself up to make leg 2 3 4 5 6 7 8 9 10 take a quarter of the time where the person who didn’t do the right leg work in leg 1 is having to now do the same amount of work in 2 and 3 and 4 and 5 it’s infinitely as this goes on and on and on slower to do it the wrong way okay so that’s why we follow best practices is why we try to do stuff as organized and dynamic and scalable as possible from the beginning if your builder does not have a repeater or a query loop it is not a professional builder it’s an amateur builder it’s not a legitimate builder in my estimate number 10 no number 9 dynamic data again this very important you’re talking about templates custom templating you’re talking about custom post types and custom fields we have to be able to pull information from our CMS this is why we have a CMS guys this is why we have a CMS this is fundamental to a constant management system just like I said a div is fundamental HTML classes are fundamental CSS custom post types custom fields templating this is fundamental to a content management system so we’ve got people building websites that are just skipping the features of a CMS skipping the features the core features of HTML skipping the core features of CSS and trying to tell us as professionals that this is a better method they’re doing it the right way they’re doing it a better way they’re doing it an easier way right none of that is true it’s simply not true this is not even arguably a good example not even arguable again I’m going to say this over and over again not even an argument in my estimation it’s not it’s amateurs telling professionals what to do it is it is not surprising that that breeds toxicity and strong disagreement in these groups number 10 conditional logic can I hide or display elements of the website based on certain conditions can I hide phone numbers based on time of day day of the week can I show or hide content based on whether custom fields have a specific value or not this is all very important to building a scalable dynamic website number 11 clean code output no divception divvy element or beaver builder you add one element to a page a button a heading even something super super simple and it adds five divs it’s it’s it’s wrapping stuff and other stuff it’s got tons of classes and ideas and all this stuff going on in a lot of cases it’s got pre made styling that’s trying to help you with shortcuts and if you really know what you’re doing you’re trying to get to where you want to go all of those things are just hurdles to get into where you want to go and when it comes to clean code output the other side of the story that we have to look at is stuff like core web vitals we talk about toxicity in these groups I was in a discussion with somebody who uses beaver builder they were telling me the beaver builder is a tool for professionals and that they sell websites all day long to clients and they build these websites in beaver builder and that it’s been a rock for them and yada yada yada yada yada yada this is an amateur who is selling websites to people okay remember we talked about a professional someone who sells websites but really there’s an amateur in disguise it’s an amateur who’s selling websites to people but fundamentally and philosophically they’re an amateur and in their knowledge base they’re an amateur and he’s telling me that beaver builder is just fantastic and I said you know tongue in cheek poking as I do okay anybody that knows me on Facebook knows like hey when I see a post like this I’m going to speak up right I’m going to poke I’m going to poke a little bit and I’m going to get a discussion going right because I think these things are important but it also is entertaining and I’m going to do it.

0:31:59
I’m going to do those entertaining and it also does help other people they come and they read the arguments against like I don’t want just people running their mouth basically who don’t know what they’re talking about because other people get the wrong impression and other people go get let a stray if you convince somebody to use beaver builder you have ruined their life in my estimation right and so if I have the opportunity to step in and save somebody from that outcome. I’m absolutely going to do that and I’m going to have fun while I do it okay so this guy telling me all about how beaver builder is great for professionals he says I can’t see how other people would use another tool or something like that I don’t remember what the exact thing what he said something about I can’t see something and I was like I’m surprised you can see anything throw those dips and that’s the only comment that I wrote and then he comes back and he was like is it these extra dives don’t matter so I go to his website I pull it up I go find. He’s got a portfolio of client sites I pull up each and every client site on core web titles on Google page speed insights every single website is failing core web titles every single website is flagged for an excessive dom size D.o.m. right so what that means is there’s too many elements on the page now you look at the page and it looks like any normal website what how could this possibly have an excessive dom size compared to another website that looks exactly the same and it’s because of beaver builder it’s because of element or it’s because of divvy they you add one element to your page you’re actually adding five elements to the page because of all the dives that are wrapping that element for basically no reason we know it’s for no reason because oxygen does it without doing this bricks is able to add elements without doing this dives section nonsense it’s clean code verse not clean code so you have a guy telling people that beaver builder’s a professional tool and that he’s had no problems with it and it’s a rock and yada yada and then he explicitly told me that the excessive dom elements is not a problem even though all his websites are failing core web titles and are being flagged for an excessive dom size okay so this is just people that don’t know what they’re talking about telling other people what they should and shouldn’t be doing and I have a problem with that shouldn’t I don’t you agree that I should have a problem with that that any professional should have a problem with that as you’ll get people saying things like it doesn’t matter what builder you use just use the builder you’re most comfortable with that is objectively false this is not a use whatever camera that you’re comfortable with this is not a can inverse Nikon situation okay we’re going to get to a point where oxygen verse bricks is can inverse Nikon that’s the point that we’re going to get to and at that point fine tell people is user preference but don’t tell him it’s user preference between beaver builder and oxygen that’s just excuse me that’s just dumb that’s just dumb ass shit okay that is not there’s no objective reality there okay one is an amateur tool that does not give you professional access to things and another is a tool that gives access to professionals okay so this is not even an argument or a discussion next thing is and I’m not going through these very fast they might hopefully you’re at least being entertained or you’re skipping around I don’t know or you just you know you like me enough to just sit here and watch the whole thing okay next is we did clean code output flex box layout so any professional builder should give flex box tools now there’s actually a lot of different ways to implement flex box and you’re going to see that oxygen does flex box differently from bricks I also want you to open up an app called Figma Figma is a design tool and Figma is geared towards professionals and Figma uses two things that I want to point out because this goes to show that there are a lot of ways to execute on this where you can still follow best practices but the builder still makes it easy the reason I’m referencing Figma is because I don’t think oxygen makes flex box layout easy so if they were trying to appeal to amateurs and again this is amateurs trying to become professionals they wouldn’t say well let’s remove the flex box layouts because they’re too complicated for amateurs they should say let’s just find a way to make flex box easier so you’re still encouraging amateurs to use flex box because that’s what they should be doing but you’re making it easy on them that’s totally legitimate okay it’s not legitimate for break dance to be like well we’re not going to give flex box tools now I think even break dance does flex box tools because they recognize that some of this stuff you just can’t remove but element or I think element or only recently gave flex box controls to its users divi still has basically no flex box tools as at least last time I used it that’s insane to me again flex box fundamental to web design and development at this point but the reason I bring up Figma is because you should go into Figma and you should add a frame to it and I want you to notice something a frame in Figma is just a diff it’s just a blank diff that’s all it is you add a frame and they have something called an auto layout you can auto layout that frame and the auto layout features in Figma are flex box you just don’t know it because it’s all UI driven they even have space between controls just like flex box space between but they use a visual grid system where you can click on little dots to align content inside of the auto layout that is flex box 100% they just don’t call it flex box and they don’t use any of the flex box terminology but it is flex box and it works pretty much everything that you would need to do in flex box for the most part from a base flex box standpoint you can do in Figma and that is an example of how a builder could implement the exact same thing and professionals would be able to use it just like professionals use Figma and amateurs would find it very very friendly just the way amateurs find it friendly in Figma Figma is done it very very well for 13 is CSS grid if your builder does not give you access to CSS grid or does not support CSS grid it is an amateur builder it is not a professional builder professionals know they absolutely need grid it is very very important and critical to web design and development Lewis from so fly by the way has tried to make the argument that grid is not necessary that you should only use flex box nobody needs grid what would you need grid for I think even ask this in the oxygen group trying to get feedback from people where a lot of people are like hey do a grid is kind of important you know just like we told him classes were important and he tried to tell us the classes are not important or fundamental to web design go figure 14 an accessible menu builder I talked about this a little bit in the beginning is one of my examples you can build an accessible menu in your builder of choice oxygen fails this it’s 4.0 and oxygen still fails this and it’s an area where you have a lot of amateurs clamoring for a mega menu amateurs want the shiny objects amateurs want the fancy things for the most part by in large professionals know that simple menus are the best way to go mega menus are not typically the best way to go that’s why you have professionals who are just like give me a simple accessible menu would drop down single layer drop down it may be a fly out option but even probably not that the flatter we can get the navigation the better the experience is going to be for users typically there are some cases where that may not be the case but for the most part a simple flat navigation style is the best way to go and then we need to be able to transition that to a mobile device all of that from desktop to mobile needs to be accessible again oxygen fails this test but oxygen has add-ons that do not fail the test like oxie extras but if you don’t have a builder that gives you an accessible basic menu on desktop and mobile in my opinion is not a professional builder or it’s lacking that professional feature at least but that is a mandatory feature all right so the next one is reusable components so reusable components are very very important is basically you take a block that you’ve created maybe we’ll call it a CTA strip a call to action strip where you’ve got your call to action text it’s all designed a certain way your call to action button the link that the button is targeting and so on you get that exactly how you want to use it now you want to use that on many different pages you want to be able to use it inside of Gutenberg for example I don’t know you should be able to save that as a global component and then wherever you use it whenever that CTA needs to change because guess what guys offers change a lot for a lot of businesses so you have an offer component basically and you want to be able to change that from time to time is the off the offer changes can I change the heading and the heading changes everywhere I’ve used the block can I change the offer text the offer text changes everywhere I use the block can I change the button text the button text changes everywhere I’ve used the block can I change the link the link that the button goes to and that changes everywhere I’ve used the block yes or no if that’s not available to you you’re not using a professional builder now I will say that oxygen there’s a dual layer to this global components thing I’m not going to get into all the details now oxygen gives you enough to be usable but it doesn’t do it right in my opinion bricks doesn’t do it right in my opinion yet I haven’t seen a builder that doesn’t write in my opinion but bricks and oxygen are serviceable in this regard next one is source set images I have an entire training on source set images basically these are responsive images this is the ability to add an image to a website but you’re also telling the website hey these are the other available sizes and the browser because of source set is able to choose the size that it needs based on the size of the device dynamically this is very important to user experience website speed lots lots of different things I skip one I feel like I skipped one oh HTML attributes I skipped HTML attributes I believe I did custom HTML tags and then I never did HTML attributes so we’re going to throw an HTML attributes I don’t know what number this is going to be I probably skipped a number at some point I’m not re recording this entire thing HTML attributes very important can you add height and with attributes the images that’s one thing that popped into my mind is the ability to add those are HTML attributes I can’t do that right now I’m not gonna do that.

0:42:59
Those are HTML attributes adding explicit width and height which is important if you don’t know why that’s important to preventing cumulative layout shift as an example and passing core web titles on CLS again technical things that amateurs probably don’t really know anything about when it comes to accessibility HTML attributes are extremely important you have to be able to add Arria labels are you hidden are you all of these different are you features for accessibility come through the use of HTML attributes as far as I know Divi does not allow you to add HTML attributes element or does not allow you to add HTML attributes unless they have specific pre made HTML attributes for you in some cases but that’s not custom HTML attributes open ended where you can add anything data attributes are very important so if you can’t add data attributes it’s not a professional builder those are a different kind of HTML attribute so you see that these things you know the amateurs don’t even really know anything about in it for the most part and they’re going to be like why are you guys worried about this thing we don’t need this kind of discussion in the bricks group why why don’t we need that kind of discussion we’re talking about the fundamentals so if you want to ever move from amateur to professional or you’re just an amateur that really wants in loves the you know creating a great website and you want to do things the right way following best practices you need to be thinking about these things you need to choose a builder that gives you access to these things number 17 is unit selection unit selection means can I choose REM can I choose VH VW CH these are very important to be able to switch between in different scenarios right can I use variables oh boy big one right there it is not a professional builder again the guy told me hey beaver builder so professional open beaver builder first check I did can I add for best can I add variables for colors can I variables for font size and and spacing patting things like that the answer is no you can’t that’s not a professional builder is an amateur builder I couldn’t use beaver builder for a single day in my life because of the things that it lacks I mean let’s just be for builder right off the bat does it have a div no does that classes not really doesn’t have a section element not really does it have footer templates I believe so custom HTML tags don’t think so HTML attributes don’t think so repeater query loop don’t think so it’s just on and on and on and yet this guy’s telling me oh beaver builder is a rock for professionals get out of here man get out of here nonsense okay let’s go with that we did unit selection so Ram VH VW CH etc 18 is a decent structure panel this is where Gutenberg fails for me everybody’s telling me Gutenberg is the next best things on slice bread decent structure panel means can I drag and drop easily can I see the entire structure of the page that I’m building can I rename things in the structure panel can I do things from the structure panel like duplicate delete et cetera can I do it with one click very very very very important to have a really decent structure panel oxygen has a not decent structure panel it’s decent in every guard every regard except for drag and drop it is absolutely horrific for drag and drop I don’t care what they say they did not fix it in 4.0 it’s still horrific bricks great structure panel the drag and drop is flawless the size of the structure panel the readability of the structure panel all fans absolutely fantastic number 19 short code execution can I execute short codes in the builder yes or no that’s very important because like I said if the builder for example doesn’t give you access to an accessible basic menu you can take something like max mega menu build your accessible menu it’ll give you a short code you drop that short code in the builder it executes the short code you have an accessible menu so even if the builder didn’t give you access to it you’re able to still get it when using that builder a forms thing would be another one so I use WS form right I think it’s the best forms builder for WordPress it’s going to give you a short code you take that short code you put it in a builder it’s going to show your form where you put the short code unless of course your builder doesn’t support short code execution that would be a major problem that would be an amateur builder number 20 final one customizable break points can you change the break points you know that you want to change and with automatic CSS if you’re using that you can customize the break points the builder should be able to customize the break points that you can match very very very important okay so those are my 20 mandatory things I know this has been a long video we’re an hour into this thing I told you you know grab some coffee grab some wine whatever this is a super important discussion though and it’s going to answer the question of how do I find the next builder for me if I don’t want to use oxygen if I don’t want to use bricks maybe for whatever reason you don’t like bricks and you want to evaluate some other builders I know some people are looking at some Gutenberg builders like quickly as an example well how do you grade it for a professional a true professional to ever use a builder it would need these 20 things so that’s it if you have any questions drop them below if you were offended by my amateur versus professional talk I didn’t mean to offend you I’m not attempting to offend you but I am attempting to tell it like it is I’m not sugar-coating things I truly believe that there are amateur builders and there are professional builders and if you consider yourself to be a professional in any sense of the word which includes just a philosophical professional then you should not use the amateur builders they are not suitable to be used period end of story okay you’re never going to see me build a website in divi you’re never going to see me build a website in an element or you’re never going to see me build a website in beaver builder it’s not going to happen and so people can ask for tutorials using these buses never going to happen you will see me build websites in bricks in fact the next client side I’m doing is in bricks and I am recording an entire series from start to finish of this website in bricks inside of my inner circle so you’re going to see plenty of stuff in bricks you may end up seeing something in quickly if I decide to quickly you know does all these 20 things but that is it for me and this discussion I am out peace.