Tags

Front End

1) [WEB] Voiceover doesn't work on the Mozilla (Mac)

Since last a few months, I am learning accessibility. Recently while testing the accessibility tools I stumbled on an interesting issue on Mozilla (Mac) with voiceover and I was not able to figure out that is the issue is on my webpage or not?

I went out and tweeted about it. Here is the screenshot of the problem and solution (not exactly the solution but the reason for the problem).

The good news is Mozilla is planning to support Voiceover support for Mozilla(Mac).

Alt Text

2) [CSS] Inline elements white space

This is something I came across while working with my team. In our web application, we were having 1px weird space between our buttons. We debugged but no luck for the source of 1px space. A quick Google explained the issue.

If you have inline or inline-block elements there will be 1px space but the fix of this is most weird.

Why it is happening?
HTML preserves the whitespace between the inline/inline-block elements.

Solution:

  • Make inline elements block
  • gzip or minified the HTML code. There should be no white-space
  • Add comments between inline elements
  • Make the element's font-size: 0;

Read more: https://css-tricks.com/fighting-the-space-between-inline-block-elements/

3) [WEB] Fonts support for the localization

At my work, I am working on the Design system. Our Design system will be used by many products worldwide which means we will be supporting different languages. Currently, we have products with 12+ languages. Our design system should able to support 12+ languages.

For this, the first task is to identify the font-family and working on the usage guidelines with every language. The reason is the font properties that are working fine with the 'English' or 'German' might won't work with say 'Japanese'. The default 1rem and font-weight 800 which is visually looking good for English might not be readable with other languages.

So, I learned about these requirements and what is required from the developer.

4) [FRAMEWORK] Vuejs Gridsome

I am learning VueJS and I stumbled upon Gridsome and I am loving it. I loved my experience with it. Whenever does a ReactJS developer ask me what it is? My response to them - 'It is Gatsbyjs of Vuejs'.

For more information: https://gridsome.org/

I am working on a small project to learn and implement the Gridsome. My learning curve is very smooth so far and documentation is pretty awesome.

5) [JAVASCRIPT] instanceof

JavaScript is a programming language where one can learn every day something new. Strangely we developers are so busy in delivering the tasks that we rarely get time to go under the hood of the languages.

instanceOf operator checks whether the constructor instance falls anywhere in the prototype chain of an object. This is helpful when you have nested inheritance and want to check is the constructor instance is falling anywhere in the prototype chain of an object. Just to be clear it does not check that instance is a prototype of an object or not.

isPrototypeOf() differs from the instanceof operator. In the expression >"object instanceof AFunction", the object prototype chain is checked > against AFunction.prototype, not against AFunction itself.

For more information: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/instanceof

6) [JavaScript]URLSearchParams

This one I learned while working on the vanilla JS application. I wanted to get the params from the URL. Instead of having the old trick of using replace() or slice() to get the params, JavaScript has URLSearchParams an easy way to get the params.

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams

Happy Learning!!


Guest Blogger

Special thanks to our guest blogger Neha Sharma, a Manager UI CoE at HCL Technologies: HCL Software Division for her contribution to the Ronald James Blog this week.

Visit the original link for this blog here.

 

Who Are Ronald James?

We are a leading niche digital & tech recruitment specialist for the North East of England. We Specialise in the acquisition of high-performing technology talent across a variety of IT sectors including Digital & Technology Software Development.

Our ultimate goal is to make a positive impact on every client and candidate we serve - from the initial call and introduction, right up to the final delivery, we want our clients and candidates to feel they have had a beneficial and productive experience.

Contact our Team

If you’re looking to start your journey in sourcing talent or find your dream job, you’ll need a passionate, motivated team of experts to guide you. Check out our Jobs page for open vacancies. If interested, contact us or call 0191 620 0123 for a quick chat with our team.

Let's be Friends!

Follow us on our blog, FacebookLinkedInTwitter or Instagram to follow industry news, events, success stories and new blogs releases.

 

 

Back to Blog

</Follow Us>