Las herramientas de validación del W3C son el pan nuestro de cada día. Supongo que a estas alturas estaremos medianamente concienciados de la necesidad de generar un código válido y acorde a los estándares.
Si hay algo “molesto” en estas herramientas es el hecho de tener que validar por un lado la hoja de estilos y por otro el HTML. No es que sea una tortura pero sería ideal poder validar nuestros sitios web de una sola sentada.
En estándares y accesibilidad, Gabriel Porras se hace eco de una herramienta que nos propone precisamente esto. Con el XHTML-CSS Validator podremos validar nuestros sitios de una sola pasada, eso si, sitios que se encuentren disponibles desde la red ya que la única forma de indicarle los documentos a validar es mediante una URL.
Una pena que tengan que venir terceros a mejorar las herramientas del Consorcio, una suerte por otro lado que haya terceros interesados en facilitarnos la vida.
Así que ya sabéis, como dicen los autores de este interesante validador “Se válido (valida) o muere aprendiendo” (Be valid or die learning)
XHTML-CSS Validator: http://xhtml-css.com/
Se me ocurren un montón de situaciones en las que podemos agradecer tener a mano un generador de formularios como este.
Con pForm podrás tener un formulario en HTML (relativamente bueno) con un bonito estilo. Para ello sólo tendrás que seleccionar un esquema de color, escoger los campos y escribir las etiquetas que los acompañarán.
El resultado podréis descargarlo para integrarlo en vuestros sitios comodamente y gratis.
pForm: http://www.phpform.org/
Ayer, cuando os pedía consejo sobre editores de código para Gnome no me esperaba esa respuesta (gracias, de verdad). Ahora tengo un montón de ellos para escoger y creo que lo mejor es que los pongamos todos juntos en un artículo como referencia para futuros linuxeros desamparados. Cito por orden alfabético:
Proyecto oficial de Eclipse para el desarrollo con PHP
Algunos son completos IDEs, otros simples editores de código con resaltado de sintáxis y algunos son sólo para los más fuertes de ánimo.
Seguro que nos hemos dejado muchos en el tintero, una vez más quedan abiertos los comentarios, por si se os ocurre algún otro.
De la mano de Eric Meyer nos llega una solución que, por simple, es sin duda un gran hayazgo.
Haciendo un uso magistral de los selectores de CSS, va filtrando situaciones comunes en cualquier sitio (imagenes sin alt, enlaces que no van a ningún sitio…), haciéndolas mucho más fáciles de localizar.
La hoja de estilo queda algo así (por supuesto, adáptala a tus necesidades)
a[href="#"] {background: lime;}
a[href=""] {background: fuchsia;}
img {outline: 5px solid red;}
img[alt][title] {outline-width: 0;}
img[alt] {outline-color: fuchsia;}
img[alt], img[title] {outline-style: double;}
img[alt=""][title], img[alt][title=""] {outline-width: 3px;}
img[alt=""][title=""] {outline-style: dotted;}
Sin duda, la Web Developer Toolbar ya nos sirve para esto pero, de esta manera, recibimos referencias visuales más concretas (sabremos de un vistazo qué está mal y por qué).
Para profundizar en la lógica de esta hoja de estilo nada mejor que leer el artículo de Eric: Diagnostic Styling
Hoy, en el trabajo, surgió el ancestral debate “¿y por qué tanto lío para evitar maquetar con tablas?”. Por supuesto, un vistazo al código fuente de aplicaciones web como las de Google o el mismo Flickr, buque insignia de la web 2.0 no hizo más que sumar argumentos en mi contra ya que, como supondréis, me posiciono en favor de un marcado limpio. Como siempre, se sacó una conclusión errónea: “Eso de los estándares al final es para 4 frikis”.
No obstante, toda esta lata que damos los “estandaristas” tiene razón de ser y, en el caso de proyectos modestos o de empresas con recursos limitados (o sea, todas salvo las mega corporaciones), los estándares pueden suponer ventajas insospechadas para muchos:
A todo esto, además, podemos sumarle el gusto de hacer bien las cosas ¿Acaso eso no es suficiente?
A través del blog de Leandro D’Onofrio conozco Libros Web, un sitio en castellano donde nos ofrecen algunos libros traducidos a nuestra lengua para leer online o imprimir.
Por el momento tienen sólo tres libros: una guia de Symphony, Introducción a CSS e Introducción a XHTML pero, por lo que veo en su sitio, parece que pretenden ampliar esta colección con más libros traducidos para desarrolladores web.
LibrosWeb.es pretende publicar varios libros gratuitos sobre diseño web y aplicaciones relacionadas
Esperemos que se mantengan gratuitos o a bajo precio en un futuro (Yo pagaría algo por poder descargar los libros en PDF, ahí va una idea…)
LibrosWeb: http://www.librosweb.es/
Seguro que alguna vez has escuchado ese argumento, que no por mucho que se repita es cierto, de que los estándares web no tienen cabida en el ámbito de los negocios. Se puede tratar de rebatir con argumentos pero, sin duda, lo que mejor convence a alguien son los ejemplos de uso.
The Business Case for Web Standards es un wiki en el que, a pesar de los spammers que ya han tomado la página principal, pretenden recopilar ejemplos reales de uso (o no uso) de estándares web en aplicaciones y sitios con caracter comercial. Sin duda, la lista de factores a favor es más que interesante, de entre todos destaco:
Por el momento faltan argumentos en contra que tengan algo de fundamento.
Existen múltiples test y validadores para tu código que puedes emplear online, no obstante, si necesitas ir validando múltiples sitios puede ser laborioso ir acudiendo al sitio de cada herramienta.
Si hay una ventaja que hace destacar a Firefox sobre los demás navegadores (sin ánimo de polemizar, otros navegadores también tienen sus herramientas pero se salen de la perspectiva de este blog al no ser software libre) son sus extensiones.
Para todos los desarrolladores web, existen numerosas extensiones que nos ayudarán a validar y verificar nuestro código:
Con Offline Page Validation podrás enviar cualquier página que estés visitando al servicio de validación del W3C incluso si son páginas locales, que requieran registro, etc.
Valida tus hojas de estilo mediante el servicio del W3C
La “HERA-Extension” es una extensión para los navegadores de la familia Mozilla (Netscape, Firefox, Flock, Safari, etc.), que permite revisar online, en un solo clic, la página web que estemos visitando e incluso un marco de esa página (si los tiene), facilitando el uso y acceso a HERA.
TAW3 en un click te permite comprobar la accesibilidad de las páginas que visites, utilizando el servicio TAW3 Online y las reglas WCAG 1.0
Con ella podrás comprobar que el contraste de los colores que has escogido para tu sitio web es adecuado para todos tus posibles visitantes
Te mostrará tus páginas de forma similar a como las interpreta un lector de pantalla
Esta extensión está pensada para ser una ayuda en la navegación de personas discapacitadas pero los desarrolladors podemos utilizarla para comprobar si su desempeño es correcto
Entre sus múltiples posibilidades (de las que hablaremos en unos días en profundidad) está la de validar tus sitios locales y los sitios que visites, tanto su html y css, como su accesibilidad…
La extensión Total Validator, de la que ya hablamos por aquí, te permite realizar múltiples validaciones en un solo click
Valida HTML, XHTML, CSS, RDF, RSS, XML, WAI, Section 508, P3P, Hypervínculos, Metadata y más
Seguro que alguna vez te has visto en problemas para mantener el pie de tus páginas en su sitio, abajo del todo. Ya vimos, en este mismo blog, una aproximación que nos permitía conseguir que los pies de página se mantuviesen en su sitio. No obstante, aquella solución nos obligaba a emplear atributos de estilo propietarios y no válidos.
Ryan Fait llega a otra solución que, en lugar de requerir etiquetas no válidas, requiere un div extra y poco más.
El CSS es algo tan simple como:
* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em; /* el margen inferior es el valor del pie en negativo */
}
.footer, .push {
height: 4em; /* .push y .footer deben tener la misma altura*/
}
Pero lo mejor es que veáis el ejemplo y echéis un vistazo al código.
A través de 456 Berea St encuentro un interesantisimo artículo de Andy Rutledge que trata de explicar, de una vez por todas, a los diseñadores gráficos por qué los estándares no son el enemigo de su creatividad: Web Misunderstandars.
Sin duda, algo que hay que repetir más: Los estándares no tienen nada que ver con el diseño. Cualquier cosa que pueda ser representada gráficamente puede representarse en internet sin tener que incumplir ningún estándar.
…if there is something you cannot do with design online it’s because of your ignorance or lack of skill, not because of Web standards.
…si hay algo que no puedas hacer con un diseño online es por culpa de tu ignorancia o falta de habilidad, no por culpa de los estándares web
Alojado en RedCoruna Hosting
¿Quieres hasta 6 meses de hosting gratis? Utiliza el cupón RCwebmasterlibre al contratar cualquier plan con RedCoruna - más información
Seguir @webmasterlibre
