La descarga está en progreso. Por favor, espere

La descarga está en progreso. Por favor, espere

Alejandro Hidalgo Fernández MVP Internet Explorer. Development Advisor, Plain Concepts buenas prácticas.

Presentaciones similares


Presentación del tema: "Alejandro Hidalgo Fernández MVP Internet Explorer. Development Advisor, Plain Concepts buenas prácticas."— Transcripción de la presentación:

1 Alejandro Hidalgo Fernández MVP Internet Explorer. Development Advisor, Plain Concepts buenas prácticas

2

3 Muchos navegadores diferentes Muchas versiones diferentes Nuevas versiones constantemente

4 Same MarkupDetección del navegadorDetección de capacidades

5

6 El mismo HTML, CSS y JavaScript tienen el mismo comportamiento en todos los navegadores. Basado en estándares Los navegadores antiguos pueden necesitar código extra para emular este comportamiento.

7

8 Importancia para Multinavegador Importancia del SEO No es oro todo lo que reluce. No implica ser malos si no se pasa en verde el validador. Importancia de validar el código estático.

9 EstablesPerecederas (Sólo si son necesarias)Nuevas (Cuidado con ellas)

10

11 // User Agents navigator.userAgent // Comentarios condicionales // Objetos únicos if(document.all) … if(window.attachEvent) … if(window.ActiveXObject) … // Comportamientos únicos(CSS Hacks, etc.) background: #FFFFFF /* Firefox y los demás */ *background: # /* IE7 e inferiores */ _background: #CCCCCC; /* Sólo IE6 */

12 // nuestro código para IE // nuestro código para IE7 IE Cualquier versión de IE lt IE X Inferiores a X lte IE X Inferiores o iguales a X IE X Solo para la version X gte IE X Superiores o iguales a X gt IE X Superiores a X

13 if ( jQuery.browser.msie ) { Código específico } jQuery.browser.version webkit safari opera msie mozilla

14 = Punto de comprobación = Código alternativo Estructura de código Resultado en el navegador

15 = Punto de comprobación = Código alternativo Estructura de código Resultado en el navegador

16

17

18 Detección del navegador DEMO

19

20

21

22

23 = Punto de comprobación = Codigo alternativo Comprobación de característicasComprobación de navegador

24 = Punto de comprobación = Código alternativo Detección de capacidadesDetección del navegador

25 = Punto de comprobación = Código alternativo Detección de capacidadesDetección del navegador

26 Descarga el video

27 .target { border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; }

28 // Crea un test para comprobar el bug var testPassed = runTest(); // Comprueba si el test ha pasado if(!testPassed) { // Si no, aplica un workaround }

29

30 var form = document.createElement("div"), id = "script" + (new Date).getTime(); form.innerHTML = " "; var root = document.documentElement; root.insertBefore( form, root.firstChild ); if ( document.getElementById( id ) ) { …

31 // Comprobando HTML5 Canvas if (Modernizr.canvas) { var c = document.createElement('canvas'); var context = c.getContext('2d'); } // Comprobando formatos de HTML5 Video if (Modernizr.video && Modernizr.video.ogg){ // preload ogg video assets } else if (Modernizr.video && Modernizr.video.h264){ // preload h264 assets}

32

33

34

35

36

37 Detección de capacidades DEMO

38 Por qué no funciona en vez de en Dónde no funciona CONSEJO

39 Same Markup Detección de capacidades Buena Práctica Same Markup Detección del navegador Mala Práctica

40 msdn.com/ie

41 Gracias a todos.


Descargar ppt "Alejandro Hidalgo Fernández MVP Internet Explorer. Development Advisor, Plain Concepts buenas prácticas."

Presentaciones similares


Anuncios Google