buenas prácticas para el desarrollo web
DESCRIPTION
Slides de la desconferencia "buenas prácticas para el desarrollo Web" presentada en el II Barcamp Puno PerúTRANSCRIPT
![Page 1: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/1.jpg)
Alain Alejo Huarachi
Puno, 19 de diciembre del 2009
Buenas prácticas para Buenas prácticas para el Desarrollo Webel Desarrollo Web
![Page 2: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/2.jpg)
ResumenResumen
• Introducción• Diseño• Maquetación• MVC• AJAX• JS no obstructivo• SEO• Herramientas de soporte
![Page 3: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/3.jpg)
IntroducciónIntroducción
<html>
![Page 4: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/4.jpg)
DiseñoDiseño
![Page 5: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/5.jpg)
DiseñoDiseño
• Diseños para inspirarse• Wireframes, Mockups• Recursos
– Iconos– Fotos– Dibujos– Patrones– Colores / Degrades
• Plantillas o Templates– PSD– HTML/CSS– Para CMS
![Page 6: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/6.jpg)
MaquetaciónMaquetación
![Page 7: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/7.jpg)
MaquetaciónMaquetación
• Formato de imágenes (JPG, GIF ó PNG)
• CSS Sprites• Estándar HTML• Navegadores• Cheat Sheets
![Page 8: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/8.jpg)
Modelo Vista Controlador Modelo Vista Controlador (MVC)(MVC)
• Uso de Frameworks– Ruby on Rails– CodeIgniter– Kohana
![Page 9: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/9.jpg)
AJAXAJAX
![Page 10: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/10.jpg)
Javascript no obstructivoJavascript no obstructivo
• JQuery• Mootools
![Page 11: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/11.jpg)
Search Engine Optimization Search Engine Optimization (SEO)(SEO)
• Título y descripción de la página• HTML semántico
– h1, h2, h3, em, strong, a, img
• Ojo con Javascript y Flash• URLs amigables
– sitioweb.com/articulo/tecnicas-seo/– sitioweb.com/?articulo_id=1542 x
• Sitemaps
![Page 12: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/12.jpg)
Herramientas de soporteHerramientas de soporte
• Google Analytics• Google Webmaster Tools
![Page 13: Buenas prácticas para el desarrollo Web](https://reader033.vdocumento.com/reader033/viewer/2022051015/556a1d0ed8b42a2f3f8b4681/html5/thumbnails/13.jpg)
ReferenciasReferencias
• www.maestrosdelweb.com• www.smashingmagazine.com• El blog para webmasters