Elementor Typography: The Right Way to Use Titles Tags for SEO

✨ Join us in the Lytbox Academy Community:
lytboxacademy.com/join-us/
Learn more about Design Systems with Elementor - • How to Use Web Design ...
My goal is to create a community for Web Designers, Developers, Freelancers, and Elementor enthusiasts to learn the design & business side of creating websites.
Got questions? You can reach me anytime - lytboxacademy.com/contact/
/////
✨ Learn High-Level Web Design Skills With Me:
🟢 Master Elementor while learning web design skills:
lytboxacademy.com/design-with...
🟢 Learn powerful SEO in an easy-to-follow style for WordPress users and web designers:
lytboxacademy.com/seo-for-wor...
🟢 A step-by-step guide to building a WordPress Maintenance Business that results in high MRR:
lytboxacademy.com/maintenance...
🟢 Become a Lytbox Academy Pro Member:
lytboxacademy.com/the-academy/
/////
✨ My Recommended WordPress & Web Design Tools:
👉 The hosting I use:
Cloudways (use promo code LYTBOX for 30% off 3/months)
lytboxacademy.com/cloudways/
xCloud:
lytboxacademy.com/xcloud/
/////
👉 My WordPress Tools:
Elementor Pro:
lytboxacademy.com/elementor/
Breakdance Builder:
lytboxacademy.com/breakdance/
Bricks Builder:
lytboxacademy.com/bricks/
Crocoblock:
lytboxacademy.com/crocoblock/
SEOPress (the best SEO tool for WordPress!):
lytboxacademy.com/seopress
Perfmatters:
lytboxacademy.com/perfmatters
InstaWP:
lytboxacademy.com/instawp
WP Umbrella:
lytboxacademy.com/wp-umbrella
/////
Thank you for supporting my channel 🙏 - Jeffrey @ Lytbox
#elementorwebdesign #elementordesignsystems #elementordesigntips

[@cristian9090]

I don’t know why you don’t have more followers. Thanks for such info, and for helping people with this matters.

[@LytboxStudio]

Thanks Cristian, I appreciate it!🙏

[@princessamaole9632]

He deserves million subscribers honestly. So many helpful videos he's got

[@CarminaRoberts]

I'm so glad I found your video! This was the best description with examples I've found! You've made it super easy to understand. Thank you so much!!

[@LytboxStudio]

I'm so glad to hear!

[@rozkrokokrok]

After my desperate efforts to build a design system based on the choice of Headings, this tutorial was very liberating for me. Well thank you

[@LytboxStudio]

So glad to hear!

[@samarfaizan]

OMG. You are the MOST AMAZING AND HONEST AND WONERFUL AND SUPER SUPER NICE person I ever saw on KZbin. You are a real blessing for everyone around you. LOTS OF LOVE FROM PAKISTAN MY FRIEND

[@mnramplify6724]

Genius. My team and I have been doing big-small sites for over 15 years. I've read and watch stupid hours on topics and tips. This is the most unassuming and BEST video on laying out H tags + SEO + Design I've ever seen. TRUE TRUE secrets and WISDOM in here. Best of luck to ya!

[@LytboxStudio]

Wow thanks for this! I really appreciate it! 🙏

[@NickGrimshawe]

Wow. That really helped me understand what those H tags are really for. Back to my site to make sure I use your ideas.

[@LytboxStudio]

That's so good to hear! Every time I hear someone say they now understand what H tags are really meant for I feel like its a big win!

[@NeoOnyx]

Thanks for the explanation. One thing though, when you make a new page in Wordpress, the title automatically gets the H1 tag. Now, in Elementor you can choose to not display the title of the page, but it is still in there somewhere. If you add your own title to the page and make it a H1, then you will have 2 H1 tags on the page. According to Google, they see multiple H1 tags quite a lot and SEO-wise it’s not a big deal, as they say. It doesn’t seem to take away much for the ranking. But, not using the typograhy settings for the H tags is smart and I’m going to use that approach because if you’re defining H tags on size, then 6 of them are never enough 😊

[@LytboxStudio]

If you choose ‘Elementor Full Width’ for the page template, the H1 page title does not show up in the source code. But it will if you leave it on default.

[@jahedashaik8460]

