Help
Hey,
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for this sort of blog, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
Page 1 of 1
iPad web design trouble
#1
PeterParker 
- Member
-
- Group: New Members
- Posts: 20
- Joined: 26-May 12
Posted 13 December 2012 - 12:35 PM
#2
smax013
- Veteran
-
- Group: Members
- Posts: 2,910
- Joined: 06-July 07
Posted 16 December 2012 - 01:22 AM
PeterParker, on 13 December 2012 - 12:35 PM, said:
Hey,
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for this sort of blog, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for this sort of blog, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
I think it is just a web protocol/format that iOS browsers do not support...kind of like how iOS does not support Flash. I am not sure there is any work around for it other than programming the site to recognize an iOS browser and have the site deal with the background differently for such browsers...but that is something way beyond my scope of knowledge.
This post has been edited by smax013: 16 December 2012 - 01:24 AM
[soapbox]Back up = good...No back up = bad[/soapbox]
#3
icerabbit
- Veteran
-
- Group: Members
- Posts: 2,116
- Joined: 28-March 02
Posted 23 December 2012 - 08:26 AM
PeterParker, on 13 December 2012 - 12:35 PM, said:
Hey,
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for this sort of blog, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for this sort of blog, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
It is not just in Safari. Other mobile browsers seem to have it the same way. It must be the way the page is coded and/or some errors, as a static background, a static layer and scrolling layer are pretty basic stuff.
Looking under the hood, there are quite a number of errors in the code. Which, may be "forgiven" in a desktop browser where it'll fix or ignore the omission (fill in the blanks) or go into some compatibility mode; but smaller mobile versions of browsers don't have the same sophistication and may just leave things out, static, ... I'd start by fixing the errors in the code and/or stripping out some of the unsupported elements.
But, of course we're dealing with a third party product, using a third party theme. Seems like it uses something called posterous. So, unfortunately besides getting posterous to fix their code for that theme, or picking a different theme, there aren't any options ... unless posterous gives you access to all the theme code, which I doubt, if it is anything like other blogging platforms.
Anyway, I wouldn't blame the iOS device. Posterous seems the issue.
Tiny side note: I don't know that I'd ever let myself or anyone else use an image of Whoopi Goldberg or any other person, famous or not; labeled with "this is me" on any site.
This post has been edited by icerabbit: 23 December 2012 - 08:27 AM
#4
icerabbit
- Veteran
-
- Group: Members
- Posts: 2,116
- Joined: 28-March 02
Posted 23 December 2012 - 08:36 AM
PS:
There might be an option to enable an additional style sheet for mobile devices, which would bypass the issue. If you strip out a bunch of advanced code, keep it simple and set the background big enough and static, nobody would ever know you're serving two different styles.
Looks like there is an option to customize themes. I haven't seen the details, but it is referenced with just one paragraph.
So, that may be the way to go; without trying to fix everything posterous or someone else coded for that theme.
There might be an option to enable an additional style sheet for mobile devices, which would bypass the issue. If you strip out a bunch of advanced code, keep it simple and set the background big enough and static, nobody would ever know you're serving two different styles.
Looks like there is an option to customize themes. I haven't seen the details, but it is referenced with just one paragraph.
So, that may be the way to go; without trying to fix everything posterous or someone else coded for that theme.
#5
PeterParker
- Member
-
- Group: New Members
- Posts: 20
- Joined: 26-May 12
Posted 23 December 2012 - 11:07 AM
Yes (to icerabbit),
this is probably a good summary of the issues at hand. Posterous is one of the largest Blog services, I believe, so I guess they are providing more tablet-friendly solutions in the future.
In short: I decided most friends/possible site visitors are not going to visit this site in the near future on a tablet. Maybe in a few months or in a year, but I'd say they are not the type, my parents are rather modern. So as the design was lots of work and as I still like it rather much, I'm not going to change it quickly. (I also did try your suggestions already, in a way, just exchanging something simple, but this is not so easy, nothing worked 'well' - without changing the original design so much that it destroys part of it. I'm not extremely skilled, I'm rather doing my best. What coding mistakes are you refering to anyway?)
One last thing: What's wrong about Whoopi? My suggestion was to swap this image every few weeks or so - just beautiful singers, actresses and stuff, Madonna was last. I didn't consider copyright questions yet, anyway, but there are not going to be zillion visitors, so...
Merry christmas everyone,
Pete
this is probably a good summary of the issues at hand. Posterous is one of the largest Blog services, I believe, so I guess they are providing more tablet-friendly solutions in the future.
In short: I decided most friends/possible site visitors are not going to visit this site in the near future on a tablet. Maybe in a few months or in a year, but I'd say they are not the type, my parents are rather modern. So as the design was lots of work and as I still like it rather much, I'm not going to change it quickly. (I also did try your suggestions already, in a way, just exchanging something simple, but this is not so easy, nothing worked 'well' - without changing the original design so much that it destroys part of it. I'm not extremely skilled, I'm rather doing my best. What coding mistakes are you refering to anyway?)
One last thing: What's wrong about Whoopi? My suggestion was to swap this image every few weeks or so - just beautiful singers, actresses and stuff, Madonna was last. I didn't consider copyright questions yet, anyway, but there are not going to be zillion visitors, so...
Merry christmas everyone,
Pete
#6
icerabbit
- Veteran
-
- Group: Members
- Posts: 2,116
- Joined: 28-March 02
Posted 23 December 2012 - 02:29 PM
PeterParker, on 23 December 2012 - 11:07 AM, said:
Yes (to icerabbit),
this is probably a good summary of the issues at hand. Posterous is one of the largest Blog services, I believe, so I guess they are providing more tablet-friendly solutions in the future.
In short: I decided most friends/possible site visitors are not going to visit this site in the near future on a tablet. Maybe in a few months or in a year, but I'd say they are not the type, my parents are rather modern. So as the design was lots of work and as I still like it rather much, I'm not going to change it quickly. (I also did try your suggestions already, in a way, just exchanging something simple, but this is not so easy, nothing worked 'well' - without changing the original design so much that it destroys part of it. I'm not extremely skilled, I'm rather doing my best. What coding mistakes are you refering to anyway?)
One last thing: What's wrong about Whoopi? My suggestion was to swap this image every few weeks or so - just beautiful singers, actresses and stuff, Madonna was last. I didn't consider copyright questions yet, anyway, but there are not going to be zillion visitors, so...
Merry christmas everyone,
Pete
this is probably a good summary of the issues at hand. Posterous is one of the largest Blog services, I believe, so I guess they are providing more tablet-friendly solutions in the future.
In short: I decided most friends/possible site visitors are not going to visit this site in the near future on a tablet. Maybe in a few months or in a year, but I'd say they are not the type, my parents are rather modern. So as the design was lots of work and as I still like it rather much, I'm not going to change it quickly. (I also did try your suggestions already, in a way, just exchanging something simple, but this is not so easy, nothing worked 'well' - without changing the original design so much that it destroys part of it. I'm not extremely skilled, I'm rather doing my best. What coding mistakes are you refering to anyway?)
One last thing: What's wrong about Whoopi? My suggestion was to swap this image every few weeks or so - just beautiful singers, actresses and stuff, Madonna was last. I didn't consider copyright questions yet, anyway, but there are not going to be zillion visitors, so...
Merry christmas everyone,
Pete
The Whoopi thing I guess just struck some personal nerve. I'd use either a generic icon or custom drawing/rendering of the site owner. But, that's just me. I just seemed odd to have several unique custom icons and then copy some celebrity there, while the site has nothing to do with her. It served its purpose in grabbing my attention the minute I looked at the page.
Regarding the errors. There is validation for HTML, XHTML, CSS etc. and the site does reports a bunch. It is hard to avoid them as there some pitfalls and the validation is not without its faults as it will give some false positives because it is running behind on the times and red flag things it doesn't understand. But, typically one strives to get totally valid code and that's why I like to keep things simple as that has the broadest support between operating systems and devices, without running into the world of hacking browser specific code. At that point you have to keep up with webdesign every day.
If you like I can send you a pdf with some findings (you can send me your email in PM). Or you head over to http://validator.w3.org
#7
skyyawn
- Newbie
-
- Group: New Members
- Posts: 1
- Joined: 04-May 13
Posted 04 May 2013 - 06:22 AM
PeterParker, on 13 December 2012 - 12:35 PM, said:
Hey,
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for the top web designers, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
my parents are about to getting an iPad for christmas I think, but... I have a problem with their website. I didn't really know that, but the web on the iPad seems to be a bit different. I didn't really ever notice any difference, I had rather thought it works really great, and the web was mostly what I expected it to be, but... I tried to google and there seems to be some more technical debate on how to do it - it's an open secret you rediscuss your design in general, but that's not what I meant.
So, this website: http://atelierkunterbunt.net
On the Mac, or on any desktop computer and browser for that matter, there is this sort of "paralax effect" - so there's a background image and a foreground layer that scrolls holding the background fixed. It's cool for the top web designers, I thought.
But with iPad, this won't work, the iPad Safari browser simply ignores the command, and everything goes weird.
Any idea? What to do? A Safari bug? A quick workaround?
Hmm,
Pete
If you have control over the site, you can determine which OS the user is browsing with and display different content based off of this.
Share this topic:
Page 1 of 1