Hace ya unos días que Opera anunció y publicó un interesante proyecto relativo a la formación en estándares web: Opera Web Standards Curriculum. Se trata de un completísimo “curso” para enseñarnos sobre desarrollo web basado en estándares. El curso, por supuesto, está en inglés (idioma que ha que saber al menos leer si uno se dedica a esto profesionalmente).

Hasta el momento han publicado 23 artículos (y prometen 30 más de aquí a septiembre) organizados en apartados como:

• Introducción al mundo de los estándares web
• Conceptos sobre diseño web
• Bases del HTML
• El núcleo o cuerpo del HTML

Los artículos son obras de gente como Chris Mills o Roger Johansson; gente que sabe mucho sobre desarrollo web estándar y son realmente claros y didácticos.

Un material inestimable para desarrolladores, estudiantes, profesores y para la web en general que Opera nos ofrece de forma completamente gratuita para que usemos como queramos.

Comparte este post

El artículo aborda de forma sencilla y clara atributos como:

• Display
• Position
• z-index

Y parece ser el primero de una serie…

Comparte este post

• Soporta contenido generado (generated content): esto es algo fundamental. Casi todos los maquetadores lo solemos poner como lo primero en nuestras listas de deseos.
• Texto vertical!
• Tablas “inline”
• Selectores avanzados: parece que empieza a medio funcionar el E[attr=val]. Este es la ostia… llevo esperándolo media vida, por fin podremos poner un estilo diferente a un elemento en función del valor de un atributo. El ejemplo más claro, diferenciar un enlace con “_self” de uno con “_blank”

Algunas referencias

• En la web del navegador
• En css3.info
• En evotech

Comparte este post

¿Que pasa? ¿Qué polémica?

Bueno... el tema es de esos que a los frikis de la web nos pone cachondos, pero al resto del mundo no le va a dejar sin sueño. Resto del mundo: no os preocupéis demasiado excepto si tenéis invertida una pasta en bolsa.

Resumo un poco el tema:

Hace poco informamos de que IE8, siguiendo la línea marcada por IE7, avanza en el respeto hacia los estándares web y que habían coseguido superar el famosísimo Acid2 Test.

Esta semana nos enteramos de que para que IE8 funcione en modo "estándar" será necesario declarar una etiqueta META

en nuestro documento. Solo si existe dicha etiqueta IE8 funcionará en modo estándar, pasará el Acid2 Test y permitirá utiliza características de las CSS como el contenido generado (yo quiero eso yaaa!).

Ya la hemos liado

Ante este hecho se monta la guerra de siempre. A su izquierdaaaaa y encabezados por Jeremy Keithhhhh los que consideran esto una aberración y que los navegadores deben respetar los estándares por defecto. A su derechaaa, de color azul y encabezados por Eric Meyerrrrr los amantes del “Don’t Break the Web” con el que Microsoft se ha defendido siempre para pasar de los estándares.

Mi opinión

¿Rompo la web? ¿La dejo como está?... no sé, no sé. Y lo digo en serio... aquí pasa algo parecido a lo de los toros. En el ardor de la juventud fuí un detractor de la postura “Don’t Break the Web”; pero con el tiempo he ido entiendiendo y aceptado esta postura que, aunque ha sido utilizada por Microsoft para pasarse los estándares por el forro, tiene su lógica.

¿Es la hora de romperla definitivamente? mi corazón me dice que SI. Mi cabeza que con la edad se hace algo más conservadora, no lo tiene tan claro.

Pues creo que mi corazón tiene razón: ya es hora de ir forzando a los desarrolladores a entender algo sobre estándares y a utilizarlos. Si quieren mantener la compatibilidad hacia atrás que sea el irresponsable el que ponga la dichosa META y si no sabe ni lo que es y su web no se ve en IE8, FF3, Safari, Opera y todos los demás, pues que se forme un poquito.

En algún momento hay que romper con esta filosofía que Microsoft apoya impone con el argumento de no destrozar los sitios mal hechos que, por desgracia, son mayoría. ¿Alguien se cree esa postura filantrópica de Microsoft? Pero si se han pasado todo por el forro... bueno, ahora entiendo por qué siguen haciendo sistemas operativos intestables, debe ser para que el usuario no se asuste demasiado al tener un ordenador funcionando de forma estable durante más de un día; si hicieran un SO estable ¿De que iban a vivir los pobres técnicos de barrio...? habría que cerrar todas las tiendas de informática. Gracias Bill... pero no.

El objetivo de Microsoft no es que las webs funcionen o no, su objetivo que su navegador siga siendo el mayoritario sea como sea (es lógico pero que no nos engañen).

Si de verdad eres un friki de la web

Y quiere seguir a fondo esta polémica:

• Justificación de Chris Wilson’s sobre el tema,
• El cabreo de Jeremy (un tio muy majo)
• Lo que nos dice Eric Meyer
• Zeldman, como no, también opina
• ¿Y que piensa Roger Johansson de todo esto?

