Updated on May 21, 2015 in Learn
3 Simple Design Tests to Improve Your Aesthetics
Developers often use test driven development to write simple and reliable code. Sometimes too much testing can slow down the development of a product, but in general, it’s a smart idea. The web design community doesn’t have a perfect analog to…
Updated on May 21, 2015 in Learn
CSS Sprites with Background Positioning
There’s nothing more common than hover states to give your website some life. The user comes to your site, scrolls over an image with their mouse cursor, and the image changes. That’s it. While I spent most of 2012 learning…
Updated on May 21, 2015 in Learn
Multiplane Design with SVGs and CSS 3D Transforms
Recently I tweeted about my experimentations with an idea that I’m calling multiplane design. I’ve been experimenting with multi planing using 3D and SVGs: http://t.co/l4h1slT4jK Only works on desktop Chrome/Safari (for now). — Nick Pettit (@nickrp) August 4, 2013 Right…
Updated on May 21, 2015 in Learn
50 Homepage Website Layouts using Featured Details & Icon Lists
The trend of icon detail lists has be rising very quickly but silently. I have not seen many other designers writing about this topic, and my hope is to shed light onto the trend with some beautiful examples. Generally startups…
Updated on May 21, 2015 in Learn
CSS Tip: A Better Clearfix with Sass
The CSS clearfix has been a must-have in our web design toolkit for quite some time and, until new layout features like flexbox become more stable, we’ll always need some form of clearfix in float based layouts. There are several…
Updated on May 21, 2015 in Learn
Building Your Ecommerce and Design Business with Shopify
Let’s be honest, you are probably reading this blog because you are a user of Treehouse or thinking about becoming one. You have a thirst for web knowledge and a desire to become better at what you do – right?…
Updated on May 21, 2015 in Learn
CSS Tip: Better Rounded Borders
We’ve all used border-radius in our designs to round the corners of images, divs, navs, etc. But have you ever noticed what happens when a thick border is added to an element with a border radius? As we learned in…
Updated on May 21, 2015 in Learn
Build a Gmail-Style Expanding CSS3 Navigation Menu
Users of GMail should be familiar with sliding effects of the inbox side navigation. In the most recent design you will find the GChat/Hangouts box along with other various email tags(inbox, trash, etc.). When you have a large number of…
Updated on May 21, 2015 in Learn
Triggering CSS Animations with Sibling Selectors
Combinators describe the relationship between CSS selectors, and they’re commonly used to combine two or more selectors into a more specific selector. Examples of combinators are the greater-than sign (>), plus sign (+), and tilde symbol (~). If you’ve ever worked with descendant selectors,…
Updated on May 21, 2015 in Learn
Startup Design Examples of Login Forms and Signup Pages
There are plenty of great startup websites using signup forms to capture early users. Both email newsletters and user accounts are two methods for bridging new people into your startup. A crucial aspect to a successful registration form is the…
Updated on May 21, 2015 in Learn
Fixed Headers and Navigation Bars Used in Web Design
The trend of fixed heading styles in web design has grown exponentially in recent years. I have read a lot of criticism, both for and against these techniques, and generally it boils down to personal preference. Lots of designers have…
Updated on May 21, 2015 in Learn
WordPress Plugins for Custom User Voting Functionality
The open source WordPress CMS is typically installed to fill the void as a blogging platform. Many webmasters also choose WordPress for handling static pages with a backend interface. But the additional library of free WP plugins can only add…