Point me in the right direction, please., Revamp of existing website Options

[lunghd]

Hello all,

Back again after a 6 year hiatus. Pandy & co... thanks for all your help back then! I'm back looking for some feedback & to be pointed in the right direction for the knowledge I need. Not looking to learn advanced coding at the atomic level... but do want to have a better grasp of the basics as they apply to my site upgrade.

What I'm working on:

http://www.lunghd.com has been pretty static / unchanged for several years and enjoyed a good traffic count up to the early part of this year. I'm seeing a drop in visitors in large part to my clunky html & kludged together code and it's overall mobile UN-friendly nature. The site functions "ok" for full size / desktop screens & standard web browsers but could use updating in that arena as well.

Goals:

Detect mobile browsers on any page & either A) - redirect them to a mobile version of the site (ex: www.mobile.lunghd.com ) or B) - serve them a mobile version of each page on the fly

Revamp existing pages to current standards for pc & mobile browser friendliness. (Which will require all pages to eliminate tables, iframes and the myriad of other horrid things I've done...) .

Global option to set text size to visitor preference. I can probably figure out (meaning: 'cut & paste') an include for that one but as far as storing the user preferences (cookies) I haven't a clue.

Globally present --most-- pictures as small images that the visitor can click to view full screen or in a pop over style window. This would be primarily for the mobile version.

Global option to convert the entire page, with (fullsize) photos, to a .pdf file that the visitor can download or email to themselves. Will need to create a database, or list, of pages & email addresses making use of this.

Reduce javascript to a minimum and deal effectively with browsers that block use of javascript. (Via php ?????)

Not looking for detailed answers here (unless you're feeling extraordinarily generous!) - basically I need to 'plan the attack' on how to accomplish these goals & incorporate other ideas as they come.

I hate to ask such a broad question but search engine results inevitably lead me to ambiguous results that don't answer my questions. Searches return either kindergarten or PhD level answers... or "pay us to use opensource code for you!" sites with no answers at all.

[Christian J]

Detect mobile browsers on any page & either A) - redirect them to a mobile version of the site (ex: www.mobile.lunghd.com ) or B) - serve them a mobile version of each page on the fly

You might use CSS Media Queries: http://forums.htmlhelp.com/index.php?showtopic=15317

Global option to set text size to visitor preference. I can probably figure out (meaning: 'cut & paste') an include for that one but as far as storing the user preferences (cookies) I haven't a clue.

Why not let the user use his default settings? Not all users allow cookies.

deal effectively with browsers that block use of javascript. (Via php ?????)

Depends on what you want to do. In general, server-side scripts like PHP are more reliable than JS if you have a choice.

[lunghd]

Thanks Christian - that CSS link will give me something to start with there. Another thanks for jogging my memory about some old programming books I know I have around here... somewhere...

EDIT: I reread that link you gave & we have another point of agreement: SINGLE COLUMN views for smartphones. My old BlackBerry browser had that as an option to load sites that way whenever possible. Drudge's site is a classic example of a site that is unusable unless it's loaded in column view.

Edit#2: And this link http://24ways.org/2011/conditional-loading...ponsive-designs from that thread was worth the price of admission! It describes one of the problems I've faced with the exisiting site: columns that I don't want to load unless the browser window is large enough. He's using JS but still, the thought process -with examples- is what I'm trying to grasp. Thank you again!

Understood, not everyone allows cookies, etc. That's a great point that I need to add to my plan. It's one of those things that I overlooked because it is so obvious: EVERYONE blocks evil, nasty cookies! (Including me. *doh!*)

I actually don't want to force a text size on the visitor. Guess I wasn't clear: I'd like to offer visitors an easy option to enlarge text if needed on mobile devices. Let the pages load to their default setting with an option to enlarge text, etc. This, is for old farts like me who can't figure out how to do that on their smart(er than me) phone when an entire page is loaded onto that microscopic screen. I can't count the number of sites I've personally backed out of simply for that reason... I couldn't read the darned microscopic text & didn't want to futz with the phone (again) trying to figure out how to zoom text. Rather than depend on the visitor wanting to change his/her phone settings - I'd rather make it a simple option - if the visitor chooses.

