Etiqueta: Web Responsive Design

Para añadir en tu sitio ví­deos de Youtube que adaptan su tamaño automáticamente

Publicado el

por Juan Diego Polo

embedPublicar un ví­deo de Youtube en un sitio web (sea blog, portal, sitio corporativo o cualquier otro medio) es algo tan sencillo como copiar y pegar el código que se muestra en la parte «Compartir» existente en la sección inferior de cada uno. Podemos elegir el tamaño del mismo para que se adapte al diseño de nuestro sitio, pero… ¿qué pasa cuando nos consultan desde un móvil? ¿o desde un monitor gigante?.

webdesignerwall.com comenta una solución, solución que vimos más tarde en seetio.com. Se trata de una solución que podemos usar alterando la hoja de estilos (.css) de nuestro blog, algo tan sencillo como añadir las siguientes lineas: Continúa leyendo «Para añadir en tu sitio ví­deos de Youtube que adaptan su tamaño automáticamente»

Viewport Resizer – prueba el funcionamiento de cualquier web ante diferentes tamaños de pantalla

Publicado el

por Fco. José Hidalgo

Viewport Resizer es una herramienta que nos permitirá poner a prueba cualquier sitio web que queramos, sobre todo aquellos que disponga de un diseño web adaptativo, para comprobar cual será su reacción ante diferentes tamaños de pantalla.

Y lo hace mediante un bookmarklet, pudiendo optar por el bookmarklet estándar, el cual permite la comprobación de sitios web mediante tamaños de pantalla más habituales, o bien podemos crear un bookmarklet personalizado según nuestras necesidades, configurándolo con su propia herramienta.

Ya sólo tenemos que introducirlo en la barra de ví­nculos de nuestro navegador web y dirigirnos a cualquier web para ponerla a prueba según los tamaños de pantalla que queramos comprobar.

Enlace: Viewport Resizer | Ví­a: WebResourcesDepot

Responsivator – comprueba el desempeño de diseños de sitios web ante diferentes tamaños de pantalla

Publicado el

por Fco. José Hidalgo

Ya al menos tenemos dí­a de lo que es el diseño web adaptativo o responsive web design cuando oí­mos o leemos algo sobre esta cuestión, a tener en cuenta en estos tiempos en los que vivimos, para permitir que los diseños web puedan verse en óptimas condiciones tanto en navegadores de escritorio como en navegadores de dispositivos móviles.

Responsivator es una sencilla herramienta que nos permitirá poner a prueba precisamente estos sitios web, donde podemos comprobar como se adaptan sus diseños a diferentes tamaños de pantalla, teniendo una relación de las mismas por defecto que podemos modificar para introducir o eliminar tamaños si así­ lo necesitamos.

Podemos optar por poner a prueba URLs en concreto o bien jugar un rato con aquellas URLs que nos saque la propia aplicación de manera aleatoria, disponiendo además de enlaces que nos permite compartir los resultados allá donde queramos, facilitándonos la tarea a la hora de compartirlos en Twitter y en Facebook.

Se trata de una herramienta de código abierto que, en definitiva, nos permite testear los diseños de sitios web para diferentes tamaños de pantalla.

Enlace: Responsivator | Ví­a: WebResourcesDepot