Actualizacion:

Marcy nos aporta esta magnífica recopilación de enlaces sobre el tema

Comparte este post

Si! ya se empieza a hablar de Internet Explorer 8; y una de las primeras noticias sobre la próxima versión de este navegador es que, tras años y años de saltarse a la torera los estándares web, concretamente el HTML y las CSS, los chicos de Microsoft han conseguido que su navegador pase el Acid2 Test..

Es una buena noticia y una indicación más de que, al menos a nivel de márketing, el equipo de desarrollo de Internet Explorer sigue con la orientación pro-estándares que inició con la versión 7 del popular navegador.

El Acid2 es una prueba que consiste en conseguir que el navegador renderice una imagen mediante HTML y CSS 2 y para hacerlo se utilizan reglas bastante complejas. Pasar esta prueba implica que el navegador cumple soporta los estándares de desarrollo web antes mecionados a un altísimo nivel.

Comparte este post

El (¿la?) wiki de microformats.org, centro de referencia para todo el que esté interesado en el tema de los microformatos, se está traduciendo al español y les vendrá bien tu colaboración.

Si quieres saber cómo echar una mano en el tema en el post original de Dani tienes todos lo datos

PD: últimamente estoy de un imperativo con los titulos de los posts...

Comparte este post

En realidad es parte de la especificación CSS2, siiiii, aquella del año 1998... pero la guerra que aquella época mantuvieron Netscape e Internet Explorer (sobre todo éste, que pasaba del ttf) impidió que se utilizase esta posibilidad:

Tampoco es que ahora se pueda utilizar ya que Microsoft sigue apostando por el "popular" formato .eot y el resto creo que por ahora pasan del tema. A lo que vamos, el que parece lo va a implementar y de forma estándar, va a ser WebKit, el navegador de open source que es la base de Safari (el navegador de Mac).

¿Esto quiere decir que la cosa va a cambiar? ¿Vamos a poder utilizar tipografías distintas en nuestras web? bueno, pues mi opinión es que por ahora nada de nada... Safari es un navegador minoritario con una influencia relativamente escasa. Pero por fin alguien retoma el asunto depués de mucho tiempo y a lo mejor se despiertan las conciencias de Firefox y Ópera y Chris Willson que es el responsable de Internet Explorer y un tio mu apañao... decide que ya es hora de implementar las fuentes descargables. Seguiremos soñando.

Más información:

• 456BereaStreet
• Monday By Noon: muy interesante su visión sobre los beneficios que esto aportaría en el campo de la accesibilidad
• CSS3.info

PD: Putada... esto nos impediría decirle al cliente que no puede usar la Comic Sans en su web

Comparte este post

En el escenario... Tantek Çelik (Tantek.com)... tenía ya ganas de ver/oir a este chaval.

Algunos objetivos en el tema de la portabilidad de perfiles en las redes sociales
-Facilidad para los usuarios: todos los días salen nuevas redes sociales, Una cosa que habría que conseguir que pudiésemos tener un perfil común para todos. Cierto, eso sería maravilloso (¿OpenId?)
-Facilidad para los desarrolladores:
-accesible para diseñadores (desarrolladores web) no para programadores. Si se logra que el sitio sea accesible para los diseñadores (POSH).
-También lograr que incrementando el esfuerzo se incremente los resultados
-Modularidad de las soluciones: es necesario que las soluciones sean modulares, en bloques independientes.
-También es importante la reutilización tanto de las urls y los contenidos ya existentes.
-Esto facilita tambien el princpio DRY (no repetirse)

Pone un ejemplo de un perfil de usuario y va a explicar cómo utilizar el microformato hCard para el trabajo con perfiles de usuario. Pone una página con un perfil en HCard y nos muestra como enviarlos a su libreta de contactos mediante la extensión Operator. Comienza a profundizar en el hCard y lo útil que es para publicar información de perfiles e interactuar con ella (importar los datos, portabilidad de los perfiles entre sitios)

Ahora introduce el tema de OpenID. para el tema de compartir datos de perfiles y cosas como los enlaces a mi perfil, los iconos de mis amigos, nombre... para conseguir esta portabilidad entre perfiles usa hCard y XFN.

Va a poner un ejemplo de cómo publicar datos en hCard + XFN (relaciones).

Otro punto importante de las redes sociales: la suscripción a los perfiles de la gente. Nos enseña una implementacion de hCard + XFN con un ejemplo en HTML.

Ahora vemos el tema de la equivalencia de perfiles en distintos sitios, para eso la base es poner el enlace a mi perfil y usar el tag "rel" con valor "me". También como poner en nuestro perfil nuestra lista de amigos; para eso vuelve a usar hCard mediante el cual va definiendo una lista de gente.

