jueves, 29 de setiembre de 2011

Malas practicas para crear paginas webs

Cuando empece hace algunos años en esta profesión fui aprendiendo poco a poco lo que debe hacerse y lo que no, aprendí que es importante seguir reglas HCI y UI/UX, pero fundamentalmente aprendí que lo elemental esta en pequeñeces que aveces pasamos por alto. 
Elabore un tema con 6 malas practicas que me vienen a la mente ahora(desde mi punto de vista , claro), Seguro me falto poner bastantes mas , vos podes ayudarme. 

1 - Utilizar markup desactualizado o viejo 


Un sitio web en si mismo es un enlace directo a la tecnología, y esa tecnologia debe estar en constante actualización, de eso se trata. 
En la era del XHTML, es necesario mantenerse actualizado con las normas que hacen a un sitio web Solido, HTMLDog tiene buenos tutoriales sobre eso. 

MAL: 

- Usar markup Obsoleto 
- No usar doctype 
- Hacer diseños basados en Tablas 

BIEN: 

- Siempre utilizar doctypes 
- Usar etiquetas <div> para el posicionamiento 
- Usar siempre una hoja de estilos CSS, nada harcodeado. 
- Validar la pagina con el validador del W3C 

2 - Elegir fondos invasivos o que causan distracción 


 
Cuando comenzó el Internet, la gente estaba tan sorprendida que fueron capaces de publicar cosas que no pensaban en la legibilidad y la presentación. Hay que elegir un fondo que es atractivo, pero no distraer al lector. 

MAL: 

- Uso de un fondo de color rojo brillante, sin tener una razón muy buena. 
- Uso de GIF animado como fondo. 
- Uso de una imagen que es más llamativo que el contenido principal. 

BIEN: 

-Aplicar fondos llamativos, pero no distraer al lector. 

3 - No tomar ventaja de las abreviaciones para CSS 


La taquigrafía abreviada de CSS se utiliza para activar muchas propiedades CSS en uno solo. Podemos hacer que el tamaño de los archivos más pequeños y tener limpia la hoja de estilos. A menudo se utiliza para borders, padding, margins y fondos. Se puede usar como tantas veces como sea posible para optimizar su tiempo de carga de página. 

MAL: 

