It's seems like all major browsers (ie, firefox, safari, chrome) support animated gifs. Though I've been reading that IE might not be faithful to high frame rates. Who doesn't support animated GIFs? Iphone safari seems to just fine. What about other mobile browsers?
Lynx, for example.
Or any other non-graphical browser will likely also have problems.
Source: see this browser support matrix for GIF (and other image formats).
Related
For my responsive site I need to support IE9 meaning that I cant use felxbox yet. However ive got a breakpoint at 500px targeting phones. Is it safe to use flexbox within this media query? The mobile browser support seems good.
This is a new site so I dont have any existing analytics data to make this decision with.
It's safe to use Flexbox at any breakpoint with supported browsers, as long as you use all the necessary old prefixes, please do. Android & iPhone browsers that don't support flexBox are essentially dead.*
*Except that Opera Mini doesn't (quite yet) have FlexBox support in 2014, and is used by 250 million users, which is a higher market share than IE9 on older Windows Phones 7. Probably a dying breed at this point, IE 9 Mobile now only account for 0.29% of the mobile market. However having a table fallback solution to a Flexbox layout is still rather important, especially if your site cater to the Asian or African continents or Eastern Europe for Opera Mini, or if still need to target IE8 or IE9 users.
Know that technically you can use Flexbox with a IE8-9 compatibility fallback using table + table cel/row. It depends on your context, and as to which Flexbox features are being used... If you don't use flexWrap nor reordering, a table fallback should work reasonably well on IE8-9, even on mobile.
Here is an example production site I did using flexBox + table fallbacks, working in IE8+, Opera 11 and Opera Mini (Presto). Opera Mini gives a rather crappy layout, but at least it's mobile compatible.
Update: Opera Mini servers now support Flexbox at Opera Presto 2.12 levels which is unprefixed.
Not perfectly safe, no. There are some situations where a desktop or notebook browser might be smaller than 500px wide.
One suggestion could be to use IE conditional statement to include the appropriate CSS, but this approach might fail in IE10 as IE conditional include support is removed.
The safest bet is to use feature detection library like moderniser and then write your css accordingly.
If IE9 and mobile browser class is added to the body by moderniser you can write your media query accordingly to apply felxbox styles only when the browser is not IE desktop and have fallback css acoordingly
I have embedded the Soundcloud widget on my website here:
http://www.jackcarnoldmusic.co.uk/music/
…however, on Safari 6.1 (the latest version), no audio plays. There is no error returned, and the time counter and play cursor move, but no sound comes out. Same page loaded in other browsers, including IOS7, work fine. What is it that Safari 6.1 is doing to stop the audio, and how do I get around it?
Thanks
I solved this same problem as follows:
Safari - Preferences - Advanced - unchecked Internet plug-ins (Stop plug-ins to save power)
Reloaded my page with embedded Soundcloud widget & I now get the audio to stream.
This new Safari feature causes other plug-ins to have a similar problem. Not sure what Apple is thinking sometimes...
It's a problem of Safari Power Saver. SoundCloud uses Flash to play audio, but puts it somewhere it in the page making Safari think it's not an important Flash instance (it's not front and center) so it must be blocked to save power. Unfortunately SoundCloud also visually hides Flash, making it impossible to click on it, therefore making it impossible for Safari to put it in the Power Saver whitelist. Also unfortunately, there is no way to add more websites to that list from Safari.
Fortunately though, it was easy enough to create a tool that fixes that. So here is Safari Power Saver Whitelister. It adds any website you want to the Safari Power Saver whitelist. Just click Run in the AppleScript Editor.
After trying to figure out why my favicon was not showing across various browsers (except Safari), but replaced by a gray globe, I found the following discussions:
http://support.mozilla.org/en-US/questions/923022
It seems this is now normal either for websites that do not supply identity information or when one's connection to a website is not encrypted.
Even the major websites don't show favicons.
Is this a problem with me or are we not seeing favicons in the URL address bar as commonly as we used to?
I believe favicons today are even more popular than in the past.
Part of the issue I believe you are running into is how favicons are displayed. It isn't that they are less popular, but the location or how they are displayed may have changed.
Here is the rundown on where they are displayed.
Address Bar: Firefox v1 - 12, IE 7+, Opera v7 - 12 and Safari
Address bar drop down list: Firefox
Links bar: Firefox, Chrome, IE 5+, Opera 7+
Bookmarks: Firefox, Chrome, IE 7+, Opera 7+, Safari
Tabs: Firefox, Chrome, IE 7+, Opera 7+
Drag to Desktop: Firefox, Chrome, IE 5+, Opera 7+
(List from Wikipedia)
You also have to consider that favicons are now playing a larger role because of mobile devices. When someone bookmarks or pins a site to their screen it will use the favicon. I find that having favicons set for mobile are great because it shows a logo or icon vs seeing the page crammed into a small icon on the screen.
Bottom line: Favicons are not going anywhere and I highly recommend programming them for both desktops and mobile devices.
I have a website that doesn't work in IE8, due to a ton of issues.
Apparently, some people don't understand. There is no way my site will ever work natively in IE8.
MY GAME WILL NEVER WORK NATIVELY IN IE VERSION EIGHT.
As a workaround, I want to place a Java applet on it that simulates a browser. This way, people - 25.8% of people - can see my site in IE8 by viewing the site through the applet.
Basically, it would work something like the emulator at http://www.opera.com/developer/tools/mini/ - except not Opera Mini.
Thus: Are there any emulators that I can put on my site that emulate other browsers? They could be JS/HTML5, Java, Flash, whatever.
{Opera Mini doesn't work with my site - so unfortunately this otherwise perfect example from Opera doesn't work, but any of the current versions of the Big 5 (IE, Chrome, FF, Opera, Safari) would work with my site flawlessly.}
I have used Firefox, Chrome and now Opera. Everytime when I switch browsers, I find that some of the websites don't display or display incorrectly i.e. in terms of box alignments etc.
I have never understood why does this happen. Which property differs in all the browsers that leads to this issue?
Each of those browsers uses a different rendering engine (Firefox -> Gecko; Chrome, Safari -> WebKit; Opera -> Presto), and each rendering engine has different rules about how the markup is displayed and which default attributes are used.
However, if your site is designed properly, these three browsers should have little trouble displaying the correct layout. It's the Internet Explorer's Trident engine that many people have trouble with.
See the Wikipedia articles on Web browser engines and comparisons amongst them for HTML and CSS