As an amateur, I have set up a few small websites over the years, with the use of a now out-dated Dreamweaver 2004MX and some PHP/MYSQL. It would be great to make one or two of the sites "mobile-friendly", and am seeking advice on how to tackle this. In the past I have found text-books on PHP, HTML etc. to be helpful. Are there any books on converting sites to mobile-use which you could recommend? Or perhaps there are particularly clear and helpful websites that you know of that might help.
Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Starting out in Converting websites to Mobile Phone use.
- Thread starter BadChough
- Start date
ChrisHirst
IS-IT--Management
mobile use" meaning??
Because I don't know of a mobile operating systems that supports running PHP on it.
Chris.
Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
Because I don't know of a mobile operating systems that supports running PHP on it.
Chris.
Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
- Thread starter
- #3
Thanks for the question ChrisHirst.
What I mean is sorting out websites that operate ok on a desktop browser, but either don't fully operate, or are awkward to read and navigate on a an iphone or other mobile phone.
and example of mine is where the php that I have used still does the job when viewed on my iphone, but the layout is not really appropriate for that media.
Does that make sense?
What I mean is sorting out websites that operate ok on a desktop browser, but either don't fully operate, or are awkward to read and navigate on a an iphone or other mobile phone.
and example of mine is where the php that I have used still does the job when viewed on my iphone, but the layout is not really appropriate for that media.
Does that make sense?
There are two ways to approach this problem:
1. Browser detection
2. Responsive design
Browser detection usually works by analyzing the browsers user agent (either server-side in PHP or via Javascript) and then redirecting to a mobile friendly version of the site (usually at a subdomain, like your instance m.dvw.org.uk). If you were using PHP to do the detection you could internally route and output the design without the redirect keeping the URL the same for both sites (keeping the URL the same is a plus).
The downside to browser detection is that it is not always accurate, especially if the user disables sending the user agent string to the server.
Responsive design involves crafting your HTML and CSS to change for different devices (usually using screen sizes). This has the plus of keeping the URL the same, and not relying on the user agent string - only the capabilities of the browser. These type of website designs can be more complicated to design, as you have to make the same markup adapt to each device.
As of right now there isn't really a good way to handle responsive images. Images that work good on a desktop, might be to big for a mobile site and using a smaller image could save precious network bandwidth for mobile users - but that smaller image wouldn't work good on the desktop. Having a separate site via browser detection can handle this fine, by just outputting a different image. There are some tricks for responsive design, and it looks like there is a specification in the works, but don't expect broad browser support for a while.
I would really look into the responsive design strategy, of which you can find numerous articles online. Responsive design has the added benefit of having the website work well on the desktop even if the user re-sizes the browser.
1. Browser detection
2. Responsive design
Browser detection usually works by analyzing the browsers user agent (either server-side in PHP or via Javascript) and then redirecting to a mobile friendly version of the site (usually at a subdomain, like your instance m.dvw.org.uk). If you were using PHP to do the detection you could internally route and output the design without the redirect keeping the URL the same for both sites (keeping the URL the same is a plus).
The downside to browser detection is that it is not always accurate, especially if the user disables sending the user agent string to the server.
Responsive design involves crafting your HTML and CSS to change for different devices (usually using screen sizes). This has the plus of keeping the URL the same, and not relying on the user agent string - only the capabilities of the browser. These type of website designs can be more complicated to design, as you have to make the same markup adapt to each device.
As of right now there isn't really a good way to handle responsive images. Images that work good on a desktop, might be to big for a mobile site and using a smaller image could save precious network bandwidth for mobile users - but that smaller image wouldn't work good on the desktop. Having a separate site via browser detection can handle this fine, by just outputting a different image. There are some tricks for responsive design, and it looks like there is a specification in the works, but don't expect broad browser support for a while.
I would really look into the responsive design strategy, of which you can find numerous articles online. Responsive design has the added benefit of having the website work well on the desktop even if the user re-sizes the browser.
ChrisHirst
IS-IT--Management
Right! So being in the PHP forum was a bit of a red herring then, as you really need forum215. PHP is server side so doesn't actually 'know' what it is being 'used on'.
The answer by the way is "CSS media queries"
Chris.
Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
The answer by the way is "CSS media queries"
Chris.
Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
I agree with Chris. While you can detect the user agent and output a site accordingly. Its usually not all that accurate, and you would have to contend with the thousands of different user agents out there to determine the type of browser being used, which tends to be very inconvenient.
The "easier" way of tackling this is using a responsive design via media queries. Most newer devices support this just fine and will honor the CSS in the media queries.
You can even specify different images of different sizes through the media queries, so you deliver smaller images to mobile devices and larger more HD images to desktop devices.
There are in fact many many books about this already.
This of course falls really far away from PHP since its all in the HTML and CSS portion of the site.
----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
Web & Tech
The "easier" way of tackling this is using a responsive design via media queries. Most newer devices support this just fine and will honor the CSS in the media queries.
You can even specify different images of different sizes through the media queries, so you deliver smaller images to mobile devices and larger more HD images to desktop devices.
There are in fact many many books about this already.
This of course falls really far away from PHP since its all in the HTML and CSS portion of the site.
----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
Web & Tech
- Status
Similar threads