Documentación especificación oficial CSS. W3schools y W3fools. Validación CSS W3C validator (CU01023D)

Resumen: Entrega nº23 del Tutorial básico del programador web: CSS desde cero.
Codificación aprenderaprogramar.com: CU01023D

 

 

SERVICIOS DEL W3C

Hemos comentado que el estándar CSS es definido por el consorcio internacional W3C. El W3C ofrece algunos servicios de interés a través de internet, como la posibilidad de consultar la documentación oficial relacionada con CSS, una web divulgativa y con ejemplos sobre la aplicación de CSS en la práctica y la validación (comprobación de cumplimiento del estándar) CSS de páginas web.

css

 

DOCUMENTACIÓN OFICIAL CSS

La web oficial del consorcio W3C es http://www.w3.org/. A través de esta web podemos acceder a distintos contenidos del trabajo de la W3C, que no solo tratan sobre CSS, sino en general sobre las tecnologías relacionadas con el desarrollo web como HTML, CSS, Javascript, gráficos, audio y video en entornos web, protocolos, etc.

Desde la página principal de W3C podemos navegar hasta llegar a la página oficial CSS (cuya URL será similar a esta: http://www.w3.org/Style/CSS/) donde podremos encontrar numerosa información sobre CSS (en inglés). Dentro de esta información están disponibles las especificaciones oficiales CSS, por ejemplo en http://www.w3.org/TR/selectors/ podemos consultar la especificación oficial de selectores para CSS. El principal problema de recurrir a la documentación oficial para el aprendizaje es que resulta demasiado extensa y demasiado técnica. También existen numerosos documentos técnicos, algunos de los cuales son recomendaciones, otros pre-recomendaciones (se denominan candidatos a recomendación) y otros borradores. Este exceso de información y su forma de presentación resulta poco útil de cara a adquirir una formación práctica y básica sobre CSS. No obstante, conviene conocer su existencia porque puede ser necesaria su consulta en algún momento.

 

 

RECURSOS DIDÁCTICOS SOBRE CSS

Indicado ya que la documentación oficial CSS puede ser demasiado árida o extensa, ¿qué recursos existen que sean más didácticos y educativos? Existen numerosas alternativas.

En primer lugar señalaremos la página web http://www.w3schools.com/. Esta plataforma alberga tutoriales y documentación sobre numerosas tecnologías relacionadas con el desarrollo web como HTML, CSS, Javascript, AJAX, PHP, SQL y muchas otras. Contrariamente a lo que pueda parecer, esta web pertenece a una empresa privada y no está en absoluto relacionada con el consorcio W3C. La similitud del nombre de dominio resulta, cuando menos, confusa. Tampoco hay indicaciones explícitas en la plataforma de la no-relación con el W3C. Los resultados de w3schools suelen aparecer en los primeros lugares cuando se hacen consultas en buscadores, de ahí que muchos usuarios o profesionales relacionados con internet piensen que w3schools es un servicio de W3C, cuando la realidad es que no es así. Debido a estos hechos y a otros aspectos negativos que se pueden achacar a w3schools han surgido voces críticas que recomiendan no usar esta web, entre los que podemos destacar http://www.w3fools.com/.

Nosotros no recomendamos el uso de w3schools, pero tampoco lo desaconsejamos. Simplemente pensamos que debe conocerse qué es y cuáles son sus ventajas e inconvenientes. Como ventajas señalaremos estas:

- Se trata de una plataforma web con una buena estructuración de los contenidos y una buena presentación.

- Tiene un sistema de contenidos, ejemplos y pruebas basadas en la edición de código on-line que en general resultan bastante didácticos y facilitan el aprendizaje.

- Es accesible gratuitamente.

 

Como inconvenientes señaleremos los siguientes:

- Parecen aprovecharse de la confusión y similitud de nombre con el W3C, aparentando ofrecer información oficial cuando no la es.

- Ofrecen cursos y certificados previo pago que no están avalados por organismos o empresas con garantías suficientes. Su publicidad puede resultar engañosa.

- En general se trata de webs bastante cargadas de publicidad que se entremezcla con los contenidos, llegando a resultar molesta.

- Parte de la información que ofrece esta web puede ser no correcta o estar no actualizada.

 

 

La mayor parte de los desarrolladores web o diseñadores web han utilizado en algún momento w3schools. Nosotros simplemente te aconsejamos que si la usas, conozcas qué es, sus ventajas e inconvenientes.

A continuación vamos a ofrecer un listado con recursos didácticos sobre CSS:

Recurso

URL

Tutorial CSS de aprenderaprogramar.com

http://www.aprenderaprogramar.com/index.php?option=com_content&view=category&id=75&Itemid=203

Documentación CSS de Mozilla

https://developer.mozilla.org/en-US/docs/Web/CSS

Wiki de la W3C para CSS

http://www.w3.org/wiki/CSS

Documentación CSS de webplatform

http://docs.webplatform.org/wiki/css

Documentación CSS de sitepoint

http://reference.sitepoint.com/css

Documentación CSS de w3schools

http://www.w3schools.com/css/

 

 

Nuestra recomendación es que para el aprendizaje inicial de CSS uses un solo curso y trates de seguirlo de forma completa y hasta el final, consultando otras fuentes sólo para cuestiones puntuales. Si tratas de adquirir una formación básica recurriendo a varias fuentes de información al mismo tiempo es posible que acabes perdiendo el tiempo y haciéndote un lío. Una vez tengas las bases de CSS y algo de experiencia, será más fácil moverte consultando la multitud de recursos e información que existen en libros, revistas y páginas web.

 

 

VALIDACIÓN CSS CON W3C VALIDATOR

Hay un servicio de la W3C que puede resultar de relativo interés: el W3C CSS validator o validador CSS de la W3C. Se accede a través de w3.org escogiendo la opción validators: CSS. También se puede acceder directamente en la URL http://jigsaw.w3.org/css-validator/

Una vez en la página con el formulario de entrada, basta introducir una URL para que el contenido de esa página web sea sometido a análisis y aparezcan los resultados del mismo. Si el CSS de la web cumple con la especificación oficial aparece un mensaje informativo y se nos ofrece la posibilidad de insertar los logos de validación W3C en nuestra página web.

css validator

 

 

En caso de que la página web no cumpla la especificación, se nos indican cuántas faltas se han encontrado y cuáles son. Las faltas se dividen en faltas menores (warnings o advertencias) y faltas mayores o errores.

validacion css

 
 

El servicio de validación CSS puede ser una herramienta útil para personas que están aprendiendo y para profesionales, al permitirles identificar en qué partes de su código no están cumpliendo con la especificación oficial. No obstante, te recomendamos que no pierdas demasiado tiempo tratando de que la página web que estés creando tenga cero errores por un motivo simple: no tener errores en el validador no garantiza que tu web se vaya a visualizar correctamente. Muchas personas pierden horas tratando de corregir el código para pasar la validación W3C cuando su web no tenía ningún problema de visualización. Entonces, ¿para qué perder el tiempo en ello? Sí, siempre es “bonito” pasar limpiamente un validador, la cuestión que debemos tener en mente es si merece la pena el tiempo que vayamos a invertir.

A modo de curiosidad, piensa en algunas páginas web importantes que conozcas (por ejemplo de algún diario, alguna televisión, alguna empresa importante) y pásale el validador CSS de W3C. Encontrarás que muchas de ellas no superan la validación, y sin embargo son webs de prestigio y con millones de visitas. Si estas grandes webs no se preocupan de tener una validación W3C perfecta ¿merece la pena obsesionarse con no tener errores de validación CSS en nuestras páginas web? A modo de curiosidad te diremos que en el momento de escribir este curso hemos pasado el validador CSS a facebook.com y hemos obtenido como resultado 24 errores. En la web oficial del gobierno de Estados Unidos, 102 errores, y así podríamos continuar una larga lista de webs importantes que no superan la validación. Pero repetimos: lo importante no es superar la validación, lo importante es que la web funcione y se vea correctamente.

Sobre los logos del W3C de validación, su presencia en una página web no asegura que la página web pase el validador, ya que se trata de simples imágenes que cualquiera podría insertar en su web. La forma de saber si una web cumple la validación es pasar su URL por el validador CSS de la W3C.

 

 

EJERCICIO

Crea un documento HTML que conste de los siguientes elementos: un título h1 con el texto “Aprendizaje de la programación”. Una división div con id menú que contenga: un título h2 con el texto “Menú” y una lista de elementos ordenados (ol) con los siguientes items: Programación básica, Programación intermedia y Programación avanzada. Finalmente, una división div con id footer con el texto “Curso aprenderaprogramar.com”. Establece diferentes valores de las propiedades color, background-color y font-size para:

a) Los elementos h1

