Check Browser Compatibility: Difference between revisions

From LemonWiki共筆
Jump to navigation Jump to search
mNo edit summary
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
Check Browser Compatibility
Check Browser Compatibility
* {{Gd}} [http://www.caniuse.com/ Can I use... Support tables for HTML5, CSS3, etc] "Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers."
* [http://www.browsersupport.net/ Browser Support] 教學: [http://csscoke.com/2013/10/09/css_and_browser_support/ 查詢CSS與瀏覽器支援度的網站 · CSS可樂]
* [http://blog.miniasp.com/post/2013/07/14/HTML5-CSS3-JavaScript-JS-compatibility-resouces.aspx The Will Will Web | 前端工程研究:HTML/CSS/JavaScript 相容性檢查資源整理]


noun explanation
Noun explanation
# allowed to interact: the solutions which (1) allowed to interact the web pages e.g.  click the link and test javascript (2) view the web snapshot
# allowed to interact: the solutions which (1) allowed to interact the web pages e.g.  click the link and test javascript (2) view the web snapshot
# view the snapshot only: only allowed to view the static web snapshot
# view the snapshot only: only allowed to view the static web snapshot
==== checking Compatibility ====
* {{Gd}} [http://www.caniuse.com/ Can I use... Support tables for HTML5, CSS3, etc] "Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers."
* [http://blog.miniasp.com/post/2013/07/14/HTML5-CSS3-JavaScript-JS-compatibility-resouces.aspx The Will Will Web | 前端工程研究:HTML/CSS/JavaScript 相容性檢查資源整理]


==== allowed to interact ====
==== allowed to interact ====
Line 20: Line 21:
===== mobile browsers =====
===== mobile browsers =====
: [[Image:Owl icon.jpg]] WARNING: Simulators/emulators for mobile browser testing is '''different''' from the browser for real mobile device.
: [[Image:Owl icon.jpg]] WARNING: Simulators/emulators for mobile browser testing is '''different''' from the browser for real mobile device.
* [http://iphonetester.com/ iPhone 3G/4G tester - online website test emulator with flip] {{exclaim}} not check user agent {{access | date =2012-06-06}}
* [http://www.mozilla.org/en-US/mobile/ Mozilla Firefox | Firefox for Android | Download Firefox to your mobile device] {{access | date =2012-06-06}} {{win}} {{linux}}  
* [http://www.mozilla.org/en-US/mobile/ Mozilla Firefox | Firefox for Android | Download Firefox to your mobile device] {{access | date =2012-06-06}} {{win}} {{linux}}  
* [http://www.opera.com/developer/tools/mini/ Opera Mini simulator]. Require: Java installed
* [http://www.opera.com/developer/tools/mini/ Opera Mini simulator]. Require: Java installed
Line 32: Line 32:
One PC with different Internet Explorer versions 同一電腦可以有不同版本的Internet Explorer
One PC with different Internet Explorer versions 同一電腦可以有不同版本的Internet Explorer


* {{Gd}} [http://finalbuilds.edskes.net/iecollection.htm Internet Explorer Collection]([http://blog.miniasp.com/post/2009/03/Useful-tools-Internet-Explorer-Collection.aspx 介紹])  
* [https://blogs.windows.com/msedgedev/2015/08/17/windows-10-virtual-machines-now-available-on-microsoft-edge-dev/#QZQ86LBwxcHOQOgo.97 Windows 10 virtual machines now available on Microsoft Edge Dev | Microsoft Edge Dev Blog] IE8, IE9, IE10, IE11, Microsoft Edge {{access | date = 2016-10-12}}
* [http://finalbuilds.edskes.net/iecollection.htm Internet Explorer Collection]([http://blog.miniasp.com/post/2009/03/Useful-tools-Internet-Explorer-Collection.aspx 介紹])  
** various {{IE}} browser version: IE1.0 ~ IE8 which allow to choose to install '''IE developer toolbar''' & '''Firebug Web development extension''' during the installation
** various {{IE}} browser version: IE1.0 ~ IE8 which allow to choose to install '''IE developer toolbar''' & '''Firebug Web development extension''' during the installation
* [http://www.my-debugbar.com/wiki/IETester/HomePage IETester]  
* [http://www.my-debugbar.com/wiki/IETester/HomePage IETester]  

Revision as of 12:01, 24 January 2019

Check Browser Compatibility

Noun explanation

  1. allowed to interact: the solutions which (1) allowed to interact the web pages e.g. click the link and test javascript (2) view the web snapshot
  2. view the snapshot only: only allowed to view the static web snapshot

checking Compatibility

allowed to interact

desktop browser + mobile browser

cloud services for testing desktop browsers and mobile browsers

testing different screen resolution

mobile browsers
Owl icon.jpg WARNING: Simulators/emulators for mobile browser testing is different from the browser for real mobile device.

alternative

desktop browser

One PC with different Internet Explorer versions 同一電腦可以有不同版本的Internet Explorer

older version of IE also available at

other desktop browser available at

alternative: Install different virtual machines, ex:

view the snapshot only

20922082366_2659222fba.jpg
image hosted by flickr
  • iCapture 檢視網頁在 Chrome 裡看起來會像甚麼。 [Last visited: 2016-09-13]

See also

further reading


Web site design and development process