Finally something very clear and straightforward. Thank you.

[@princessamaole9632]

I have spent 5hours watching your videos. They are super packed. Thanks so much

[@LytboxStudio]

Wow that's so amazing to hear and a huge motivation for me! Many Thanks 🙏💜

[@dimasmayda8021]

Bro i had to pause the video just to thank you. I love the way you explain things, the subjects you speak of, and the general quality of all! I hope your videos get even more views because you deserve it. Keep it up with the awesome job! Greetings from Argentina :)

[@LytboxStudio]

Wud Up Argentina 🇦🇷! All the way from Thailand 🇹🇭

[@futuriostube]

Nicely explained brother, Let's work together on Elementor & SEO Projects.

[@stevechong65]

Hey Jeff! Thank you so much! Now I have a better idea of what those Hn are all about! I have learn so much from you! If we ever met, first beer on me!

[@LytboxStudio]

Sounds excellent! Hit me up when you travel through Chiang Mai! Cheers!

[@digitalbyadnan]

Cleared out my Tags and Sizing confusion with this video.

[@abaniahmadbani]

I once think "maybe this is how to do the tags for the SEO" but I'm not sure. But after I watched this video of yours, now I convinced that this is how it works. Thank you so much for the tips!

[@LytboxStudio]

Many Thanks 🙏💜

[@NorthBusinessGroup]

Jeff, loving the video's / content and your style. - don't stop.....Love the people and the country also...💖🇹🇭

[@LytboxStudio]

That’s awesome! Gotta lotta 💖 for 🇹🇭!

[@digitalbyadnan]

Helpful video Jeffrey! Thanks

[@AngelaKooij]

Oh yes!! I wish I knew you earlier. Now I got all my clients websites SEO unfriendly haha oeps!

[@LytboxStudio]

I've been there. It's how we learn

[@rickporier]

Great video man. I took over the SEO from the company I was paying to do it because they sucked. So I am learning as I go. This broke it down more in-depth and easier to understand than any other video I have seen thus far.

[@AnthonyBarberaAuthor]

Very nice and simple and helpful. Thank you!

[@charming1977]

Really useful video as I embark my journey to optimise the SEO of my business's website built on elementor.

[@akifalsancak]

Star Wars heroes are not a legend, they live in real life and I just watched a great video of him giving elementor lessons. On behalf of everyone, thank you my friend, you are number one and God bless you!

[@PaulDewseth]

worth the watching time, thank you.

[@LytboxStudio]

Glad to hear it!

[@drewtrykowski1881]

Man what a great tutorial ... thank you mate , you are super easy to follow and easy to understand . Keep up the great work !

[@4Mulator]

Thank you for this! I finally got it!

[@LytboxStudio]

Glad I could help! Thanks! 🙏

[@OscarObians]

Best explanation of H tags I've found

[@LytboxStudio]

Thanks!

[@whatthesaintsdidnext]

Wow, what a brilliantly helpful tutorial. This has brought so much clarity how I should approach constructing my pages. Thanks so much 👍😀

[@LytboxStudio]

I’m so glad to hear! Thanks !

[@emirbasha1410]

This is Super helpful, Thanks man!

[@LytboxStudio]

Many Thanks 🙏💜

[@stateofnomind]

I really like your style of explaining this, thanks man.

[@LytboxStudio]

Thank you! I appreciate that 🙏

[@adelaidewinetours]

Very thankful to people like you, great tutorial and easy to understand - thank from George Wine Valley Tours Adelaide South Australia

[@monicaterroba]

Great explanation of H Tags video. I didn't know that size has nothing to do with H tags. Thanks so much for this type of videos! You gotta new subscriber from Mexico! :)

[@LytboxStudio]

Glad it was helpful! Thanks! 🙏

[@alexchung281]

Awesome video. Thank you a lot!

[@riikkaalavuotunki1836]

Thank you very much! This is a brilliant tutorial how to write H titles with Elementor. This is straight to the point I need to know right now.

[@LytboxStudio]

Hey Riikka I’m glad to hear thanks!

[@beatricegoldenfingers8309]

You nailed it,what a good teacher you.

[@LytboxStudio]

Wow that’s too kind🙏 thanks!

[@joshlyons1005]

