How to make a mobile website?

mobile sites are usually made in the wap/wml format..now html format has come for mobile too...

first abt wml...

Unfortunately WML cannot be run on all web hosts. For WML content to be run, a web host must make some changes to the configuration of their web server. If your host cannot do this for you, you can try WAPHosts.net. They can provide you with a server which will support WML.

Declaring A WML Document

When you are creating a WML document all you need is notepad or another text editor, just like for HTML. The first thing you should enter is:

<?xml version="1.0"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"

"http://www.wapforum.org/DTD/wml_1.1.xml"><wml>

this tells the phone that it is interpreting a WML document and which WML standards it is using.

Cards

Instead of having pages, WAP sites have cards. These are what is displayed on the screen at one time, just like a page. More than one card can be inserted in each WML document. To declare a card, insert the following:

<card id="index" title="My WAP Site" newcontext="true">

This will make a card with the ID index (used for linking) and will display the text:

My WAP Site

at the top of the screen.

Closing Tags

Unlike with HTML, it is extremely important to close WML tags. If you do not, a page will certainly not work. You must close both the <card> and <wml> tags:

</card>

</wml>

now html can be used for mobile sites..

Rudimentary Steps:

You’ll first need to obtain a copy of Adobe Creative Suite 3 that has Dreamweaver CS3 and Adobe Device Central (FYI: Device Central does not ship separately from CS3. It is part of the overall suite).

Now:

1.) Launch Dreamweaver CS3. (NOTE: currently you can’t start the mobile workflow from within Device Central).

2.) Next thing to do is select the More … folder from the Create New option.

3.) Select HTML from Page Type and then simply publish out using XHTML Mobile 1.0 profile under DocType from the menu (this will just add a header, no biggie).

4.) Start coding your HTML based Mobile Web Site to your hearts content.

Remember, try to keep it a simplistic HTML design (use basic HTML and follow the community .mobi guidelines as best as you can).

Learning to code HTML for mobile

When developing for mobile, there are some really good websites out there in regards to coding practices for HTML on mobile.

There are also some templates over at the .MOBI developer site if you want to go that route. This includes the dot MOBI site, and the dotmobi mobile web developers guide.

Also, Community MX also has a decent series on articles on Mobile Web.

There are numerous other resources of the subject, just search.

5.) Once the site markup is complete, you’ll of course, want to test it.

Here instead of testing within Web Browser as you typically would in Web based project, you now use the Preview in Browser, and then select Adobe Device Central from the menu.

his changes the workflow from desktop to mobile! … a time saver in that you can test iteratively within Adobe Device Central before you push down to physical devices for testing.

6.) Once in Adobe Device Central, first you’ll want to pick a target device from the Available Devices panel on the left.

You can either choose your target devices manually, or better still build a device profile containing all the devices you plan to support.

Once completed, your content will load and render for the device(s) choosen. Notice that the content type is set to Browser mode in Content type panel.

If you think you’re going to support each and every device out there, you’re overly ambitious. In some respects, it much like the early “Browser Wars” on desktop, but this time around you must deal with different devices, screen sizes, browsers, etc.

Keeping your design simple and “clean” is good approach to making it viewable across the largest collection of mobile and portable devices out there. Again, check out some sample mobi sites, and read the Mobile Web Developers guide for more insight.