I'm working on a small PHP-driven website that's so basic that I can't imagine a browser from any time in the 2000's, if not further back, would have any serious issues with it.
I added the FancyZoom Javascript image viewer, though, and it's the ONE part of my site that I can't bet my life on in terms of across-the-board compatibility, especially taking fragmented mobile browsers into account (for instance, I'm still using an iPhone 3GS, so I know luddites like me are out there).
I know browser/feature detection is discussed here often, but I've got a relatively specific request since I'm not an up-to-date web programmer. What specific features (or user agents, if the case may be) should I be detecting to determine whether to enable an image viewer like FancyZoom or simply leave the user with a direct image link?
I'd imagine that it should be possible to filter out a few cases where the image loader wouldn't work, without going so far as to use one of those uber-complex user agent parsers that require updates, etc. This is a really simple, specific detection problem.
Any ideas on how to boil this down to the simplest possible features to check for would be great. Thanks!
you could do something like this to weed out old browsers
$browser = $_SERVER['HTTP_USER_AGENT'];
if(preg_match('/(?i)MSIE [1-6]/',$browser) && !preg_match('/Opera/i',$browser))
{
$image = 'Non fancy zoom';
} else
{
$image = 'fancy zoom';
}
I have not messed with the jquery plugin your using, so I do not know what browsers it is good for etc, but you can use the below to find their browser and just write rules...
$browser = $_SERVER['HTTP_USER_AGENT'];
Related
Actually I'm fooling around while developing some things like "change avatar", where there exists the option to get the image from its URL
$raw = file_get_contents($src);
$img = imagecreatefromstring($raw);
// and others gd stuff
Actually it works fine, except when it comes from a certains website, like pixiv
http://i2.pixiv.net/img02/img/suzupin/2800349.jpg
This, for example, throw some errors
BTW, the same goes when I try to PIN this on Pinterest =P WHY?
Is there a way to prevent the others to do things like file_get_contents on my site?
Am I right to say that it has something to do with oriental websites? Because pretty often I can't PIN images from japanese sources. >.<
What is happening is these websites are implementing 'hotlink prevention'. There are many different methods--some #duskwuff suggested--cookies, checking referer, sessions, etc.
What you want to do is circumvent hotlink prevention, and that is answered in this SO question: Download file from URL using CURL
You can use login form or captcha then allow image view and test browser version etc. but if user is using curl with cookies (i don't know how to use cookie with file_get_contents then it's tough to disallow user.
I have never understood why some people say making custom css for each browser is a bad thing. To keep my page size down and download times fast it makes perfect sense to me to make a custom css for the major browsers (especially IE in its many different forms), and a general catch all css for everything else.
If you want to send out a bloated, huge, Swiss army knife of the css world, for all situations then go right ahead I'm not going to stop you.
Fast detection of the browser is important when doing this. Loading a JavaScript file to detect the browser seems slow. So I would prefer to use php to detect the browser, and send out the specified css. Or at least a general browser specific css then use the JavaScript to load a more detailed version of the css.
But I've read article after article about why this is a bad thing. The main reason behind each of these articles is because the user agent can be faked. Or there using Firefox but the server thinks they're using IE7 so it sends out the wrong css file.
As a developer/designer of web apps why is this my problem? If you want to use Firefox, but tell my server your using safari or IE*, and get a crappy looking page, why is it my problem?
And don't throw that whole if the user can't see your site right they'll never come back, or some kind of similar argument at me. a normal user isn't going to be doing this. its only going to be the people who know how to do this, and will know whats wrong when my site looks crappy.
This is similar to looking at my site on a old Apple II (I have no clue how), and yelling at me because everything looks green.
So is there a good reason, not a personal preference, why I shouldn't use php to detect the browser and send out customized css files?
I do this mostly for the different versions of IE. It just seems like for some sites, adding the if IE6 and if IE7 parts just double or triple the size of the css file.
Typically when a user intentionally fakes the user agent string, it is because something is not viewable in the user's browser that should be. For example, some sites may restrict users to IE or Firefox, but the user is using Iceweasel on Debian. Iceweasel is just a Firefox renamed for trademarked reasons (there are a few other changes also), so there is no reason that the site should not work.
Realize that this happens because of (bad) browser detection, not despite it. I would say you don't need to be terribly concerned about this issue. Further, if you can just make your site reasonably cross-browser compatible, it won't matter at all. If you really want to use browser-specific CSS, and you don't want to do so all in one CSS file, don't let a fake user agent stop you.
As long as the only thing you're doing is changing style sheets, there is no valid reason as far as I can tell. If you're attempting to deliver custom security measures by browser, then you'll have issues.
Not sure about php but in Rails it is normal and dead simple practice to provide css files and different layouts based on the user agent particularly when considering that your site is just as likely to be accessed by any of the myriad of available mobile devices, never mind writing for the most popular (Currently Firefox) browsers and even writing custom MIME types if need be is also dead simple.
IMO not doing so is pure laziness on the coders part but then not all sites are developed by professional teams of developers with styling gurus at hand. Also in languages other than Rails it might not be so simple. Sorry, I haven't a clue about PHP so this may not be an appropriate reply
In my opinion, starting with normalize.css, and having a base style sheet to start, overriding the base styles as needed usually works along with making sure you set appropriate fallbacks. If you really need it a few media queries, and feature detection can go a long way.
One reason you shouldn't base things off of the browser is because major search engines like Google and Yahoo prohibit displaying different content for different browsers. GoogleBot can detect different CSS and HTML and you may get bad search positioning. Additionally, if you use any advertising services you may be in breach of their contract by displaying varying content.
i was looking for a way to block old browsers from accessing the contents of a page because the page isn't compatible with old browsers like IE 6.0 and to return a message saying that the browser is outdated and that an upgrade is needed to see that webpage.
i know a bit of php and doing a little script that serves this purpose isn't hard, then i was just about to start doing it and a huge question popped up in my mind.
if i do a php script that blocks browsers based on their name and version is it impossible that this may block some search engine spiders or something?
i was thinking about doing the browser identification via this function: http://php.net/manual/en/function.get-browser.php
a crawler will probably be identified as a crawler but is it impossible that the crawler supplies some kind of browser name and version?
if nobody tested this stuff before or played a bit with this kind of functions i will probably not risk it, or i will make a testfolder inside a website to see if the pages there get indexed and if not i abandon this idea or i will try to modify it in a way that it works but to save me the trouble i figured it would be best to ask around and because i didn't found this info after a lot of searching.
No, it shouldn't affect any of major crawlers. get_browser() relies on the User-Agent string sent with the request, and thus it shouldn't be a problem for crawlers, which happen to use custom user-agent strings (eg: Google's spiders will have "Google" in their names).
Now, I personally think it's a bit unfriendly to completely block a website to someone with IE. I'd just put a red banner above saying "Site might not function correctly. Please update your browser or get a new one" or something to that effect.
I am a humble graphic designer who is trying his best to learn development. I have a challenging question that I need some very clear and straightforward help with. From my research it seems that my solution can be accomplished with PHP or Javascript. I am totally an infant in both languages but I don't care which one is used. Preferably whatever is easiest for a noob like me.
So her is the deal…
I have a site I have just put together with a bunch of nice -webkit-transforms http://www.eameswords.com I want to send desktop Safari/Chrome to this site. I want to send iPad and iPhone to a separate touch enabled version too.
The kicker…
I have an Adobe flash version of the site as well. It does all the same interactivity. I want to send user agents for IE, Firefox and Opera to this version.
So I have 3 versions of my site!!
I would like to put all three versions of my site in three separate folders for organizational purposes.
So I need three types of user agent detection and three redirects:
iPad & iPhone (mobile Safari) ––––> folder01
Webkit Browsers (Safari/Chrome) ———> folder02
All other browsers (IE, Firefox, etc.) ————> folder03
This is crazy but I need some serious help to make this work. If anyone can give me a straightforward answer I would be happy to swap any of my design skills to pay-it-back. I say this because I need someone to literally write out the solution so I can process it, learn from it. I am really bad at piecing code together.
Thank you so much in advance!!!
Check the user-agent header for the signature.
For example, in PHP:
$user_agent = $_SERVER["HTTP_USER_AGENT"];
//Condition checks: Does $user_agent equal the signature of a webkit browser?
//If not, redirect: header("Location: main.php?nonwebkit=true");
Search for the existence of "webkit" in the User agent string. If it exists, fine. Otherwise, redirect the user to the flash page.
jquery solution:
$(document).ready(function() {
if(navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)){
window.location.replace("URL1");
}
else if ($.browser.webkit){
window.location.replace("URL2");
}
else{
window.location.replace("URL3");
}
});
Suppose I have developed one web portal in PHP/MySQL. I want to make it work in mobile also. What is the easiest way to do this?
Can we use PHP with any mobile based mark up languages like WML or XHTML i.e. as we can use PHP with HTML in web applications used to view in normal web browsers?
PHP has nothing to do directly with the platform you want to display your app on. PHP is just the tool to deliver the kind of markup you need for your page to be displayed on whatever platform you want. It's up to your own knowledge and creativity to render markup which suits your needs. So in other words, yes of course you can send WML, XML, XHTML, you name it to the client!
The client doesn't know anything about PHP anyways (PHP 'exists' only on the server side), the client doesn't understand PHP and doesn't need to. It understands XHTML or any other markup and that's what you have to deliver! What tool you use to do that is completely up to you. PHP is one option.
So all you need to know is for what platform/client you want to render your content and what kind of markup this platform understands and then deliver the right markup to the right platform/client including the respective CSS, js, etc.
What your app does:
detect what client is requesting your site
see if you're able to send the appropriate markup
send this markup or if not available some default or similar markup
Pseudo-code for each page, (or just the template page, if you have that)
<?php if(mobile()): ?>
Mobile HTML and PHP
<?php else: ?>
Desktop HTML and PHP
<?php endif; ?>
I use this.
Depends on what you understand under the term "mobile". Basically it would just mean to adapt your portal displayed data and css to the smaller display sizes and make as ZOMFG said an if statement to output your source accordingly. If you want to enable WAP browsing you have to output your data in the Wireless markup language.
PHP is just a tool which generates some markup language (or anything else, actually, which might not be markup-oriented at all) that is understood by the client -- the browser.
Your PHP code will have to be able to generate two kind of different outputs :
a "full ouput" (likely HTML), which you already have, for computer web browsers
a "light ouput" (maye VML, maybe HTML too but without some heavy stuff), for mobile-based browsers.
The task you'll have to deal with is to differenciate between mobile and non-mobile users ; this might be done by user-agent sniffing, for instance, or detecting what the client requested.
A nice thing to do could be to use a special domain-name for users of mobile platforms ; something like mobile.example.com ; for instance, so they can bookmark it and directly access the "mobile-version" of your site -- can be useful if your detection doesn't work well ^^
If you are targetting advanced-mobile-machines (like iPhone) which have a not too bad browser, you might want to send them "rich" HTML pages ; just test your pages to verify they fit on the small screen of theses machines ; and, maybe you'll want to send less data (like not display some sidebars, or have a smaller menu, ... )
BTW, what kind of platform do you mean by "mobile" ? Those old phones with small screens, or more power-users-oriented phones, like iPhone / Android / stuff like that ?
This could make quite a difference, actually, as the more recent ones have nice functionnalities that the oldest didn't have ^^
In any case, one important thing to remember :
you will spend some time making the site work on these devices
you will have to spend more time maintaining it !
Which means : do something simple, and, as much as possible, use the same PHP code for both mobile and non-mobile version of the site : the less code you duplicate, the less code you'll have to maintain !
Hope these few ideas (not really well sorted, I admit) will help...
Have fun !
Already the mobile browsers support almost full XTHML, Javascript, Flash.
My recommandations are:
have a light css for the mobile
version
restrict some heavy functionalities
validate your code
optimize, optimize, optimize, although this works even for the full version.