Great info. Thanks!

[@Checklogic]

Great video. Thank you.

[@dominik.szewior]

Thanks! Now it’s clear:)

[@clintt5266]

Very useful info! Thx!

[@LytboxStudio]

Thank you for that. Much appreciated!🙏

[@daczito]

Great video. Thank you for making it so clear.

[@LytboxStudio]

Thanks Daniel!

[@eszter1508]

Awesome content as usual, Jeff! I'm totally addicted to your channel for a few days! :) Many thanks! :)

[@LytboxStudio]

Wow Eszter! That means so much to hear! Many thanks 🙏

[@frankstone]

Outstanding tutorial. You clarified this feature for me.... thanks!

[@LytboxStudio]

Thanks Frank! So glad to hear these are helping. Cheers

[@DesireevanToor]

Thanks for sharing! It is very helpfull😅🥰

[@fulilaoji7483]

Thank you very much!

[@ravindug]

amazing, unique content, unique channel

[@LytboxStudio]

Wow, thanks

[@educationmentor]

I had the same mistake, thanks a lot, this is very helpful :)

[@pedapodpera]

Very clever and helpful! Trank you! You should have more follower!

[@LytboxStudio]

I appreciate that! Thanks 🙏

[@dannygrio]

This was a brilliant explanation and tutorial! Thanks a lot for this and you are probably the only one who thought this right! Great content and keep them coming! :)

[@LytboxStudio]

I appreciate that! Thanks! 🙏

[@theworld2754]

Okay but the problem with elementor is that u have to give your post its title in quick edit. Elementor title dont changes the url. This is big problem. So i make title then i come to elementor to further edit. Ater title I give HI tag. Is it wrong?

[@cameliaiosif9944]

Very useful! Thank you very much!

[@LytboxStudio]

Happy to hear. Thanks!🙏

[@jcarlin596]

Excellent tip. Thank you for sharing

[@LytboxStudio]

Thank you Jim!

[@Liav-jc3cm]

Helped me a lot! Great video!

[@LytboxStudio]

Glad it helped!

[@famagolo]

Thanks man 👌

[@tatigarcia5192]

Far out!!!!! Thank youi

[@susangemayel-tapper3794]

Thank you, great tutorial

[@LytboxStudio]

Thanks! Much appreciated 🙏

[@vedprakash-yq9vc]

Thank you sir

[@OscarObians]

The use of the Elementor H tags vs Global fonts has confused since forever. Now I know the best way to approach it. Unfortunately, most themes also attach styling to the H tags as well adding to the confusion. But I think its easier to manage when using a theme like the blank Hello theme.

[@LytboxStudio]

Yah I never got it why the theme did the typography this way. Before Elementor I used to style up all titles with CSS for the SEO. Elementor has made this process so much easier and faster!

[@gerhardgroenewald6560]

Thank you

[@ianochka_lou]

So true, the H1 and the rest of the Hs are superconfusing in Elementor. Huge thank you for the video and the explanation.

[@LytboxStudio]

So glad it helped. I was also confused until I started learning SEO and what the H tags really are for. Many Thanks 🙏💜

[@Kneichion]

I didnt know that, Its going to change how I do things. Thank you.

[@LytboxStudio]

So glad to hear!

[@parthosarkar5270]

This is a great resource, even some school textbooks teach it wrong. Thanks for this :) Also, do you have a setup in every room? :p

[@LytboxStudio]

Thanks Partho! Yah man, been kind of a nomad lately moving around lol

[@jproquemore]

+1 just for the star wars sleeve. :-D

[@LytboxStudio]

Haha cool man! May the force be with you 🚀

[@harbourdogNL]

Did you design that site? Just had a look at it. Nice clean design, and a good treatment for copy-heavy material like that. I'm doing a mindfulness & meditation website and it's really hard to get around that "wall of text" when there's a lot of info to put on the page.

[@LytboxStudio]

I look at Designing Content as a step in the design process where I focus solely on the content and how to make it flow and connect with the end user. I believe it’s one of the most important steps in the design process

[@audaciouseloise]

Thank you so much for un-frying my brain!!

[@wgm247]

Great video.. i will redo my themes

[@LytboxStudio]

