1. Authors
  2. Joshua Johnson

Joshua Johnson

Joshua Johnson

Equal parts editor, writer, designer, and photographer. Hit me up on Twitter, or check out my photos.

Web Design Critique #75: Income Diary

Critique / 28 Jan 2012

Web Design Critique #75: Income Diary

Every week we take a look at a new website and analyze the design. We’ll point out both the areas that are done well in addition to those that could use some work. Finally, we’ll finish by asking you to provide your own feedback.

Today’s site is Income Diary, a blog that offers simple, practical advice for how to earn money online. Let’s jump in and see what we think!

Weekly Freebies: 15 Free Business Card Templates That Don’t Suck

Freebies / 27 Jan 2012

Weekly Freebies: 15 Free Business Card Templates That Don’t Suck

Business cards are an awesome creative outlet where designers tend to push themselves to come up with unique and interesting solutions. If you’re a newbie to business card design though it can be difficult to break out of the cliché unoriginal layouts that will no doubt pop into your head. This post of over 15 free layered business card templates should help you out.

As a bonus, we’ve included not only layered business card templates, but a few editable 3D mockup files as well so that once you start creating your own awesome designs, you can show them off in style.

Addictive UX: Why Pinterest Is So Dang Amazing

Business / 25 Jan 2012

Addictive UX: Why Pinterest Is So Dang Amazing

Today we’re going to examine a very specific example of good design and discuss what makes it so successful. Along the way we’ll discover the importance of good design and how to structure experiences that turn users into addicts.

We’ll hone our sights in on Pinterest and perform a seriously in-depth analysis to see why this seemingly generic idea seems to stand so far out from the competition. The ultimate conclusions will equip you to design experiences that your users will absolute love.

Jumpstart Your Web Project With HTML KickStart

CSS / 24 Jan 2012

Jumpstart Your Web Project With HTML KickStart

Recently, we took a look at a really solid framework from the good folks at Twitter called Bootstrap. This toolkit is a swiss army knife of utilities and includes both a functional layout grid and enough pre-styled elements to get a great jumpstart on any project.

Today we’re going to look at a very similar tool from Joshua Gatcke called HTML KickStart. This framework is simply overflowing with great stuff that will enable you to build web page prototypes at light speed. Let’s jump in and build a page with it to see what we think.

Nailing Browser Support in CSS3 and HTML5: Invaluable Resources to Use Today

CSS / 23 Jan 2012

Nailing Browser Support in CSS3 and HTML5: Invaluable Resources to Use Today

New technologies are making web development more exciting than ever before. HTML5 and CSS3 provide a double dose of modern practices that are absolutely refreshing and empowering. Unfortunately, utilizing these technologies can considerably complicate your quest for cross browser compatibility.

How can you know which techniques are safe to use now and which you should either provide alternatives to or avoid altogether? Join us as we take a look at a handful of our favorite resources that quickly and easily help you make informed decisions about real world HTML5 and CSS3 implementation.

Weekly Freebies: 6 Sophisticated and Free Didone Fonts

Freebies / 20 Jan 2012

Weekly Freebies: 6 Sophisticated and Free Didone Fonts

Didone typefaces (also known as Moderns) are a particularly classy type of font that is characterized by heavy contrast between the thick and thin portions (the vertical parts are thick) and typically very thin, unbracketed serifs. They’re a lot like slab serifs that want to be upscale and fancy.

This particular classification of typeface is one of the rarer breeds to find in the free font world so be sure to take all you can get. Today we’ve got a great little collection of six beautiful and free Didone fonts for you to download and enjoy.

Create Amazing CSS Buttons on the Fly With CSSButton.me

CSS / 19 Jan 2012

Create Amazing CSS Buttons on the Fly With CSSButton.me

Today we’re going to have some fun as we take a look at an awesome new free tool for web developers simply called CSS Button. This web app makes it quick and easy to make the CSS buttons of your dreams using simple and intuitive controls.

I’ve seen quite a few other CSS button makers before and almost none really merit repeated use, but this site has a lot going for it and can genuinely save you a lot of time and frustration. Let’s jump in and check it out!

Beating Borders: The Bane of Responsive Layout

CSS / 18 Jan 2012

Beating Borders: The Bane of Responsive Layout

Responsive design often requires setting your widths using percentages. This is easy enough to accomplish, that is until you start throwing borders into the mix. If your columns and total width are set using percentages, a static border size wreaks havoc on your layout.

Today we’re going to look at a couple of different ways to beat this problem. You’ll learn how to create a completely fluid layout that doesn’t mind extra borders or padding one bit.

New Logos for the Marlins, Orioles and Jays: Did They Get Better or Worse?

Graphics / 17 Jan 2012

New Logos for the Marlins, Orioles and Jays: Did They Get Better or Worse?

With a new year always comes new branding attempts. Organizations want a fresh face to signal progress and ongoing evolution and branding is the vehicle that designers use to achieve this goal.

As we all know quite well, this is a risky venture with large entities. If it goes well, your customers (or fans in this case) love you for it. If it doesn’t, you’re setting yourself up for plenty of public ridicule. Today we’re going to venture into the world of sports and check out three new Major League Baseball team logo designs. Which teams are updating their look for the new year? Were they successful or is the result a surefire embarrassment? Read on to find out!

Weekly Freebies: 12 Fantastic, Fresh and Free Icon Sets

Freebies / 13 Jan 2012

Weekly Freebies: 12 Fantastic, Fresh and Free Icon Sets

It’s 2012 and time to refresh your stock of web design icons. Stop using the same old sets and add some new resources to the mix. Today we’ve got twelve awesome icons sets that are completely free to download and use.

No matter what type of project you’re working on, we’ve got your covered. From general purpose web design icons to social media and payment methods, these twelve sets cover an impressive range of potential uses.

When the Photo Doesn’t Fit the Space: Tips and Tricks for Making It Work

Graphics / 12 Jan 2012

When the Photo Doesn’t Fit the Space: Tips and Tricks for Making It Work

You’ve been there a thousand times, staring at a big empty canvas that simply doesn’t seem to work with the photo that the client has provided. Perhaps you have a vertical space and a horizontal photo (or vice versa), or maybe the image is simply too small to resize without unacceptable quality loss. What now?

Today we’ll go over some tricks of the trade and teach you how to cope with images that don’t fit where you need them to. The next time you run into a problem, you’ll be ready!

Build a Fun Trivia Game With the CSS Active Selector

CSS / 11 Jan 2012

Build a Fun Trivia Game With the CSS Active Selector

We’ve done a ton of fun stuff recently with the :hover selector. From button hover effects for beginners to more advanced hover tutorials and even onto using hovers with multiple backgrounds. Today we’re moving on and learning about a related but equally awesome selector that often gets overlooked.

With :active, we can control the state of an object while it’s being clicked. Typically, this takes the simple form of changing a link’s color while the mouse is pressed down, but we’re going to do something much more interesting. Follow along as we build a super cool, pure CSS presidential trivia game.