Potencia Tu Sitio Web De La Mano De Internet Explorer 8
•Descargar como PPTX, PDF•
0 recomendaciones•495 vistas
Recomendados
Más contenido relacionado
Destacado
Destacado (12)
Similar a Potencia Tu Sitio Web De La Mano De Internet Explorer 8
Similar a Potencia Tu Sitio Web De La Mano De Internet Explorer 8 (20)
Más de Andrés Iturralde
Más de Andrés Iturralde (13)
Potencia Tu Sitio Web De La Mano De Internet Explorer 8
- 1. Potencia tu sitio web de la mano de Internet Explorer 8 Gonzalo Pérez MVP ASP.NET chalalo@hotmail.com www.chalalo.cl Andrés Iturralde SeniorConsultant aiturralde@ultragestion.cl www.ikom.cl Martín Cabrera Gerente de Arquitectura y Desarrollo Microsoft Chile mcabrera@microsoft.com http://blogs.msdn.com/mcabrera
- 2. Agenda Conociendo Internet Explorer 8 Compatibilidad Web Accelerators DeveloperToolbar SearchProviders Web Slices Cómo prevenir fraudes más frecuentes
- 3. Conociendo Internet Explorer 8 DEMO
- 5. IE8 estábasado en estándares CSS 2.1 compliance DOM Improvements HTML Improvements Acid2 Test compliance This means Data URI Support Improved Namespace Support And more CSS 2.1 HTML ACID 2
- 6. ¿Quéhacen los desarrolladores hoy? 1. Identify browser 2. Serve right page Page Built For IE7 Page Built To Standards Page Built For IE6 I’m Safari I’m Firefox I’m IE6 I’m IE7 7 6
- 7. Un solo site, cualquiernavegador 1. Identify browser 2. Serve right page Page Built To Standards I’m Safari I’m Firefox I’m IE8 8
- 8. Soporte de Compatibilidad Compatibilidad Estándares 4. Rely on the Compatibility List 2. Implement the X-UA-Compatible Tag 1. Code to IE8 Standards 3. Display Intranet Sites in Compatibility Mode or rely on group policy settings 5. Rely on User Pressing Compat Button
- 9. Compatibilidad con IE7 y anteriores Se puede implementar a distintos niveles Por site Por página Botón de compatibilidad
- 10. Compatibilidad por site <system.webServer> <httpProtocol> <customHeaders> <clear /> <add name="X-UA-Compatible" value="IE=EmulateIE7" /> </customHeaders> </httpProtocol> </system.webServer>
- 11. Compatibilidad por página <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> </head> </html>
- 13. Web Accelerators
- 14. Web Accelerators Simplifican y potencian el acceso a los sitios web Sensible al texto seleccionado
- 15. ¿Cómo se implementa un Web Accelerator? Creamos un descriptor (archivo xml) Creamos la página de preview Creamos la página de ejecución (click) Creamos una página de instalación
- 16. Crear descriptor <openServiceDescriptionxmlns="http://www.microsoft.com/schemas/openservicedescription/1.0"> <homepageUrl>http://localhost/MyWebAccelerator</homepageUrl> <display> <name>Mi Demo Web Accelerator</name> <icon>http://localhost/MyWebAccelerator/myaccelerator.ico</icon> </display> <activitycategory="Others"> <activityActioncontext="selection"> <previewaction= "http://localhost/MyWebAccelerator/Preview.aspx"> <parametername="TextoSeleccionado" value="{selection}"/> <parametername="clean" value="true"/> <parametername="w" value="320"/> <parametername="h" value="240"/> </preview> <executeaction="http://localhost/MyWebAccelerator/Preview.aspx"> <parametername="TextoSeleccionado" value="{selection}" type="text" /> </execute> </activityAction> </activity> </openServiceDescription>
- 17. Crearpágina preview 1/2 <html> <body> <form id="form1" runat="server"> <div> <asp:TextBox ID="MostrarTextoTextBox" runat="server" Height="245px" Rows="5" Width="550px"></asp:TextBox> </div> </form> </body> </html>
- 18. Crear página preview 2/2 protected void Page_Load(object sender, EventArgs e) { stringtextoSeleccionado = Request["TextoSeleccionado"]; MostrarTextoTextBox.Text = textoSeleccionado; }
- 19. Crear página ejecución Idem página preview
- 20. Crearpágina de instalación // El accelerator yaestainstalado? window.external.IsServiceInstalled (http://localhost/myaccelerator.xml); // Instalar accelerator window.external.AddService (http://localhost/myaccelerator.xml);
- 24. SearchProviders
- 25. SearchProviders Tu motor de búsqueda favorito pero con sugerencias!
- 27. Open Search Descriptor <?xml version="1.0" encoding="UTF-8"?> <OpenSearchDescriptionxmlns="http://a9.com/-/spec/opensearch/1.1/"> <ShortName>My Custom Search</ShortName> <Url type="text/html” template="http://example.com/?q={searchTerms}&source=IE"/> <Image height="16" width="16“ type="image/icon"> http://example.com/mycustom.ico </Image> <Url type="application/x-suggestions+json” template="http://suggestions.example.com/?q={searchTerms}"/> <Url type="application/x-suggestions+xml” template="http://suggestions.example.com/?q={searchTerms}"/> <ie:PreviewUrl type="text/html” template="http://example.com/search?q={searchTerms}&ei=utf-8"/> </OpenSearchDescription>
- 28. Agregando tu SearchProvider //Verificasi el clientees MSIE 8.0 //paramásinformación: http://msdn2.microsoft.com/en-us/library/ms537509.aspx //Verificasi el servicioyaestáinstalado window.external.IsSearchProviderInstalled(‘http://example.com/SearchProvider.xml’); //Si esalgo, muestra el botónparaagregar el proveedor window.external.AddSearchProvider(‘http://example.com/SearchProvider.xml’) ;
- 30. Recursos Crea tu propio SearchProvider (Asistente) http://www.ieaddons.com/es/createsearch.aspx Crea tu propio SearchProvider (Manual) http://msdn.microsoft.com/en-us/library/cc848862(VS.85).aspx Más info. sobre archivos OpenSearch Descriptor http://www.opensearch.org
- 31. Web Slices
- 32. WebSlices Permiten adherir actualizaciones en un sector de una página
- 33. DEMO Web Slices
- 37. Ejemplo básico <div class=”hslice” id=”1” > <p class=”entry-title”>Amazon Kindle, Unopened</p> <div class=”entry-content”> <imgsrc=”pic.jpg”> <p>Current bid: <b>US $282.11</b></p> </div> </div>
- 38. Parametros del Web Slice Hslice Entry-title– El título del ítem Entry-content– El contenido del ítem Ttl – Valor time-to-live Feedurl– Path alternativo donde conseguir las actualizaciones Endtime– La fecha en el cual el ítem ya no es relevante
- 39. Manejo de la red El motor de descarga de fuentes busca actualizaciones una vez al día por default (15 min. Max.) Configurando el valor time-to-value <div>Actualizarcada<span class=”ttl”>60</span>mins</div> Poniendo a disponibilidad una fuente alternativa de actualización <a rel=”feedurl” href=”www.foo.com/feed.xml”>Suscribir</a>
- 40. Privacidad y autenticación Las fuentes permiten obtener la data de la web para usuarios y aplicaciones Web slices son lo mismo que las fuentes RSS La data es cacheada en la maquina del usuario Expone data privada mediante autenticación Soporte de autenticación de la plataforma: Autenticación basada en cookie persistente En cookies expiradas, presiona sobre la pagina para re autenticar Autenticación basada en HTTP (Basic & Digest) Autenticación básica vía SSL Usuarios guardan credenciales para descargas en background En caso de error, los usuarios pueden presionar en la página para resolverlo NTLM (Escenarios corporativos)
- 41. DEMO Web Slices
- 42. ResúmenWebSlices Son una forma liviana para que los usuarios puedan mantenerse en contacto con la información de tu sitio Empieza hoy: No necesita código en el cliente! Notificación a los usuarios de actualizaciones Atrae usuarios mediante la vista previa
- 43. Cómo prevenir fraudes más frecuentes
- 44. Fraudes más comunes Conexiones inseguras Descarga de archivos maliciosos (malware) Dominio falso Phishing Clickjacking Cross-site scripting
- 45. Conexiones inseguras Se produce cuando intercambiamos datos sensibles contra sitios no seguros
- 46. Conexiones inseguras – cómo evitarlo Verificar que exista siempre una conexión segura (https://...) No proceder si el certificado del sitio reporta errores Certificado emitido por entidad desconocida Certificado emitido para otro sitio Certificado vencido
- 48. Descarga de archivos maliciosos (malware) Software desarrollado para robar información confidencial o dañar el sistema Se enmascaran detrás de software aparentemente inofensivo
- 49. Descarga de archivos maliciosos (malware) - cómo evitarlo No descargar archivos de sitios no conocidos Tener siempre activa la protección del navegador
- 50. Malware DEMO
- 51. Dominio falso Nos llega un mail de una dirección aparentemente correcta con un link para actualizar información El link nos lleva a un sitio cuyo dominio no coincide con el de la empresa
- 52. Dominio falso - cómo evitarlo Prestar mucha atención a la url del sitio al cual nos conecta el link Tener siempre activas las alertas de los navegadores Reportar sitios no confiables
- 54. Phishing Similar al anterior Se intenta adquirir información confidencial de manera fraudulenta
- 55. Phishing – cómo evitarlo No confiar en correos que nos invitan a actualizar nuestros datos Tener siempre activa la protección del browser Reportar siempre los nuevos sitios fraudulentos
- 56. Phishing DEMO
- 57. Clickjacking Se produce cuando un sitio malicioso se oculta detrás de un sitio legitimo Por lo general se implementa utilizando iframes
- 58. Clickjacking – cómo evitarlo Nunca acceda a su sito de confianza desde links publicados en sitios desconocidos Dichos links lo pueden conducir fácilmente al sitio malicioso que muestra solo el sitio legítimo Tener siempre activas las alertas del navegador
- 60. Cross-sitescripting Es el más sofisticado de todos Se produce sobre el sitio real (legítimo) La trampa se basa en inyectar código script a través de links que aprovechan defectos de programación de las aplicaciones web
- 61. Cross-site scripting – cómo evitarlo Evitar el acceso a sitios sensibles a través de links no confiables Programar las aplicaciones controlando el input de los usuarios.
- 63. El navegador es nuestro aliado Cuanto más nos ayude mejor Fuente: Informe Web Browser Security desarrollado por NSS Labs
- 64. Todos somos protagonistas Los invitamos a difundir esta iniciativa y a colaborar compartiendo experiencias de fraude Más info en: http://www.microsoft.com/security/ http://microsoft.com/ie http://www.microsoft.com/windows/internet-explorer/features/safer.aspx
- 65. Potencia tu sitio web de la mano de Internet Explorer 8 Gonzalo Pérez MVP ASP.NET chalalo@hotmail.com www.chalalo.cl Andrés Iturralde SeniorConsultant aiturralde@ultragestion.cl www.ikom.cl Martín Cabrera Gerente de Arquitectura y Desarrollo Microsoft Chile mcabrera@microsoft.com http://blogs.msdn.com/mcabrera
Notas del editor
- The goal with IE8 is to ensure greater browser fidelity - write once and render
- Internet Explorer 8 improves rendering behavior for content authored to various web standards using the default Internet Explorer 8 standards mode. In order to maintain backwards compatibility, sites can easily opt to use Internet Explorer 7-like handling of content by inserting a special meta element into the web page, which will trigger the "IE7 standards mode“.While the behavior of the browser is unchanged from Internet Explorer 7 in "IE7 Standards Mode", the new standards based rendering and layout engine in Internet Explorer 8 (the default Internet Explorer 8 rendering mode) supports Data: URIs, the abbr tag, CSS generated content, the display: table CSS properties, in addition to fixing CSS and HTML parsing bugs. By default Internet Explorer 8 uses the new Standard Mode layout engine to display pages adhering to standards including HTML, CSS 2.1, DOM L2. In addition, Internet Explorer 8 renders the Acid2 test correctly – by default. This results in Internet Explorer 8 supporting and displaying more web pages correctly. This also results in a greater developer experience – increased interoperability for web pages viewed on all browsers, resulting in a “write once, run anywhere” scenario. Additionally, sites written specifically for Internet Explorer 7, can elect to use the Internet Explorer 7 emulation mode to show pages without making any layout changes and still enjoy a smooth browsing experience.By including both the Internet Explorer 7 and Internet Explorer 8 layout engines, Internet Explorer 8 provides a highly compatible browser while not breaking sites specifically written to take advantage of Internet Explorer 7 layout engine. In addition to making the web developers life much easier in dealing with a new browser release, this alleviates user frustration and leads to a better overall browsing experience.Code SnippetsIn past versions of Internet Explorer, developers and designers have found inconsistencies between Internet Explorer and defined standards with respect to the way the browser handles HTML, CSS, scripting, etc. In some cases, these inconsistencies arise because Internet Explorer supports standards prior to their finalization. If those standards change when they are ratified, the implementation Internet Explorer uses can be different from the standards. The Internet Explorer team has traditionally decided to support the legacy Internet Explorer model, so that sites developed to it would continue to behave as expected in newer versions of Internet Explorer. Moving forward, the decision to support legacy behaviors versus strict standards will be put in the hands of Web developers because they can select the rendering mode – all the way down to a page-by-page basis.Windows Internet Explorer 8 Beta 2 ships with multiple rendering modes which the developer can select by using the X-UA-Compatible header.This value may be set server-wide as an HTTP response header or at the document level by adding it directly after to the head tag, such as:<meta http-equiv="X-UA-Compatible" content="IE=8" > By default, Windows Internet Explorer 8 uses the Internet Explorer 8 Standards mode. Developers who want to continue to have their sites render in Internet Explorer 7’s Standards mode should add this immediately after HEAD tag : <meta http-equiv="X-UA-Compatible" content=“IE=EmulateIE7"> Note that the setting in the document always overrides the HTTP header.Interoperability with other browsersNone of the improvements or new features in Internet Explorer 8 will matter if websites look bad or work poorly. Since Internet Explorer 8 adheres to web standards by default, there is greater interoperability with all browsers as well as full compatibility with the existing Internet Explorer 7 web sites by including the Internet Explorer 7 layout engine in addition to the new engine. This means that developers can focus on innovation rather than creating special cases to achieve browser compatibility.One browser for developersAdditionally, by including both layout engines as well as default standard compliance, developers only need Internet Explorer 8 to create, update, test, and deploy new and existing websites. This leads to higher productivity and more efficient development cycles. This also reduces corporate resource requirements because additional physical or virtual machines become less necessary.