louie540 — 2011-06-16T22:23:14-04:00 — #1
I didn't realize there was a Mobile Development section. Please move, thanks.
I decided to start making a mobile version of my website. From what I've gathered via Youtube, Google, etc, I found that you should make a site that doesn't have a lot of width. So I made mine with about 340px in width.
Earlier today, I was browsing mobile phone websites on my laptop, just for kicks. But I realized that they all have something in common that I don't.
YouTube - Broadcast Yourself.
They all look the same, and they don't have their width set to something like 340px.
This is currently mine: Metal Gear Solid Info
What do you guys think? What do you recommend I should do? Should I just keep it the way it is or try to change it? My site didn't take very long (about a day).
ralphm — 2011-06-16T22:34:15-04:00 — #2
If you set the width to 100%, it will fit any browser size. For monitors that are too wide, you could set a maximum width.
The next step is to serve up different styles for different media, via media queries.
This slideshow takes it a step further, and is worth a look:
Rethinking the Mobile Web by Yiibu
louie540 — 2011-06-16T22:44:38-04:00 — #3
I'll be sure to take a look, thanks.
stevie_d — 2011-06-17T07:27:05-04:00 — #4
This doesn't always apply to mobile browsers.
For example, I'm running Opera Mini on a Nokia touch-screen phone. When the phone is trying to display it as a fully functional web page, it lays out the page at a default width of about 840px, even where the stylesheet would quite happily let it take a much narrower width. This means that it invokes horizontal scrolling, sometimes unnecessarily. On the other hand, it does try to make the width of the main content column exactly the width of the screen, which is pretty smart.