Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: OssoH en 16 Abril 2014, 17:40 pm



Título: style content caracter estraño que representa una imagen
Publicado por: OssoH en 16 Abril 2014, 17:40 pm
Es algo que he encontrado en varias web y quisiera por curiosidad saber el motivo de porque hacerlo de esta forma y cómo hacerlo.

Por ejemplo : http://www.nethercottconstructions.com/es/modulos-prestashop/15-ajax-desplegables-categorias.html

Si entrais y accedeis por firebus a la imagen del carrito del boton de la derecha de compra. aparece este codigo :

Código:
.box-info-product .exclusive:before {
    border: 1px solid #06B2E6;
    border-radius: 5px 0 0 5px;
    bottom: 0;
    color: #FFFFFF;
    content: "";
    font-family: "FontAwesome";
    font-size: 25px;
    left: 0;
    line-height: 47px;
    position: absolute;
    text-align: center;
    text-shadow: 0 1px #015883;
    top: 0;
    width: 51px;
    z-index: 2;
}

El style content va acompañado de un simbolo raro que hace mostrar la imagen del carrito. ¿esto significa que el jpg de esa imagen no existe en la web? ¿como se logra esto? ¿esta técnica tiene algún nombre? ¿Que sentido tiene hacerlo de esta forma en vez de poner la url de la imagen? 

Gracias.
Un saludo.


Título: Re: style content caracter estraño que representa una imagen
Publicado por: #!drvy en 16 Abril 2014, 17:50 pm
Son fuentes.

http://fortawesome.github.io/Font-Awesome/
http://fortawesome.github.io/Font-Awesome/icons/

Tiene muchas ventajas. Ahorras recursos, lo pueden leer dispositivos que no procesan imágenes (lectores), es adaptable (responsive), no tienes que lidiar con las pantallas retina.. etc.

Saludos


Título: Re: style content caracter estraño que representa una imagen
Publicado por: OssoH en 16 Abril 2014, 17:59 pm
Muchas gracias por la aclaración.  ;-) ;-)

Entiendo que la parte negativa de usar este tipo es el hecho de cargar la fuente js y el tiempo de procesarlas.

Es como por ejemplo el hacer uso de fuente de google (u otros). Es más rápido la carga de la web el usar fuentes standars (por ejemplo arial) que usar fuentes comerciales.

Gracias.


Título: Re: style content caracter estraño que representa una imagen
Publicado por: #!drvy en 16 Abril 2014, 18:05 pm
Citar
Entiendo que la parte negativa de usar este tipo es el hecho de cargar la fuente js y el tiempo de procesarlas.

No hay ningún JS, solo los archivos de la fuente y el CSS.

Citar
Es como por ejemplo el hacer uso de fuente de google (u otros). Es más rápido la carga de la web el usar fuentes standars (por ejemplo arial) que usar fuentes comerciales.

Si pero el impacto es mínimo (hablamos de mili-segundos) y con un buen cache te sale mejor que hacerlo con imágenes.

Saludos


Título: Re: style content caracter estraño que representa una imagen
Publicado por: OssoH en 16 Abril 2014, 18:12 pm
Excelente.
Muchas gracias.

 ;-) ;-) ;-) ;-)