Alertbox: Mobile Site vs. Full Site
Jakob Nielsen <[email protected]> Tue, 10 Apr 2012 12:15:39 -0400
| Newsgroups | gmane.comp.web.alertbox |
|---|---|
| Message-ID | <538d934a891681a5d850bb4e5f405d0f72c.20120410161508@mail128.us1.rsgsv.net> |
This is a multi-part message in MIME format
--_----------=_MCPart_1648125301
Content-Type: text/plain; charset="utf-8"; format="fixed"
Content-Transfer-Encoding: quoted-printable
Good mobile user experience requires a different design than what's
needed to satisfy desktop users. Two designs, two sites, and
cross-linking to make it all work.
> http://www.useit.com/alertbox/mobile-vs-full-sites.html?utm_source=
=3DAlertbox&utm_campaign=3D5c9f1b519f-Mobile_vs_Full_Sites_4_8_2012&utm_me=
dium=3Demail
_____________________________________________________________
Usability Week 2012 conference
* Amsterdam, The Netherlands: April 23-27
* Washington, DC: May 14-18
* Chicago: June 25-29
* Toronto: July 23-27
* Sydney: August 12-17
Full event program describing all full-day training courses.
> http://www.nngroup.com/events?utm_source=3DAlertbox&utm_campaign=
=3D5c9f1b519f-Mobile_vs_Full_Sites_4_8_2012&utm_medium=3Demail
Deadline to save 10% on early-bird registration for Washington, DC:
* This Friday, April 13
> http://www.nngroup.com/events/washington_dc/prices.html?utm_sourc=
e=3DAlertbox&utm_campaign=3D5c9f1b519f-Mobile_vs_Full_Sites_4_8_2012&utm_m=
edium=3Demail
Deadline to save =E2=82=AC150 on advance registration for Amsterdam:
* Next Friday, April 20
> http://www.nngroup.com/events/amsterdam/prices.html?utm_source=3D=
Alertbox&utm_campaign=3D5c9f1b519f-Mobile_vs_Full_Sites_4_8_2012&utm_mediu=
m=3Demail
__________________________________________________________________
HTML Newsletter
Starting in March, I have offered the Alertbox newsletter in HTML
format with some typography and maybe even a few images. I have seen
several blog postings, Tweets, etc. along the lines, "Jakob Nielsen has
gone upscale; what's the world coming to?"
While it's true that I stuck with an extraordinarily basic newsletter
design for many years, we have known since our first research study
about newsletter usability that many users prefer HTML. Each of our
subsequent newsletter studies has shown increasing preferences for
HTML, as users get faster download times and bigger mailboxes.
> http://www.useit.com/alertbox/20020930.html?utm_source=3DAlertbox&u=
tm_campaign=3D5c9f1b519f-Mobile_vs_Full_Sites_4_8_2012&utm_medium=3Demail
Out of the 763 subscribers who signed up for the Alertbox mailing list
in March, only 20 (3%) elected to receive the newsletter in text-only
format.
Since 97% preferred HTML messages, it seems safe to declare this format
as the overwhelming user favorite.
Of the 20 subscribers who wanted text-only email, 4 are in developing
countries and 2 in Eastern Europe, so it seems reasonable to suspect
that they may suffer under slow or expensive Internet connections. The
statistics can't tell whether any of the 14 rich-country subscribers
are users with disabilities, but that's another group who often prefers
text-only messages.
Anyway, even though text-only email is only wanted by a tiny minority,
it's cheap enough to provide, so I still recommend offering a choice of
newsletter formats.
Copyright =C2=A9 2012 Nielsen Norman Group, All rights
reserved.
You're receiving this newsletter because you subscribed at www.useit.co=
m/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?
[12]View it in your browser.
[13]unsubscribe from this list | [14]update subscription preferences
Links:
12. http://us4.campaign-archive1.com/?u=3D538d934a891681a5d850bb4e5=
&id=3D5c9f1b519f&e=3Df405d0f72c
13. http://useit.us4.list-manage1.com/unsubscribe?u=3D538d934a89168=
1a5d850bb4e5&id=3D7f29a2b335&e=3Df405d0f72c&c=3D5c9f1b519f
14. http://useit.us4.list-manage.com/profile?u=3D538d934a891681a5d8=
50bb4e5&id=3D7f29a2b335&e=3Df405d0f72c
--_----------=_MCPart_1648125301
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: Mobile Site vs. Full Site">
<title>Alertbox: Mobile Site vs. Full Site</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:#505050;
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=0cebd78bcc&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="padding-bottom: 4px; background-color: #ffffdd; margin: 0px; padding-left: 4px; padding-right: 4px; padding-top: 4px">
<p style="margin-top: 0px; margin-bottom: 2px">
<a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=b50fbe8902&e=f405d0f72c" style="color: #505050; text-decoration: none">Summary:<br>
Good mobile user experience requires a different design than what's needed to satisfy desktop users. Two designs, two sites, and cross-linking to make it all work. </a></p>
<p style="line-height: 120%; margin-top: 2px; margin-bottom: 0px; font-size: 120%">
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=a9e639094d&e=f405d0f72c" style="color: #505050; text-decoration: none">Jakob Nielsen's Alertbox for April 10: <span style="color: #0033aa; text-decoration: underline"><strong>Mobile Site vs. Full Site </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=30e52400c9&e=f405d0f72c">Amsterdam</a>, The Netherlands: April 23-27</li>
<li>
<a href="http://useit.us4.list-manage1.com/track/click?u=538d934a891681a5d850bb4e5&id=9a426cbc4b&e=f405d0f72c">Washington, DC</a>: May 14-18</li>
<li>
<a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=4ab8c6ae28&e=f405d0f72c">Chicago</a>: June 25-29</li>
<li>
<a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=d25bb8f1f8&e=f405d0f72c">Toronto</a>: July 23-27</li>
<li>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=949dfa047b&e=f405d0f72c">Sydney</a>: August 12-17</li>
</ul>
<p>
<a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=a8cf24f0bf&e=f405d0f72c">Full event program</a> describing all full-day training courses.</p>
<p>
Deadline to save 10% on <a href="http://useit.us4.list-manage1.com/track/click?u=538d934a891681a5d850bb4e5&id=a6c3e7d058&e=f405d0f72c">early-bird registration for Washington, DC</a>:<br>
* <strong>This Friday</strong>, April 13</p>
<p>
Deadline to save €150 on <a href="http://useit.us4.list-manage2.com/track/click?u=538d934a891681a5d850bb4e5&id=083c675497&e=f405d0f72c">advance registration for Amsterdam</a>:<br>
* <strong>Next Friday</strong>, April 20</p>
<hr>
<h3>
HTML Newsletter</h3>
<p>
Starting in March, I have offered the Alertbox newsletter in HTML format with some typography and maybe even a few images. I have seen several blog postings, Tweets, etc. along the lines, "Jakob Nielsen has gone upscale; what's the world coming to?"</p>
<p>
While it's true that I stuck with an extraordinarily basic newsletter design for many years, we have known since our <a href="http://useit.us4.list-manage.com/track/click?u=538d934a891681a5d850bb4e5&id=4238ccedad&e=f405d0f72c" title="Email Newsletters Pick Up Where Websites Leave Off">first research study about newsletter usability</a> that many users prefer HTML. Each of our subsequent newsletter studies has shown increasing preferences for HTML, as users get faster download times and bigger mailboxes.</p>
<p>
Out of the 763 subscribers who signed up for the Alertbox mailing list in March, only 20 (3%) elected to receive the newsletter in text-only format.</p>
<p>
Since <strong>97% preferred HTML messages</strong>, it seems safe to declare this format as the overwhelming user favorite.</p>
<p>
Of the 20 subscribers who wanted text-only email, 4 are in developing countries and 2 in Eastern Europe, so it seems reasonable to suspect that they may suffer under slow or expensive Internet connections. The statistics can't tell whether any of the 14 rich-country subscribers are users with disabilities, but that's another group who often prefers text-only messages.</p>
<p>
Anyway, even though text-only email is only wanted by a tiny minority, it's cheap enough to provide, so I still recommend offering a choice of newsletter formats.</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 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=5c9f1b519f&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-manage1.com/unsubscribe?u=538d934a891681a5d850bb4e5&id=7f29a2b335&e=f405d0f72c&c=5c9f1b519f">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=5c9f1b519f&e=f405d0f72c" height="1" width="1"></body>
</html>
--_----------=_MCPart_1648125301--