References

1
5 Trending Fonts for 2014

Font styles and trends are always changing; and new font styles are always being created. In order to keep your designs fresh and current I will go over 5 fonts that will be trending for 2014. Although sans-serif is on top right now, I believe serif fonts will be making a comeback this year. All of the fonts I will list below are free for both personal and commercial use.

1. Open Sans

Open Sans is a great font for both headings and paragraph text. It is easy to read and a simple font, so it’s great for the current web design trends of simple & minimal.

Open Sans Font

2. Roboto

Roboto comes in many varients, both condensed & bold, as well as serif and sans-serif. Roboto is a great font for use with main headings like h1’s and h2’s.

Roboto Font

3. Lato

Lato is yet another clean and modern looking sans serif font. It is a very crisp font that works great for both headings and normal paragraph text.

Lato Font

4. Droid Serif

Created for the Android platform, Droid Serif is a perfect font for readability. This font goes great for use in both paragraphs and headings.

Droid Serif Font

5. Arvo

Arvo is a very clean and more modern serif font that has gained popularity in recent years. It is a very clean cut font that is great for use on screen and print.

Arvo Font

2
Web Safe Colors

Out of no other reason but pure boredom (and for fun), I created a little website to showcase all of the web safe colors. I actually started this project years ago when I first got into web development, but in my amateur-ness (is that a word?) I was using images to showcase the different colors (not sure what I was thinking).

Fast forward to a few months ago, I decided to finish this project with one goal in mind, make it super simple. I think I accomplished that goal as the site has only the bare essentials to serve its purpose, plus it only weighs 70kb.

Anyways, the site showcases the 216 web safe colors in a grid pattern. When you hover over each color it displays the RGB, HEX, and HSL color codes for that color. Why those color codes? Well because those are color codes used in CSS for the web :) I hope this site becomes of some use for those of you in search of web safe colors and I tried to make as user friendly as possible so enjoy!

Web Safe Colors

Web Safe Colors by Zac Knoblauch

Web Safe Colors by Zac Knoblauch

0
5 Great Books to Learn WordPress

WordPress is taking over the web, seriously. There are over 70,666,336 WordPress websites in the world and over 374 million people visiting WordPress sites each month, that’s insane! With more and more people switching their websites over to WordPress comes the need for more and more people to learn how to use WordPress.

Lucky for us, the amount of online resources for WordPress is almost infinite, if you have any issues with WordPress you can simply Google them and be on your way to learning how to solve them in minutes.

Beyond the greatness of WordPress support forums, stackexchange, and various other online WordPress resources, there are some very informative WordPress books out there. Here I have compiled a small list of 5 great books to help you learn WordPress.

These books range from beginner status for those of you just looking to learn the basics, to expert status for those looking to dissect WordPress and dive into some code.

1. WordPress for Dummies

Category: Beginner

WordPress for Dummies is a great book for those of you who are just starting out with WordPress and wanting to learn the basics. Before I even got into web development I had purchased this book to learn how to quickly set up a website using WordPress (it was an older edition).

The book starts out covering the very basics of WordPress like how to set up a WordPress site, learning how to navigate through the dashboard, and creating and organizing posts. It also talks about choosing the right plugins, media management (videos, pictures, etc.), installing themes, and it ends with tweaking the WordPress themes (touching in coding and more advanced stuff).

WordPress for Dummies

2. The Tao of WordPress

Category: Beginner to Intermediate

Written by Jeff Starr (co-author of the popular WordPress book “Digging into WordPress”), The Tao of WordPress is a 300 page book that covers everything relating to WordPress for beginners to intermediates. This book guides you through the process of setting up, configuring, customizing, securing, and optimizing your WordPress website.

Although I have not purchased this one yet because it’s fairly new, I plan on getting it soon, mainly because I trust the author. Jeff is an experienced developer, and designer and he also helped co-author one of the most popular WordPress books out right now; not to mention he is the WordPress editor for Smashing Magazine.

The Tao of WordPress

3. Smashing WordPress

Category: Intermediate to Advanced

Smashing WordPress is an amazing book, in fact, I still use it as a reference from time to time. I purchased this book over a year ago to help improve my WordPress knowledge and coding skills while I was interning at a company that developed websites using WordPress.

This book helped me to better understand custom post types, the loop, and got me from a novice WordPress user to a full on WordPress developer. You can trust this book as it is backed by Smashing Magazine (a well-known web blog in the industry).

