Everything is getting smaller by the day…the web is going mobile!!! i hope we are all aware of that? anyway i need to know, how do i create a mobile version for my website. eg yahoo have m.yahoo.com which is different from the usual yahoo.com that you see on you system…how do i create something like that? are there special css, html or javascript for that? Trust you guys have answers.
Sam! Check out HTML 5. Secondly, if you study mobile web architecture, you will find that it is usually made up of text and small sized images. Find out about responsive web design. With this, you web content can automatically fit into any browser window on any device that is capable of displaying web content. please check out http://www.antarcticstation.org/station/construction/ please visit smashingmagazine.com for tutorials on responsive websites. Please watch out for my workshop on compliant web processes, design architecture and implementation and custom CMS design and extension… Coming to your neighborhood soon! Gate fee… to be argued! I hope this works.
well mister samson what u are asking is quite very sime there is nothing really special. first thing is to create the sub domain in ur site’s control panel which will be m.yoursite.com next you build a miniaturised version of the site again wit less images and No javascript. just server language (php, jsp, asp, asp.net) and client languages (html and css). then upload it to that m.yoursite.com which is now a common folder in your site directory.
mark u people will have to always type m.yoursite.com to visit it. but there is a simple code (if you are interested) i can give u dat will automatically know d device your user is using and redirect the user wether it is a mobile site or for a desktop.
lastly for those who use CMS they usualy have mobile themes so they just use that so they dont bother about any code.
mysite: www.talkdeygo.com it has its mobile too m.talkdeygo.com you can check and see for yourself. i hope i have helped u
Thanks guys, i really appreciate your response…out of curiosity, i found one e-book, am reading already. @nimboya: i am interested in the code oh! u can send it to [email protected] pls.
@DangerMouse: pls lets know when your programme is coming up on facebook, twitter, yahoo, even codenigeria…everywhere!!!
Firstly, creating a subdomain of m.yourwebsite.com is old-school oga samson, as DangerMouse as mention, it is responsive design bro…your typical website.com to display differently depending on the platform it being view it (width,height,dimension etc)
please oh i would like to know if u say m.sitename.com is old schoool then what is nee school. what dou tink the big boys use. yahoo, google facebook etc. well will like u to xplain d new type if m.sitename.com is old
@nimboya, dont get me wrong oh…my meaning is responsive design is the way to go - and you dont need m.website.com for that. As for yahoo.google and facebook having m.theirwebsite.com, that is what is called “progressive enchancement”, if you use one of the latest phones/devices to browse those guys website, you wont be taking to m.theirwebsite.com though you use a mobile device to access them, but if you use some of the less capable phones, you will be shown m.theirwebsite.com
My Point: you can have a mobile version website without using m.website.com, you can write a php script to detect useragent and the like, and serve each device different stylesheet.
What @SpryPixels is saying is actually the best way to render a mobile version of ur site, irrespective if the user visit the m.mysite.com directly or not.
I’'ve attached a php script to help detect if the user is on a mobile platform or not.
Usage:
Put the at the start of ur index code.
$detect = new mobileDetect();
if($detect->isMobile()) {
//also available are — isAndroid(), isBlackberry(), isOpera(), isPalm(), isWindows(), isGeneric()
$gc[‘isMobi’] = true;//this is just my own way of handling the result… tweak to urs
//or you can redirect to a mobile URL
}else{
$gc[‘isMobi’] = false;
}
Nice guys, i am happy we have this forum…different view, same result. @OLSylas, i cant find you attachment oh!, i believe its the same with the test above! Honestly, i wish i can still learn this so called php, i don old!!! lol! Thumbs up guys
Hi long time since ave been on this forum, actually mobile sites are easy to implement especially from a PHP MVC Framework, the thing is i try to conceptualize it, first when an HttpRequest is made there is always a preDispatch and postDisptach so we enter the preDispatch check to see if it is a Mobile Environment if its then either pass it a mobile View or pass it to a Mobile Controller and load the mobile template view, and your got a good mobile view there i usually create 3 Routes one for Web-kit based browser, one for non-webkit and the xhtml/wap in Zend and Yii
click on the file link or http://codenigeria.com/uploads/FileUpload/ac/e9d46af4d8155e5c676b2d532cdcfc.txt
@OLSylas: you are not specific about where i should put this code:
$detect = new mobileDetect();
if($detect->isMobile()) {
//also available are — isAndroid(), isBlackberry(), isOpera(), isPalm(), isWindows(), isGeneric()
$gc[‘isMobi’] = true;//this is just my own way of handling the result… tweak to urs
//or you can redirect to a mobile URL
}else{
$gc[‘isMobi’] = false;
}
is at at the beginning of my index code? ie before ? OR before ?
where exactly sir?
also, the php document you attached sir, what file name will i give it? does it have a special location am suppose to save it to?
kindly reply sir.
is at at the beginning of my index code? ie before “head” OR “body”? where sir?
Note that it’s a php code and wud only run in a php file.
The code shud be at the beginning of your php file.
Example:
`
it means my index page will be saved as index.php?
then my second question is:
The link u sent to me; http://codenigeria.com/uploads/FileUpload/ac/e9d46af4d8155e5c676b2d532cdcfc.txt
what file name will i give to it? where do i also keep the file?
@oga Samson, you need to learn php o 
step 1. rename your index.html to index.php and copy/paste the code above by Silas to the very top of your document, before the doctype declaration.
step 2. open the link : http://codenigeria.com/uploads/FileUpload/ac/e9d46af4d8155e5c676b2d532cdcfc.txt and choose file->save as from your browser menu, and save it as “MobileDetect.php” without the apostrophes.
step 3. Open MobileDetect.php in your fav editor and edit line 5 of the code above, that says "header(“Location: URL-TO-MOBILE-PAGE”); "…change URL-TO-MOBILE-PAGE to the url you wanted.
step4. make sure MobileDetect.php and your index.php resides in same root directory.
thats it, it should work.
though i strongly do recommend media queries, works good for my website.
Thank you so much! You guys are the best!!! I actually want to learn the php oh! i didnt find anybody to show me the way, am also very busy, thats not helping matters at all.
Which one is “media queries” again? lol! thanks for helping out
media queries is featured in CSS3 …google it to learn more about it or read http://coding.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/
Silas link to the smashingMagazine is a very good start. For a demo, visit my website www.sprypixels.com on any platform or better still, view on your browser and resize the browser window to see media query in effect.
thanks, that was a good one. thumbs up!! i think there is something i didn’t get right oh!
“Location: URL-TO-MOBILE-PAGE” please which one is the correct one?
Location: http://nextlayers.com/ OR
Location: www.nextlayers.com OR
Location: nextlayers.com
which is the correct one out of the 3?