The Hamburger Icon Debate

Type “hamburger icon” into Google and once you scroll past the images of the icons, you’ll notice a few articles about the history of the icon and a lot of articles debating if it’s the solution for all our small screen navigation problems or if the hamburger icon will destroy humanity. You know the usual overreaction to every topic that involves designing websites.

Continue reading

Why You Should Start Learning More About Icons

One of the challenges in designing websites for smartphones is the small screen size. It can be difficult to fit even basic things like navigation labels on smaller screens and when you do fit them all in there’s often a lack of space between links leading you to click one you didn’t intend.

Continue reading

Sass: When To Use @mixin And When To Use @extend

Mixins are ways to reuse styles across your project and their ability to take arguments makes them very powerful and flexible. The @extend directive allows you to reuse styles by letting one selector inherit those of another. In some respects they both do the same thing so which one should you use?

Continue reading

Sass: The @mixin Directive

Being able to reuse code across a project has benefits in maintenance and development efficiency. So far in this series, I’ve talked about the @import and @extend directives and both help to make your code more reusable. Sass also offers the @mixin directive as a means for reusing code.

Continue reading

Sass: Placeholders and @extend-Only Selectors

Sass’ @extend directive allows one selector to inherit the styles of another and it does so in a way that produces DRY CSS code. When combined with placeholders you can further abstract your code so that some styles are compiled only when extended and used in another selector.

Continue reading