WebMatrix

WebMatrix
Armando dinámicamente nuestros
sitios con HTML5, PHP y MySQL
Peter Concha Regatto
Microsoft Student Partner Jr
Miembro Avanet Colombia

@PeterConchaR
www.ptrconcha.wordpress.com

Agenda
•WebMatrix
– Conociendo un entorno para desarrolladores

• HTML5
– Semántica y Contexto

• CSS3
– Estilos y Maquetado

• PHP
– MVC

• MySQL
– Centralizando Contenido

WebMatrix

DEMO

HTML5
Y aúnhay más…
Semántica

Gráficos y Efectos

Multimedia

Acceso de Dispositivos

CSS3 y Estilos

Conectividad

Compatibilidad

SEMANTICA

Vieja Estructura

Nueva Estructura

Semántica

DEMO

CSS3 YESTILOS

Antes Del CSS3

Llego CSS3

Llego CSS3

CSS3

DEMO

PHP

DEMO

MySQL

DEMO

COMPATIBILIDAD

Soporte HTML5
•
•
•
•
•

Chrome
Firefox
Safari
Opera
Internet Explorer 9+

¿Qué podemos hacerpara
trabajar hoy con HTML5?
Modernizr
http://www.modernizr.com/
No se detecta HTML5.
Se detectan cualidades de
HTML5.

• La mejor librería de
caractetísticas detecta:

detección

de

– Todas lascaracterísticas principales de HTML5
– Todas las principales características de CSS3

• Incluye HTML5 Shim para el soporte de
tag semánticos
• Adopción generalizada
• Updates continuos
• Se incluye conASP.NET MVC 3

Polyfills & Shims

• Qué son?
Normalmente JavaScript CSS y HTML y CSS
• ¿Qué permiten hacer?
Proporcionan la tecnología que nosotros, los
desarrolladores, esperaríamos que elnavegador
ofreciera nativamente.
Provee características que faltan.
• ¿Cuando se utilizan?
Se utilizan para generar la llamada “fallback
Gracefully” o imitar una funcionalidad.

Mapeo HTML5

El futuro, quesigue, que falta?
IE9

IE Platform
Previews

HTML5 Labs

Sitios Listos
con
HTML5

Desarrollando
más
Características

Estándares en
Prueba y Desar

beautyoftheweb.com

ietestdrive.com

html5labs.comwww.cuttherope.ie

www.disneydigitalbooks.go.com/tron/

HERRAMIENTAS
•

Cualquier editor y un navegador!
• SublimeText, Notepad++, Bloc de Notas

•
•

VS 2012 – HTML5 Schema y Intellisense...