Best Practices for Website Fonts

Arial, Verdana, Georgia, Helvetica; which font is the best for websites? Which font sizes will guarantee that your website will prevail? Which font color is the best? We'll be trying to answer this question in a series of articles.

The articles shall try to answer each of the above questions as lucidly as possible. As a part of research, I came across the following interesting articles. A SixRevisions Article on user experience (Did I mention, The founder of sixrevisions gave an interview to codemakit.com, Read the interview with Jacob Gube!), the dude in that article did a split test on which font types and size would be the most effective in conversion. His results included that among 10px, 14px, 18px and 21px, users connected most with 14px fonts.

One of the best places to get a customized answer for your question is Google forum. There I asked the following question, "Which font leads to maximum User Interaction?", there I found some of the most ingenuous methodologies and concepts that many wouldn't even dream of. The solutions are incorporated into the articles.

However, every one of them stopped at one single point, as if everyone finally concludes with, ".. Any font of any size would do great, provided you choose them in accordance with your website type and content."

Though I agree font type and size must change with the type of website, (i.e. a funny comic blog can be embellished with comic sans or an official looking website to be adorned with Georgia/Arial etc), but still which font would do great for News website or a blog? There are plethoras of official looking fonts which give the feeling of authenticity to the text. But which one strikes a chord with the user? Hence this research.

Study methodology

