Blog

HTML

HTML (5)

¿Qué es HTTPS?

El protocolo seguro de transferencia de hipertexto (HTTPS) es un protocolo de comunicación de Internet que protege la integridad y la confidencialidad de los datos de los usuarios entre sus ordenadores y el sitio web. Dado que los usuarios esperan que su experiencia online sea segura y privada, te recomendamos que adoptes HTTPS para proteger sus conexiones con tu sitio web, independientemente de lo que este contenga.

Martes, 06 Febrero 2018 16:21

Redefinir el CSS del Carousel de la plantilla Helix3

Esrito por

El módulo por defecto de carousel, que viene con la plantilla Helix3 está mal adaptado para móviles. De hecho, el problema que tiene es que la fuente se ve muy grande, con lo que no cabe una descripción de dos líneas.

La solución consiste en redefinir el CSS del carousel, para que en los móviles la fuente se vea más pequeña. He aquí el código.

@media screen and (max-width: 480px) {   

.sppb-carousel-pro-text h2 {

    font-size: 23px;

    line-height: 30px;

    padding: 3px !important;

    text-align: center;}

.sppb-carousel-pro-text h3 {

   padding: 0px !important; margin: 5px !important; font-size: 15px;}

.sppb-item.sppb-item-has-bg .sppb-carousel-item-inner {padding: 10px 20px;}

#section-id-1490875236442 .sppb-col-md-12 {padding:0;}

.sppb-carousel-pro-text p {margin: 0;}

.sppb-carousel-inner > .sppb-item > img  {min-height: 250px;}

}

Martes, 06 Febrero 2018 10:52

Redefinir código CSS para dispositivos móviles

Esrito por

Dadas las reducidas dimensiones de los móviles, en ocasiones, lo que queremos es que la página web se presente en los móviles con otro aspecto diferente. Lo que tenemos que hacer es reconfigurar el código CSS, para que cuando detecte el dispositivo móvil, se utilicen dichos códigos. 

Por ejemplo:

En casos de dispositivos con ventana (la parte de la pantalla / papel donde se procesa el documento) con anchuras entre 400 y 700 píxeles las reglas CSS son las siguientes:

@media screen and (min-width: 400px) and (max-width: 700px) {   

body{  

background-color:#555;  

font-family: Times New Roman;  
}  
header h3{  
        text-align:center;  
 }   

Sábado, 27 Enero 2018 17:27

CSS para centrar un formulario

Esrito por

form {

    display: inline-block;

    text-align: center;

}

 

Viernes, 14 Octubre 2016 20:29

Trabajar con hreflang

Esrito por

Si estamos trabajando con una página web multilenguaje, esta etiqueta se convierte en uno de los factores más importantes a tener en cuenta, ya que tras su correcta implementación, conseguimos aportar información relevante a los robots que rastrean nuestro sitio, marcándoles con esta etiqueta los idiomas disponibles para el usuario.

 

Profundizando un poco más en el uso de esta etiqueta, debemos saber que podemos definir incluso el país o la región a la que está enfocada el idioma de nuestra página:

 

A continuación, mostramos algunos ejemplos de la etiqueta implementada en una URL, por ejemplo:

Cuando queremos definir el idioma de la página en inglés…

 

<link rel=”alternate” hreflang=”en” href=”http://www.midominio.com/en/”>

 

 Cuando queremos definir el idioma de la página en alemán…

 

<link rel=”alternate” hreflang=”de” href=”http://www.cneris.com /de/”>

 

 Cuando queremos definir el idioma de la página en italiano…

 

<link rel=”alternate” hreflang=”it” href=”http://www.cneris.com /it/”>

 

Puede darse también el caso que tengamos el mismo idioma pero distinta zona geográfica.

 

Por ejemplo, tener una versión española y colombiana. El idioma es el mismo, castellano, aunque hay detalles o matices que son totalmente diferentes, por lo que se recomienda definirlos en la propia etiqueta del país:

<link rel=”alternate” href=”http://cneris.com/catalogo/espana” hreflang=”es-es” />

 

<link rel=”alternate” href=”http://cneris.com/catalogo/colombia” hreflang=”es-co” />

 

<link rel=”alternate” href=”http://cneris.com/catalogo/mexico/” hreflang=”es-mx” />

 

Para los selectores de idioma que redireccionan automáticamente, también se puede añadir una anotación en la etiqueta: hreflang “x-default”

 

<link rel=”alternate” href=”http://cneris.com/es-ES” hreflang=”x-default” />

Sobre CNERIS

CNERIS es una empresa constituida por jóvenes emprendedores procedentes de diferentes sectores del mundo de la información. Nuestro equipo está compuesto por programadores, administradores de sistemas, administradores de base de datos, diseñadores gráficos, maquetadores,