If you are new to software development, frontend developers are the ones that bring designs and functionality together. They are the glue that connects pretty images that designers make together with the functionality and logic built by backend developers, so websites look and work how they should. Every website you visit, what you see and interact with is created by frontend developers! In their work, they make use of three main tools - HTML5, CSS and Javascript. HTML is used for building the page structure, CSS is responsible for page rendering while JavaScript brings in the interactive elements. Together, these three technologies bring websites to life.
So what are the common mistakes frontend developers make?
Cross-Browser compatibility : Since each browser renders pages differently, developers need to test the site fully on each browser to ensure cross-browser compatibility. It is a lengthy process but if you care for user's experience, you know this is is important. There are tools out there that help with testing, such as BrowserStack, CrossBrowserTesting, LambdaTest, and others. Check them out. Whatever you do, do not skip testing!
One HTML for everything: Most developers put everything into one HTML file. They put HTML, CSS and Javascript in one file. This is a bad practice. Move your Javascript files into and external folder and get familiar with native web components. Frameworks like Vue or React can help you implement modular components easier, you might want to look into that.
Autoplay: It is annoying when you open a website and suddenly a video starts blaring noise in our ears😐. While developers are actually trying to prevent it, they use the attribute ‘autoplay” in the video’s source tag, then set it to “false”.
The issue here is that “autoplay” is not a boolean type variable, it doesn’t work based on “true” or “false" rules. So instead, the browser sees the string and ignoring the “false” setting attempt, auto plays the video. The simplest solution is to remove the attitude or use an attribute like “autostart” that is working by boolean preferences.Forgetting input validation: Don't make the assumption that your users will input the proper data in the right fields. It is highly recommended to use input validation at all times. It ensures the correct data in the correct format is stored in your database, it is a good UX practice and is highly beneficial for your security, since it helps prevent injection attacks, systems compromises, and memory leakage.
Finally,
Not focusing on site speed: Site speed affects bounce rates, conversion rates, revenue and user satisfaction. Site speed depends on various factors. For example, client side can become slow due to “Spaghetti” JavaScript code. Large images can slow down page loading speed too. Slow sites frustrate users, thus it’s beneficial to put into use site speed testers that identify design elements responsible for slowing down your site. Good JavaScript libraries and supported code help design a responsive and mobile friendly site 👌.
Connect with me:
Twitter : @DaCodess
Instagram: @realsuccess._
Top comments (1)
Good one! 💯