Find file
Fetching contributors…
Cannot retrieve contributors at this time
177 lines (164 sloc) 7.41 KB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML5 Apps</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le styles -->
<link href="assets/css/bootstrap.css" rel="stylesheet">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
<link href="assets/css/docs.css" rel="stylesheet">
<link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700,800' rel='stylesheet' type='text/css'>
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="assets/ico/favicon.ico">
<link rel="apple-touch-icon" href="assets/ico/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/ico/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/ico/apple-touch-icon-114x114.png">
</head>
<body data-spy="scroll" data-target=".subnav" data-offset="50">
<!-- Navbar
================================================== -->
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="i-bar"></span>
<span class="i-bar"></span>
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">HTML5 Apps</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>
</li>
<li class="">
<a href="./highfalutin.html">Motivation</a>
</li>
<li class="active">
<a href="./appsandweb.html">Apps+Web</a>
</li>
<li class="">
<a href="./technology.html">Technology</a>
</li>
<li class="">
<a href="./design.html">Design</a>
</li>
<li class="">
<a href="./mechanics.html">Mechanics</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<div id="overview">
<header class="jumbotron masthead" id="overview">
<h1>Apps vs. Web <br/><span class="light">or</span> <br/>Apps + Web?</h1>
<div class="spacer">
</div>
<p>Peanut butter &amp; Chocolate: why choose?</p>
</header>
<hr class="soften">
<div class="subnav">
<ul class="nav pills">
<li><a href="#apps">What's exciting about Apps?</a></li>
<li><a href="#web">What's important about the Web?</a></li>
<li><a href="#both">Can't we have both?</a></li>
</ul>
</div>
</div>
<!-- Grid system
================================================== -->
<section id="apps">
<div class="page-header"/>
<div class="well slideheight">
<h1>What's so exciting about apps?</h1>
<div class="hero-unit">
<div id="appsCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active"><h1>Apps work on phones &amp; tablets.<br/>duh.</h1></div>
<div class="item"><h1>Apps are easy to buy, install, use, share.</h1></div>
<div class="item"><h1>Apps are single-purpose, simple.</h1></div>
<div class="item"><h1>Apps work offline!</h1></div>
<div class="item"><h1>Apps are full screen.</h1></div>
<div class="item"><h1>Apps have a glossy launch button.</h1></div>
<div class="item"><h1>Apps platforms drive users.</h1></div>
<div class="item"><h1>Monetization!</h1></div>
</div>
<a class="carousel-control left aside" href="#appsCarousel" data-slide="prev">&lsaquo;</a>
<a class="carousel-control right aside" href="#appsCarousel" data-slide="next">&rsaquo;</a>
</div>
</div>
</div>
<br>
</section>
<section id="web">
<div class="page-header"/>
<div class="well slideheight">
<h1>What's important about the web?</h1>
<div class="hero-unit">
<div id="webCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active"><h1>Openness at every level</h1></div>
<div class="item"><h1>Universality, deeply</h1></div>
<div class="item"><h1>No middlemen</h1></div>
<div class="item"><h1>Innovation from the edge</h1></div>
</div>
<a class="carousel-control left aside" href="#webCarousel" data-slide="prev">&lsaquo;</a>
<a class="carousel-control right aside" href="#webCarousel" data-slide="next">&rsaquo;</a>
</div>
</div>
</div>
<br>
</section>
<section id="both">
<div class="page-header"/>
<div class="well slideheight">
<h1>Peanut Butter + Chocolate</h1>
<div class="hero-unit">
<div id="bothCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active"><h1>Why not bring app qualities to the web?</h1></div>
<div class="item"><h1>Build a runtime environment that is webby: WebRT</h1></div>
<div class="item"><h1>Model an open appstore</h1></div>
<div class="item"><h1>Define APIs inspired by phones</h1></div>
<div class="item"><h1>Many allies</h1></div>
<div class="item"><h1>Reboot the web, that's all!</h1></div>
</div>
<a class="carousel-control left aside" href="#bothCarousel" data-slide="prev">&lsaquo;</a>
<a class="carousel-control right aside" href="#bothCarousel" data-slide="next">&rsaquo;</a>
</div>
</div>
</div>
<br>
</section>
</div><!-- /container -->
<!-- Le javascript
================================================== -->
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script src="assets/js/tests/vendor/jquery.js"></script>
<script src="assets/js/google-code-prettify/prettify.js"></script>
<script src="assets/js/bootstrap-transition.js"></script>
<script src="assets/js/bootstrap-alert.js"></script>
<script src="assets/js/bootstrap-modal.js"></script>
<script src="assets/js/bootstrap-dropdown.js"></script>
<script src="assets/js/bootstrap-scrollspy.js"></script>
<script src="assets/js/bootstrap-tab.js"></script>
<script src="assets/js/bootstrap-tooltip.js"></script>
<script src="assets/js/bootstrap-popover.js"></script>
<script src="assets/js/bootstrap-button.js"></script>
<script src="assets/js/bootstrap-collapse.js"></script>
<script src="assets/js/bootstrap-carousel.js"></script>
<script src="assets/js/bootstrap-typeahead.js"></script>
<script src="assets/js/application.js"></script>
</body>
</html>