You’ll definitely improve your SEO and workflow:) I’ve had to redo mine in the past as well, it’s how I learned😁

[@damianmigaa7474]

amazing bro ;)

[@LytboxStudio]

Thanks! 🙏

[@roshan571]

please make one video on desktop screen sizes not on mobile but on the desktop I having an issue if you zoom the website all the images and title and description get scattered and if I see on bigger screen all get simply hell please help me.

[@LytboxStudio]

I have something on this coming up with a video I am making on building sites to be accessible that includes the zoom not scattering elements of the site. But a quick tip, it has to do with no longer using px for font sizes and images and instead using EM and %. This allows the elements to adjust to the zoom.

[@bigcdaddy280]

does it matter where you put it? For example, can I put an H2 near the bottom of the page?

[@mikeborgeld9683]

The webpage starts with h4 tages. I thought h2, h3 etc. should be after the h1 so the webpage does start with h1. Can you start a website with a tag other than h1?

[@LytboxStudio]

I wouldn’t have h4s at the top of the page. It’s best to have an H1 followed by an H2 above the fold. This is for SEO and the user experience. The H1 and H2s should let the user know what the page is for and the rest of the Hs as a way of structuring the hierarchy of content.

[@markosilander4515]

Thanks for the awesome tutorial Jeffrey! I have a question. When working with Elementor, do you disable the "default colors" and "default fonts" in Elementor settings? I'm not completely sure if it's a good idea to disable them. However, me neither have touched the "typography" settings.

[@LytboxStudio]

Thanks Marko! Yes, I always disable the default colors on fonts in the settings when using globals. This way Elementor’s default globals don’t show or override any of the globals I set up.

[@markosilander4515]

@@LytboxStudio Thanks for the reply. Nice to hear that I was on to something when disabling those defaults 🙂

[@pixelgap]

Nice video. One question. You have an h4 in the hero and then in another section below you have h1. Isn't that an SEO problem? Shouldn't the tag appear in order? Thanks

[@LytboxStudio]

It’s been a while since I created this video. Normally I always have an H1 and H2 in the banner. For rare exceptions I’ll add the h1 right below the banner but it’s best to add above the fold. The H tags don’t have to go in order and I rarely even use h4, h5, h6 tags. What I look at is the actual title with keywords in it and assign a tag based on the keyword hierarchy. For example, Page title is the H1 with most important keyword in it. The same keyword will be in the URL most of the time. Al main keywords going the H2 Titles describing the H2 and speaking more to the user than Google get the H3. It looks like this: Web design services - H2 Creating high performing websites - H3 The H2 has a primary keyword and H3 backs it up. Then I’d use H4 to back up the H3 and so. But really, most sites now I just use H2 + H3 combos and sometimes H4 and it’s working great. I have to take a look at this video again and see why I used an h4 in the banner. I normally wouldn’t do that

[@pixelgap]

@@LytboxStudio Thank you for the long answer Jeffrey

[@DarrenMcPhee]

Does it makes a difference if you use the header widget or the regular text editor widget if you change the tag afterwards? For example, could I just use the header widget for everything, even body text, if I change the tag to afterward? Thanks!

[@LytboxStudio]

I personally use the header tag for most content because it has 1 less div and for me is cleaner to use. I don’t see a harm to use either header or text widget. I use header widgets with set a lot of the times. Only sometimes with large paragraphs on content heavy pages like Terms where I am copy and pasting I will use the text widget.

[@DarrenMcPhee]

@@LytboxStudio Thanks!

[@eskerinola5845]

Excellent video. H Tags confuse me like you say. Every time I select an H tag, it's settings overwrites the typography I selected via Global fonts. How can I avoid that, leaving the H tag just to specify SEO importance? Thank you

[@LytboxStudio]

Thanks! And in the back Elementor settings, make sure to select disable Elementor’s default font and colors. As long as the typography styles aren’t set in Elementor or the theme, nothing should override the Global fonts

[@henningokholm7912]

Man I forgot the tip you gave like writing for SEO. Write key words and build the text.

[@sgo7806]

Nice Video! But why do you use a h Tag in the Hero section instead of a div? The Text there has No seo relevant content to me? 😬

[@LytboxStudio]

