Manual para optimización de peso minisitios

Recommendations

Info

Recomendaciones para reducir peso Imágenes • Usar SVG en ves de GIF/PNG/JPG para los logos de marcas. • Usar Lazy-load en todas las imágenes (Excepto slider) datasrc=”imagen.jpg” • En lo posible usar un tileset para iconos y logos. • Las imágenes deben venir en el tamaño máx de uso, no más grandes. • Exportar las imágenes para web. JS • Compilar todos los JS en un solo archivo de ser posible. • Si se puede hacer con CSS no usar JS. Ejemplo clase “hover” en divs. Para eso existe :hover • No usar Modernizer.js porque no le damos soporte a IE8 • No volver a cargar jquery. Ya está cargado en el sitio y volver a cargarlo genera conflictos. CSS • Compilar y comprimir los CSS. Yo uso Koala, pero hay varios para distintas plataformas. Ejemplo: El CSS de la IC de computación se demora 1.6 seg en cargar mientras que el CSS de todo el sitio 150 ms. • En ves de usar margin-right:10px; margin-left:10px; usar reglas como margin: 0 10px; para ahorrar espacio y mejorar la performance. Elementos reutilizables Las IC puede utilizar las librerías existentes en ripley.cl, sin necesidad de volver a cargarlas. JS • jQuery 2.x • bootstrap • modal - bootstrap
• tooltip bootstrap • owl.carousel - carrusel • ladda - librería para hacer botones que cargan typeahead • jquery.menu.aim • jquery.lazy - lazy loading CSS • bootstrap normalize • grid • tables font-awesome
Page 1: Manual para desarrollo de IC
Page 5: • Existe “Font-awesome” agreg

Manual para optimización de peso minisitios

Create successful ePaper yourself

Delete template?

Save as template?