Alertbox: Serif vs. Sans-Serif Fonts for HD Screens
Jakob Nielsen <[email protected]> Mon, 2 Jul 2012 16:01:16 +0000
| Newsgroups | gmane.comp.web.alertbox |
|---|---|
| Message-ID | <538d934a891681a5d850bb4e5f405d0f72c.20120702160049@mail21.us4.mandrillapp.com> |
This is a multi-part message in MIME format
--_----------=_MCPart_1941861111
Content-Type: text/plain; charset="utf-8"; format="fixed"
Content-Transfer-Encoding: quoted-printable
Decent computer screens with pixel densities of 220 PPI or more lead
to new usability guidelines for on-screen typography.
> http://www.useit.com/alertbox/web-typography.html
Jakob Nielsen's Alertbox for July 2: Serif vs. Sans-Serif Fonts
for HD Screens
__________________________________________________________________
Usability Week 2012 conference
* Toronto: July 23-27
* Sydney: August 12-17
* San Francisco: September 23-28
* London: October 14-19
* New York City: Oct. 28 - Nov. 2 NEW
Full event program describing all full-day training courses:
> http://www.nngroup.com/events
__________________________________________________________________
Email Beats Social Media in Business Value
The analytics company Monetate analyzed 100,000,000 visits to a
range of e-commerce sites. Conversion rates differed dramatically,
depending on where users came from:
Traffic Source Conversion Rate
Email 3.9%
Google 2.4%
Facebook 0.5%
> http://www.monetate.com
As I have said before, our user studies show that people use social
media to be, uhm, social: to connect with family and friends, and not
so much to connect with companies. This doesn't mean that you should
avoid social media, just that you should focus your budget on SEO and
email, since they offer much better returns.
See also:
> http://www.nngroup.com/reports/streams
> http://www.useit.com/alertbox/20020930.html
> http://www.useit.com/alertbox/newsletters.html
> http://www.nngroup.com/events/tutorials/newsletter.html
__________________________________________________________________
Goodbye Minitel
This weekend, the French Minitel service was finally shut down for
good after 30 years.
In the 1990s, about half the French population used Minitel =E2=80=94 a=
much
higher penetration than found for Internet services in similar
countries. Even more amazing, there were still about half a million
Minitel terminals in use last week when it came time to turn the
switch.
Mintel's success proved the value of simple online information with an
unfussy user interface. Minitel=E2=80=99s ultimate failure proves the
limitations of walled gardens which tend to be overcome by open
world-wide information webs. 11 years ago I wrote an essay titled
Mobile Phones: Europe's Next Minitel?
(http://www.useit.com/alertbox/20010107.html) which said that:
* "Today [2001], Minitel is a dead end." It took another 11 years fo=
r
this dead end to play out to its ultimate doom. This shows the
immense inertia of human behavior once people are used to
something. They don't give it up easily. (And it's not just the
French who move slowly: AOL still has 3 million subscribers in the
U.S.)
* "An Internet device should allocate close to 100% of its surface
area to the screen" [e.g., like the iPhone did 6 years later] but
that Europe was unlikely to lead the mobile Internet despite its
strong domination of mobile technology at the time of my article.
I was proven right on all these counts, even though a happier alternate
history would have seen (a) Minitel evolve into a simplified way for
low-tech users to access the Web, and (b) European telecoms vendors
invent better Internet devices. I guess there=E2=80=99s one last hope t=
hat
Nokia can fulfill dream (b) next year, though with the help of
Seattle-developed software.
Copyright =C2=A9 2012 Nielsen Norman Group, All rights
reserved.
You're receiving this newsletter because you subscribed at http://www.u=
seit.com/alertbox/subscribe.html
Our mailing address is:
Nielsen Norman Group
48105 Warm Springs Blvd.
Fremont, CA 94539-7498, USA
Is this email not displaying correctly?
[15]View it in your browser.
[16]unsubscribe from this list | [17]update subscription preferences
Links:
15. http://us4.campaign-archive1.com/?u=3D538d934a891681a5d850bb4e5=
&id=3D3a188c169b&e=3Df405d0f72c
16. http://useit.us4.list-manage.com/unsubscribe?u=3D538d934a891681=
a5d850bb4e5&id=3D7f29a2b335&e=3Df405d0f72c&c=3D3a188c169b
17. http://useit.us4.list-manage.com/profile?u=3D538d934a891681a5d8=
50bb4e5&id=3D7f29a2b335&e=3Df405d0f72c
--_----------=_MCPart_1941861111
Content-Type: text/html; charset="us-ascii"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<!-- This is a simple example template that you can edit to create your own custom templates -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- Facebook sharing information tags -->
<meta property="og:title" content="Alertbox: Serif vs. Sans-Serif Fonts for HD Screens">
<title>Alertbox: Serif vs. Sans-Serif Fonts for HD Screens</title>
<style type="text/css">
#outlook a{
padding:0;
}
body{
width:100% !important;
}
body{
-webkit-text-size-adjust:none;
}
@media only screen and (max-device-width: 720px){
.mobilenoshow{
display:none !important;
}
} @media only screen and (max-device-width: 720px){
table td,table th{
padding:2px !important;
}
} body{
margin:0;
padding:0;
}
img{
border:none;
font-size:14px;
font-weight:bold;
height:auto;
line-height:100%;
outline:none;
text-decoration:none;
text-transform:capitalize;
}
#backgroundTable{
height:100% !important;
margin:0;
padding:0;
width:100% !important;
}
body,.backgroundTable{
background-color:#FAFAFA;
}
li{
margin-top:0px;
margin-bottom:0px;
}
#templateContainer{
border:1px solid #DDDDDD;
}
h1,.h1{
color:#202020;
display:block;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:140%;
font-weight:bold;
line-height:100%;
margin-top:0px;
margin-bottom:10px;
text-align:left;
}
h2,.h2{
color:#202020;
display:block;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:130%;
font-weight:bold;
line-height:100%;
margin-bottom:10px;
text-align:left;
}
h3,.h3{
color:#202020;
display:block;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:120%;
font-weight:bold;
line-height:100%;
margin-bottom:10px;
text-align:left;
}
h4,.h4{
color:#505050;
display:block;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:110%;
font-weight:bold;
line-height:100%;
margin-bottom:10px;
text-align:left;
}
#templatePreheader{
background-color:#FAFAFA;
}
.preheaderContent div{
color:#101010;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:9px;
line-height:100%;
text-align:left;
}
.preheaderContent div a:link,.preheaderContent div a:visited{
color:#336699;
font-weight:normal;
text-decoration:underline;
}
.preheaderContent div img{
height:auto;
max-width:600px;
}
#templateHeader{
background-color:#FFFFFF;
border-bottom:0;
}
.headerContent{
color:#202020;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:34px;
font-weight:bold;
line-height:100%;
padding:0;
text-align:center;
vertical-align:middle;
}
.headerContent a:link,.headerContent a:visited{
color:#336699;
font-weight:normal;
text-decoration:underline;
}
#headerImage{
height:auto;
max-width:600px !important;
}
#templateContainer,.bodyContent{
background-color:#FDFDFD;
}
.bodyContent div{
color:#101010;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
line-height:120%;
text-align:left;
}
.bodyContent div a:link,.bodyContent div a:visited{
color:#0033aa;
font-weight:normal;
text-decoration:underline;
}
.bodyContent img{
display:inline;
margin-bottom:10px;
}
#templateFooter{
background-color:#FDFDFD;
border-top:0;
}
.footerContent div{
color:#707070;
font-family:Verdana,Calibri,Helvetica,Arial,sans-serif;
font-size:12px;
line-height:125%;
text-align:left;
}
.footerContent div a:link,.footerContent div a:visited{
color:#0033aa;
font-weight:normal;
text-decoration:underline;
}
.footerContent img{
display:inline;
}
#social{
background-color:#FAFAFA;
border:1px solid #F5F5F5;
}
#social div{
text-align:center;
}
#utility{
background-color:#FDFDFD;
border-top:1px solid #F5F5F5;
}
#utility div{
text-align:center;
}
#monkeyRewards img{
max-width:160px;
}
</style></head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
<center>
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="backgroundTable">
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateContainer">
<tr class="mobilenoshow">
<td align="center" valign="top">
<!-- // Begin Template Header \\ -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateHeader">
<tr>
<td class="headerContent">
<!-- // Begin Module: Standard Header Image \\ -->
<div style="text-align: left;"><a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=42ef0ef739&e=f405d0f72c" style="color: #336699;text-decoration: underline;font-weight: normal;"><img src="http://www.nngroup.com/images/nnglogo.gif" alt="" border="0" style="margin: 0;padding: 0;border: 0;height: auto;line-height: 100%;outline: none;text-decoration: none;" width="90" height="50"></a></div>
<!-- // End Module: Standard Header Image \\ -->
</td>
</tr>
</table>
<!-- // End Template Header \\ -->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- // Begin Template Body \\ -->
<table border="0" cellpadding="10" cellspacing="0" width="100%" id="templateBody">
<tr>
<td valign="top" class="bodyContent">
<!-- // Begin Module: Standard Content \\ -->
<table border="0" cellpadding="10" cellspacing="0" width="100%">
<tr>
<td valign="top">
<div><div style="text-align: left;">
<blockquote style="background-color: #ffffdd; color: #000000; line-height:130%; padding: 4px; margin: 0;">
<p style="margin-top: 0px; margin-bottom: 2px;">
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=1b6a9b0af1&e=f405d0f72c" style="text-decoration: none; color:#505050;"><span style="color: #505050;">Summary:</span><br>
Decent computer screens with pixel densities of 220 PPI or more lead to new usability guidelines for on-screen typography.</a></p>
<p style="margin-top: 4px; margin-bottom: 0; font-size:120%; line-height:140%;">
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=a05d6584d4&e=f405d0f72c" style="text-decoration: none; color:#505050;">Jakob Nielsen's Alertbox for July 2: <span style="text-decoration: underline; color:#0033aa;"> <strong>Serif vs. Sans-Serif Fonts for HD Screens</strong> </span></a></p>
</blockquote>
<hr>
<h3>
Usability Week 2012 conference</h3>
<ul>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=00d4c12226&e=f405d0f72c">Toronto</a>: July 23-27</li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=958c124d2b&e=f405d0f72c">Sydney</a>: August 12-17</li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=0e082dd4dd&e=f405d0f72c">San Francisco</a>: September 23-28</li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=5f11957190&e=f405d0f72c">London</a>: October 14-19</li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=64efa9a54f&e=f405d0f72c" target="_blank">New York City</a>: Oct. 28 - Nov. 2 <strong><span style="font-size:11px;"><span style="background-color: rgb(255, 255, 0);">NEW</span></span></strong></li>
</ul>
<p>
<a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=cdabcc803c&e=f405d0f72c">Full event program</a> describing all full-day training courses.</p>
<hr>
<h3>
Email Beats Social Media in Business Value</h3>
<p>
The analytics company <a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=53d728038b&e=f405d0f72c" target="_blank">Monetate</a> analyzed 100,000,000 visits to a range of e-commerce sites. <strong>Conversion rates </strong>differed dramatically, depending on where users came from:</p>
<table>
<tbody>
<tr>
<th>
Traffic Source </th>
<th>
Conversion Rate</th>
</tr>
<tr>
<td>
Email</td>
<td>
3.9%</td>
</tr>
<tr>
<td>
Google</td>
<td>
2.4%</td>
</tr>
<tr>
<td>
Facebook</td>
<td>
0.5%</td>
</tr>
</tbody>
</table>
<p>
As I have said before, our user studies show that people use social media to be, uhm, <em>social</em>: to connect with family and friends, and not so much to connect with companies. This doesn't mean that you should avoid social media, just that you should focus your budget on SEO and email, since they offer much better returns.</p>
<p>
See also:</p>
<ul>
<li>
<a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=4944aac59f&e=f405d0f72c" target="_blank">Usability guidelines for social media</a></li>
<li>
<a href="http://useit.us4.list-manage1.com/track/click?u=538d934a891681a5d850bb4e5&id=3d99d64c91&e=f405d0f72c" target="_blank">Email newsletters — original user research</a></li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=76b1170a6c&e=f405d0f72c" target="_blank">Email newsletters — latest user research</a></li>
<li>
Full-day <a href="http://useit.us4.list-manage1.com/track/click?u=538d934a891681a5d850bb4e5&id=0c22424b72&e=f405d0f72c" target="_blank">training course on designing email</a> newsletters<br>
</li>
</ul>
<hr>
<h3>
Goodbye Minitel</h3>
<p>
This weekend, the French Minitel service was finally <a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=d4d8bb9400&e=f405d0f72c">shut down for good after 30 years</a>.</p>
<p>
In the 1990s, about <strong>half the French population used Minitel </strong>— a much higher penetration than found for Internet services in similar countries. Even more amazing, there were still about half a million Minitel terminals in use last week when it came time to turn the switch.</p>
<p>
Mintel's success proved the value of simple online information with an unfussy user interface. Minitel’s ultimate failure proves the limitations of walled gardens which tend to be overcome by open world-wide information webs. 11 years ago I wrote an essay titled Mobile Phones: Europe's Next Minitel? (http://www.useit.com/alertbox/20010107.html) which said that:</p>
<ul>
<li>
<em>"Today [2001], Minitel is a dead end."</em> It took <strong>another 11 years </strong>for this dead end to play out to its ultimate doom. This shows the immense inertia of human behavior once people are used to something. They don't give it up easily. (And it's not just the French who move slowly: AOL still has 3 million subscribers in the U.S.)</li>
<li>
<em>"An Internet device should allocate close to 100% of its surface area to the screen" </em>[e.g., like the iPhone did 6 years later] but that Europe was unlikely to lead the mobile Internet despite its strong domination of mobile technology at the time of my article.</li>
</ul>
<p>
I was proven right on all these counts, even though a happier alternate history would have seen (a) Minitel evolve into a simplified way for low-tech users to access the Web, and (b) European telecoms vendors invent better Internet devices. I guess there’s one last hope that Nokia can fulfill dream (b) next year, though with the help of Seattle-developed software.</p>
</div>
</div>
</td>
</tr>
</table>
<!-- // End Module: Standard Content \\ -->
</td>
</tr>
</table>
<!-- // End Template Body \\ -->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- // Begin Template Footer \\ -->
<table border="0" cellpadding="10" cellspacing="0" width="100%" id="templateFooter">
<tr>
<td valign="top" class="footerContent">
<!-- // Begin Module: Standard Footer \\ -->
<table border="0" cellpadding="10" cellspacing="0" width="100%">
<tr>
<td valign="top" width="100%">
<div>
<em>Copyright © 2012 Nielsen Norman Group, All rights reserved.</em>
<br>
<!--
-->
You're receiving this newsletter because you subscribed at http://www.useit.com/alertbox/subscribe.html
<br>
<strong>Our mailing address is:</strong>
<br>
<div class="vcard"><span class="org fn">Nielsen Norman Group</span><div class="adr"><div class="street-address">48105 Warm Springs Blvd.</div><span class="locality">Fremont</span>, <span class="region">CA</span> <span class="postal-code">94539-7498, USA</span></div><br><a href="http://useit.us4.list-manage.com/vcard?u=538d934a891681a5d850bb4e5&id=7f29a2b335" class="hcard-download">Add us to your address book</a></div>
<br>
<!--
-->
</div>
</td>
<td valign="top">
<div>
<!--
-->Is this email not displaying correctly?<br>
<a href="http://us4.campaign-archive1.com/?u=538d934a891681a5d850bb4e5&id=3a188c169b&e=f405d0f72c" target="_blank">View it in your browser</a>.<!--
-->
</div>
</td>
</tr>
<tr>
<td colspan="2" valign="middle" id="utility">
<div>
<a href="http://useit.us4.list-manage.com/unsubscribe?u=538d934a891681a5d850bb4e5&id=7f29a2b335&e=f405d0f72c&c=3a188c169b">unsubscribe from this list</a> | <a href="http://useit.us4.list-manage.com/profile?u=538d934a891681a5d850bb4e5&id=7f29a2b335&e=f405d0f72c">update subscription preferences</a>
</div>
</td>
</tr>
</table>
<!-- // End Module: Standard Footer \\ -->
</td>
</tr>
</table>
<!-- // End Template Footer \\ -->
</td>
</tr>
</table>
<br>
</td>
</tr>
</table>
</center>
<img src="http://useit.us4.list-manage.com/track/open.php?u=538d934a891681a5d850bb4e5&id=3a188c169b&e=f405d0f72c" height="1" width="1"></body>
</html>
--_----------=_MCPart_1941861111--