advertisement

Presentación RodrigoPolo.com @ Barcamp Guatemala '09

50 %
50 %
advertisement
Information about Presentación RodrigoPolo.com @ Barcamp Guatemala '09
Technology

Published on March 15, 2009

Author: rodrigopolo

Source: slideshare.net

Description

Una presentación que pretende despertar en el mundo real del web actual.
advertisement

Bienvenidos

Optimizando Sitios Web Rodrigo Polo IT Consultant & Web Developer www.rodrigopolo.com

¿Qué son los estándares web? • Contenido UTF8 • XHTML • CSS • JavaScript • Flash

¿Qué Proponen?

Separar el contenido del diseño

Contenido indexable por buscadores

¿Cuál es el verdadero objetivo de los estándares web?

The red pill or the blue pill?

The red pill or the blue pill? • You take the blue pill and the story ends. You wake in your bed and believe whatever you want to believe. • You take the red pill and you stay in Wonderland and I show you how deep the rabbit-hole goes.

The red pill or the blue pill? Remember; all I am offering is the truth, nothing more.

Comunicación • Comprensible • Rápida • Eficiente • Rentable

W3C (World Wide Web Consortium)

W3C Validator http://validator.w3.org

¡Sitios no estándar! Sitio Errores Google.com 65 Apple.com 2 Microsoft.com 176 Yahoo 32

P:¿Por Qué? R:Prioridad a la Comunicación

Web 2.0 = Comunicación • Twitter • Youtube • Facebook • Flickr

Prioridad de la Comunicación sobre el web 1. Optimización 2. Estándar Web

Google - Gmail Quirks mode (No declaración de documento, tablas, poco amigable con buscadores, etc.)

Quirks mode = < Bytes + Rápido

NO usar Quirks Mode

¡Estándares Web con Buen Enfoque! Optimización Web

Estándares Web mal aplicados www.elcircodelrock.com (UTF8, XHTML, CSS, JavaScript, etc.)

3MB

3MB Conexión Tiempo 256kbps 1.36m. 512kbps 48s.

Internet Móvil 1KB x Q0.05

Internet Móvil 3MB = Q156.60 sólo el home page

Error de Validacón UTF8 Mal aplicado

Problemas Actuales • Blogs infinitos • Comentarios infinitos • Divs en vez de Tablas • Muchos Archivos CSS y JS • Contenido JavaScript

Verdadero Estándar Web (2.0)

¡Optimización!

Herramientas Indispensables para BUENOS Webmasters

www.mozilla.com

www.getfirebug.com

YSlow http://developer.yahoo.com/yslow/

Web Developer http://tinyurl.com/devetool

YUI Compressor http://tinyurl.com/yuicomp http://yui.2clics.net

Optimizando

1) Pocas Peticiones • Unificar JavaScript • Unificar CSS • Integrar imágenes • Ajax

2) Minificación de JS y CSS • Proceso por el cual se remueven todos los caracteres del código fuente sin cambiar su funcionalidad, estos caracteres innecesarios usualmente son espacios en blanco, retorno de carrete, comentarios y en ocasiones delimitadores de bloque; Son usados para obtener lectura humanamente comprensible del código e innecesarios para su ejecución.

3) Menos Frameworks • Explotar todas las capacidades de un sólo frame work • Buscar Plugins • Google.com - it

.httaccess en Apache 4) Compresión de contenidos 5) Expiración de archivos 6) Eliminación de Etags

4) Contenido Compreso <ifmodule mod_deflate.c> AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript </ifmodule>

5) Expiración <IfModule mod_expires.c> ExpiresActive On ExpiresDefault quot;access plus 6 monthsquot; ExpiresByType text/css quot;access plus 6 monthsquot; ExpiresByType text/javascript quot;access plus 6 monthsquot; </IfModule>

5) Expiración • Manejo de versión en nombre de archivos mootools-1.2.1.js jquery-1.3.2.js sctipt-1.3.r4.js

6) Eliminación de Etags FileETag none

7) Contenido • El usuario es humano • Menos es MÁS • Una imagen = Mil palabras • Íconos

7) Contenido

7) Contenido

7) Contenido

8) Contenido Alterno • Flash • Quicktime • Windows Media • JavaScript

8) Contenido Alterno <object width=quot;800quot; height=quot;600quot;> <param name=quot;moviequot; value=quot;flash.swfquot; /> <p>Contenido alterno</p> </object>

8) Contenido Alterno <script type=quot;text/javascriptquot;> $(document)… </script> <noscript> <p>Contenido alterno</p> </noscript>

9) Flash

Flash es Excelente Para: Hotsites • Aplicaciones Multimedia • Video • Juegos • 3D • Presentación de Producto • Banners y Publicidad •

Flash NO se debe usar en: • Remplazo completo de un site • Remplazo de un menú de navegación de un sitio • Única entrada a un site • Única solución para galerías • Única solución para video

10) Friendly URLs http://site.org/?cat=libros&pag=1 http://site.org/libros/1

11) Paginación Comentarios • Blogs • Categorías • Etc. •

12) Web Móvil • Detección de plataforma • Eliminación de contenido no HTML • Reducción de contenido (… [leer artículo completo])

Inventando el agua azucarada • Wordpress – Permalinks – WPTouch Plugin • Joomla – Joomla SEF Plugin – PDA-plugin

Últimas Notas

