- Part Two Chapter 01 – Develop Mobile Websites in HTML5
Part Two Chapter 01
To develop your mobile website, the first step is to code the web pages in HTML5.
What is HTML5?
HTML has long been a markup language used for structuring and presenting content for web pages. HTML5 is the next version to HTML4, and is the latest version of HTML.
Nowadays, users will visit your website on desktop, tablet or mobile devices. HTML5 is different to all the previous HTML versions because it is intended for developing cross-device websites.
HTML5 has new features in which HTML4 and other previous versions do not have. The new features is intended to make it easy for handling multimedia and graphical content on web pages without having to install browser plugins.
A typical website consists of multiple web pages. A single web page is made up of:
<!doctype html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body> <h1></h1> <p></p> </body> </html>
CSS provides the visual presentation of a web page.
An Example: HTML5 Web Page
A typical HTML5 web page should have the structure below.
<!doctype html> <html> <head> <title></title> <meta charset="utf-8"> <link rel="stylesheet" href="http://www.example.com/css/stylesheet.css"> <script src=" http://www.example.com/js/scripts.js"></script> </head> <body> <h1></h1> <p></p> </body> </html>
The first line specifies the document type of the web page: Coded in HTML5.
The character set of the page is specified by the META charset tag. “utf-8” enables the use of English words and characters of other languages (e.g. Chinese Simplified, Chinese Traditional, etc) on your web pages.
All web pages need a proper interface that is visual to users. CSS provides the visual presentation of the page. The “ref” attribute in the “link” tag retrieves the CSS from the external file “stylesheet.css”.
<link rel="stylesheet" href="http://www.example.com/css/stylesheet.css">
Launch Mobile Websites with WordPress or Shopify
Wordpress and Shopify are two commonly used website builders for anyone to develop and launch mobile friendly websites.
- You can install WordPress on Siteground after buying a domain name and an inexpensive hosting package.
- Shopify is a website builder in which you won’t have to manage the web hosting. But refer to this Shopify setup checklist to ensure your website is optimally set up.
Gordon Choi's Mobile Website Book has been available since November 2016.
Content on Gordon Choi's Mobile Website Book is licensed under the CC Attribution-Noncommercial 4.0 International license.