ansaurus

Question

How to make a webpage display differently in different browsers?

Answer 1

A:

<?php
    if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone')) {
        // is iPhone
    }
?>

Erik Persson 2010-04-22 23:37:54

And where did he mention iPhones?

Josh 2010-04-22 23:41:06

@Josh Just took it as an example.

Erik Persson 2010-04-22 23:41:41

@Erik and based on his revised question you appear to be right! He didn't mention PHP either though.

Josh 2010-04-23 01:57:32

I am indeed implementing this in PHP. Sorry for not being clear enough in the question

Karthik Kottapalli 2010-04-23 02:10:48

Answer 2

+1 A:

Check the contents of the User Agent header that is sent with the HTTP request. Until you tell us more about what you're using to display the page I can't be any more specific, but you should compare the User Agent header to known browsers and then serve up different content based on that test.

tloflin 2010-04-22 23:38:03

Except that header is not a reliable indicator of the browser.

Rob 2010-04-23 00:44:18

@Rob, there *is* no reliable indicator of the browser. Browsers can pretend to be whatever they want. Heck, the browser could just be some guy typing at a terminal. The user-agent is simply the standard method of self-declaration.

tloflin 2010-04-23 15:45:53

@tioflin - Um. That's what I just said.

Rob 2010-04-23 18:25:35

@Rob, OK. I was just clarifying because it sounded like you were saying that the user-agent header was not the most reliable indicator: that there was another, more reliable one I hadn't mentioned.

tloflin 2010-04-23 18:59:35

Answer 3

A:

In addition to reacting on different user-agent HTTP headers, you can also use some CSS tricks to differentiate at least between IE and non-IE browsers, and different IE versions. And of course there is still another method: Use some JavaScript code to show/hide specific parts of the page depending on the browser detected from that JavaScript code.

As a rule, though, I would avoid any browser specific stuff and write the pages in a way that renders well in the most important browsers, and reasonably gracefully degrades with the older and ancient browsers.

Let me also note that if you decide to user-agent switching after all, please do make sure you fall back to reasonable defaults. Nothing is more annoying than needing to masquerade my browser A as browser B just because some web site does not know about browser A or something similarly stupid.

ndim 2010-04-22 23:43:46

Answer 4

A:

Browse-sniffing is tricky to do because many user agents try to mimic others to get past programmer-induced restrictions. If you're specifically trying to make a mobile-friendly stylesheet, using the "media" attribute of the LINK tag is a good way to target specific devices. i.e.

<link rel="stylesheet" type="text/css" href="base.css" media="all"/>
<link rel="stylesheet" type="text/css" href="mobile.css" media="handheld"/>

The first stylesheet will be applied to all media types, while the second will only get applied to "mobile" devices.

If you're looking for a way to target only IE, check out Conditional Comments: http://www.quirksmode.org/css/condcom.html

Aaaand for a bit more information on controlling the viewport of the iPhone, check out this article from Apple: http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html

Tim Hettler 2010-04-26 15:51:13

ansaurus

tags:

views:

answers:

How to make a webpage display differently in different browsers?

related questions