FrontendWalla

Solutions for Real World Frontend Problems.

CSS

Frontend Performance Optimization Part 4 – Fonts

Good Typography is a fundamental requirement of any web design. Choosing the right Web font for your website improves Readability, Accessibility, and Trust in your brand.  In Order to Provide a Great Visual Experience Website uses something called “Web Fonts” these fonts are the fonts that will not be available on User’s Computer and would […]

Frontend Performance Optimization – Part 3 ( CSS )

we need to Work on Something Called Critical CSS, This is the CSS that is needed for showing the “Above The Fold” Content or CSS which is minimally required to display the viewable content. 

if you have a menu that is not visible, A Footer that would require scrolling of the page, etc. would all be considered non-critical.  With this understanding, let’s discuss points for CSS optimization.

Bootstrap the Frontend Framework for Non Designers.

So you are a Web Developer having an exciting idea flourishing in your mind. And you rush to your machine and start writing that awesome code that was never written before. And now you are ready to show it to your friends with all excitement. Your friends think the idea is fine but it doesn’t looks good and then you get a […]

Reset Stylesheet: How to Handle Cross-Browser Differences?

I discovered a file reset.css in one of our Project’s css folder. I went ahead googling the purpose of this file and found it’s interesting use. Browsers as we all know are different in their interpretation of certain things. Default line-heights, margins font-sizes being some of them. What this means is that a header on […]

How to Jump to a section of a Page?

In long pages having large content divided into sections, it’s a good usability practice to provide links to different sections on the top of the page. See this beautiful Site. Here in this one page site News | About Me | Portfolio etc are links that jump you to a section on the page.   Also […]

How to Create Tabs and Make a Tab link shareable

Tabs are used to show data of same context. Below we will discuss how to create Tab’s using simple HTML CSS and Javascript and then we will discuss a behavior users demanded from these Tabs and how we applied “Fragement Identifier Pattern” a frontend design pattern to modify the functionality. You can skip the code if you are just interested in understanding the design […]

Scroll to top