Now that we’re done talking about SASS let’s now talk about learning LESS. If you haven’t seen my SASS tutorial, I recommend you check it. In our previous tutorial, we listed down the drawbacks of CSS and how pre-processed methods can improve your workflow. We also talked about how to implement SASS using variables, nested, mixins, functions and so on. So we’re ready to take another learning curve with another pre-process method which is LESS.
LESS in a Nutshell
LESS is a dynamic style sheet language that extends CSS and, just like SASS, it has dynamic behavior such as variables, mixins, operations and functions.
It allows you to write CSS in a simpler way by just using and combining mixins, functions, and so on. LESS also increases readability and organization of CSS using imports, nested rules and comments with .less extension.Read More
Writing a lot of CSS can be overwhelming that is why learning SASS and LESS can make any web developer and designer’s life much easier. For a beginner, you might find it fine but as time goes by and your CSS skills are improving. You begin to wonder if there is a way so that you don’t need to repeat a lot of CSS codes in your style sheet. The good news is, there is one! Thanks to the CSS pre – processor, it’s now possible to write concise CSS codes without repeating each of them again and again. It is even formatted nicely. You can perform computations and do dynamic styling using these pre-processing methods. There are two pre-processing methods that I will tackle: SASS and LESS. For this tutorial I will talk about SASS first and then on a separate tutorial, I’ll talk about LESS.Read More
Many have been searching for cross-browser styling tips that can help them solve their browser compatibility problems. After all, creating a website can be easy but developing one that looks the same on all browsers can be tough. For many years, browser compatibility is one of the hardest parts of web development.Read More
If Jimmy Neutron were real, could he become a pretty decent web designer? Of course, he would. For starters, he knows the anatomy of the Atomic Design. He could be designing the best web pages you will ever see, and make your eyes shed blood out of extreme admiration of his designs. And you’ll probably wonder why he is that good.
Well, for one thing, Jimmy Neutron understands a fundamental yet commonly unappreciated principle in web design. He knows how to work on a very potent tool to his full advantage. Using this tool, he could easily design mock-ups and code them without difficulty.Read More
Parallax websites are one of the latest and biggest trends on the web for some time now. If you want to impress your clients or implement immediate impact on your site, this is a good choice for you. In this tutorial, I’ll teach you how to create a simple but beautiful parallax website that will create an illusion of 3D depth to your site. It will surely catch your viewers’ attention. So let’s dig in.Read More
People hate waiting. It is a fact that web designers and developers should accept. It has been quite a maxim that as designers, we shouldn’t make our viewers wait. This is because many people tend to get bored and choose a website that loads faster. And that, my friend, is a big no-no.
However, waiting is seemingly inevitable. Despite modern internet connection speeds, some browsers still take time to load web elements. So it becomes a need to make people still want to visit your website even if it takes a little bit of time when they load it. There are a lot of plausible solutions for this, and I have to say, that our topic for this article is one of these.Read More
Converting PSD to HTML/CSS might intimidate you at first since it’s a brand new world, especially for long-time Photoshop users. A basic knowledge of HTML and CSS won’t hurt; beginners might find these tutorials a bit dizzying but, hey, it’s worth a try. And believe me when I say to you, finding a good teacher who will teach you for free (or for a small amount) is just another difficulty waiting next door if you don’t start now.Read More
In this tutorial, we are going explore the basics of jQuery animations for you to get prepared for advanced designs. Animations is the core functionality behind the interactive elements in web design.
The design of a website plays a major role in attracting visitors on a consistent basis. Interactive designs get more attention compared to the plain old static designs.
Let’s get started!Read More
Today we continue the series of tutorials on basic HTML5 and CSS3 coding and we jump even deeper into CSS3 with this video on how to design a pricing plan.
If you own a product which you sell only on a subscription basis, then you will probably need pricing tables in order to showcase your product and the purchase options better. This tutorial will teach you how to do that.Read More