91 809 57 18  |  618 085 373  |  Atención telefónica: L-V, 9 a 14h  |  Mantenimiento web
Adaptar web a móviles y tabletas: ¿Misión imposible?

Adaptar web a móviles y tabletas: ¿Misión imposible?

Adaptar tu página web a móviles, tabletas, smartphones, ipad, iphone, android, etc., es algo que puedes hacer si cuentas con un profesional en diseño y maquetación CSS3. A este tipo de diseño se le denomina responsive, aquí te dejamos otro artículo relacionado.

Muchas veces nos preguntan si es necesario tener dos versiones de la misma web, una para ordenadores y otra para dispositivos móviles. Si la web está bien realizada y diseñada no es necesario, el HTML de las páginas es el mismo y lo que varía son los estilos CSS, los cuales deben definir las conocidas media query para ajustar el layout de las páginas en función de la anchura del dispositivo. En definitiva: si tienes una web bien diseñada no necesitas dos versiones.

¿Puedo adaptar mi web actual a móviles y tabletas?

Si tu página está realizada en HTML, maquetada en capas y con posicionamiento relativo es muy posible que se pueda adaptar. Si por el contrario está realizada en Flash o maquetada con tablas en lugar de capas o con posicionamiento absoluto será bastante más difícil, consúltanos si necesitas una opinión técnica.

Si tu página esta medianamente bien hecha simplemente se le inyecta un archivo .CSS al final de la cabecera que reescribe las reglas de estilo actuales de la página, adaptándola a las diferentes anchuras de dispositivo.

En ocasiones hay que modificar la renderización del HTML para crear contenedores o adaptadores paternos y esto puede complicar el trabajo, sobre todo si la página genera contenido dinámico.

 

Genera tu tipografía de iconos para la creación de diseños web con Fontello

Genera tu tipografía de iconos para la creación de diseños web con Fontello

Hemos descubierto un estupendo recurso gratuito que te permite crear una tipografía de iconos personalizada. En esta web hay disponibles diferentes juegos de iconos gratuitos para que puedas seleccionar cualquier de ellos y además puedes subir tus propios iconos vectoriales para crear una tipografía completa.

Este es el enlace: Fontello

 

Cómo actualizar tu web para dispositivos móviles y tabletas: diseño responsive o adaptable

Cómo actualizar tu web para dispositivos móviles y tabletas: diseño responsive o adaptable

Si tienes una página web antigua necesitarás adaptarla a teléfonos móviles y tabletas si quieres que desde estos aparatos puedan visitar tu página. No se debe menospreciar este mercado de dispositivos porque actualmente un 66% de los visitantes web proceden de visitas realizadas desde teléfonos móviles, tabletas, televisores con conexión a Internet, etc.

Adaptar una página web a dispositivos móviles y tabletas no es demasiado complejo pero sí requiere de un diseñador web que tenga conocimientos en maquetación HTML5 y CSS3 para que sea capaz de crear un diseño responsive o adaptable.

Si nunca has oído hablar del diseño responsive te lo explicamos a continuación. Este tipo de diseño lo que hace es adaptar el contenido de la página a la anchura de la ventana de navegación de tal forma que el contenido nunca aparece recortado horizontalmente. El contenido se va distribuyendo hacia abajo de tal forma que sólo se utiliza el scroll vertical. Esto, que puede parecer una tontería, es muy importante porque los dispositivos permiten rotación y cambian la anchura de la ventana constantemente y si la página es adaptable el contenido se estirará y encojerá de forma flexible evitando tener que utilizar la barra de scroll horizontal.

Si por un casual tu página web está realizada en Flash entonces no podrás realizar una adaptación para teléfonos móviles y tabletas porque estos dispositivos no soportan la tecnología Flash y en ese caso lo que tendrás que hacer es crear una página web totalmente nueva, desde cero. Siempre puedes crear tu nueva página en base a la página actual intentando conservar texto e imágenes pero en ningún caso debes continuar con tu página Flash porque no se va visualizar en esos dispositivos puesto que se ha dejado de soportar esa tecnología. Por eso insistimos a nuestros clientes que tener una página Flash es como no estar en Internet hoy día.

Si estás pensando renovar tu página porque es antigua esta es la ocasión para pasarte a WordPress, la mejor herramienta para tener una página web viva, gestionable, con blog, de diseño responsive, orientada a SEO, con un catálogo enorme de diseños de plantilla para que puedas elegir el que mejor se adapte a tu actividad y lo mejor: más de 27.000 plugins gratuitos para ampliar las funcionalidades de tu web de forma casi infinita!

 

 

Hoja de resumen y demostraciones de propiedades CSS3

Hoja de resumen y demostraciones de propiedades CSS3

Esta es una interesante colección de ejemplos de algunas propiedades CSS3. Viene muy bien para no olvidar ninguna de ellas o aprender alguna característica poco conocida, como poner múltiples imágenes de fondo, colores HSLA, imágenes en bordes y otras más.

Lo bueno es que según la característica nos dice la compatibilidad con los navegadores que la soportan, aquí está el enlace.

Transiciones CSS3: Repertorio de ejemplos

Transiciones CSS3: Repertorio de ejemplos

Aquí dejamos un enlace de una página que tiene una interesante colección de ejemplos de transiciones CSS3. Para los que no lo sepan, las transiciones CSS3 son el futuro de las animaciones en las páginas web.

CSS3 nos permite crear animaciones de todo tipo: rotaciones, escalados, efectos de opacidad, desplazamientos, etc. y ahora mismo son soportadas por la gran mayoría de navegadores web modernos aunque hay que esperar un poco a que desaparezcan de escena reliquias como IE8 que impiden su implantación definitiva.

Actualmente algunas web optan por usar transiciones CSS3 pensando en navegadores modernos y pasan olímpicamente de los navegadores antiguos. En mi opinión y a día de hoy no es aconsejable para dar este paso, es importante pensar en navegadores obsoletos como IE8 que todavía tienen una cuota de mercado importante.

Muchas páginas crean sus animaciones usando Javascript como alternativa a CSS3 pero el consumo de recursos es mayor, lo ideal es CSS3 ya que las transformaciones y procesos se realizan sobre el hardware nativo, lo cual ofrece mayor rapidez, fluidez y menor consumo de memoria.

Aquí está el enlace.

 

Uso de cookies

Esta página web utiliza cookies de terceros, cuya finalidad es mejorar nuestros servicios mediante el análisis de sus hábitos de navegación. Si continua navegando, consideramos que acepta su uso. Si cambia de opinión puede cambiar la configuración sobre el uso de las mismas, y obtener más información sobre éstas aquí.

ACEPTAR
Aviso de cookies