Blog de François Becker

Aller au contenu | Aller au menu | Aller à la recherche

dimanche 5 janvier 2014

Nice personal websites

Some pretty personal websites.

http://www.nullpointer.co.uk

http://29a.ch

http://cedricvillani.org: minimalistic & clean

https://swiftcoder.wordpress.com

http://www.aladyinlondon.com

http://jenifferdake.net

jeudi 24 octobre 2013

3D HFR : mal à la tête pour la première fois

L'année dernière, j'étais allé voir pour la première fois un film en 3D HFR, c'est-à-dire que chaque œil reçoit des images à une fréquence double de la fréquence habituelle du cinéma, c'est-à-dire 48 images par seconde au lieu de 24.

J'ai peu apprécié les les premières scènes présentant des mouvements de caméra brusques, et des plans de durée extrêmement courtes. J'ai eu la sensation de voir le film en accéléré, comme on peut en avoir l'expérience dans les rayons TV des magasins devant des écrans "200Hz". Puis J'ai été un peu perturbé par la propreté des habits des acteurs, notamment lorsqu'ils rampaient contre la paroi des montagnes. A partir de la moitié du film, j'ai commencé à avoir mal à la tête, chose qui ne m'était encore jamais arrivée avec de précédents films en 3D.

Cet article de Gizmodo donne des éléments de compréhension des limites du procédé HFR.

jeudi 16 août 2012

HTML&CSS container of a maximized image

When developing a web gallery, it can be usefull to maximize the image to the screen, so that

  • the proportions are preserved
  • the whole image fits the screen.

Here is a method for that, in pure HTML & CSS.

<style>
#imagewell {
    position: absolute;
    top:0;left:0;bottom:0;right:0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
</style>
<div id="imagewell" style="background-image: url('http://upload.wikimedia.org/wikipedia/commons/thumb/0/0f/Grosser_Panda.JPG/300px-Grosser_Panda.JPG');">
</div>

samedi 19 mai 2012

CSS Tricks

Here are some CSS tricks I use.

Reset the style:

* { margin:0; padding:0; }
h1, h2, h3, h4, h5, h6 { line-height: 100%; margin: 0.15em 0 0 0; }
li { line-height: 133%; }
p { margin: 0.5em 0; }

Always have a scrollbar, at right-hand side (otherwise centered colums "move" when switching between pages which do or don't overflow the screen):

html {
        overflow: scrollbars-vertical;
        overflow: -moz-scrollbars-vertical;
        overflow: -webkit-scrollbars-vertical;
        overflow-y: scroll;
}

Style the quote tag <q></q>:

q:before { content: "« "; color:grey; }
q:after { content: " »"; color:grey; }

See also other quotation mark glyphs.

Other nice CSS tricks:

Resources:

  • http://youmightnotneedjs.com/

This page will be updated with more tricks in the future.

dimanche 23 octobre 2011

Ma boîte à outils pour le webdesign

A toutes fins utiles, voici des outils très pratiques pour les webmasters et les webdesigners :

Et quelques outils curieux/amusants :