XHTML-MP: Using Tables For Layout
Posted by Rich on Friday March 30th 2007, 9:24 am
Filed under: Mobile

Ready.mobi and some other mobile style guides discourage the use of tables for layout – as well as for pretty much anything on mobile devices. I’m ok with this for devices with narrow screens, but for the wide-screened ones like the blackjack, etc. a single column layout with no accurate horizontal placement looks bad.

Recently I decided to use the logic:

c :when test="${capabilities.wall_markup != 'wml' && capabilities.resolution_width > 300}"

for my WALL-enabled JSP to determine if I should use tables. This means that any device that’s not a crappy WML device (meaning it supports the TABLE tag) and that has a resolution of greater than 300, gets a pretty conservative table layout. This makes it look so much better, and it passes the .mobi ready test too. .mobi’s tester sends in user-agents for narrow phones, so they never get the tables.

Anyone else pulling tricks like this? Am I going to find a phone that chokes on it? Will .mobi extend their tests and give me the wag of their finger? Is the table rule starting to become moot altogether? I’d like to hear your opinions.

Update: And what the heck? You can’t use the copyright symbol escape code in a mobile document according to .mobi? Using it brings my page score down to a 4 from a 5. Is this really a big deal?

Update 2:It wasn’t copy. It was having any content at all outside of my main div tag and before my closing body tag. WTF? This is just nitpicky. I wanted to be a good mobile developer and score a 5. But if it will make things this much more complicated for questionable change in phone support, I’m not going to bother. (That said, I still kinda want to score a 5.)

Bookmark and Share

No Comments so far
Leave a comment



Leave a comment
Line and paragraph breaks automatic, e-mail address never displayed, HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

(required)

(required)