Tag: HTML

Las mejores universidades de Estados Unidos también cometen errores

Acabo de encontrar la infografía Best Education Sites, en la que podemos encontrar mucha información sobre la presencial en la Web de las universidades de Estados Unidos más importantes.

Me ha llamado la atención un par de datos que ofrece sobre los errores que tienen las páginas web. La University of Phoenix, una universidad online con más de 200 centros distribuidos por todo el mundo, tiene una página principal con casi 200 errores de CSS:

Por otro lado, entre las 10 principales escuelas de ingeniería hay algunas con numerosos errores en su página principal, y destaca Caltech con 51 errores, demasiados errores para una universidad en la que enseñan a hacer cohetes espaciales:

Nota: en la infografía se indica que la fecha de realización fue el año 2011, así que las versiones actuales de estos sitios web puede ser que ya no presenten estos errores.

Referencia de entidades de HTML

En la página web HTML Entity Reference for Common Characters podemos encontrar una lista de las entidades de HTML que más nos pueden interesar. Existen otras páginas en las que podemos encontrar listas más largas, como List of XML and HTML character entity references, pero muchas veces se tarda mucho tiempo en encontrar aquellos caracteres que estamos buscando.

Aquí tenemos la lista:

Nombre Carácter Entidad Numérico
Copyright © © ©
Registered ® ® ®
Trademark ™ ™ ™
Curly Open Double Quote “ “ “
Curly Closed Double Quote ” ” ”
Curly Open Single Quote ‘ ‘ ‘
Curly Closed Single Quote ’ ’ ’
Big Bullet/Dot • • •
Small Bullet/Dot · · ·
Square Dot ⋅ ⋅ ⋅
En Dash – – –
Em Dash — — —
Cents ¢ ¢ ¢
Pound (Currency) £ £ £
Euro (Currency) € € €
Not Equal To ≠ ≠ ≠
Half (Fraction) ½ ½ ½
Quarter (Fraction) ¼ ¼ ¼
Three-Quarters (Fraction) ¾ ¾ ¾
Degrees ° ° °
Left Arrow ← ← ←
Right Arrow → → →
Up Arrow ↑ ↑ ↑
Down Arrow ↓ ↓ ↓
Lowercase “e”, Grave Accent è è è
Lowercase “e”, Acute Accent é é é
Lowercase “c”, Cedilla ç ç ç
Ellipse … … …
Triangle Down ▼ (none) ▼
Triangle Up ▲ (none) ▲
Triangle Left ◀ (none) ◀
Triangle Right ▶ (none) ▶
Nombre Carácter Entidad Numérico

¿Cuáles son las diferencias entre HTML4 (XHTML 1.0) y HTML5?

El W3C ha preparado un documento, HTML5 differences from HTML4, en el que detalla las principales diferencias entre HTML4 (y su variante según XML, XHTML 1.0) y la nueva versión del lenguaje, HTML5.

Algunas de las principales diferencias son:

  • HTML5 define una sintaxis que es compatible con HTML4 y XHTML 1.0. Por tanto, un salto de línea se puede escribir como <br> (HTML4) o <br /> (XHTML 1.0).
  • Para definir el juego de caracteres se introduce un nuevo atributo para la etiqueta <meta>:
    <meta charset=”UTF-8″>
    aunque todavía es posible utilizar el método tradicional:
    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
  • Se simplica el DOCTYPE:
    <!DOCTYPE html>
  • HTML5 permite incluir elementos de SVG y MathML.
  • Se introducen nuevos elementos, como: section, article, aside, header, footer, etc.
  • Se introducen nuevos atributos, como: media, charset, autofocus, placeholder, etc.
  • Algunos elementos cambian, como: a, b, i, menu, etc.
  • Algunos atributos cambian, como: type, name, summary, etc.
  • Algunos elementos desaparecen, como: basefont, big, center, etc.
  • Algunos atributos desaparecen, como: align, background, bgcolor, etc.
  • Mejora de las API, como: getElementsByClassName() y innerHTML.

Divitis: abuso de div y span

