Claro que lo entiendo. Incluso un niño de cinco años podría entenderlo. ¡Que me traigan un niño de cinco años!

Atributos: “@import vs link”

Categorías: CSS y HTML, Estructura, General, Propiedades por GeL/T0 el 26 de marzo, 2007

Bueno, después de un tiempo de inactividad (creo que Loretahur está peor que yo, si es que esto de apuntarnos a tantas cosas…) volvemos con un post algo más “técnico” para intentar resolver una de las dudas que salieron al principo de este blog.

Y es que no hace mucho Loretahur escribió un post sobre las diversas formas de añadir los estilos a una página web, a partir del cual, entre los comentarios, volvió a resurgir el famoso debate entre @import y links.

Bueno, siempre que salga una duda de usabilidad o de dualidad entre varias opciones, lo mejor sería recurrir al gran oráculo. Los del w3c (no, google no siempre es el gran oráculo) y escuchándolos resulta que lo recomendable para linkar una página de estilos desde una página web es usar el links siempre frente el @import*.

Los del w3c han hablado, nosotros aceptamos.

Con lo cual, todo resuelto. Post acabado.

Lo que pasa es que, como somos buenos estudiantes, y no tenemos por que creer nunca a nadie a pies juntillas, al menos, hasta que nos de razones de peso, pues, ahora si, haciendo uso de google, buscamos las posibles ventajas/desventajas de ambos para comprender porque usar link frente a @import (la mayoría son meramente subjetivas, pero claro, dentro de la accesibilidad web, que no es subjetivo?).

* Ciertos navegadores no aceptan la sentencia @import: Es, por ejemplo el caso de cualquier versión del IExplorer anterior a 4.0. Aunque muchos diseñadores lo suelen utilizar para discriminar navegadores web antiguos, no es una técnica demasiado buena.
* @import, siempre debe ir al principio del código: Ya sea dentro de las etiquetas

o en una hoja externa, @import siempre debería ir al principio, lo cual fija bastante el código (aunque es cierto que solo debería ir dentro de los heads de la web ).
* En contra de lo que se comentaba en el post anterior, para lograr una mejor web semántica, es mejor el uso de link ya que aporta más información al navegador web que debe recibir la información y tratarla. Aparte de que para incluir @import en la página web, debes añadirla mediante las etiquetas

, añadiendo estilos dentro de la página web, algo no muy recomendable. Lo cual nos lleva al siguiente punto.
* Para incluir @import en una hoja, debes crear una sección

dentro del html. Lo cual hace añadir más código del que posiblemente sea necesario.
* @import está pensado para incluirse dentro de las hojas de estilo, su uso es poder enlazar hojas de estilo dentro de hojas de estilo. Para enlazar cualquier archivos externos dentro de html existe el link.
* Técnicamente, @import “embebe” el código enlazado dentro de la página web, sin embargo, mediante los navegadores tratan el código como externo sin introducirlo en la página. (Esto lo leí hace bastante tiempo, actualmente no se si seguirá siendo igual, o no)

Bueno, después de estas razones, creo que deberíamos aceptar las preferencias de la W3C sobre el uso de links. Aunque sin descartar el uso de @import!

* Y como he averiguado eso?? Donde lo han dicho?? Seguro que por algún lado encontraríais un artículo técnico al respecto, pero yo he sido más vago y si miráis el código de w3.org resulta que no hay ningún @import y si muchos

Entradas relacionadas:

  • No related posts

  • Puedes dejar un comentario, o un trackback. Comparte este post RSS 2.0

    6 comentarios en " Atributos: “@import vs link” "

    1. Rodrigo dice:

      Hola buscando las ventajas de usar @import, es que llegue a este sitio, ya que nunca use esta sentencia para incluir css, sino de la forma tradicional con link.

      Tengo un codigo de un compoente de un colega, que utiliza google maps, y analizandolo veo que usa esto

      @import url(“http://www.google.com/uds/css/gsearch.css”);
      @import url(“http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css”);

      Que buscando en la documentacion de google aparece como ejemplo.

      http://code.google.com/intl/es/apis/maps/documentation/javascript/v2/services.html

      Lo que no entiendo todabia que ventajas reales aporta usar @import y el porque google las usa asi.

      Saludos.

      12 de enero, 2011 a las 18:26

    2. Rodrigo dice:

      Aca les pongo el link directo, perdon.

      http://code.google.com/intl/es/apis/maps/documentation/javascript/v2/services.html#Local_Search

      12 de enero, 2011 a las 18:29

    3. Luis dice:

      No pretendo ser grosero, es sólo un consejo, pero escribir acerca de un lenguage (de computadora o humano) escribiendo mal el lenguaje materno se ve muy feo. Vamos hombre, al menos utiliza un corrector o diccionario si no sabes escribir correctamente.
      (Puedes borrar este mensaje, por supuesto.)

      Saludos.

      27 de septiembre, 2018 a las 16:40

    4. Luis dice:

      Era para Rodrigo por supuesto.

      27 de septiembre, 2018 a las 16:41

    5. link dice:

      Nice weblog here! Additionally your website quite a bit up fast!
      What host are you the use of? Can I get your associate link on your host?

      I want my web site loaded up as quickly as yours lol

      25 de junio, 2019 a las 3:28

    6. Frank dice:

      Estimado, lo que he podido entender después de leer varios foros y quisiera me confirmen si es correcto:
      – no de debe usar el import en el archivo html
      – en una hoja de estilo si se puede agregar y la idea es que se agreguen varias de estas hojas dentro de esta hoja principal para que cuando se haga la descarga desde el html solo descargue un archivo de estilo ya integrado y evitar varios descarga..

      18 de septiembre, 2019 a las 17:02

    Deja tu comentario

    Cerrar
    Enviar por e-mail