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).
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.
- 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;
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.
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.