Archive | Herramientas RSS feed for this section

Frameworks & Boilerplates for Responsive Design

23 May

Web Designer Magazine trae en una entrega reciente un articulazo sobre responsive design que estaría mu feo de escanear y ponerlo aquí para que os lo bajarais…

Lo que no me cuesta na es apuntar aquí los cuatro enlaces que hay a algunos frameworks que en teoría facilitan la creación de contenido adaptable:

The Goldilocks Approach to Responsive Design

“(…) a responsive framework consisting of both CSS and JS files that tries to specifically step away from the responsive approach of designing for specific devices, and rather creates a fully flexible web design for each and every circumstance”

Skeleton

“(…) minimalistic (…) flexible layout and highly compatible design elements, making it ripe for customising. There are several pre-styled elements included – all you need is your unique design flair.”

Yamb (Yet Another Mobile Boilerplate)

“(…) fluid grid, drop-down menus and responsive slideshows”

Gridless

“(…) the most basic (…)a JS file that increases compatibility in older browsers(…)”

BONUS TRACK: RESPONSINATOR

Lo tienes que leer como cuando en la tele anuncian “RAASTREAAATOOOOR” XD que gilipollas que soy. Es una página de múltiples previsualizaciones de una url. Y es mu bonica. Pero lo único que hace es pintar iframes en las pantallas de los dispositivos, sin ninguna funcion más. Nada, que mejor tener los cacharros, los mil emuladores, los móviles de tus amigos, etc.

Web Designer Magazine Issue 195

Sobre la revista: es COJONUDA, y ahora además se puede comprar en Zinio. Pero como ocurre en muchos medios impresos aún, a veces tienen cada garrulada… como por ejemplo, ponerte url´s recortadas (bit.ly/batiburrillo) en un ARTÍCULO IMPRESO, es algo así como ¿estáis de coña o qué?

Mira que cacho de post mas chulo me ha quedao. Se nota que hoy el peque está con sus abuelos… y tengo TIEEEEMPOOOOOOOOOO

20 Useful CSS Tools You’ll Need – Azhar Kamar

16 May

Viejos amigos y nuevos conocidos… peacho tools; Y bonita web, azar… zaka… bueno; la del enlace.

20 Useful CSS Tools You’ll Need – Azhar Kamar.

Adobe Shadow | preview mobile web – Adobe Labs

14 May

Adobe Shadow | preview mobile web – Adobe Labs.

SVG Stacks | simurai (Sprites)

5 Abr

Una interesantísima técnica para usar sprites sin tener que calcular coordenadas a saco…

Habrá que probarla.

SVG Stacks | simurai.

Homebrew — MacPorts driving you to drink? Try Homebrew!

22 Feb

Homebrew — MacPorts driving you to drink? Try Homebrew!.

The data: URI kitchen

14 Dic

Conversor de HTML a data URI

(O almacenar contenido HTML dentro de una URL para acceso offline)

http://es.wikipedia.org/wiki/Data:_URL

“Desventajas:

[…]

* La capacidad máxima del navegador en la longitud del URI limita el tamaño máximo de los datos. Por ejemplo, los URIs en Opera suelen tener un límite de 4KB.”

The data: URI kitchen.

Otro: http://www.scalora.org/projects/uriencoder/

Online Image to Base64 Converter – Convert Image to Base64 String and Base64 String to Image – Daily Coding – daily coding tips and tricks, C#, .NET, ASP.NET, SQL, Online Converter, Image to String, String to Image, Image to Base64, Base64 to Image, Image to byte[], byte[] to Image

6 Dic

El mejor y más simple conversor de imágenes a código base64. No hay que olvidar que en la cabecera hay que poner aquello de (ejemplo css):

background:url(data:image/png;base64,TODOELCODIGODELAIMAGEN)

o ejemplo :
src=”data:image/png;base64,TODOELCODIGODELAIMAGEN”

Online Image to Base64 Converter – Convert Image to Base64 String and Base64 String to Image – Daily Coding – daily coding tips and tricks, C#, .NET, ASP.NET, SQL, Online Converter, Image to String, String to Image, Image to Base64, Base64 to Image, Image to byte[], byte[] to Image.

lessphp – leaner css in php

4 Nov

lessphp – leaner css in php.

Aún no he podido probarlo, minimiza y optimiza (agrupando clases) tu css.

Hay un ejemplo puesto…

How to Control Your CSS3 Animations | #you{CSS3:Animator;}

4 Nov

How to Control Your CSS3 Animations | #you{CSS3:Animator;}.

Detect rotation of Android phone in the browser with javascript – Stack Overflow

13 May

Detect rotation of Android phone in the browser with javascript – Stack Overflow.