6 COMMON Website Mistakes That You're Making

What I use to build amazing websites:
Elementor (the best WordPress page builder): be.elementor.c...
Awesome, affordable hosting (the server your website needs to exist): www.hostg.xyz/...
🧙 Wizards of Webcraft - A series where I’ll be reviewing your websites - www.reialesa.c... Apply now!
Designing and building websites is difficult. Mistakes are inevitable and they're an important part of the process we all go through. Still, a lot of mistakes, like the ones in this video, can easily be avoided and fixed.
We're going to take a look at 6 very common mistakes that are hurting your website. Some of them negatively impact your SEO, some hurt your user experience and some simply ruin your otherwise awesome design. Some of them actually do all three at the same time! And, as a result, they all stand in the way of increasing your conversions.
By learning to identify and fix these mistakes, you'll become a better designer and a better website developer. And, by improving the UX and the UI of the websites you design and build, you'll improve and increase the conversion rate on those websites as well.
#ux #webdesign #webdevelopment
Get in touch:
www.reialesa.c...
Don’t be shy! Let me know what you’d like to see next, ask me anything related to design or just simply say hi.
Please note that some of the above are affiliate links, which means I earn a commission if you make a purchase, at no additional cost to you. Thank you very much if you decide to use them!

[@MarcKiben]

Learned a lot again! Thank you sir! ❤

[@Reialesa]

That's awesome to hear! Thank you for your kind comment, I appreciate it! 🙌

[@BenEllis-jd1mc]

Really great video! I would love to see how you made your website navigation menu (or one similar) It's a great style, and I've not found any videos on YT that show anything similar!

[@Reialesa]

Thank you, Ben! I'm really glad you liked the video. When it comes to the website navigation, do you mean the hover effect that happens on the desktop version, just the overall layout or the mobile version? Also, are you interested in the design or the actual process behind building it? I'll likely be making a video about some different website menu designs in the near future. Thank you, again, for your much appreciated support! 🙌🙏

[@BenEllis-jd1mc]

@@ReialesaApologies for not being more specific. I would love to see the process behind it (tutorial) for the hover menu and the mobile menu. There are other popup tutorials but yours is very clean and professional looking!

[@Reialesa]

Thanks for letting me know. 😃 I can't exactly say when or even if I'll be making a video on this, but I appreciate the idea. I can definitely give you some pointers, though! The menu on desktop is a mega menu. It's pretty straightforward and if you know how to use containers, you shouldn't have any issues: elementor.com/help/create-mega-menu/ The only ''special'' part about it are the hover effects. Namely, the arrow sliding in and the text changing colors. You can get a pretty clear idea about how to achieve both of these effects by watching these videos: kzbin.info/www/bejne/noPKg6ioht2qbNU and kzbin.info/www/bejne/ppSYaJVpj7mEr6c The first video will show you how to create the color change on hover and the CSS you can find in the second video will give you a pretty clear idea of how to animate the icon. For the mobile and tablet versions, the menu is, like you said, created using a popup. You just add an icon widget into your mobile header and make it open a popup, which contains all of your elements, including a button that closes the popup. More about this here: elementor.com/help/popups/ (scroll to the bottom). For the smooth animations in your popup, you can just use Elementor's options under ''Advanced'' - ''Motion Effects'' - ''Entrance Animation''. Just make sure that you create a popup for your mobile version and a popup for your tablet version. Unfortunately, Elementor's popups can be buggy and responsive settings apply poorly to them. So it's best if you keep them separate. You'll also need 2 different icons, one visible on mobile and one visible on tablet. The mobile one opens the mobile popup and the tablet one opens the tablet popup. One important thing to note is that the padding in your header and in your popup, for the logo and the open/close buttons (and any other elements you want to keep static) should be identical. That will make sure you get that smooth transition where static elements actually remain static, instead of moving around slightly. If you want a better idea of which units to use for padding, I recommend you check out my video that discusses units in Elementor. That's pretty much it. The rest is just polishing out the details. Let me know how it goes! 💪

[@Cellcorner]

good advise, I am removing social links from top as we speak )

[@Reialesa]

That is a great idea and I'm happy you found my advice useful! Thank you for your support, I appreciate it. 🙌🙏