Let me iterate that this book is not for beginners. It will take you through the WordPress install but then it jumps right into the WordPress syntax, themes and template tags, child themes and so forth. This is a great book if you are looking to skip all the basic beginner WordPress stuff and dive right into customizing and development.

Smashing WordPress

4. Digging into WordPress

Category: Beginner to Advanced

Written by CSS-Tricks owner Chris Coyier and WordPress editor at Smashing Magazine Jeff Starr, Digging into WordPress is a jam packed 400+ page book covering all aspects of WordPress. I do own this book, but have only made it through the first chapter (I basically learned everything I needed in the Smashing WordPress book), but I hope to make time to finish reading it.

This is a great WordPress book for people who are in the beginner to intermediate range looking to move into the advanced category. Digging into WordPress will give you a great understanding on site configuration, theme customization, performance optimization, SEO, and WordPress security. This book was written by two big names in the WordPress industry so you can trust that you are getting the right information.

Digging into WordPress

5. Professional WordPress: Design and Development

Category: Intermediate to Advanced

Professional WordPress: Design and Development has great reviews by plenty of WordPress guru’s on various blogs. The book starts off with the basic WordPress introduction, feeding you some interesting stats and what not; it then jumps into the install and wp-config setup.

The authors cover the WordPress core, the loop, custom post types, custom taxonomies, theme development, and plugin development so you can be on your way to creating a fully custom WordPress site. It doesn’t stop there though, it goes on to cover things like content aggregation, WordPress site security, getting your site found, responsive design, and even user experience principles.

Professional WordPress: Design and Development

8
What Classifies as Flat Design Featured Image

What classifies as flat design? As this trend has quickly risen in popularity, so has the abundance of people claiming “flat” and “not flat” on various designs.

About a week ago I came across a Twitter post by a design blog that had to do with the new GoDaddy redesign, asking people what their thoughts were on it. Curious to see what it looked like, I went over to GoDaddy to check it out. It’s nothing special, just a simple redesign using some flat elements. What I did like, and what was most noticeable, was the amount of clutter they got rid of (the old GoDaddy website was a mess).

After seeing the new design, I went back over to Twitter to give my thoughts on it. Before doing so however, I decided to read some of the comments others had on it. A few of the users exclaimed that the new design was “not flat”, citing “too much white” and “bad font choice” as the reason. This had me scratching my head, are people confused on what flat is?

That really got to me (enough so that I have decided to write an article about it) because, to me, flat can be considered many things. The term “flat” is somewhat politically incorrect because there is such a broad base on what could be considered “flat”. As designers we need to find some common ground and agree on what exactly defines a flat design.

I want to start by looking at the dictionary definition of flat, which is defined as “smooth and even”. Even by the definition, flat could be considered a multitude of things because it’s definition is so broad. So what I did was made a little list here of some elements that are usually included (or not included) in a design that make it “Flat” :

  • Uses solid colors
  • Has less gradients
  • Looks two dimensional
  • Has squared or sharp Edges
  • No bevels
  • No textures
  • Sometimes without shadows (some include long shadows)
  • No skeuomorphic details that give it that realistic or three dimensional look
  • Utilizes function and simplicity
  • Has minimal design elements

I’m sure the list is missing a few things, but after reading it and reading the above definition of flat, I hope to give you an idea of what flat design is. Now it’s time to do some comparisons so we can see what classifies as flat and what does not.

Flat vs Not Flat

The app icons in this design are a great example for comparison between the skeuomorphic design of iOS 6 and this flat concept design of iOS 7 by SimplyZesty. Notice how the icons in iOS 6 have the glare across them with various gradients and much detail giving it the ‘pop’. Just the opposite, the iOS 7 concept icons are simple with solid colors, squared edges, and a flat look.

iOS 7 Concept Designs by SimplyZesty

Flat

Awhile back we did a company spotlight on Fostr, a creative project app, so I will use their website as perfect example of flat web design. Notice how simple it is, no flash involved and it incorporates flat design elements perfectly. It even shows off some flat vector style graphics on the landing page.

Fostr The Creative Project App for Designers

Flat vs Not Flat

Here is another great example of flat design versus “not flat” design, the clock app icon for apple iOS devices. As you can see the new clock app icon for iOS 7 (left) is much more simplistic and easier on the eyes than the iOS 6 clock app icon (right).

iOS 6 app icon compared to iOS 7 app icon

Flat