Acabo de encontrar el artículo Divitis: Abuso de etiquetas div y span. Un artículo muy interesante donde se comenta el mal uso que se hace en muchos casos de las etiquetas div y span.

También explican lo mismo en Errores comunes del desarrollo web:

<span>-mania

Una forma común de estilizar algo con CSS es meterlo dentro de un elemento<span> y ponerle una propiedad con una clase. Estoy seguro que todos hemos visto cosas como <span> y <span>.

¿Por qué? En la mayoría de los casos es completamente innecesario, no tiene valor semántico y hace que el código quede ilegible. Usen elementos de cabecera para la cabecera, pongan párrafos en los elementos de párrafo, hagan listas con los elementos de listas de HTML. Usen CSS para estilizar esos elementos. Si es necesario, añadan atributos de clase o id.

 

Divitis and classitis

Relacionado con <span>-mania. Añadir elementos div y atributos class innecesarios.

Por qué? Ver “<span>-mania” y “falta de semántica”

El futuro de la Red se juega en la mejora del código HTML

Fuente: elmundo 03/10/2007

¿Cuál es el futuro de la Web? Uno en la que las imágenes y el vídeo estén integrados en el código HTML de forma que los usuarios puedan modificarlos a su voluntad: hacerlos más grandes, más pequeños, girarlos… gracias al Scalable Vector Graphics (SVG). Un código HTML en el que se puedan usar fórmulas matemáticas y en el que los microformatos se ocupen de las tareas fáciles y repetitivas como guardar la dirección de correo de un amigo automáticamente en la libreta de contactos, etc.

Éste es el vaticinio que han hecho Charles McCathieNevile (Opera), Doug Stamper (IE), Mike Schroepfer (FireFox), Arthur Barstow (Nokia), Allan Sandfeld (Konqueror) en una mesa redonda del congreso Fundamentos Web 2007, que se celebra en Gijón.

Cada vez más los usuarios acceden a Internet desde distintas plataformas: teléfonos móviles, PDA, televisiones, consolas de juego… y, según estos expertos, la Red debe ser una sola, independientemente del lugar desde el que se acceda. En su opinión, no tiene sentido publicar contenidos para la ‘Web móvil’ distintos de los que se ofrecen para la Red tradicional.

Además, han afirmado que el usuario debe tener el control: él es el que decide dónde, cuándo y cómo acceder a la información y, en muchos casos, su presentación. Por lo tanto, uno de los retos a los que se enfrentan los desarrolladores es conseguir que las páginas web se vean lo mejor posible en cada dispositivo. Otro reto es averiguar qué quieren hacer los usuarios y conseguir que puedan hacerlo de manera sencilla.

¿Y cuáles creen estos expertos que son los desafíos a los que se enfrenta Internet? Avanzar, respetando lo que ya se ha conseguido (evolución, y no revolución) y mejorar en la seguridad, la fiabilidad, el control de la información, la internacionalización y la accesibilidad.

Sobre éste último aspecto también ha hablado Matt May, ingeniero de accesibilidad de Adobe, en su ponencia.

Una Web accesible para todos
“Todo el mundo necesita tener igual acceso a la Web”, ha afirmado May. En su opinión, gracias a que ahora se puede acceder a la información desde distintos dispositivos y en cualquier lugar, es necesario ver el concepto de accesibilidad en su significado más amplio: la limitación a la hora de leer, ver o escuchar el contenido de una página puede ser tanto físico como ambiental (conectarse desde una cafetería, en la zona soleada de un estadio de fútbol, etc.). Según May, esta limitación incluye a todos los usuarios en el grupo de afectados, con lo que cada vez hay menos excusas para no tenerlos en cuenta.

Desde su punto de vista, el desarrollo de la accesibilidad debe ir acorde con el de las nuevas tecnologías. A medida que la Web se basa más en el uso Flash, Flex (para el desarrollo de las RIA) o Ajax se hace necesario conseguir que éstos sean accesibles.

Japón, Australia, Canadá y Estados Unidos poseen leyes más estrictas para garantizar unos requerimientos mínimos de accesibilidad. Sin embargo, en España sólo las páginas gubernamentales están obligas a cumplir unos mínimos.