En los sitios de redes sociales, cuando se popularizan mucho, empieza a no caber la gente y empieza a ser problemático tanto a nivel de uso como de rendimiento del sitio. Ahora propone como hacer nuestra lista de amigos pero con una página para cada uno,... lo mismo pero ahora incorporamos en el enlace el valor "next " o "preve" dentro del rel

Hay muchas páginas que pueden permitir utilizar un perfil único: flickr, twitter, technorati... wordpress.

Importación de perfiles... va a poner un ejemplo de cómo lo ha hecho en getSatisfaction (www.getsatisfaction.com). A la hora de darte de alta, en este sitio permiten importar tu perfil de otros sitios (flickr, technorati...) ponemos el nombre y lo busca en estos sitios... Otra similar es ¿Doppler? que permite importar tu perfil directamente de Twitter.

Pregunta importante ¿Porqué una empresa va a permitir la portabilidad de los datos de sus usuarios?... ¿Por que le va a interesar a Flickr compartir los datos de sus usuarios?... no veo claras las razones que da...

Código (programación) para usar hCard:
-hKit
-Online Identity Consolidator
-Django-PSN

Problemas de la portabilidad de perfiles:
-Las empresas que utilizan perfiles de usuarios corren el riesgo de molestar al usuario al usar datos que éste no quiere publicar (ej,: dirección email )
-En ocasiones piden passwords de otros sitios para obtener el perfil (ej.: twitter lo hace para explorar tu red de contactos en Gmail e incorporarlos a tu lista) esa tendencia es un problema imporante.

Hacia donde va el tema de la portabilidad de Perfiles
-Matenerse informado de los cambios que publican en microformats
-Empezar a usar OpenId
-Echar un vistazo a los esfuerzos que están haciendo desde OAuth (Sistema para autorización abierta)

Por dios... que agobio con la pobre traductora afónica.

Comparte este post

Una breve historia de las CSS, de la primera especificación a la segunda.

Lo más sustancioso la explicación de cómo están priorizando los módulos que quieren implementar en CSS3.

1. La característica a implementar tiene que ser técnicamente posible, obviamente. ¿Se puede programar? ¿Los ordenadores serán capaces de procesarlo?
2. Hay suficientes expertos en el grupo de trabajo W3C para desarrollarlo?
3. Interesa a la comunidad

Y tras esto hace un breve repaso a los módulos actualmente más priorizados:

• La rejilla, el Grid. la están abordando desde dos perspectivas: Advanced Layout y Posicionamiento en la rejilla. Son dos módulos distintos pero que van dirigidos al mismo objetivo y que incluso, podrán combinarse
• Dispositivos móviles: lo consideran esencial. La especificiación actual tiene ya algo de interoperabilidad con dispositivos móviles, pero quieren ir más allá. Dos premisas a este respecto
  • Los moviles tienen capacidad a nivel de procesamiento como para procesar la actual CSS2
  • se va a hacer una especificación más especializada en conjunto con los fabricantes de móviles
• Más facilidades para bordes: redondeos, sombras o imágenes para generarlos
• Rotación de textos

Se acaba el tiempo y como todo buen miembro de la W3C, pide ayuda a la comunidad. Pero solo da tiempo a dos preguntas... de todas formas se a ofrecido a que lo asaltemos por los pasillos.

un 6

Comparte este post

Bueno, a lo que vamos, acabo de ver una web donde puedes generarte menús de este tipo y en vez de hacer un post sobre el sitio he pensado que es más interesante recopilar los que a mi más me gustan:

Listamatic

El de siempre, el clásico, el único, el veterano, el del sonido estilo inconfundible. Una colección de menús tanto verticales como horizontales que recojen lo mejor de lo mejor. También incluyen ejemplos de menús anidados.

Más de 50 ejemplos disponibles, con su correspondiente código, a los que se suman tutoriales para aprender el arte de la creación de menús. Es el mejor recursos para aprender a hacer menús que es lo que realmente recomiendo a cualquiera que se quiera dedicar al desarrollo web y un punto de partida excelente. Imprescindible.

Enlace: http://css.maxdesign.com.au/listamatic/

List-O-Matic

Se trata de un generador de menus online basado en los que ofrece el listamatic. Puedes generar tu menú en 3 pasos:

• Define el número de enlaces
• Define el texto, título y url de cada uno
• Elige tu menú

Enlace: http://www.accessify.com/tools-and-wizards/developer-tools/list-o-matic/

CSS Menu Maker

Es el que he descubierto recientemente y aunque tiene poca variedad de menús parece que tienen la intención de ir ofertando más opciones. Muy fácil de usar, ofrece diseños bastante interesantes.

Enlace: http://cssmenumaker.com/index.php

Smashing Magazine

Hace unos meses publicaron un post titulado "CSS-Based Navigation Menus: Modern Solutions" donde ofrecían ejemplos de webs que utilizan menús CSS. Únicamente ofrecen el link a los sitios originales y además algunos de ellos utilizan Javascript pero hay que reconocer que hicieron una magnífica selección.

Enlace: Smashing Magazine

Comparte este post