Good question. Content above the fold holds a lot of SEO value. The page title with the target keyword should be wrapped in an H1 followed by an H2 with secondary keywords or keyword phrases. And these should be above the fold (in the hero section) or very close to it. The contents used in this tutorial is just a demo. Every real site should have valuable content in the hero that lets the user know where they are at and H1s should always be up at the top followed by H2s letting Google know what the page is about.

[@sgo7806]

@@LytboxStudio Ok :-) i often see things like that: H4 > H1 > H2 instead of DIV(span,p) > H1 > H2, so why should there be a H-Structure above H1, that was the main thing i wanted you to say/ask. The above the Fold thing was something i did not realize that buch before, thank you ;-)

[@mario312]

Does it matter how far down in the code is the H1 tag?

[@LytboxStudio]

Do you mean how far down the page it is? If so I am not 100% sure if Google penalizes H1s in the middle or bottom of page. It’s best to have towards the top since Google does want the title to show right when the user lands on the site.

[@ronrichardson175]

I'm still a bit confused with the actual mechanics of how you use Elementor's Site Settings > Design System and Site Settings > Theme Style. Do you use the Heading Widget for all headings? Do you include any H tagged text in the Text Editor? How would you style an Icon Box Widget where it defaults to H3 for the title? If you didn't style the H3 tag in the Site Settings > Theme Style then it would have the style of the site's Theme.

[@LytboxStudio]

So I veneer use theme styles for fonts. Especially with Elementor. I mostly use the Heading widget even for small paragraphs. I would use a Paragraph widget only if needed, for example, a terms and conditions page. And when using a Paragraph widget, I would not use a header in it. The Icon Box is H3 by default but that con be changed in the widget settings. And you can use the Global Font style (not theme style) in the Icon Widget as well.

[@School_Me]

so how many h2 can i have?

[@roshan571]

Hi my name is Roshan, just i want to ask what measurement should i keep the design size for all screens in elementor while doing website or starting the website (in desktop all screens 18 to 32 inches screens) I'm confused and facing lots of design issue in screens so please let me know and give helpful tip for design for my future client. please thank in advance

[@LytboxStudio]

Great question. What I do is keep my containers between 1200px and 1350px depending on the design. And I keep a 12px - 20px padding on the sides. The key is keeping it consistent. Before starting the project/design, I determine the container size, top and bottom spacing between sections, and side spacing and keep it the same throughout the design. This will give the cleanest look and feel no matter the desktop size.

[@roshan571]

@@LytboxStudio thank you sir for the wonderful tip sir and i will focus on consitency thank you

[@GlobalReset-yu1jm]

Bro you in Thailand as I need some SEO help ?

[@LytboxStudio]

I live in Chiang Mai! Go to my channels about page, there contact details there. Cheers!

[@FirebrandVOCALS]

I thought the same way lol

[@LytboxStudio]

Nice! I've seen it happen a lot and hope it helps new web creators use title tags for SEO purpose instead of font size.

[@AllesPat]

I think typografie settings are only usefull for the styling of links... I dont know, what else the purpose of this module is.

[@LytboxStudio]

I agree, links and sometimes body text. I feel like they added it because that is what most themes used to do.

[@rajknowledge9774]

Hello, Thank u for this great video. Learned some new points of it. I have one offer for you I see that you don't add timestamp to your video, which is now beginning trend so audience have easier to saw particular part. I have deal , I will add timestamp for your video free for next 20 video. If you feel Its helping to grow your channel or making user time save. You can then hire me. Thank u

[@LytboxStudio]

Thank you for the offer and I appreciate the hustle. At this time I am good. Cheers

[@gorodrigue]

Regards from Chile !! Thank you for your videos, they are really helpful, is there any other plugins you recommend for SEO in WordPress & elementor? Thank you

[@grassyandris]

Hello, I don't think it's a good idea to change the order of the headings. order Eg .: h4 - h2-h1… Does Google tolerate this? Thank you so much for the video!

[@LytboxStudio]

Good point! It's best to have the H tags in a hierarchy. The H1 should be above the fold or close to it. For the rest I think it is the content in the H tags and are the H3s supporting the H2s. I wouldn't worry about the order on a page but the hierarchy in the content and titles with keywords and keyword descriptions.