Mobile Web Page Development Tutorial Part I

      Comments Off on Mobile Web Page Development Tutorial Part I

Google Add

Mobile Web Pages Development Tutorial – Part I

If we know how to create web pages using XHTML, we can comfortably create web pages for mobile browsers. For part 1 of this tutorial, we are going to create a simple home page for a mobile website. At the end of part 1, we will recap before we move to part 2. In part 2, we will incorporate CSS as part of a mobile webpage.

A few tools we will use in this part one are as follows:

  • Opera Mini Simulator, used to test our simple mobile web page. Opera Mini Simulator is popular mobile browser from Opera
  • A text editor, (to write our web page)
  • Mobile Profile Validator to validate your XHML Mobil Profile 1.1
  • FileZilla, to transfer our simple web page to our website.

Step 1 – Develop the mobile web page

Use a notepad and create a page name index.html. Enter the following code:


Step 2 – Upload to our website

Use FileZilla to upload to the website of the mobile web page.

Step 3 – validate the web page

The W3C Validator of XHTML Mobile Profile is at
Simply enter the URL of the mobile web page and hit return. The result could be shown as follows


Step 4- View the web page with Opera Mini Simulator
The Opera Mini Simulator is at The simulator allows us to simulate the Opera Mini browser of a mobile phone.

Enter the URL of the mobile web page. See image below

Next we press OK. We would see the web pages as follows:

simulator view


 Click to go to the next part – part II – Mobile Web Page Development Tutorial