Usen lo que sea necesario según la ocasión • Tablas HTML para datos, Divs para layout • El estándar es mantener la comunicación en cualquier medio • Pregúntense a sí mismos que desean comunicar, con eso encontraran el estándar que necesitan

Traten de cumplir con los estándares, sin sacrificar la optimización Apple en relación a Ajax: …Microsoft implementó el objeto “XMLHttpRequest” (Ajax) en Internet Explorer 5 para Windows, Los ingenieros de Mozilla implementaron una versión compatible en Mozilla 1.0 (y Netscape7), Apple ha hecho lo mismo desde Safari 1.2… …Existe una funcionalidad similar propuesta por W3C, el “DOM Load and Save”, sin embargo a causa del creciente soporte al objeto “XMLHttpRequest” ha hecho que éste se vuelva un estándar por defecto por lo que será utilizado en Safari como el estándar a pesar de las especificaciones del W3C… (Actualizado: 2005-06-24) http://tinyurl.com/applajax

Traten de cumplir con los estándares, sin sacrificar la optimización Actualmente el W3C sigue discutiendo la adaptación del estándar del objeto “XMLHttpRequest”, sin embargo este objeto es la solución por defecto, ya que es más rápido, más compatible y más eficiente que el “DOM Load and Save” que propuso el W3C al inicio.

¡Lo más importante! En todas las carreras relacionadas al Web y a la tecnología se debe ser autodidacta, de lo contrario no se puede estar al día y ser competitivo. Un amigo que puede resolver tus inquietudes o asistir a cursos y conferencias es bueno, pero el conocimiento allí queda; el Web puede enseñarte TODO lo que necesitas saber con un sólo clic y te mantiene actualizado SIEMPRE. ¡Toda la información contenida en este documento salió del web! :)

¿Preocupados por la Economía?

Ahorro en Educación Web Libro GRATUITO Completo de Guía de SEO (Search engine optimization o Posicionamiento en buscadores): http://tinyurl.com/guiaseo Libro GRATUITO Guía Wordpress http://tinyurl.com/wp-manual Excelente Libro GRATUITO de Diseño Web Inteligente (Improving Interface Design) http://tinyurl.com/uidesign

Ahorro en Educación Web Cursos XHTML, CSS, XML, JavaScript, AJAX, SQL, ASP, ADO, PHP, .NET ASP, Flash, Web Building, Web Browsers y Web Hosting. http://w3schools.com Buscador de bookmarks populares Ideal para buscar lo que otros consideran relevante http://delicious.com

Ahorro en Educación Web Video Tutorial XHTML-CSS (en HD) http://espractico.com Video Web2.0 (The Machine is Us) http://tinyurl.com/web20vdo Entendiendo la Web 2.0 (RSS, Wikis, Social Networks) http://tinyurl.com/web20en

Ahorro en Educación Web ¡Todo el mundo del conocimiento en tus manos! www.google.com - www.wikipedia.org

Copia de este documento y video de la presentación http://rodrigopolo.com/barcamp09

¿Les Gustó?

¿Les Gustó? ¡Inviten al conferencista a una Coca!

¿Preguntas?

Add a comment

Related presentations

Presentación que realice en el Evento Nacional de Gobierno Abierto, realizado los ...

In this presentation we will describe our experience developing with a highly dyna...

Presentation to the LITA Forum 7th November 2014 Albuquerque, NM

Un recorrido por los cambios que nos generará el wearabletech en el futuro

Um paralelo entre as novidades & mercado em Wearable Computing e Tecnologias Assis...

Microsoft finally joins the smartwatch and fitness tracker game by introducing the...

Related pages

Presentación BarCamp - Rodrigo Polo

Presentación BarCamp. ... ¡MetallicA Guatemala! ... Rodrigo Polo says: April 23, 2010 at 1:10 am. Hosting completo anual = $120 USD
Read more

BarCamp Desarollo Web - Rodrigo Polo

BarCamp Desarollo Web. ... Presentación BarCamp → ¡MetallicA Guatemala! ... © 2016 RodrigoPolo.com. Home; About; Contact; Back to Top ...
Read more

Segundo gran Barcamp Guatemala Julio ‘09 - Eventioz

Damos el banderazo de salida y oficialmente lanzamos el Barcamp Guatemala Julio 2009, ... Segundo gran Barcamp Guatemala Julio ‘09. sábado, 18 de Julio ...
Read more

BarCamp / FrontPage

BarCamp has now quite an impressive historical record. ... 2015 at 6:09:42 pm revision, the last one with the info on how to use this wiki.
Read more

Barcamp Guatemala - iLifebelt™

La idea es que cualquiera de los participantes pueda realizar una presentación para exponer sus ideas o ... Sábado 09 de julio ... Barcamp Guatemala.
Read more

.: Segundo gran Barcamp Guatemala Julio ‘09

Segundo gran Barcamp Guatemala Julio ‘09. martes, 14 de julio de 2009. ... presentacion (3) primer ingreso (5) primera instancia (1)
Read more

Barcamp en Guatemala

Los asistentes llegan, van poniendo su tema de presentación en una pared y la gente elige a cual asistir. ... Segundo gran Barcamp Guatemala Julio ‘09;
Read more

Miss Playa Guatemala 2009 (Presentacion de Candidatas ...

Miss Playa Guatemala 2009 (Presentacion de Candidatas) ... MISS HIGUEY 09-TRAJE DE BAÑO - Duration: 7:06. Evar. de la Cruz 60,530 views. 7:06
Read more