How to create mobile version of a website

Question

5.00/5 (2 votes)

See more:

I have googled this topic and found lots of solution but still i am confused how to start.
I have made some asp.net websites in which i was applying JQuery, Ajax, webservices this technology.
Now i want to make that website in a lighter mobile version(windows phone, android phone, tablet, iphone, other mobile device).

Please guide me properly so that i have a clear idea regarding mobile website development.

Thanks in advance.

Posted 31-Aug-12 0:40am

sahabiswarup

Updated 31-Aug-12 0:43am

v2

Add a Solution

Comments

Prasad_Kulkarni 31-Aug-12 6:44am

:thumbsup:

4 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

VIPR@T · Answer 1 · 2012-08-31T01:11:00

Solution 3

hi,

Right now i have no code becuase i had worked on that in previous company.
But i can help you.
i hope you have normal site.
now you don`t need to change the the code.
just change the UI.

http://jquerymobile.com/demos/1.1.1/[^]

See this link.
you will get all your controls over here.

suppose you have textbox asp.net control. then you have to just give the attributs. look the below example for textbox. here data-role="fieldcontain"
will gibe you the layout.

http://jquerymobile.com/demos/1.1.1/docs/forms/textinputs/[^]

you can just review 2 days this website. I am sure you will get idea.
All the detailed documets over here.

http://jquerymobile.com/demos/1.1.1/docs/about/getting-started.html[^]

Thanks,
Viprat Shah

Posted 31-Aug-12 1:11am

VIPR@T

Comments

sahabiswarup 31-Aug-12 7:21am

Thanks for your co-operation. i'll try and definitely disturb you if i am getting any trouble [:P]

VIPR@T 31-Aug-12 7:27am

sure.... :)

VIPR@T 31-Aug-12 7:28am

see mbet.co.za/mobi
i had worked on it.

sahabiswarup 31-Aug-12 8:43am

when i am typing www.mbet.co.za on mobile it doesn't redirect to the mbet.co.za/mobi page.
That's the important thing which i want to implement in my website.
and mbet.co.za/mobi this page showing error may be some configuration error.

VIPR@T 31-Aug-12 9:03am

http://www.worldofsport.co.za/mobi/mobi_Login.aspx
http://www.mbet.co.za/mobi/Default.aspx

This 2 examples.

sahabiswarup 1-Sep-12 0:26am

These are really interesting..Good job..

VIPR@T 1-Sep-12 0:34am

Thanks..

sahabiswarup 1-Sep-12 2:07am

viprat in jquerymobile.com i am using their tools to make mobile website which is powered by Codiqa. i found in http://www.codiqa.com/ that this are free for 30 days. if these i have problem. Are you having codiqa license to use their tools?

VIPR@T 1-Sep-12 2:42am

hi, go through
http://jquerymobile.com/download/
download
Zip File: jquery.mobile-1.1.1.zip (JavaScript, CSS, and images)
here only css and jquey so you don`t require any licence for that.
once download this folder and see the examples. you have to just use the css and jquery.

sahabiswarup 1-Sep-12 15:52pm

Thanks viprat; this all examples are based on html. can you give me a idea if i want to convert my dynamic website into mobile version then how should i utilize this jquery plugin's?

VIPR@T 3-Sep-12 0:20am

you can design your page like this html. you have to design all your aspx page like this. And your code remain same as normal site.

sahabiswarup 4-Sep-12 3:17am

I have done it; but its just a basic design; try to improve myself in this technology.

VIPR@T 4-Sep-12 4:19am

see the example site which i had given you.

http://www.worldofsport.co.za/mobi/mobi_Login.aspx
http://www.mbet.co.za/mobi/Default.aspx

These are for mobile. And see its normal site.

http://www.worldofsport.co.za
http://www.mbet.co.za

Both site has all the functionality. But in mobile site we have to do some modification as per suitable design. so you have to first make the layout for that.

Eduard Keilholz · Answer 2 · 2012-08-31T00:44:00

Solution 1

Maybe this helps :
http://www.asp.net/whitepapers/mvc4-release-notes#_Toc303253809[^]

Posted 31-Aug-12 0:44am

Eduard Keilholz

Comments

sahabiswarup 31-Aug-12 6:55am

This is not what i want...but Thanks Eduard for sharing this link.

VIPR@T · Answer 3 · 2012-08-31T00:54:00

Solution 2

hi,

http://jquerymobile.com/[^]

Download the jquery from here.
i have worked with 2 projects using this jquery.
its very good and user friendly.
you will get all solution over here.

Thanks,
Viprat

Posted 31-Aug-12 0:54am

VIPR@T

Comments

sahabiswarup 31-Aug-12 6:58am

can you please share some code snippet so that i can get some idea from there viprat

_Amy · Answer 4 · 2012-08-31T01:18:00

Solution 4

Hi,
See the similar thread below:
how to make asp.net web site,mobile comparability[^]

--Amit

Posted 31-Aug-12 1:18am

_Amy