HTML and CSS Reference
In-Depth Information
Web Font SaaS Options
For this app, we're using Fonts.com to load Cooper Black and news gothic into our design. there are many
options available, but a few of the most popular options are these:
if you choose to use something other than
Fonts.com,
you'll still be able to complete the app in this topic without
issue, but note that the
font-family
names will probably vary.
Not
■
the Fonts.com free account requires a banner to be placed in your app, which the JavaScript include
automatically does. a free account at Fontdeck will allow you to develop the app in this topic without any added cost.
they charge only when a site is taken “live,” which they consider to be when more than 20 unique ip addresses need
to access the site.
Common Elements
This app, like most others, has common elements that don't change from page to page. Let's start by developing those.
The Header Markup
Every view this app will offer features the header at the top. This is structurally simple: it's a box with the app title and
a tagline inside.
Using the HTML5
<header>
element, add the header markup to the
<body>
section of
index.html
:
<body>
<header>
<h1>Realtime Q&A</h1>
<p class="tagline">
A live feedback system for classes, presentations, and conferences.
</p><!--/.tagline-->
</header>
</body>
Ti
■
using a comment at the closing of elements with classes or ids can help with scannability, especially when
dealing with nested elements or layouts that nest the same tags, such as
<div>
elements. these comments are entirely
optional.
Search WWH ::
Custom Search