.class { 
padding-left: 3px; 
margin-right: 6px; 
padding-top: 10px; 
padding-right: 9px; 
margin-left: 6px; 
background-image: url('images/happy.jpg'); 
background-position: bottom; 
background-repeat: repeat-x; 
background-color: #E2CCCC; 


BIEN: 

.class { 
padding: 10px 9px 0 3px; 
margin: 0 6px; 
background: url('images/happy.jpg') repeat-x #E2CCCC bottom; 


4 - Utilizar los efectos de Photoshop por defecto 


 

Vos debes haber visto esto en algún sitio en el Internet. Algunos abusan de el uso de bordes (especialmente el rojo) o utiliza "relieves", "sombras" o "Texturas" de forma inapropiada y termina viéndose todo como el traste. 

MAL: 

- Abuso en la utilización de efectos 
- Usar la configuración predeterminada por efecto de el Photoshop. 

BIEN: 

- No confíes solo en los efectos de Photoshop para que tu diseño se vea bien. 

5 - Uso de Intros en Flash 


Las Presentaciones Flash son conocidos como "bloqueadores de Google". Estas introducciones están por lo general en la URL raíz de los sitios, la página más importante a través de el punto de vista SEO. La mayoría de las personas quieren ver tu contenido en lugar de ver el video, por lo que se convierte en otra barrera para obtener la información que están buscando. 

6 - No validar 


Es tan fácil para validar la pagina mediante el W3C Markup Validator...pero muchos no lo hacen, la importancia de esto es extrema. 

Validadores: 

W3C HTML Validator 
W3C CSS Validator 
W3C Link Checker 
ThruSites SEO Validator



---------------------------------------------------------------------------------------------------------
Jesús Kana Conde
Diseñador Web
URL: http://www.jesuskana.net
E-mail: jesuskana@gmail.com
Nextel: (98)141*1359
Oficina: (511)3926248 Claro:(511) 992426230 Movistar: (511)988363286
Webmaster
--------------------------------------------------------------------------------------------------------

jueves, 22 de setiembre de 2011

Sigue en vivo la conferencia de Facebook f8 en Vida MRR



image

Como muchos sabrán, hoy Facebook tiene su evento sobre Facebook, así como Apple, o Microsoft tienen su día de eventos relacionados con sus productos, hoy le toca a la red social.

Hemos visto a lo largo de estas semanas que el buen Mark anda como loco colocando funciones y funciones nuevas a Facebook, y se supone que hoy dará algunas que si valen un poco más la pena.

Si quieres seguir todas las conferencias en vivo no te despegues de este post, porque después del salto está la transmisión en vivo del f8.

martes, 6 de setiembre de 2011

10 indispensables tutoriales para empezar a usar jQuery


10 indispensables tutoriales para empezar a usar jQuery Javascript es la parte de la web que le da dinámica a las cosas, pero jQuery es el complemento que hace que ese dinamismo se vuelva mucho más sencillo. Y es que a pesar de que las nuevas implementaciones de HTML5 y CSS3 nos dan de qué se puede reemplazar en ciertos aspectos el uso de flash, el uso de javascript no.

Si aún no has empezado a utilizar jQuery te traigo 10 indispensables tutoriales para empezar a usar jQuery. Podría decirse que el único defecto es que está en inglés, pero yo lo veo una ventaja, porque los tutoriales son de muy buena calidad de contenido.


Serie de video tutoriales para principiantes en jQuery

Tip: Aprendiendo jQuery 1.4 $.proxy

Supersized 3.1 jQuery Plugin

jQuery Cheat Sheet (Chuleta)

Creando un formulario estilo Digg en jQuery y CSS3

Cómo cargar y animar contenido en jQuery

Simple menú con sub-secciones en jQuery

Leyendo y editando atributos HTML en jQuery

Una introducción a jQuery Templating

Efectos Fade In, Fade Out en jQuery

Cómo crear un menú estilo Apple en jQuery

Vía spyrestudios


El porqué es mejor usar Div's en vez de Tablas

Posted: 06 Sep 2011 06:00 AM PDT

El porqué es mejor usar Div's en vez de Tablas Otro de los misterios en HTML al momento de conocer las etiquetas y la forma de maquetar o diseñar un sitio es la necesidad de tener contenedores. Muchos que empezaron a diseñar por ahí de hace diez años quizá tengan la maña de crear estructuras a base de tablas.

Hoy en día es más común usar capas, o div's, pero ¿Por qué? En este post vamos a analizar y dar algunas razones por las que es mejor usar Div´s en vez de tablas, porque la verdad no es por gusto o moda, sino por comodidad que las capas son las mejores para empezar a estructurar nuestro contenido.

image
Un buen uso de las tablas

Por mucho tiempo se usó la etiqueta <table> para empezar con la estructura de un diseño web, pero con CSS la comodidad empeoró y se hizo muy pesado soportar un diseño a base de celdas. Algunas otras razones son las siguientes:

<table> es más pesado que <div>

Mientras que una tabla llega a ocupar la etiqueta <table>, <tr>,<td>, entre otras más, la capa div sólo ocupa la capa div. Esto es más eficiente porque se carga menos código, y al momento de pedir una petición HTTP, el código enviado al usuario al ser menor será más rápido.

Div nos da mejor maleabilidad

Como les decía, con CSS prácticamente murió la estructura de tablas como un estándar, porque la organización no existía. Con una capa div puedes aplicarle todo el CSS que puedas y será muy maleable, las tablas no.

Las tablas crecen muy raro, las capas no

sólo intenten lo siguiente. Creen una tabla y a una celda coloquen más contenido que otra, verán que la celda con menos contenido irá desplazando dicho contenido al centro. Con este hecho demuestro que no son útiles para maquetar, porque no hay un control verdadero entre las celdas, ya que alinean el contenido al centro verticalmente.

image Las capas DIV nos dan mucha más flexibilidad

Capas dentro de capas es más flexible que tablas dentro de tablas

Una capa dentro de una capa no hace tanto ruido, porque actúan independientes de ambas, pero un tabla no depende por sí sola de los demás elementos como columnas y filas, por lo que si intentas modificar una tabla, literalmente arruinarás todo el diseño, por más pequeño que sea el cambio.

Las tablas varían entre navegadores

Esto lo aprendemos viendo con el tiempo. Es bien curioso pero las tablas son el elemento HTML que más dan lata a diseñadores porque no se ven iguales en ningún navegador, y más si usas sus propiedades. Tanto tamaño, borde y propiedades de identificación no funcionan de la misma forma, lo que hace un gran dolor de cabeza trabajar con tablas.

Y entonces, ¿cuándo uso las tablas?

Las tablas hoy en día tienen una sola función: presentar datos. Diría que es para presentar información, pero podría confundirse de nuevo; las tablas la única función debe ser la de ordenar datos, como cualquier tabla que podrías hacer.