b) Los elementos h2

c) Los elementos ol y partes internas a este (elementos li de listas).

d) El elemento con id footer.

 

A continuación utiliza el W3C validator y comprueba si no te indica ningún error, o qué errores o warnings te indica y trata de identificar el por qué de ellos y corregirlos. Puedes comprobar si tus respuestas son correctas consultando en los foros aprenderaprogramar.com.

 

 

 

 

 

 

Para acceder a la información general sobre este curso y al listado completo de entregas pulsa en este link:  Ver curso completo.

Para  hacer un comentario o consulta utiliza los foros aprenderaprogramar.com, abiertos a cualquier persona independientemente de su nivel de conocimiento.

Donar o colaborar

Este sitio se mantiene abierto gracias al apoyo de muchas personas. Si crees que merece la pena apoyar económicamente este sitio web puedes realizar una donación o colaborar. Contacta con nosotros.

¿Puedo yo aprender?

Seas o no del área informática, si quieres aprender a programar te ofrecemos una solución guiada y personalizada: realizar un curso tutorizado on-line. Con este tipo de curso, podrás aprender a programar de forma ágil y amena.

Acceder a detalles y precios de los cursos tutorizados on-line

Política sobre cookies

Utilizamos cookies propias y de terceros para ofrecerte una mejor experiencia y servicio, de acuerdo a tus hábitos de navegación.

Si continúas navegando, consideramos que aceptas su uso. Puedes obtener más información en nuestra Política de Cookies.

En Facebook!

Ahora puedes seguirnos en Facebook. Noticias, novedades y mucho más ¡Te esperamos!

RANKING APR2+

Ranking de lenguajes y entornos de programación aprenderaprogramar.com
 

SEPTIEMBRE - OCTUBRE 2017

1. Java / J2EE
2. Entornos Oracle
3. Entornos SQL Server
4. .NET, C#
5. JavaScript, jQuery
6. HTML, CSS
7. Php, MySql
8. Android, iOS


Acceder a detalles sobre el ranking de programación aprenderaprogramar.com

FOROS APR2+

Pregunta, responde, consulta, lee, intercambia...

Participa!!! Entra en los foros aprenderaprogramar.com.

             Copyright 2006-2017 aprenderaprogramar.com                La web abierta a cualquier persona interesada en la programación