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.

Weekly Freebies: 12 Free Icon Fonts Perfect for Web Design

Freebies / 3 Mar 2012

Weekly Freebies: 12 Free Icon Fonts Perfect for Web Design

Every week we search all over the web and bring you a handpicked selection of the finest design freebies around. We do all the research and you reap the benefits!

This week’s collection of freebies contains twelve awesome free fonts that double as icon sets. Icon fonts are perfect for serving up to the web via @font-face and make for an incredibly versatile way to add interesting but simple graphics to your site. Icon fonts can be pretty pricey but you can grab all of these without spending a cent!

Massive Inspiration Roundup: 140 Dribbble Debut Thank You Shots

Inspiration / 1 Mar 2012

Massive Inspiration Roundup: 140 Dribbble Debut Thank You Shots

Dribbble started as a very small, targeted way for a handful of designers to share the things they were working on. It has since grown into a fairly massive network that houses an unbelievable range of design related talent. Despite its growth, the network remains fairly closed. Unless you can score one of those rarely issued invites from a faithful user, you’re a mere spectator.

Those who do score invites are incredibly appreciative, so much so that it’s become an incredibly popular trend to spend your all important debut shot on a graphic that serves as a thank you message to the person that invited you. Browsing through all of the various ideas that designers come up with to visually thank each other is fascinating. We’ve spent hours looking through these shots and today bring you a massive collection of 140 of them. Enjoy!

What’s the Deal With Display: Inline-Block?

CSS / 29 Feb 2012

What’s the Deal With Display: Inline-Block?

We’ve been using floats for layout pretty much since we left tables behind. It’s a quirky solution that can often cause troubles, but if you know what you’re doing, it works.

One interesting alternative to floats that people are turning to more and more lately is to set the display value of an element to inline-block. What does this do exactly? How is it like a float? How is it different? Let’s dive in and see what we can discover.

5 Quick Ways to Make Your Site More Mobile Friendly

Mobile / 28 Feb 2012

5 Quick Ways to Make Your Site More Mobile Friendly

If you’ve ignored mobile platforms in the past, it can be intimidating to finally make the jump and begin to support mobile browsing on your existing sites. There’s so much to learn, a million techniques to choose from and a limitless amount of work that you could potentially put into existing projects.

A question that designers and site owners alike always want to know is, “How can I quickly add mobile support?” Sometimes, you don’t have the budget to start from scratch and yet still desire a modicum of mobile goodness. Today I’ll walk you through five things that you can do to make your site more mobile friendly.

Super Sweet CSS 3D Text Effects With Sass and LESS

CSS / 27 Feb 2012

Super Sweet CSS 3D Text Effects With Sass and LESS

I was recently discussing the merits and various features of CSS preprocessors with a colleague. We covered all of the basics: how it’s great to have variables and how mixins can save you an incredible amount of coding time. When the conversation turned to some of the more obscure features though things got interesting. When I brought up the various color operations, my colleague boldly proclaimed that no “real designer” could ever find a legitimate excuse for using this feature and not picking his own colors manually.

In the words of Barney Stinson, “challenge accepted!” Today we’re going to create an awesome faux 3D text effect with pure CSS and then see why it’s a lot easier to do it with the color operations in Sass or LESS.

Weekly Freebies: 35 Free Textures for Spring

Freebies / 25 Feb 2012

Weekly Freebies: 35 Free Textures for Spring

Every week we search all over the web and bring you a handpicked selection of the finest design freebies around. We do all the research and you reap the benefits!

This week’s collection of freebies contains thirty-five textures that will have you aching for winter to pass and spring to begin. You’ll no doubt have some seasonal design projects coming up so be sure and grab a few of these in advance!

Do We Still Slice PSDs?

CSS / 24 Feb 2012

Do We Still Slice PSDs?

The other day a friend of mine said something that caught my attention, “I’m trying to learn how to slice a PSD.” It’s a simple enough statement. As soon as he said it, I knew exactly what he was talking about, and yet, there was something in there that didn’t quite set right.

Upon seeing my hesitation my friend responded with a question, “Do we still slice PSDs?” Great question! For beginners, jargon isn’t merely jargon, it implies a process and suggests a method of action. For this reason, it’s often helpful for more advanced developers to define their terms in a way that is meaningful to others. Today we’ll dive into the theory behind the process of converting a PSD to to a web page and end with a discussion on the ups and downs of designing in the browser.

Responsive Design: Why You’re Doing It Wrong

CSS / 22 Feb 2012

Responsive Design: Why You’re Doing It Wrong

Responsive design isn’t a fad that arose because of a cool CSS technique, it’s an answer to a problem. Always remember that and constantly ask yourself whether or not you’re really adequately addressing that problem. If you’re using copy and paste to insert your media query breakpoints, your solution might be flawed.

Let’s discuss why media queries exist and how we can leverage them to truly solve the quandary of the ubiquitous web. Let’s talk about why you should let your content determine the breakpoints of a layout, not hypothetical screen sizes.

The Brutally Honest Tale of My First Web Design Meetup

Business / 21 Feb 2012

The Brutally Honest Tale of My First Web Design Meetup

You should connect with the web design community in your area. At least, that’s what you keep thinking. It’s one of those bucket list items that you always mean to do but never really get around to pursuing. As someone tirelessly dedicated to brining you the scoop on all things design related, I took the plunge for you.

I researched local gatherings of web designers, chose a group, made the drive and talked to real people face to face about their pursuits in web design. I’ll walk you through the entire experience, including that inevitable part where you’ll simply decide not to go, so you can follow in my footsteps and do something similar in your area. Was it difficult to find a meeting to attend? Was the entire experience a socially awkward nightmare? Do I recommend it? Will I go back? Read on to find out.

Weekly Freebies: 20 Really Cool Retro Web Elements

Freebies / 18 Feb 2012

Weekly Freebies: 20 Really Cool Retro Web Elements

Every week we search all over the web and bring you a handpicked selection of the finest design freebies around. We do all the research and you reap the benefits!

This week’s collection of freebies contains twenty irresistible retro and vintage web design elements. We’ve got everything from icon sets to badges and background patterns. Be sure to add these to your collection of resources so you can bust them out the next time your design needs to resemble something from a bygone era.

Web Design Critique #76: IdentyMe

Critique / 17 Feb 2012

Web Design Critique #76: IdentyMe

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 IdentyMe, a free virtual business card service. Let’s jump in and see what we think!

4 Fun CSS Image Effects You Can Copy and Paste

CSS / 16 Feb 2012

4 Fun CSS Image Effects You Can Copy and Paste

Once upon a time we relied purely on Photoshop to create fancy image effects. These days though we’re turning more and more to pure CSS to add eye candy to our images. Applying custom image treatments using code makes for an infinitely flexible workflow that’s easy to tweak at any time.

Today I’ll walk you through creating some extremely simple and fun CSS image tricks. From polaroids to vignettes, you won’t believe what we can pull off.