What better way to show what flat design is that with the company that helped bring this trend to life, Microsoft. Defining it as “Metro”, Microsoft gave a fresh breath to the flat design trend with their Windows 8 UI and it’s simplistic design.

Microsoft Website 2013 Screenshot

Flat vs Not Flat

Staying with Microsoft, when they launched their new logo in 2012 they incorporated the metro look to it. Check out this comparison of the old Microsoft logo (left) versus the new flat Microsoft logo (right)…

Old Microsoft Logo versus New Microsoft Logo comparison

Flat

Taasky, an up and coming task management app, has a great example of flat design for their website. It is simple and incorporates the popular flat colors and minimal design.

Taasky Task Management App

Flat vs Not Flat

Jay Kwong, a web and graphic designer from Hong Kong, designed the app icons for Lightly. As you can see in the image below, she has the app icon for iOS 6 (left) next to the newly designed icon for iOS 7 (right). This is a perfect example of Flat vs Not Flat design and how much simpler the flat trend makes designs.

Lightly iOS6 vs iOS7 app icons

Flat

The Cubicle Ninjas website is a great example of being flat, but being subtle about it. It doesn’t flaunt the usual flat color palette and vector style graphics, it uses flat as a means to make the website more minimal and give the user an easy yet appealing experience.

Cubicle Ninjas Website

Flat vs Not Flat

Some of you may have come across it by now, the new Google logo is what I’m talking about. This comes a a great recent example of a flat redesign. The old logo (pictured on top) incorporated a bevel on all of the letters giving it dimension and a “pop”. As you can see below, the new logo (bottom) has removed the bevel giving it a flatter look that is worlds better.

Old Google Logo versus New Google Logo 2013

Flat vs More Flat

Some designs that are flat, like the new iOS7 for example, are not as flat as they could be. I’ll show you what I mean by using this iOS7 redesign by Wellgraphic. They created this side by side comparison of the new iOS7 (left) and their version of iOS7 (right) in a redesign. Notice how much flatter and more minimal Wellgraphic made the icons in their design.

iOS7 Redesign by Wellgraphic

Conclusion

As you can see, some flat designs are different from others. It’s not to say that the new iOS7 design by Apple is not flat, parts of it are because it encompasses some of the qualities of a flat design that I listed above. It’s just not the greatest example of what a flat design could be in my opinion.

The point I’m trying to make with this article is that there are many different takes on flat design, some designs are an obvious flat, while others are sleepers and don’t really come off as flat. As I knew (and was hoping it would), this article is going start some controversy, good controversy I hope, that can help us figure out what this trend really is. So feel free to comment your take and opinions on the matter of flat design below.

4
Useful WordPress Plugins

As a rule, when designers start a new project they’re using the same array of technical tricks as in previous projects. In this blog post let’s focus on useful WordPress plugins that cover all aspects i.e. all parts of the site, including security, imagery, promotion, SEO, eCommerce, etc.

Our list includes only those plugins which are maintained and supported, be sure that you’ll get a response from developers if something goes wrong. Plugins that won’t work are not included into this round-up.

When creating the list I wasn’t pursuing the aim to gather a large number of plugins, no one needs huge lists. For each aspect I’ve chosen the best, in my opinion. Browse through the list, and don’t forget to submit your opinion at the bottom.

BTW, if you think that some plugins needs to be included into the round-up, submit the link into the comments and add some brief description. Thanks in advance.

Alpine PhotoTile for Instagram

Alpine Photo Tile for Instagram

Requires: 2.8 or higher
Compatible up to: 3.5.2
Last Updated: 2013-7-20
Downloads: 30,846

Are you a heavy Instagram user? Then probably you’d want to integrate some shots from a specific profile or group of tags. Check out the Alpine PhotoTile plugin, with its help embedding Instagram photos is no longer a problem. There are several options of integration either by URL or to the slideshow. Embedding widget is possible with the help of a shortcode.

Notable features:

  • Embed into sidebar, post or page
  • Multiple customization styles
  • Slideshow presentation of shots
  • Widget is embedded via shortcode

WP User Avatar

WP User Avatar WordPress Plugin

Requires: 3.5 or higher
Compatible up to: 3.6
Last Updated: 2013-8-7
Downloads: 92,662

Seems like using images from Gravatar is pretty boring, if you want to add a bit of user profile customization to your site WP User Avatar plugin is specifically for you. All images are uploaded via gallery as any other image used for the post.

