A medida que pasa el tiempo, las estructuras web van puliendose y se van imponiendo tags/ atributos que ofrencen un valor añadido que otros no pueden añadir, elementos creados en una internet ya lejana.
Cuando la W3C, organismo que dicta las leyes sobre el desarrollo web, decide que un tag/atributo debería dejar de usarse, pasan automáticamente al estado «deprecated» (desaprovado), este estado indica que este elemento no debe ser usado y generalmente ofrece una alternativa a este elemento más apropiada para la nueva especificación.
En esta página he visto un listado de estos tags/atributos «deprecated» por la W3C y sus correspondientes alternativas.
FONT / BASEFONT
Debido al uso intensivo de desarrollo web mediante CSS, tags orientados al diseño están condenados al olvido y estos dos tags son una muestra de ello.
Ejemplo «deprecated»
<basefont face="Arial" size="+1" color="green">Some text</basefont>
Solución válida.
body { font-family: Arial, sans-serif; font-size: 10pt; color: green; }
CENTER / ALIGN
Al igual que el ejemplo anterior, los tags y atributos que aporten cualquier tipo de diseño sobre la estructura están siendo retirados para dejar a las propiedades CSS la función que antes hacían.
Ejemplo «deprecated»
<p align="center">Centered paragraph</p>
<center><img src="pic.gif"></center> Solución válida.
.center { text-align: center; }
<p class="center">Centered text</p>
U / S/ STRIKE
Estos tags indican una interacción con la apariencia del texto, por ello han pasado a mejor vida y han dejado que las propiedades de texto del CSS se adueñen del efecto.
Ejemplo «deprecated»
<u>Underlined text</u>
<s>Strikethrough text</s>
<strike>Strikethrough text</strike>
Solución válida.
.u { text-decoration: underline; }
.strike { text-decoration: line-through; }
<span class="u">Underlined text</span>
<span class="strike">Strikethrough text</span>
Pasa exactamente lo mismo con tags como <b />, <i />, <big />, <smal /> y <tt />.
BACKGROUND /BGCOLOR
Más de lo mismo para estos elementos, han pasado a mejor vida, gracias a Dios, por que recuerdo las horas tontas modificando todos los bgcolor de una tabla para cambiar el aspecto.
Ejemplo «deprecated»
<body background="graytile.gif" bgcolor="#ff0023" >
Solución válida.
body { background: gray url("graytile.gif"); }
BORDER
Otro atributo que no creo que echemos de menos en nuestras imagenes, cada vez está más integrado en nuestros CSS.
Ejemplo «deprecated»
<img src="image.gif" width="15" height="20" alt="image" border="1" />
Solución válida.
<img src="image.gif" width="15" height="20" alt="image" style="border: 1px solid black;">
TEXT/ LINK / VLINK / ALINK
Yo ya no recuerdo haber usado estos elementos en el diseño de páginas web, aunque sabía que existian.
Ejemplo «deprecated»
<body text="darkblue" link="green" vlink="black" alink="red">
<p>Some text in the document...<br>
<a href="something.com">this is link 1</a><br>
<a href="somethingelse.com">this is link 2</a><br>
<a href="google.com">this is link 3</a></p>
</body>
Solución válida.
body { color: darkblue; }
a:link { color: green; }
a:visited { color: black; }
a:active { color: red; }
HSPACE / VSPACE
Estos dos atributos que indicaban el espacio alrededor de los tags <img /> y <object /> han sido derrotados por el todopoderoso margin.
Ejemplo «deprecated»
<IMG SRC="pumpkin.gif" ALT="picture of a pumpkin" HEIGHT=100 WIDTH=100 VSPACE=50 ALIGN=LEFT>
Solución válida.
<img src="image.gif" width="15" height="20" alt="image" style="margin: 0 2px 2px 5px;">
LANGUAGE
Este atributo, deprecated debido a que semánticamente ofrece menos información que type pasa a la jubilación anticipada.
Ejemplo «deprecated»
<script language="JavaScript">
alert("Hello!");
</script>
Solución válida.
<script type="text/javascript">
alert("Hello!");
</script>
CLEAR
Este atributo que corregía los problemas causados por los elementos flotantes, renace como el Ave Fenix en forma de propiedad CSS.
Ejemplo «deprecated»
<br clear="all">
Solución válida.
.unfloat { clear: both; }
<img src="image.gif" style="float: left;">This text wraps...<br class="unfloat">
This text appears underneath the image...
WIDTH / HEIGHT
Para mi son los dos atributos con los que más he convivido, ideales para redimensionar imagenes, celdas y demás elementos, aunque increiblemente complicados de mantener, ahora gracias a su versión análoga en CSS podremos realizar cambios en el diseño con una sobrada facilidad.
Actualizo
Como bien apunta Eduo, este atributo aún quedará para los elementos <img />
Ejemplo «deprecated»
<td height="300" width="400" >...</table>
Solución válida.
td{ width:400px; height: 300px; }
TYPE (para listas)
Este atributo que nos permitía definir el tipo de lista que estabamos usando, se convierte en una versión más completa y mejorada como propiedad CSS.
Ejemplo «deprecated»
<ol type="i">
<li>first item (i)</li>
<li>second item (ii)</li>
<li>third item (iii)</li>
</ol>
Solución válida.
<ol style="list-style-type: lower-roman;">
<li>first item (i)</li>
<li>second item (ii)</li>
<li>third item (iii)</li>
</ol>
START / VALUE (para listas)
Dos atributos que indicaban por donde empezaban las listas <ol /> (START) y el valor de un elemento de la lista (VALUE).
Ejemplo «deprecated»
<ol start="0">
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li value="1">list item</li>
<li>list item</li>
</ol>
Solución válida.
ol { counter-reset: item; }
li { display: block; }
li:before { content: counter(item) ". "; counter-increment: item; }
COMPACT (para listas)
Este atributo indicaba el valor mínimo del tamaño de fuente, por lo tanto le ocurre igual que los tags anteriores.
Ejemplo «deprecated»
<DL COMPACT>
<DT>Internet Engineering Task Force
<DD>An organization which establishes technical standards for the Internet
<DT>e
<DD>Often used as a prefix to indicate the electronic version of something
<DT>spam
<DD>annoying email and news postings which waste time and bandwidth
</DL> Solución válida.
La W3C no dispone de una alternativa.
DIR / MENU
Por temas de semántica las listas de elementos se han quedado reducidas a simples listas, en las que podemos añadir más contenido mediante class o id.
Ejemplo «deprecated»
<dir><li>list element...</li></dir>
<menu><li>list element...</li></menu>
Solución válida.
<ul><li>list element 1</li></ul>
ISINDEX
No conocía este elemento, pero parece que creaba un control de entrada de texto en una línea… vamos, un <input /> de toda la vida 😀
Ejemplo «deprecated»
<ISINDEX prompt="Escriba la frase a buscar: ">Solución válida.
<FORM action="..." method="post">
<P>Entre la frase a buscar: <INPUT type="text"></P>
</FORM>NOSHADE / SIZE (para <hr />)
Todos los atributos de <hr /> han sido desaprovados, dejandolo solito frente al CSS.
Ejemplo «deprecated»
<hr size="10" noshade>
Solución válida.
<hr style="height: 10px; border-style: none; background-color: darkgray; color: darkgray;">
NOWRAP
Aplicado a los <td /> t <tr /> este atributo evitaba que el texto se descolocara dentro del elemento.
Ejemplo «deprecated»
<td nowrap>This is a very long piece of text that could stretch the table cell by quite a bit.</td>
Solución válida.
<td style="white-space: nowrap">This is a very long piece of text that could stretch the table cell by quite a bit.</td>
VERSION
Usando en el tag <html /> indicaba el número de versión que se usaba en la página, ahora el DOCTYPE hace la misma misión.
Ejemplo «deprecated»
<html version="2.0">
Solución válida.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
16 comentarios, 9 referencias
+
#