Thanks for the confirmation on php being a good direction to go in. My webhosting includes access to php, Perl, MySQL & some other server side "stuff". (I've played around there some, but only so far as some script or another required.)
The discussions I've read seem to indicate php can do most everything I've been using JS for but the examples and discussion are at the far ends of the spectrum. Basically, I want to reduce the load on the visitor wherever possible in order to give visitors (esp. mobile users) a faster, easier to use site. Can you recommend a good book, or resource for basic php?

I really appreciate the guidance.

This post has been edited by lunghd: Aug 19 2012, 08:59 PM

[pandy]

I actually don't want to force a text size on the visitor. Guess I wasn't clear: I'd like to offer visitors an easy option to enlarge text if needed on mobile devices.

But do they need that more than desktops do? I'm not that experienced with mobile devices, but om my Android phone it's two clicks to change the text size. And I can, of course, zoom in a blink. I think it's as easy on my ebook reader, but not totally sure about the text size without checking. Zooming is the same.

[lunghd]

I actually don't want to force a text size on the visitor. Guess I wasn't clear: I'd like to offer visitors an easy option to enlarge text if needed on mobile devices.

But do they need that more than desktops do? I'm not that experienced with mobile devices, but om my Android phone it's two clicks to change the text size. And I can, of course, zoom in a blink. I think it's as easy on my ebook reader, but not totally sure about the text size without checking. Zooming is the same.

I must have the only Android phone that makes zooming text or column view a pain in the, um, browser. I can't even manage it with FireFox browser on that phone. Might be an option but it's a well hidden one.

I'd like to 'idiot proof' (that would be me... *doh!*) things and simply offer it as an option for visitors who look at all the gizmo abilities of our phones as an obstacle, rather than a help. (I'm a luddite. I still want knobs on my darn vehicle radio.)
I'm also thinking of all type visitors my site gets - greasy hands from working on their Jeep... and they don't want to grease up the phone any more than they can help it trying to convince their phone to cough up a hidden viewing option... or (if they're at home) don't want to go into the house and use a desktop.
Might not be sound logic - but I've been there - working on a vehicle & needed to look up something (parts, 'how-to', etc...) and ended up frustrated because I couldn't see squat on a microscopic website & had to go inside to use the pc. (Where I sometimes don't return to the same site out of sheer aggravation.)

[Christian J]

EDIT: I reread that link you gave & we have another point of agreement: SINGLE COLUMN views for smartphones. My old BlackBerry browser had that as an option to load sites that way whenever possible.

Opera Mobile can do it too, but asking visitors to change browser is not a good idea...

EVERYONE blocks evil, nasty cookies! (Including me. *doh!*)

I searched for cookie usage stats, but didn't find much (and of course figures may vary from site to site). Here's one, FWIW: http://www.grc.com/cookies/stats.htm (cookie usage figures seem remarkably high).

an option to enlarge text, etc. This, is for old farts like me who can't figure out how to do that on their smart(er than me) phone when an entire page is loaded onto that microscopic screen. I can't count the number of sites I've personally backed out of simply for that reason... I couldn't read the darned microscopic text & didn't want to futz with the phone (again) trying to figure out how to zoom text. Rather than depend on the visitor wanting to change his/her phone settings - I'd rather make it a simple option - if the visitor chooses.

Of course that requires that the site's text zoom feature is easier to figure out than the browser's. But at least in newer Android phones I believe it should be easy enough, like pandy wrote.

Basically, I want to reduce the load on the visitor wherever possible in order to give visitors (esp. mobile users) a faster, easier to use site.

Ajax can be useful for reducing bandwidth on a database-driven site, but at the same time that makes the site programming more complex, bug-prone and sometimes less user friendly. Make sure the site remains functional when Javascript is disabled, if nothing else so that search engines wont get stuck.

Can you recommend a good book, or resource for basic php?

The PHP manual is very good actually. Here's a good place to begin: http://www.php.net/manual/en/tutorial.php

[lunghd]

And I thank you again!

Yup. Not going to suggest browser changes or anything similar.

Yup. The text control I'm aiming for will be three choices: Default browser view(small), +x% (medium), ++XX% (large). I have seen websites with this... unfortunately that was while on the desktop & not looking for that perk. Finding sites with that will be added to the learning list.

Thanks for the php site's link - I'd forgotten about that one. That, along with some books from Amazon, should help me get some basics so that I can at least frame more intelligent questions.

The input is greatly appreciated & will go a long way toward easing my learning curve.

Thanks again!