Notable features:

  • Upload your avatar to your WP Avatar setting
  • Show Gravatar avatar if WP User avatar is not available
  • Disable easily Gravatar images
  • Contributors and Subscribers have the rights to upload avatars

Related Posts by Zemanta

Related Posts WordPress Plugin by Zemanta

Requires: 3.3 or higher
Compatible up to: 3.6
Last Updated: 2013-7-8
Downloads: 24,705

Increasing traffic is a real problem for every site owner. Here is a great solution for you – Zemanta. With its help you can bring more visitors to your blog or site from across the web.

Jetpack

Jetpack WordPress Plugin

Requires: 3.5 or higher
Compatible up to: 3.6
Last Updated: 2013-8-6
Downloads: 6,246,151

Back in those days WordPress had some features that were later omitted. With Jetpack plugin you’ll be able to get back all those features to your self-hosted website.

Notable features:

  • Simple e-mail subscription to your blog post and comments
  • Social media enable comments
  • Embedded WP.me url shortener
  • Media embedding from side sources
  • Automatic posting to social media profiles

WordPress SEO

WordPress SEO WordPress Plugin

Requires: 3.3 or higher
Compatible up to: 3.6
Last Updated: 2013-7-3
Downloads: 5,627,117

SEO still means a lot for your website. There is a great number of tools that really help improve SEO. If you’re looking for one of these, WordPress SEO by Yoast is the right choice. It was developed by a WP SEO consultant and WP developer and made sure that all aspects of SEO were taken into consideration.

Contact Form 7

Contact Form 7 WordPress Plugin

Requires: 3.5 or higher
Compatible up to: 3.6
Last Updated: 2013-8-8
Downloads: 12,013,803

With Check out one of the best contact form managers. With Contact form 7 you can easily manage number of forms and with the help of simple mark-up. Contact from 7 supports Ajax, CAPTCHA and Akismet spam filtering.

NextGEN Gallery

NextGEN Gallery

Requires: 3.5 or higher
Compatible up to: 3.5.2
Last Updated: 2013-7-30
Downloads: 7,759,357

Check out one of the best WordPress gallery plugins – NextGEN Gallery. As you can see, there are more than 7,7 million downloads. So many people can’t be mistaken. This plugin offers immense abilities for managing the imagery content of your site/blog.

Notable features:

  • Uploading and managing image galleries
  • Batch uploads
  • Meta data import
  • Adding, deleting, rearranging and sorting available
  • Thumbnail editor
  • Slideshows and thumbnail galleries on board

WooCommerce

WooCommerce eCommerce WordPress Plugin

Requires: 3.5 or higher
Compatible up to: 3.6 beta 3
Last Updated: 2013-7-19
Downloads: 1,251,737

Today even a lazy-bone has an online store. If you have a WordPress-powered site you can turn it easily into a store. All you need is a WooCommerce plugin that is pretty easy to configure. The features below will give you a know why you should use this plugin.

  • Accept credit cards and PayPal payments
  • Simple offline gateways
  • Ship your items using a flat cost
  • Ship for free, or require a coupon to enable
  • Powerful analytics, including eCommerce tracking
  • Social media integration
  • Encourage your customers to share their purchases in return for a coupon

User Role Editor

User Role Editor WordPress Plugin

Requires: 3.5 or higher
Compatible up to: 3.6
Last Updated: 2013-8-2
Downloads: 739,192

Seems like, setting roles for users in standard WordPress admin is a bit too boring. Consider User Role Editor for this purpose, apart from changing a role of a specific user you can change a bunch of capabilities (see the screenshot below).

User Role Editor Capabilities

Bulletproof Security

Bulletproof Security WordPress Plugin

Requires: 3.0 or higher
Compatible up to: 3.6
Last Updated: 2013-8-1
Downloads: 779,205

Protect your site against XSS, CRLF, RFI, Code Injection and SQL Injection hacking attempts. With Bulletproof Protection plugin you’ll be to enable one-click protection for your WordPress site. Built-in .htaccess file editing, uploading and downloading.

Notable features:

  • Brute Force Login Security Protection
  • Logged DB Fields
  • Email Alerting Options
  • Dynamic DB Form
  • Enhanced Search
  • Stand-alone Unlock Form bpsunlock.php

Well I hope this list was helpful for you. If you live your WordPress life a bunch of great plugins is exactly what you need. Stay tuned to get all the latest updates.

1
Job Boards for developers and designers

