Infographic is a great way to turn the most boring data into the most comforting graphic, which is much easier for reader to digest. As web designers have to deal with pixels and code almost everyday, it would be overwhelming to look at more data and references which are filled with hypnotic words and numbers.

We understand how your eyes feel when they are suffering from sleep induction, and this leads us to compile 43 informative infographics that are relevant to web designers. While some of them are data like current state of the internet or social media, others contain useful knowledge which can also be used as a great reference sheet. So come take a glimpse, enjoy them and grab them! Digesting data and knowledge has never been so fun with infographics!

Hongkiat Exclusive

Freelance to Freedom

An epic infographic that applies well to both web designer and graphic designer. Really scared me as it plotted down all my freelancing experience, and I hope you reached the last stage.

Colors

Color is deadly essential to a website as it not only defines the focus of a web page but evokes the emotion of the site, and in most cases it even represents the branding of a company’s website. Here we collected 6 infographics for you to know about color theory, how color affect purchases, colors of the top web brands, etc.

Color Theory

Basic color theories summed up in 1 infographic, which can be a handy reference sheet.

How Do Colors Affect Purchases?

Color is crucial factor to generate a good amount of sales, and this infographic shows you why.

Color Of The Year 2010

Beautifully designed infographic that presents the favorite color for year 2010, picked by 1000 people from 137 countries.

Colors Of The Top 100 Web Brands

A detailed infographic that reveals powerful colors of the web which are colors implemented by major internet companies in their branding.

Colors Of The Social World (Wide Web)

Based on the data provided by Themeleon, this infographic shows the color preference of Twitter users when it comes to their profile design.

Colours in Cultures

Color usage for 84 subjects from different cultures such as American, Chinese or Japanese, plotted in one comprehensive infographic.

Decision Making

A decision can decide whether you work for client for free and suffer like hell, or not. Being able to make correct decision is vital to a web designer’s success and infographics below can help you carve out the path of the success.

Do You Need A New Logo?

Do you need a new logo? This infographic can help you get the answer.

How Would You Like Your Graphic Design

Extremely truthful infographic to show your client what their design would be with their (mostly impossible) needs.

Should I Work For Free

A perfect guide for designer and freelancer to decide which project you should work for free, just follow it and you are free from trouble.

So You Need A Typeface

Here’s a helpful guide for you to choose a suitable typeface for your current project.

General Survey

General survey is a collection of useful infographics that either entertain or assist you in certain decision. You can either check out the difference between web designer and web developer to determine which species you belong to or perhaps consider to raise your charge by hour based on the data from the survey, ‘All You Need To Know About Web Designers’.

State Of The Internet: Summing Up 2010

Well designed infographic revealing the current state of the gigantic internet.

All You Need To Know About Web Designers

Distribution of age, gender, education, charge per hour rate or probably all you need to know about web designers.

Web Designers Vs. Web Developers

An interesting infographic that puts web designer and web developer into comparison, with a sense of humor.

Search Engine Optimization

The content is indeed the key component to top search engine indexing, yet Search Engine Optimization (SEO) is the catalyst that speeds up your success. Infographics collected below will show you what SEO is, and how to do it effectively.

A Visual Guide To SEO

A great reference for those who just started to dive more into SEO.

Understanding Google PageRank

Google PageRank is an ever-changing algorithm, yet we can find some of its traits from this infographic.

The Essential Do It Yourself Guide To Successful Linkbait

As most results of linkbaiting are often less satisfying, this infographic teaches some essential steps to achieve effective linkbait.

Article Optimization

Instructional infographic with step by step guide on optimizing an article for search engine indexing.

Typography

Same with the color, typography is one of the most important aspect to web design, especially for this year as it is predicted by most famous web designers to have a big influence to web design. ‘Periodic Table of Typefaces’ and ‘Most Common Fonts by Operating System’ act as helpful references for your typograhy related studies and works.

Periodic Table of Typefaces

Carefully designed with the same categorizing concept of traditional periodic table, this masterpiece lists out 100 of the most popular and influential typefaces nowadays.

Most Common Fonts By Operating System

A pretty long list showing most popular fonts by operating system which is a good reference for setting fallback fonts for your website or projects.

User Experience

Although User Experience cannot be considered as ‘design’, it plays a vital role on smoothing your site visitor’s experience thus avoiding them slipping away. ‘Good Information Design’ and ‘Fastest Ways To Lose Customers’ are insightful infographics that explore this field.

Good Information Design

As there are lots of different views for good information design, this infographic explores the key components to form a good information design.

Fastest Ways To Lose Customers

Probably everything you need to know to avoid losing potential customers.

Web Technology

Web technology has evolved a lot since last year with the introduction of HTML 5, H.264 video format, WordPress 3 and plenty more web browser updates. Since it would be overwhelming to know them all by documentations with full of terms and words, infographics below can help you to understand these technologies in a more visual and comfortable way.

HTML 5

Detailed introduction about HTML5, with a few comparison to Flash.

Semantic Web

Semantic is a term that often confuse web designer, this infographic explains the concept of the semantic web effectively with comparison method.

The Anatomy Of A Perfect Landing Page

A must-see infographic for web designers to build an effective landing web page that actually attracts users.

Performance Comparison Of Web Browsers

As different web browser has different capabilities, this infographic acts as a good reference on showing the difference of capabilities for major browsers, which are also rarely mentioned in common web articles.

Apple, Flash and H.264

A full introduction about the famous issue, Apple drops Flash and embraces H.264 video format.

How Cookies Work On The Web

Still can’t understand how cookies work? Here’s an infogprahic with relaxing images to tell you what web cookies are, and how they work.

More Infographics

Here are more infographics we’ve collected:

• 50 Informative and Well-Designed Infographics
• Infographics To Understand The Blogosphere Better
• Social Media Infographics

(bellefoong)