The Study methodology is simple enough, you visit several popular websites based on either alexa rank or Pagerank or a 'list of' and check out three font parameters from the text. The parameters are Font Type (Which Font family it belongs to), Font Size (In Pixels) and Font Color (Hex Colors. Then the data is divided into 4 categories i.e. Blogs, News based Websites, Academic Journal Based Websites and Information Based websites.

Type	Website	Font Type	Font Size	Font Color (RGB)
				Red	Green	Blue
blog	1stwebdesigner	Helvetica	14	34	34	34
blog	Treehugger.com	Arial	11.5	0	0	0
blog	Mashable.com	Helvetica	11.5	85	85	85
blog	Crooksandliars.com	Arial	10	34	34	34
blog	copyblogger.com	Helvetica	13.5	51	51	51
blog	thefword.org.uk	Trebuchet MS	13	102	102	102
Information	Wikipedia.org	Arial	12.5	37	37	37
Information	support.google.com	Helvetica	11.5	68	68	68
Information	Encyclopedia Britanica	Arial	10	68	68	68
Journal	Psycology today	Arial	12.5	0	0	0
Journal	Scientific America	Geogia	14	0	0	0
Journal	MIT Technology Review	Helvetica	10.5	0	0	0
Journal	ASCE	Arial	8.5	88	89	91
News	The Economist	Arial	13.5	74	74	74
News	NyTimes	Geogia	14	51	51	51
News	Forbes	Geogia	16	0	0	0
News	Wired	Geogia	11.5	51	51	51
News	The Hindu	Geogia	11	59	58	57
News	Reuters	Geogia	11.5	0	0	0
News	AlJazeera	Arial	12.5	0	0	0
News	Fox News	Helvetica	12.5	34	34	34
News	CNN	Arial	10	0	0	0
News	Wall Street Journal	Arial	10	51	51	51

Here is a pdf codemakit document of some of the samples collected for the study.

The study is based on the assumption that, since the websites are one of the best in their field, the font parameters would also be the top as per industry standards. Though there are a few studies in which font size or color should you use? There is a general dearth of a good quality study that would lead by example instead of just pointing out the facts.

In Conclusion,

Finally, I would like to point out the following conclusions based on previous studies by codemakit.
Based on codemakit's study, "Which Font Size is the Best?", I would highly recommend a 14 px size for better readability and ease.

Based on codemakit's study, "Which Font Type is the Best?", I would advice for a Georgia for Blogs and Arial for News Journal based Websites. Also never use your custom font or a handwritten font in the body content part of your blog, use it in titles and stuff. This would ensure best fit.

Based on codemakit's study, "Which Font Color is the Best?", I would say, #222222 for Blogs and #333333 for any other website. If you find the hexadecimal values upsetting, you can visit the article for a better feel of the color.

This showed you,

Read More

How will my blog die? (Pages per Sessions)

Pages per Session as the name suggests is the number of internal pages visited by your reader when he browses your website in one go. But what happens to the number of pages per session when your blog starts dying?

Note. If you think you've missed the previous part, check out the 'When will my blog die?' study from the start.

There is a parameter known as pages per session for determining a website's health. This is only when the bounce rate (discussed before) is less than 100%. 

Based on the data received from the website during its 44 Day dry spell, It was found that the number pages viewed by a visitor per session reduced constantly. The number changed mildly at first but it was after 32 days when the graph showed extraordinary fluctuation.

The timing of the fluctuation actually matches the 5 week mark of reduction in the number of visitors received by the blog as discussed previously. 

Correlation between Bounce Rate and Pages per Session

The correlation between Bounce Rate and Pages per session  is interesting. It seems, lower the bounce rate, higher the pages per session. This is actually logical as the pages per session is actually the average of all the user sessions for the day. So, when the bounce rate is higher, the number of pages for that session is lower.

Take an example, for a bounce rate of 100%, every visitor landing on the webpage would leave it without clicking on any other link. So in short, he/she would visit just the landing page and the pages per session would be equal to 1. If Bounce rate is 0% (an extremely unlikely scenario) each and every visitor landing on the page will click on an internal link before leaving the website. This would mean, pages per session would be higher than 1 at all times.

Correlation between Average Session Time and Pages per Session 

Contrary to all the parameters studied in the research, the correlation between average session time and the number of page per session is the most unique. The two parameters seem to depend on each other directly. Even as time passes, the relation stays intact and doesn't change. In every other parameter the relation changes after the 35 days mark.

The Complete Study

The Complete 5 Part Study can be accessed from here as it is published,

What happens to Page Views when my blog dies?

[Published on 8th Dec 2014]

What happens to Bounce Rates when my blog dies?

[Published on 15th Dec 2014]

What happens to Session Duration when my blog dies?

[Published on 22th Dec 2014]

What happens to Pages per Sessions when my blog dies?

[Published on 29th Dec 2014]

What happens to New and Returning Visitors when my blog dies?

[Published on 19th Jan 2015]

This was,

Read More

How will my blog die? (Session Duration)

Session duration in simple words is the amount of time spent by a user or a reader on your website. This article will tell you what happens to that session duration when a blog is gearing towards death.

Note. If you think you've missed the previous part, check out the 'When will my blog die?' study from the start.

Session duration is one of the parameters that define the quality of writing of the author. Higher average session duration would mean that the visitor is present on the webpage for a higher period of time. This implies that the visitor is hooked to the writing thereby justifying the efforts of the author.

In the present case, the blog started receiving higher average session duration as the time progressed. The average session duration increased at a much higher rate than did the bounce rate.

Change in Session Duration with Time

However, Session duration too showed signs of fluctuation at the end of 35 days, i.e. 5 weeks time. This is actually in conformation with similar sightings of the bounce rate, Number of Visitors and average number of pages per session.

Correlation of Session Duration with Bounce Rate

The constant upward movement of Session duration with time correlated with the bounce rate which actually reduced with time. This depicts that as the bounce rate decreased visitors started viewing higher number of pages thereby spending higher amount of time at the website in one session.

Correlation of Session Duration with Number of Visitors

The upward movement of session duration in correlation with the constant dip in the number of visitors and lowering bounce rate on the website showed that as the time passed, the visitors remaining were actually interested in the content instead of surfing. In short this meant that the truly loyal or sincere visitors remained with the website towards its death.

Correlation of Session Duration with Pages per Session

Another Correlation can be found with the average session time and Pages per session, where one can find that the abrupt increase in the average session time can be attributed to an increase in the number of pages viewed in one session. This would mean that the session time increases because the readers are opening more pages and not because there was a sudden increase in the curiosity on the subject.

Correlation of Session Duration with Percentage Returning sessions

As is evident from the graph below, it was found that the changes in average session time were proportional to the percentage of returning sessions for the first 35 days. This is quite logical as the returning visitors are keen on finding and exploring the website over again. This might be in search of new content or due to simple veneration. However, after 35 days the relationship between the two parameters became inverse. The average session time actually reduced with an increase in returning sessions.

The Complete Study

The Complete 5 Part Study can be accessed from here as it is published,

What happens to Page Views when my blog dies?

[Published on 8th Dec 2014]

What happens to Bounce Rates when my blog dies?

[Published on 15th Dec 2014]

What happens to Session Duration when my blog dies?

[Published on 22th Dec 2014]

What happens to Pages per Sessions when my blog dies?

[Published on 29th Dec 2014]

What happens to New and Returning Visitors when my blog dies?

[Published on 19th Jan 2015]

This was,

Read More

How will my blog die? (Bounce Rate)

Ever wondered how will your blog die? Or What would happen when your blog dies?

The article series will help you answer this question in detail. This article will discuss the changes in the bounce rate when your blog dies.

Note. If you think you've missed the previous part, check out the 'When will my blog die?' study from the start.

Though it has been proved more than once that bounce rates are never a perfect indicator of a website's health as they change with the type of your website, a bounce rate of 100 is still worse than a bounce rate of 90.

(For more information on bounce rate you can check out a previous article on 'How is bounce rate calculated').

Here are the results of an experiment proposed in which no changes were made on a blog for a total of 44 days.

The following study was conducted in the time frame of 19th Sept, 2014 to 1st November, 2014.

Change in Bounce Rate with Time

As seen in the graph below, the change in bounce rate with respect to time is minimal. The bounce rate is edging towards a full 100% i.e. a all visitors who land on the website leave without visiting any internal link on the page. This in short is dismal and points towards an impending doom.

The good news however is that the bounce rate is increasing glacially slow and it would be 424 days (about 60 Weeks) before the bounce rate touches 100% for good. We know from the previous article that the number of visitors would be down to zero before that.

Correlation between Bounce Rate and Pages per Session

A nice correlation can be made between bounce rate and pages per session. It was seen initially that higher the bounce rate lower were the pages visited by the user per session.

This was perfectly understandable, i.e. if more percentage of people are leaving the blog, it means that they are visiting lesser number of internal links and thereby lesser number of internal pages of your blog. This trend continued throughout the period of study.

Correlation between Bounce Rates and Percentage New Sessions

Another relation can be found out between Bounce rates and Percentage new sessions. It was found that higher the bounce rates, Higher the percentage new sessions. This further concretes our understanding that newer visitors will not be highly interested in the articles, than that of returning visitors who have actually come back as a sign of veneration or sheer trust, hence they will not leave the blog without surfing further.

This trend was however, shattered after 35 days since the last article, Bounce rates were suddenly inversely proportional to the percentage new sessions.

Though it looks scary, but even if bounce rates touch a hundred, It is not tough to bring it back to your desired level by using simple tricks to improving bounce rate.

The Complete Study

The Complete 5 Part Study can be accessed from here as it is published,

What happens to Page Views when my blog dies?

[Published on 8th Dec 2014]

What happens to Bounce Rates when my blog dies?

[Published on 15th Dec 2014]

What happens to Session Duration when my blog dies?

[Published on 22th Dec 2014]

What happens to Pages per Sessions when my blog dies?

[Published on 29th Dec 2014]

What happens to New and Returning Visitors when my blog dies?

[Published on 19th Jan 2015]

This answered,

Read More

How will my blog die? (Page Views)

For a layman, the number of visitors received by a blog is the foremost parameter on which a blog is measured, for a designer/ Developer too, the first priority is accentuating the number of visitors they receive.

Note. If you think you've missed the previous part, check out the 'When will my blog die?' study from the start.

However, what ensures a huge turnout on your website? Yes it is the search engine. Google's Page-rank is one of the few things that ensure a constant flow of readers towards the blog. However, if Google's bots do not find any changes in a website, the number of visitors would be stemmed. After all nobody at any search engine wants to direct users towards a month oldarticle if several recently updated ones exist (Remember the SEO basics). Hence when you stop posting articles on the blog, the number of new visitors on the blog will surely ebb and the blog will move towards death.

However, nothing can be said about your regular viewers or fans who would constantly check your website for weeks in the anticipation of newer content. But let’s face it, after some weeks of disappointment even the most regular of your fans would think twice. Such exercise (current study) if performed on the blog frequently, would lead to lowering of the said returning visitors.

The Study,

As seen in the chart below, one can easily deduce that the website in question is heading for a breakdown.

No Change Zone

First comes the no change zone. Which in short is a 3 week zone where there exists no change in the number of visitors at the website. As is evident from the graph the cycle of visitors repeats twice in this period.

Reduction Zone

After 21 days of banality, the website heads towards the lower end showing signs of decline.

Deceleration Zone

After about 5 weeks, comes the final blow. The website accelerates towards a literal destruction in the form of reduced page views andreduced earnings. Things actually get really interesting here because you are not sure which way the website goes. This zone is very easily achieved in a "Popular at the moment blog" and very slowly achieved in a multilingual website.

When will the blog have no page views?

Since the blog could not be kept in a dry spell until it dies, one has only one option to find out the truth, i.e. to extrapolate from the present values. Such extrapolation would enable us to find the date at which the visitors would stop coming (with a tolerance of some days). The present graph follows a linear deterioration with the equation y = -2.611x + 461.5, which shows that after 177 days the visitors would stop adorning the blog and hence the blog would truly die.

The Complete Study

The Complete 5 Part Study can be accessed from here as it is published,

What happens to Page Views when my blog dies?

[Published on 8th Dec 2014]

What happens to Bounce Rates when my blog dies?

[Published on 15th Dec 2014]

What happens to Session Duration when my blog dies?

[Published on 22th Dec 2014]

What happens to Pages per Sessions when my blog dies?

[Published on 29th Dec 2014]

What happens to New and Returning Visitors when my blog dies?

[Published on 19th Jan 2015]

This answered,

Read More

When will my blog die (A study)

Codemakit once conducted a study on a single question, "What happen when you do not post for a week". Let us take this question further and ask another, "What happens when you do not blog for a month?". 

Note. If you think you've missed the previous part, check out the 'When will my blog die?' study from the start.

When does your blog die if your do not post about anything?

The complete article is in the form of a study presented in a simple way (as is always done at codemakit website research)

The following study was conducted in the time frame of 19th Sept, 2014 to 1st November, 2014, i.e. a total of 44 Days.

The Experiment

This was an experiment proposed in which no changes were made on a blog for a total of 44 days. 

Based on the current data from the website, the data was plotted on graph and extrapolated forwards to find out, when will the blog die. Here are some examples, (though for the sake of clarity, I would suggest you to read the parameters separately).

Parameters Compared

The study measured the following parameters, Number of Visitors, Bounce Rates, Pages per Session, percentage new sessions, Percentage of returning Sessions and Average Session time.

The death of a blog in simple words is basically a blog having the following parameters.

1. Number of Visitors = Zero

2. Bounce Rates = 100 %

3. Pages per Session = Zero

4. Percentage new sessions = 0

5. Percentage of returning Sessions = 0

6. Average Session time = Zero

Let us first define the parameters first, the number of Visitors is fairly easy to decipher, it has been extensively covered in various articles on Method to double your visitors and What to do for higher blog visitor series.

The Bounce Rate too is basically the percentage of visitors who bounce off from your page. (though bounce rates are not a true indicator of your blog's health). Those would be discussed in further articles describing each parameter in detail. 

Pages per session is the number of pages a person opens at the blog when he/she browses through the website.

Percentage new sessions are the number of visitors who have come to your page for the first time. 

Percentage of returning sessions are the number of visitors who has visited the website once or more before. 

Average session time is the amount of time a person spends on the website before moving on. if you're interested about the parameter itself, you can view another codemakit article on make your visitors stay longer at your website, which is same as increasing the average session time.

The Results

During the period of Study, the six parameters showed some differences. 

Obviously the number of visitors would reduce down to zero, the Bounce rate would increase to 100%, Pages per session too can reduce to zero. 

But there was one anomaly in the data, within 44 days of the study, it was found that the average session duration did not reduce down to zero, in fact, it actually would never come close to zero. The Average Session Duration of the blog kept on increasing as the time progressed. 

However for more detailed results on the different changes to the parameters of the blog, it is advisable to check the individual articles first.

The Complete Study

The Complete 5 Part Study can be accessed from here as it is published,

What happens to Page Views when my blog dies?
[Published on 8th Dec 2014]

What happens to Bounce Rates when my blog dies?
[Published on 15th Dec 2014]

What happens to Session Duration when my blog dies?
[Published on 22th Dec 2014]

What happens to Pages per Sessions when my blog dies?
[Published on 29th Dec 2014]

What happens to New and Returning Visitors when my blog dies?
[Published on 19th Jan 2015]

This will answer,

Read More

Which Font Size is the Best?

How do you know if your font size is readable enough?

What font can be called too large and how many pixels are too small? 

Learn what font sizes are used by award winning websites. Also find out how people improve readability and retention of their text by modifying the font size.

Blogs

If yours is a personal or a professional blog, written by on or many authors about one particular subject and the views are of the author only, then it’s a blog.

The size of font used by the sample of bloggers considered in the research was perfectly conclusive. After the study, It was like a known fact, that a 14px font. More than 40 percent of bloggers thought 14Px is the magical number one should size their text on. 

Another interesting fact which popped out of this graph is that more than 80 percent of bloggers thought, font size must be greater than 12px. This might be attributed to the major aim of filling more space with lesser text. 

Another reason could be that people respond positively towards things they can understand (Remember the face your teacher or boss makes when you rant on something you’re not clear on). A larger font would surely help in that.

News based websites

If you are not into information or Ideas, and just want to talk about current affairs (i.e.) what is happening currently in the world, country or your locality, you my friend, have a news website.

News websites too showed similar trend i.e. about half news websites had a font of 14 pixels and more than 70% websites thought any size more than 12 pixels is good enough for text to look readable. Least preferred font size was anything more than 16 pixels (You’ve got to stop somewhere).

Academic Journal Websites

If you do not blog or write about facts and events, but like to experiment and jot your results down for others to see, then your website is an academic journal. Examples include anything from journals to private research diary.

Journal websites were by far the most unpredictable as far as the study goes. Their values were erratic and difficult to extrapolate. Font size for most journals based websites never exceeded 14 pixels. 

About 92 percent of journal based websites had a font size less than (or equal) 14 pixels, as opposed to a paltry 60 percent in blogs. Just 8 percent journal websites had a font size of more than 14 pixels. Surprisingly the higher font size was mostly found in medical journals.

Information based websites

And if you are none of the above, you're involved in an information based website.

Information based websites followed the trend of journals, 80% of information based websites thought it would be better if they kept their font size less than (or equal) to 14 pixels. Just 20 percent thought of exceeding the 14px mark.

Findings Explained

Some notes on Font sizes

Now there is a reason why everybody is so gung-ho on keeping their fonts near 14 pixels. Though Bonn, from smashing magazine contests that 16px isn't too bad, but let’s face it, it is a magazine. 

Ergonomics

You should not keep your font less than 12px. The reason being, your websites are to be accessed on desktops too, lesser font sizes would put strain on the users eyes.

According to smashing magazine, most people sitting comfortably are about 20 inches (about half a meter) from their computer screen.

Why Font Sizes matter

People can argue saying, Font size doesn’t matter, on can obviously zoom and change the size.
Of course users can zoom their screen by holding control key and scrolling upwards, but most people do not know the feature (not all are computer geniuses like you)

Conclusions

So all-in-all, here are the conclusions,

1. If you're a blog, best font size you could use is 14px to 16px. In a blog if you don't write much and expect people to get your meaning in few lines 16px might just be fine.
2. If you are into news 14px is the best you can do. A larger font size might mean you do not have enough to show and anything smaller would hamper the reading. 
3. If yours is a research journal (Which is mine too partially), it is better to follow the trend and have the font size in the range of 12px and 13px. I guess the concept of “using large fonts if you do not have anything" hasn’t really caught on in the minds of people wearing lab coats. 
4. If you plan on starting an information based website, i.e. a dictionary website, or a private encyclopedia, your best bet would range in 13px or 14px.
5. If you still haven't decided on which category your website falls in, close your eyes and keep 14 as the font size. 

Further reading,

You could have a look at W3C's advice on font sizes too
Stackexchange on User experience too hosts a series of interesting conversations between knowledgeable participants on the optimal font size

More in font research Series

Find out Which Font Color is the best? - Did you know font colors can alter moods? Learn how professional award winning websites change text colors to ensure maximum user interaction and understanding.

Find out Which Font Type is the best? - Which font type is most favored by readers? Which font would keep them hooked to your website?

Find out Which Font Size is the best? - How do you know if your font size is readable enough? What font can be called too large and how many pixels are too small? 

This answered your question,

Read More

Which Font Type is the best?

Which font type is most favored by readers? Which font would keep them hooked to your website?

Learn about different fonts and font types. Find out what fonts do award winning websites use to keep their readers eternally happy and loyal.

A primary article on smashing magazine asking 'which font should I use?' was among the best ones which explain in detail what fonts are, what families do they belong to and which one should be used where. So if you're generally confused about the names of fonts or font families, you should probably go to the linked pdf.

The same question was asked by me during the research at Google Product forums on Maximum User Interaction for fonts, and was presented with some of the best answers ever.

The Findings

In the blogging sphere, it was found that majority of bloggers used Georgia in their creations. Helvetica and Arial came in second with a near equal prevalence. The important fact to be looked is that Verdana with a mere 4% usage was the least preferred font for any blogger.

Font Families at Blogs

If yours is a personal or a professional blog, written by on or many authors about one particular subject and the views are of the author only, then we're talking about a simple blog. Examples include any blog.

During the research, I found that Georgia, which was the most preferred, was often used in blogs which featured miscellaneous content (i.e. the content that no one dared to pick up). Helvetica on the other hand was preferred by web design and development blogs.

Font Families at News Websites

If you are not into information or Ideas, and just want to talk about current affairs (i.e.) what is happening currently in the world, country or your locality, you are a newsman (or a newswoman). Examples include websites which host news as individual articles.

News based websites had virtually no sample using Georgia, Verdana or Times New Roman. The reasons were simple enough, Georgia and Times New Roman feels archaic and Verdana in my opinion doesn't feel authentic. The most used font in News websites was Arial (About 60%).

Font Families at Academic Journals

If you do not blog or write about facts and events but like to experiment and jot your results down for others to see, then your website is an academic journal.

To determine a trend from the data in journal based websites was difficult. However, one thing was clear; here too Arial was the winner with 34 % websites using it, (Followed by Helvetica and Verdana)

Font Families at Information Based Websites

And if you're not interested in events or ideas or your opinion, but just want to create a ready reference for others which would help them find information, you have an information based website.

Surprisingly, Information based websites followed the trend of News websites. Virtually no website used Georgia, Verdana, Times or Trebuchet. They just used Helvetica (35%) and Arial (55%).

Discussion

From a psychological study in Wichita, the following were the emotions attributed to the fonts. The study included attributing 15 personality traits to 20 fonts and the top three personality trait for each font was considered (i.e. the maximum number of occurrences of a particular trait for each font).

Concluding Remarks

• So if you have a blog, the best bet would be Georgia, Helvetica or Arial in their order of precedence.
• If yours is a News based website, you need to give an illusion of updation and authenticity, which can be achieved with Arial.
• If yours is an academic Journal, then use Arial. If it’s an information based website, use Arial or Helvetica (in their order of precedence)
• If you could not categorize your website, just close your eyes and type Arial.

More in font research Series

Find out Which Font Color is the best? - Did you know font colors can alter moods? Learn how professional award winning websites change text colors to ensure maximum user interaction and understanding.

Find out Which Font Type is the best? - Which font type is most favored by readers? Which font would keep them hooked to your website?

Find out Which Font Size is the best? - How do you know if your font size is readable enough? What font can be called too large and how many pixels are too small? 

This answered,

Read More

Which Font Color is the best?

Did you know font colors can alter moods? Learn how professional award winning websites change text colors to ensure maximum user interaction and understanding.

I recently read an article 'Evoke Emotion through typography' where the author talked about connecting emotionally with people with the help of fonts.

The author stresses on the need of creating a relationship with the visitors on the website, a concept loosely labeled as 'emotional design', which isn't that illogical. Emotions help in decision making, increases motivation, affects memories and much more.

So here's an analysis on different colors (or different shades of grey) that award winning websites use for exceptional user experience. However, before going any further, you must first determine which category your website falls in.

The Study

For better understanding of the readers, the color  variations used by different websites have been clubbed into 7 parts  i.e. #000000, #111111, #222222, #333333, #444444, #555555, #666666 which can be assumed to contain  the color black as percentage 100.0, 93.3, 86.7, 80.0, 73.3, 66.7, 60.0 respectively as shown in the following table.

% of Black	Red	Green	Blue	Hex Code
100 % Black	0	0	0	#000000
93.3 % Black	16	16	16	#111111
86.7 % Black	34	34	34	#222222
80 % Black	51	51	51	#333333
73.3% Black	68	68	68	#444444
66.7% Black	85	85	85	#555555
60% Black	102	102	102	#666666

Font Colors for Bloggers

If you have a personal or a professional blog, written by one or many authors about some particular subject and the views are of the author only, then its blog.

The color variations used by bloggers varied a lot, however majority of them about 75% never crossed the 73.3% black mark (Or 75 % websites had fonts darker than #444444 hex).

If you're a blogger I would suggest #222222 or #333333 as your best bet.

Font Colors for News based Websites

If you are not into information or Ideas, and just want to talk about current affairs (i.e.) what is happening currently in the world, country or your locality, you have a news based website in your hands.

News websites on the other hand were fairly obvious; half of them used the color #333333 (Which contains 80% of Black and 20% white).

So If you run a news based website close your eyes and use #333333.

Font Colors for Journal based Websites

If you dig research with charts and tables, then your website is an academic journal.  Examples for such might include anything ranging from journals from academic institutions to private research diary.

Journal websites showed a different trend, in those websites there were two classes. One had the darkest possible color #000000 (i.e. 100% black), which were 44% of the websites.

The second class believed in a lighter approach which used #333333 (i.e. 80% of black and 20% of white), which were 30 % of the websites in the sample.

For research minded Journals, You have an option between #000000 and #333333.

Font Color for Information based Websites

And if you're not interested in events or ideas or your opinion, but just want to create a ready reference for others which would help them find factual information, you're involved in an information based website. E.g. Websites like Wikipedia, dictionary.com or thesaurus etc.

Information based websites too had nothing concrete to show, there was no definite trend visible in information based websites.

In short you can use anything.

Conclusion

News based websites can use #333333 as their font color. Academic Journals have a choice between #000000 and #333333. However for Bloggers and news based websites, instead of using any color combination, I would like to attract your attention to the following paragraph.

According to the research conducted on 'The Impact of Web Page Text-Background Color Combinations on Readability, Retention, Aesthetics, and Behavioral Intention', the author contests that color combinations with a higher contrast will ensure higher readability and retention than the ones with lower contrast. According to them, the priority of the color combinations looks like this,

Rank	Background color	Text Color	Example
1	White	Black	Example
2	Dark Blue	Light Blue	Example
3	Cyan	Black	Example

If you're not sure, which category your website falls in, close your eyes and use #000000 or 100% black as your default font color with a white background.

Website Category	Font Color
Blog Based Websites	#222222 or #333333
News Based Websites	#333333
Journal Based Websites	#000000 or #333333
Information Based Websites	#000000

Related reading,

• For those who would like to understand more about colors and their combinations, you can view the information at tiger colors.
• You can check out a thread at stack exchange on User experience on the best type of color combination too.

More in font research Series

Find out Which Font Color is the best? - Did you know font colors can alter moods? Learn how professional award winning websites change text colors to ensure maximum user interaction and understanding.

Find out Which Font Type is the best? - Which font type is most favored by readers? Which font would keep them hooked to your website?

Find out Which Font Size is the best? - How do you know if your font size is readable enough? What font can be called too large and how many pixels are too small? 

This research was about,

Read More