As designers and developers, it’s hard for us to find long term work. Most companies that need to have design or development related work done will just hire for that short time period to get what they need done and then move on rather than hire a full time designer or developer.

Doing that makes it cost effective for the company and in the current economy, that’s very important. Although this works great for the company, it’s not ideal for us designers and developers because we have to constantly looking for work.

Lucky for us there are quite a few design and development related job boards out on the web to help us easily find work. Below we’ve compiled a list of job boards that can help you in your search for employment in the design and development related fields.

Dribbble

Perhaps one of the most popular websites for designers, dribbble also has a job board that gets a good number of postings.

Dribbble Job Board for Designers and Developers

Behance

Another popular portfolio website for designers, behance also has a pretty large job board that covers a variety of design and development related job fields.

Behance Job Board for Designers and Developers

Smashing Magazine

Smashing Magazine (which we featured in our top 15 web and graphic design blogs) has a great job board with job postings from top companies like MTV, Activision, EA, Garmin, and Rockstar.

Smashing Magazine Job Board for Designers and Developers

Mashable

The well known blog Mashable has a good job board that covers not only design and development jobs postings, but marketing, social media, and advertising jobs as well.

Mashable Job Board for Designers and Developers

Freelance Switch

The popular freelance designer community Freelance Switch has a large job board for designers and developers with postings from well known companies like Audi, Sony, Getty Images, and Adobe.

Freelance Switch Job Board for Designers and Developers

Authentic Jobs

Established in 2005, Authentic Jobs in one of the larger job posting sites for creatives boasting listings from companies like Facebook, Apple, Skype, ESPN, MSNBC, and HBO.

Authentic Jobs Job Board for Designers and Developers

Krop

Krop is another big and well known job board for designers that has been around since 2000. Krop has listings from major companies like Facebook, The New York Times, Nike, Forbes, MTV, Apple, Adobe and more.

Krop Job Board for Designers and Developers

Coroflot

Established in 1997, Coroflot covers every major design related field from 3D Modeling to Interior Design to Web Development. They have a large selection of job listings from a variety of different companies.

Coroflot Job Board for Designers and Developers

AIGA

Since 2004, AIGA Design Jobs has successfully matched talented designers with over 10,000 jobs from companies across the United States, including Amazon, Bloomberg, Facebook, Herman Miller, IDEO, Interbrand, MTV Networks and Nokia.

AIGA Job Board for Designers and Developers

Design:Related

Similar to behance and dribbble, design:related is a community site with designer portfolios, inspiration, and news. They have a creatives job board, although small, that is a useful site in finding work.

Design:Related Job Board for Designers and Developers

37 Signals

Since 2006, industry leaders like Apple, The New York Times, Facebook, and American Express have used the 37 Signals Job Board to find designers and developers. 37 Signals covers a wide range of design and tech related jobs and has a large number of postings.

37 Signals Job Board for Designers and Developers

2
Adobe Creative Suite Keyboard Shortcuts Featured

For Web and Graphic Designers, some Adobe programs are a must have to survive in the industry. A lot of us use them on a daily basis (I know I do) so getting to know them better and being able to zip through them faster to crank out projects is a must.

These Adobe Creative Suite keyboard shortcuts for Photoshop, Illustrator, InDesign, and Flash will help you learn the shortcuts you need to blast through work quickly and effortlessly.

**Click images for larger sizes**

Adobe Photoshop

Adobe Photoshop Keyboard Shortcuts

Adobe Illustrator

Adobe Illustrator Keyboard Shortcuts

Adobe InDesign

Adobe InDesign Keyboard Shortcuts

Adobe Flash

Adobe Flash Keyboard Shortcuts

**Original author could not be found, if you know the original author of these please contact us so proper credit can be given**

Free eBook: How to Create a Million Dollar Website

Many people dream of becoming an internet millionaire. Don't be a dreamer download this eBook, join my newsletter and start taking action today.

  • How to Find a Profitable Niche
  • How to Market Products Online
  • How to Build a Profitable Email List
  • How to Beat the Competition
  • Free Weekly Internet Money Making Methods

Free eBook: How to Create a Million Dollar Website

Many people dream of becoming an internet millionaire. Don't be a dreamer download this eBook, join my newsletter and start taking action today.

  • How to Find a Profitable Niche
  • How to Market Products Online
  • How to Build a Profitable Email List
  • How to Beat the Competition
  • Free Weekly Internet Money Making Methods