25 8 / 2014

Fragmento en PDF del libro Typography Web Design de Laura Franz en el que se muestran visualmente las diferencias entre fuentes como Georgia, Helvetica, Times New Roman, Arial o Verdana, y las características que hacen a unas más legibles en pantalla que otras.

Typography Web Design en Amazon (tapa blanda)

Algunos fragmentos:

Reading text type (12–16 px) is easier if the font has:

  • A generous x-height
  • Open apertures
  • Prominent ascenders and descenders
  • Slightly loose letter spacing
  • Discernible terminals

Comparación visual entre Helvetica y Georgia.

Comparación de ascendentes entre Helvetica y Georgia

Comparación de aperturas entre Helvetica y Georgia

16 8 / 2014

CORS Proxy allows javascript code on your site to access resources on other domains that would normally be blocked due to the same-origin policy.

CORS Proxy is simply an HTTP Proxy that adds a header to responses saying “anyone can request this”

How do I use it?

$.get(
    'http://www.corsproxy.com/en.wikipedia.org/wiki/Http',
    function(response) { document.body.innerHTML = response; });

13 8 / 2014

aryacat:

The Itchy to my Scratchy.

9 de cada 10 gatos prefieren ratas de IKEA. 1 de cada 10 no las ha probado.

(vía hanselthecat)

09 8 / 2014

08 8 / 2014

08 8 / 2014

Imágenes de dispositivos (iPhone, iPad, MacBook, iMac, Nokia Lumia, etc.) hechas sólo con CSS y listas para utilizar en webs.

Use on…

  • Your website / splash screen

For…

  • Displaying photos
  • Displaying screenshots of your app(s)
  • Displaying reference works / illustrations
  • Displaying a content rotator / slideshow
  • Embedding a JavaScript app inside the device
  • Embedding a YouTube video

06 8 / 2014

On the other hand, too little contrast in stroke or distinction between letterforms, as in the case of Helvetica, can be unsuitable for long stretches of text because the letterforms appear too uniform, reducing legibility.

Fragmento de On Web Typography, de Jason Santa Maria.

02 8 / 2014

Thankfully Emmet makes it easier to write comments beneath closing tags by adding a tiny snippet to the end of an abbreviation. Typing: .container>ul>li*5>a|c expands to:

<div class="container">
    <ul>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>
<!-- /.container -->

So writing comments where elements close is as easy as writing |c.

20 7 / 2014

Totalmente de acuerdo. El efecto de cubrir imágenes con una capa semitransparente cuando se hace rollover sobre ellas es muy chulo… hasta que lo usas :/

04 7 / 2014