Que puedo hacer para optimizar mi sitio?

Hay muchas formar de optimizarlos pero yo aquí en esta lectura sólo explicaré las buenas prácticas que yo conozco muy bien y que me han funcionado, estas son:

• Mejorar el CSS
• Mejorar el código fuente
• Optimizar las imágenes
• Usar sólo los scripts necesarios

Bueno, en resumen esas 4 prácticas pueden hacer detu  sitio algo agradable de navegar, ahora profundicemos un poco:

Mejorar el CSS

El CSS es un archivo muchas veces liviano, pero se puede optimizar su carga de varias formas:

No uses muchos archivos CSS: Muchas veces queremos crear un archivo CSS para cada archivo HTML diferente,  pero esto es una mala jugada pues el navegador del cliente tendra que cargar cada uno de esos archivos CSS, lo cual toma un poco mas de tiempo si crearamos e incluyeramos todo en ese solo archivo, asi solo se carga un archivo CSS en vez de varios, más rapidez obtenemos así.

Formatos del código CSS: Con formatos de código me refiero a la forma en que estan organizadas los selectores y las sentencias en el archivo CSS, como ya debemos saber, los archivos se leen en la misma forma en que leemos un libro, asi pues si colocamos muchos espacios entre cada instrucción, tomará mas tiempo en leer que si colocamos todo seguido, casi sin espacios, la verdad no es mucho la diferencia, es más es casi no notorio, pero en realidad se ahorran milisegundos para la carga de la página.

No duplicar instrucciones: Esto es un error muy común que comenten hasta los mejores diseñadores, porque cuando el archivo crece en sentencias a veces olvidamos que ya hemos insertado tales propiedades o incluso selectores, una buena práctica es abrir el archivo CSS y buscar el mismo selector para comparar cuales propiedades hemos escrito mas de una vez.

Mejorar el código fuente

Mejorar el código fuente hace muy fácil hallar las partes que busquemos en él, es por eso que es un buen consejo a seguir. Si tenemos un archivo HTML muy lleno de divs puede que sea complicado encontrar rápidamente uno, para evitar esto es bueno sólo usar la cantidad de divs adecuado para nuestra estrutura de página.

La indentación: Muchos ya sabemos que la indentación es muy importante para la organización del código, hace facil reconocer cuales etiquetas son hijos y cuales son padres, asi nos ahorramos tiempo en buscar elementos, muchos editores como Dreamweaver, ayudan a generar la indentación comforme escribimos el código, pero a veces los omite y no los coloca donde lo deseamos, es por esto que es mejor escribir el código directamente que ir creandolo desde una vista de diseño.

Optimizar las imágenes

La optimización de imágenes es clave al momento de acelerar el rendimiento de una web, pues por lo general estos archivos de imágenes son los que más espacio de almacenamiento ocupan. Para optimizarlas hay cantidad de aplicaciones web que nos ahorran el trabajo de hacerlo manualmente con Photoshop u otro programa editor de imágenes.

Encontré una aplicación online que optimiza las imágenes para tus webs: Image reducer

La idea de optimizar una imágen es reducir su peso, aunque esto trae consigo una leve reducción de la calidad de la imágen, es una buena práctica a aplicar para nuestras webs. Los formatos de imágenes tambien influyen mucho en este tema, yo recomiendo personalmente usar formato .jpg pues el .png es excelente para calidad y transparencias, pero ocupa mas espacio que el formato .jpg.

Usar sólo los scripts necesarios

No creo que sea necesario explicar mucho esto pues es la misma idea como sucede con los archivos CSS al momento de enlazarlos desde una archivo HTML, debemos evitar crear tantos porque ralentizan la carga y si es posible, puedes insertar en un solo archivo .js todos los scripts que vaya a usar la página para que solo se cargue uno y mejore el rendimiento.

Conclusión

Espero que estos consejitos los pongan en práctica para sus nuevos proyectos y porque no, aplicarlos a tus webs actuales, notarás un poco la diferencia.

Estándares web es un término muy general utilizado para referirse a estándares y otras especificaciones técnicas que definen y describen aspectos de la World Wide Web. En años recientes, el término ha sido frecuentemente asociado con la tendencia de aprobar un conjunto de mejores prácticas estandarizadas para construir sitios web y a la filosofía del diseño y desarrollo web que incluye esos métodos.

Lectura original

Además de haber probado ambos navegadores, e incluso otros podrás ver que algunos sitios no los hicieron a prueba de IE, pero ese es el problema, porque no deberíamos hacerlo a prueba de algún navegador en concreto!, con esto quiero decir que sería muy bueno para todos/as que con sólo hacer un sitio respetando los estándares, se vea de igual forma en todos los navegadores, y que cada navegador se caracterice por otras medios como rendimiento, facilidad de configuración etc. Con Firefox tenemos la tranquilidad de hacer un sitio correctamente y aún asi verlo como queremos.

Como vemos esto es algo muy a favor de Firefox, pero hay otros puntos claves que lo hacen ser el navegador favorito de muchas personas (me incluyo), estos puntos son:

• Es libre y gratuito.
• Fácil de personalizar.
• Fácil de instalar, además de rápido.
• No pesa mucho (7.6 mb).
• Se encuentra disponible en muchos idiomas.
• Es muy seguro y aumenta la seguridad cada vez que se actualiza.
• Es rápido al arrancar.
• Carga rápido las páginas.

Tambien hay un punto clave muy importante que no podemos notar tan fácilmente, hablo del momento en que decidí ir a ver si el HTML de Metabix validaba (y si validó ), y me he encontrado con esto en la parte baja del sitio:

The W3C CSS validator is developed with assistance from the Mozilla Foundation, and supported by community donations.

Lo que traduce a algo como: El validador CSS de la W3C es desarrollado con asistencia de la Fundación Mozilla, y soportado por comunidad de donaciones.

Pueden ver esto en el siguiente enlace: W3C Validator.

Nota: Si no sale el aviso que yo ví debes actualizar la página un par de veces para que salga.

Ahora si no hay dudas de porqué Firefox respeta los estándares.

Espero que lo hayan disfrutado tanto como yo, es algo muy divertido de ver y además aprendes algo nuevo.