HTML and CSS Reference
In-Depth Information
Paging Strategies
There are three main ways to create pages in HTML.
Standard HTML: Creating standard HTML pages and linking
to them
Single-page Ajax: Using a single page and loading
subsequent pages using AJAX
Single-page container: Using a single page as a container
with multiple pages being held within a container
<div />
and
moving between them using JavaScript
Each method has its advantages and disadvantages. For example, a mobile web
application that has many pages and resources (images, CSS, JavaScript) could
have performance issues when using the single-page container method, as all
resources and pages will be loaded upon the first page load. Therefore, the Ajax
or standard HTML method might offer better performance and load times.
For small applications and for prototyping, the single-page container method
might be preferred. CSS3/JavaScript can handle animated transitions between
pages and, as the number of resources may be minimal, it will not have a large
impact on page loading. This might be preferred, as the end user does not have
to wait for pages to load through Ajax or the standard HTML methods. This
creates a much more app-like experience.
For simpler applications, the standard HTML method might be preferred.
However, animation between pages could become impractical and there will be
a slight wait time while pages and resources load when navigating through
pages.
NOTE:
To work with the exercises in this chapter, create a new folder
within your Aptana project called
exercises
and one within that called
chapter4
. We will refer to this as the “chapter folder” in the examples.
Paging with Standard HTML
The method to create standard HTML paging is simple. To start with, create a
new folder in chapter folder in your project called
standard
and create two basic
mobile-friendly web pages called
index.html
and
index2.html
, as shown in
Listing 4-1.
