Mobile website

[rink.attendant.6]

I'm not really sure where to post this... Anyways, I have an HTML5 site built and I would like to create a mobile version of it as well. I'm looking towards jQuery Mobile, but I can see that requires significant amounts of restructuring of my code despite the fact that it is already very semantic. (e.g. jQuery mobile uses unordered lists for some things that I use <section> and <div> for.) One solution that I am thinking of is to detect the mobile device via PHP and set a variable (say, $mobile) then output HTML accordingly:

<?php if($mobile) { ?><!-- some mobile HTML here --><?php } else { ?><!-- some desktop HTML here --><?php } ?>

However this solution seems quite messy and I'm not sure whether it is the best way to go. Another idea would be to copy the entire site into a subdomain and maintain two versions of code but that really does not fall under the DRY philosophy. Besides, that will make adding features and stuff very complicated. What would be the best way to do this? I'd really like to stick with jQuery Mobile if possible, it seems to have a wide range of support on devices.

[boen_robot]

Abstract away the common stuff... which I assume would include the vast majority of PHP code... and use two HTML templates - one for desktop, and another for mobile.This is assuming that you're currently using a template engine rather than just "blindly" mixing your PHP and HTML. If you aren't yet using a template engine, you have some work ahead of you to separate your common code from your device-specific code.BTW, it's important to note - you should let users override your detection. Just sayin'.

[rink.attendant.6]

You had me until you said template engine.... Currently the application logic (processing of data, form validation, database operations) is separated from the presentation. Other than that I'm not quite sure if I'm doing it right. :/

[boen_robot]

The template engine is the component that takes data from the application logic and combines it with a presentation template ("template" being basically, HTML with "slots" for the data to go into) to produce the final HTML. If you truly have separation between those two, then you should be able to use the application logic with different presentation templates, in which case you already have a template engine. It's just that it's a custom engine, not a separate one.

[rink.attendant.6]

Ahh ok... I did quite a bit of reading on the Model-View-Controller and Model-View-Presenter frameworks and it seems that I have the model completely separated, but my "View" is mixed with my "Controller". I shall try to fix that, Smarty seems to be overkill for what I'm doing.