baby-epic-win.jpg
Voici un autre lien qui dénonce les concepts et moteurs à mouvements perpétuels : Les moteurs à énergie infinie et/ou énergie libre et/ou mouvement perpétuel, c’est vraiment n’importe quoi !

\o/

Pour mémoire, les articles où je dénonce ce genre de conneries sont là :

Faire un thème mobile en CSS/HTML qui n’utilise ni sous-domaine (m. ou mobile.) ni détection de navigateur est très avantageux : plus simple à maintenir, moins lourd pour vos visiteurs, et techniquement plus fiable (pas de détection foireuse des navigateurs).
L’idée est de cibler des styles CSS en fonction de la taille de l’écran. Ainsi, un petit écran aura du CSS différent d’un grand écran (permettant par exemple de réduire les marges et les espaces de blancs quand l’espace manque sur les petits écrans.

Ce mini tutoriel vous donnera les bases pour faire un design utilisant le responsive design, et quelques astuces que je donne en complément :


Le responsive design en quelques mots


Le responsive desing (ou media query) ce sont des techniques HTML/CSS pour adapter le desing de votre site web à la taille de l’écran ou celui du navigateur. C’est très pratique à l’heure où votre site peut être vu sur un écran à très grande définition, un écran normal ou un petit écran comme les smartphones ou les tablettes.
Essayez de redimensionner la fenêtre du navigateur sur cette page : il y a pas moins de 4 adaptations au thème :

  • pour les écrans de plus de 1800 px de large
  • pour les écrans de plus de 1300 px de large
  • pour les écrans dont la taille est comprise entre 800 px et 1000px
  • pour les écrans dont la taille est inférieure à 799px
(les écrans dont la taille est comprise entre 1000 et 1300 px utilisent le thème par défaut, sans modifications)

La beauté du truc, c’est par exemple ça : le thème change quand la tablette ou le smartphone est en mode portrait ou en mode paysage, ce qui peut être utile sur les écrans allongés (comme le dernier iPhone par exemple) :

debout-couche.png

Le responsive design en pratique


Pour en arriver là, voici la marche à suivre :

Dans le HTML, ajoutez ceci dans le <head> :
<meta name="viewport" content="width=device-width, user-scalable=yes" />

Dans le CSS, créez des sections pour chaque domaine de largeur d’écran que vous souhaitez personnaliser :

@media (max-width: 1000px) {
    /* votre code ici, pour les écrans de taille <1000px */
}

@media (max-width: 800px) {
    /* votre code ici */
}

@media (max-width: 400px) {
    /* votre code ici */
}

Notez qu’avec cette technique, un écran de 650 px de largeur verra s’appliquer le code pour les écrans plus petit que 1000 px et celui pour les écrans plus petits que 800 px. Par ailleurs, le code pour les écrans <800 px sera appliqué en priorité par rapport à celui des écrans <1000 px à cause de l’ordre de déclaration des CSS, ce sont donc des applications de CSS en cascade. Il faut en tenir compte !

Pour cibler directement une catégorie, et uniquement celle-là, on peut faire ainsi (et je le recommande car c’est moins casse gueule, même si ça augmente un peu la quantité de code) :

@media (min-width: 800) and (max-width: 999px) {
    /* votre code ici, pour les écrans de taille comprise entre 800 et 999 px */
}

@media (min-width: 1000) and (max-width: 1299px) {
    /* votre code ici, pour les écrans de taille comprise entre 1000 et 1299 px */
}

Attention à bien faire une section de 800 à 999 pixels et non pas de 800 à 1000 pixels ! Autrement pour un écran (ou une fenêtre de navigateur) de largeur 1000 px, deux sections seront appliquées !

Pour compléter le tout, je balaye tout le domaine de largeur : les tous petits écrans, puis deux domaines, puis les très grands écrans :

@media (max-width: 799px) {
    /* votre code ici, pour les écrans de taille < 799 px */
}

@media (min-width: 800px) and (max-width: 999px) {
    /* votre code ici, pour les écrans de taille comprise entre 700 et 999 px */
}

@media (min-width: 1000px) and (max-width: 1299px) {
    /* votre code ici, pour les écrans de taille comprise entre 1000 et 1299 px */
}

@media (min-width: 1300px) {
    /* votre code ici, pour les écrans de taille supérieure à 1300 px */
}

Les ajustements de positionnement : libérez de la place !


En général, un thème pour une page web se compose d’un en-tête, d’un corps comprenant une barre latérale et une partie principale, et d’un pied de page :

general-page-layout.png
L’en-tête peut parfois comprendre un menu avec divers liens, comme c’est le cas sur mon site (qui comprend même un menu déroulant assez conséquent).

Le but du responsive design consiste surtout à réarranger les différents éléments de façon à ce que le rendu sur petits écrans reste lisible (surtout concernant la largeur limitée sur ces écrans).
On fera donc ce genre de choses :

  • Placement de la barre latérale ailleurs (souvent en ligne, au dessus ou au dessous de la partie centrale)
  • Réduction des marges (margin, padding) à gauche et à droite
  • Remplacement des largeurs fixes par des largeurs relatives (100%, ou 98% avec une marge de 1% pour centrer le tout sans coller sur les côtés)
  • Pour les images : ne pas utiliser de largeurs et hauteurs en pixels (pouvant dépasser de leur cadre) mais utiliser ceci :
    width: 100%; height: auto;
    Avec ça, les images occuperont la largeur complète et la hauteur sera adaptée de façon à conserver les proportions.
  • Les menus déroulants seront déroulés, ou supprimés (comme c’est le cas chez moi). En effet : un effet de survol (:hover) n’est pas utilisable sur un écran tactile.

Les ajustements de décor


Maintenant que les éléments sont positionnés de façon à ce que le contenu utile (les articles) occupe toute la largeur et que le contenu secondaire (barre latérale et menu) est placé au dessus, en dessous voire complètement supprimé, on peut modifier les styles de décoration (je sais pas si ça s’appelle ainsi (color, background…) , mais c’est par contraste avec les styles de positionnement (margin, padding, width, position, display)).
On effectuera par exemple ce genre de modifications :

  • Adaptation de la taille de police. Vu qu’on a spécifié dans le HTML que le contenu peut être zoomé (voir au début du tuto) :
    user-scalable=yes
    il n’est en général pas nécessaire d’adapter la taille de police pour chaque type d’écran : les navigateurs mobiles ont des règles et des styles qui suffisent en théorie à faire un rendu lisible de la page. Quoi qu’il en soit, NE METTEZ JAMAIS LE user-scalable À no. C’est un crime envers vos lecteurs.
  • Réduisez aussi la taille de police des titres. Inutile de les faire quatre fois plus gros que le texte : sur un mobile, assurez-vous que le contenu soit lisible avant de faire dans le tape à l’œil.
  • Augmenter la hauteur des lignes (line-height) : c’est bon pour la lisibilité quand c’est aéré. Quand on est dans le bus sur son téléphone, ça secoue et bouge. On a rapidement fait de perdre l’endroit où on était en train de lire. Augmenter la taille des lignes permet d’aérer.
  • Adaptez la taille de police dans les formulaires ! Les formulaires sont des éléments de la page qui sont le plus souvent zoomés de façon automatique par les navigateurs. C’est très difficile (j’en conviens) de faire quelque chose de bien (surtout que tous les navigateurs ne s’accordent pas là dessus), mais il faut réussir à faire quelque chose quand même.
  • Concernant les formulaires : utilisez les attributs du HTML5 type="email" ou type="url" : cela adaptera le type de clavier que l’écran tactile affichera : si c’est une adresse email, les boutons « @ » ou « .com » seront mis sur le clavier principal : input-de-type-email.png C’est une chose simple, mais qui est très utile et vos visiteurs vous en remercieront.
  • Sur les liens et dans les menus, n’hésitez pas à faire de gros boutons et des liens visibles (soulignés et en couleur) : c’est beaucoup plus pratique sur une interface tactile

Concernant les font de pages : il y a soit les fond qui se répètent (motifs) et dans ce cas il n’y a rien à faire ; soit les images qui contiennent elle même de l’information (certains utilisent une entête avec le logo dans dans le fond).
Dans ce dernier cas, il faut que l’image reste visible : il est possible de faire en sorte que l’image conserve soit toujours visible (mais probablement distordue) avec ce code :
background-size: 100% 100%;

Avec les media-queries, n’hésitez pas à modifier le bloc (par exemple de header) en hauteur : comme j’ai dit, si sa largeur baisse, le ratio est perdu et l’image est déformée. Baisser sa hauteur (même de façon non 100% flexible) permet de conserver un ratio lisible.

Quelques conseils


N’hésitez pas à utiliser le HTML5 et CSS3 : si on doit attendre que ça soit terminé à 100%, on y viendra jamais, tout simplement car le web n’est jamais fini et le HTML non plus.
Les outils sont là pour adapter votre site au plus grand nombre, dont aux utilisateurs de tablettes : apprenez à les maîtriser, puis utilisez-les !

Si vos pages sont lourdes (beaucoup de scripts ou styles gourmands en ressources) : modérez-les, car les téléphones sont limités en puissance de calcul (quoi que, maintenant certains smartphones sont plus rapide que mon ordinateur) et surtout en bande passante (la 3G en data coûte cher) et je compte pas la couverture réseau : si votre plus grand visiteur se trouve dans une zone mal couverte en 3G, il sera déçu si votre page met cinq heures à s’afficher.

Faites également attention avec les pseudo-effets de style : tout ce qui est hover, active ou focus (en CSS ou en JS) fonctionne encore de façon assez aléatoire sur un écran tactile. Tenez-en compte…

Un dernier truc : si votre page est longue, ajoutez un bouton « retour en haut » en bas de votre page ! J’en ai pas encore mis moi et c’est mal, je sais…


EDIT : voilà une infographie géante avec 10 astuces : http://www.splio.fr/responsive/ (image locale)

(mis à jour le 2013-07-13)

Depuis plusieurs semaines, je reçois quelques remarques sur la compatibilité pourrie de ce site avec les vieux navigateurs (on m’a parlé de IE7 (!), Firefox 3.6 (!) et Opera > 10.x sur Windows Phone).

Déjà : sous Firefox 3.6 ça devrait être remis en ordre, idem pour Opera >9.x (sur PC) : ça ne venait pas du CSS mais du HTML5.
Les balises <header>, <section>, <article> etc. ne sont pas reconnues par Firefox 3.6 et il les interprète n’importe comment.
La solution est triviale : ajouter un « display:block » à ces éléments, et tout rentre dans l’ordre.

Mon site est de nouveau navigable sur les vieux Firefox et les vieux Opera :

Avant : avant.png
Après : apres.png
Concernant IE, c’est définitivement non : ce navigateur n’utilise pas les mêmes standard que mon site et les autres navigateurs (qui utilisent du HTML/CSS), il est donc normal que ça ne marche pas.

Pour les navigateurs sur Windows Phone, je n’ai pas de quoi vérifier (pas de Windows Phone), désolé…

Enfin, je me permet de râler contre les vieilles versions de logiciels : n’utilisez pas les vieilles versions de navigateur ! Je sais que certains sont à l’école ou au travail où les responsables du service informatique n’ont pas toujours de temps de mettre à jour tous les logiciels, mais dans ce cas je ne saurais trop vous conseiller d’utiliser une clé USB avec un navigateur portable dessus : Firefox Portable ou Opera Portable par exemple. En prime vos marques pages, votre historique et vos extensions seront toujours là.
Le lancement des programmes depuis une clé USB est lui aussi interdit ? Utilisez le navigateur portable depuis le disque dur, ça marche aussi.

Bref, aucune excuse selon moi pour utiliser de vieilles versions de navigateurs et c’est aussi pour ça que je n’en fait pas plus que ça de moi même pour rendre mon site web compatible.
C’est aussi pour vous pousser à mettre à jour vos logiciels, c’est important.

crazy-cat.jpg Bientôt le week-end ? Pas encore, mais presque !

Enfin, moi je rentre tout juste et j’ai l’impression qu’une vague de liens insolites déferle sur mes flux RSS, en voici quelques-uns…

Installer son bureau (avec PC, fax, imprimante et le bureau) dans sa voiture, c’est visiblement possible aussi…
Aux USA, tout est possible. Même cuisiner sa femme…
Une LAN avec 10 000 participants. Woaw.
la première amende Hadopi (ah? c’est pas cet homme de 39 ans, finalement ?) remise en fanfare à un étudiant de 22 ans au QG du ministère de la Culture, ça n’a aucun sens… (ok, il semble que ce soit un Fake… J’ai été PWNED…
– après l’idée de la taxe-Google pour les chauffeurs d’autocars, voici l’idée de la taxe internet pour les bouchers.

Bref, ce monde est fou, vous êtes fous, je suis fou. Youpi \o/.

image de Bibi

parthenon.jpg Après mon coup de gueule contre la mascarade des élections pour le président de la république, considérant que ce genre de vote était tout sauf démocratique ; un lecteur, Matthieu, me suggère le livre « Manifeste pour la vraie Démocratie » d’André Tolmère.

Je vous le partage ici aussi (en PDF) : 2012 Manifeste pour la vraie démocratie
Ce livre considère les points suivants comme la manifestation de l’échec du modèle actuel :
– le modèle actuel n’est tout simplement pas une démocratie, mais une république. La différence est de taille ;
– un système gouverné par des « élus professionnels » (payés pour faire le pitre dans un hémicycle, quand ce n’est pas ne rien foutre du tout) ;
– la corruption mise en place au fil des ans par les dits élus professionnels (facile quand on a un ou plusieurs mandat de plusieurs années chacun) ;
– le désintérêt du peuple pour le politique ;
– la distance humaine/sociale entre ceux qui font les lois et ceux qui la subissent. Oui, j’ai bien dit « subissent ».

L’idée proposée dans le livre est simple : c’est un tirage au sort des élus parmi le peuple. J’étais pour cette idée avant de lire le livre, mais j’y voyais quand même quelques problèmes. La solution dans son ensemble expliquée dans le livre répond à mes interrogations, et il y a des façons de corriger tous ces problèmes.


« Si nous voulons transformer la société d’une façon profonde et décisive, la rendre plus juste et plus humaine, ce ne peut être que par un changement radical de référentiel, le référentiel déterminant étant le référentiel politique. Le talon d’Achille du système consiste en ses règles du jeu politique, condensées sur le point focal des quelques lignes de la sacrosainte « constitution ». Il est possible de court-circuiter le système avec de nouvelles règles du jeu, telles que je les ai définies, faciles et simples à mettre en œuvre à la seule initiative des citoyens. »

Je vous laisse lire (et pas de TL;DR hein), et merci Matthieu pour le partage !

image de JoshHunter

Ça y est, on voit les produits informatiques (disques durs, clés USB, souris…) dont l’emballage affiche fièrement un logo « compatible avec Windows 8 » :

windows 8 compatible logo
Je sais, on avait déjà les étiquettes lors de la sortie de Windows 7, Vista et tous les autres… Mais à chaque fois je pense la même chose quand je vois ça : c’est du n’importe quoi.

N’importe quelle clé USB, disque dur, souris, etc. du commerce est compatible avec Windows, Linux, Mac OS-X. Mettre uniquement « Windows » sur les emballages est trompeur pour le client : les logos « Linux Compatibles » existent mais sont très rares.
Pour le client, une souris affichée comme compatible avec Windows 8 signifie : Windows 8 = cool ; la souris en question = cool ; tout le reste = merde.

Je sais que les fabricants veulent afficher qu’ils sont compatibles avec le système d’exploitation dominant le marché à plus de 88%, mais c’est nous prendre un peu pour des cons quand même : y’a pas juste Windows sur le marché, alors autant mettre OS-X, Linux, BSD et tous les systèmes d’exploitation.

L’essence des stations Total n’est pas affichée comme « Renault/Peugeot Compatible » que je sache ? On trouve pas non plus de assiettes « compatibles avec toutes les fourchettes et couteaux* » ?

* : sauf les assiettes Apple à 29,99 € compatibles uniquement avec la iTable 3.6 à 399,99 € et la iFourchette 5S à 9,99€

okay-guy.png Après Nikopik et les auteurs de Ma via au boulot qui nous font rire avec les mots-clés de leur site, j’ai moi aussi jeté un œil dans les statistiques.

Évidemment, je n’ai pas de Google Analytics et encore moins de système d’analyse de requêtes dans Blogotext (moteur de blog de ce site), alors je regarde dans les outils de Google Webmaster Tools : on y trouve les requêtes Google qui ont permis de tomber sur mon site.

Bref, voilà ce que j’ai comme Top 20, uniquement pour Google et pour le mois de novembre (entre parenthèses, la page concernée si nécessaire) :
  • le hollandais volant
  • timo
  • hollandais volant
  • systeme binaire (page)
  • système binaire (page)
  • image 3d sans lunette (page)
  • comment fonctionne un ordinateur (page)
  • supprimer grub (page)
  • timo hollandais volant
  • blogotext
  • systeme binaire cours (page)
  • desinstaller ubuntu (page)
  • supprimer ubuntu (page)
  • dual boot ubuntu windows 7 (page)
  • flux rss twitter (page)
  • mot de passe windows xp (page)
  • ftp windows (page)
  • dual boot linux windows 7 (page)
  • torrific (page)
  • ftp windows intégré (page)

Autrement dit : rien de particulier pour mon site : ces recherches sont logiques.

Heu… Comme je sens venir les tomates, il y a quand même quelques requêtes étranges mais il faut les chercher et c’est pas facile — mes commentaires entre parenthèses :

  • point de croix pedobear (o_O)
  • mr bean fuck (ah, peut-être ça ?)
  • genius qui fume (oulà… l’auteur de la requête sûrement)
  • symbole maya minecraft (ah, c’est pas sur ce blog qu’il faut voir, mais ici ;-) :P
  • expertise psychiatrique unilatéralement (kamoulox !!)
  • c est la merde tumblr (Nan, ça va je trouve. Y’a pire.)


Voilà, donc. Ces résultats m’ont beaucoup surpris, au vu des statistiques sur Nikopik et les divers autres sites/blogs qui publient comme ça leurs mots-clés de temps à autres : il y a vraiment très peu de requêtes étranges et déplacées. Comment se fesse ?

f16.jpg Comme d’hab, quelques chiffres sortis de calculs plus ou moins hypothétiques mais toujours surprenants !

7 000 km². Le premier chiffre est une surface : c’est la surface qui contiendrait la population humaine mondiale si l’on donnait 1 m² à chaque personne.
Cette surface, c’est un peu plus qu’un département français moyen.


5 nanosecondes. C’est la durée supplémentaire perçue si on passe cinq heures dans un avion volant à 800 km/h. La relativité dit que le temps ne s’écoule pas de la même façon selon la vitesse à laquelle on se déplace.
Cela ne veut pas dire qu’on sera 5 ns dans le futur ; cela dit simplement que 5 h dans l’avion seront perçues 5 ns plus longues pour les voyageurs au sol.


1 400 kg/m³. C’est la masse volumique moyenne du Soleil. Sa densité est donc de 1,4. En gros, le Soleil est moitié moins dense que l’aluminium, six fois moins que l’acier et quatorze fois moins que l’or.
On pourrait croire que l’attraction gravitationnelle de la masse du Soleil sur elle même est plus importante que ça, mais finalement non : les fusions nucléaires entrainent une expansion compensant l’effondrement par une libération de rayonnements.
(Notons qu’en son cœur, la masse volumique du soleil est tout de même de 150 tonnes/m³.)


Enfin, je vous propose une petite question : dans un liquide, les molécules et atomes se touchent pratiquement. Ils sont donc distants d’environ 1 rayon atomique (logique). Maintenant, de combien de fois cette distance est-elle supérieure dans un gaz (l’air ambiant par exemple) ? autant ? 10 fois ? 100 fois ? 1000 fois ? plus ?
Aucun piège, mais la réponse est intéressante à voir (et à trouver, car ça se démontre en deux lignes).

Les autres épisodes sont là :
Épisode 1
Épisode 2
Épisode 3

image de Official US Air Force

school-bus.jpg Ayé, après que les majors ont obtenu des taxes pour droits d’auteur sur les GPS et les autoradios, voilà que les transports en communs demandent des taxes sur Google.

Non mais sérieusement, c’est quoi le délire ? On m’explique le rapport ?

Google a réussi à faire un site qui donne aux utilisateurs les réponses à leurs recherches. C’est quand même pas leur faute s’ils gagnent de l’argent parce que les utilisateurs sont satisfaits ?

Y’en a marre de ces tas de cons qui ne pensent qu’aux taxes débiles sur Google au lieu d’innover eux-mêmes, c’est un peu trop facile de demander des taxes à outrance comme ça, je trouve.

Oh, et loin de moi l’idée de défendre Google, hein, mais parfois faut arrêter de fumer de la moquette.

(via OWNI)

image de Matt Carman

polution.jpg Tiens, et si on faisait un peu de sciences sur les publicités pour les voitures ?

Actuellement, les publicités pour bagnoles vantent les faibles rejets en dioxyde de carbone (CO2) par kilomètre.

Analysons un peu tout ça.

Un peu de recherche me permet de trouver qu’une voiture moyenne en France émet autour de 125 grammes de CO2 par kilomètre. (sources pour 2011).

À quoi correspond ce chiffre ? Vu comme ça : à presque rien, sa seule utilité est de permettre d’aller narguer votre voisin et de lui dire sa voiture est responsable du réchauffement climatique alors que la vôtre, non.

En réalité, 125 g de CO2 ça correspond à 75 litres de gaz, soit une bonne poubelle remplie. Et je ne tiens compte que du CO2 sinon il faudrait au moins doubler ce volume, ni de le température à laquelle ils sortent sinon il faudrait doubler ce volume encore une fois de plus.
Et ce volume de gaz est émis tous les kilomètres.

Ça parle plus là ?

Donc, ouais, 125 g de CO2 au kilomètre c’est juste énorme.

image de Captain Kimo

science-cat Quand j'étais petit, disons à l'âge d'aller à l'école primaire / collège, j'aimais beaucoup regarder des émissions TV comme C'est Pas Sorcier : apprendre, découvrir : j'adore ça.
Jamais je ne manquais les émissions de ce genre…

Aujourd'hui, je ne regarde plus la télé. Et pour cause : il y a quoi d'intéressant, de scientifique ou de culturel ? Rien.

Tout est remplacé par les jeux TV pour gagner du fric, la télé-realité (rien que ce mot en dit long), des séries US (mêmes pas en VO, merde) et des JT faits à l'arrache (putin : Pujadas « avec la crise, la France et l'Allemagne n'ont jamais été aussi opposés ». Mon dieu. Chazal : « un 11/11/11, ça n'arrive pratiquement qu'une fois par siècle » : il y a un mot en trop dans la phrase, non ?)
Je me demande si la seule information valable ne serait pas les guignols de l'info ou le Groland…

J'ai fait ci-dessous une petite liste des émissions de « science » ou de découverte que je suivais quand j'étais petit :

Le Bus Magique
On commence en douceur avec ce dessin animé : le bus magique, ça devait bien être dans les années 1997 que je regardais ça : un bus qui pouvait se rétrécir et se transformer et ainsi explorer par exemple l'intérieur du corps humain, une ruche d'abeille, les océans ou l'espace… C'était vraiment un truc pour découvrir en s'amusant pour les enfants.
Après, ce genre de chose a été remplacé par des dessins animés avec des morales et leçons de vie puis par des trucs sans fond ni fun à la "wesh wesh" (Totaly Spies, Foot2rue, Titeuf, Jimmy Neutron…).
Dommage que ce genre d'émission soit passé définitivement à la trappe…

Celestin
Un autre dessin animé : un petit fantôme veille sur des enfants dans des situations de danger et leurs explique les règles élémentaires : comment traverser la rue correctement, faire attention aux produits dangereux, etc. Ce sont d'avantage des leçons d'éducation civique, mais à mon avis ça ne serais pas plus mal qu'ils fassent des rediffusions massives de ce genre de choses.

Va Savoir
Une émission un peu du genre « Ushuaïa Nature », mais orientée road trip avec découverte des autres contrées de part le monde. Animé par Gérard Klein. Je regardais ça avec mon père les samedis soirs, je me souviens…

C'est Pas Sorcier
Mon émission préféré de tous les temps. J'ai regardé ça de l'école primaire au lycée, après quoi les diffusions quotidiennes ont progressivement cessées pour ne passer qu'une fois par semaine.
Si vous ne savez pas ce qu'est cette émission, les présentateurs Jamy et Fred expliquent tout ce qu'ils faut savoir sur un sujet : ça va des volcans à la tour Eiffel, en passant par le cuivre, mais aussi les orages, la lune, l'écriture, la guerre froide, les orgues, les rapaces, le téléphone, le cerveau ou les indiens. Plusieurs centaines d'épisodes existent. C'est tout simplement grandiose.
J'ai toujours été incollable en sciences au collège grâce à cette émission, et si je suis encore dans le domaine de la science actuellement, c'est sûrement grâce à eux.

Rayons X
L'émission qui passait le samedi soir sur la 2, animé par les frères Bogdanoff, et vulgarisant beaucoup des sujets plus poussés que dans C'est Pas Sorcier. Je me souviens d'un épisode sur la vitesse de la lumière et d'un autre épisode qui traitait des serveurs DNS racine, nommés les « gardiens du web ».



C'est à peu près tout…
Ah, non, il y a 3 ans, une émission avec Jamy est apparue sur France 2 : Incroyables Expériences. Ça se passe sur un plateau TV et les explications de Jamy sont faits directement devant le public. Pas mal non plus même si ce n'est pas aussi instructif et ça ne doit passer qu'une ou deux fois par an seulement.

Voilà. Je ne sais pas trop où en sont ces émissions, même si la plupart ont totalement disparus. C'est Pas Sorcier est encore un peu d'actualité, j'espère qu'ils continueront à le diffuser encore longtemps (certaines émissions datent par contre un peu, comme ceux sur l'internet de 1996).
Aujourd'hui, la télé ne sert plus à découvrir et à apprendre (je veux dire plus du tout). C'est un peu navrant. On ne nous sert que de la télé-réalité et des séries en VF matin et soir destinée à nous occuper et qu'on soit bien sages, sûrement.
Il reste Arte qui diffuse parfois quelques bon documentaires, sur des sujets parfois controversés ou tabou, mais c'est bien tout… Tout ce qui reste c'est Internet où il est encore possible à des gens de partager ce qu'ils ont à dire et à ceux qui veulent, de l'écouter et de réagir…

La seule science que je vois encore à la TV, c'est dans The Big Bang Theory : une série US sur des geeks en physique, parfois on peut y apercevoir des équations réelles et vraies (j'ai par exemple pu remarquer l'équation de d'Alembert de propagation des ondes électromagnétiques ou celui sur les circuits RLC, mais il y en a plein d'autres).

image de Chris Tengi

magnetic-field.jpg
L’énergie gratuite, libre, sortie de nulle part et le mouvement perpétuel n’existent pas.

Toutes les vidéos — sans aucune exception — expliquant comment faire ce genre de choses, sont du bullshit total ; un amas de merde pseudo-scientifique ; un ramassis de conneries ; des fakes archi-évidents, le tout raconté par des personnes qui savent très bien qu’elles mentent et qu’elles prennent les gens pour des cons.

Voilà, tout est dit.

image de Oskay

binary.jpg Je reviens sur (et corrige) mes deux notes ici et .

Dans PHP, avec PDO pour les bases de données SQL avec les requêtes préparées, on utilise par exemple cette syntaxe :

$req = $dbh->prepare("SELECT * FROM table WHERE col=? AND col2=? AND col3=?");
$req-> execute(array($col1, $col2, $col3));

Sachez que la taille du tableau array() que l’on place dans le execute() possède une limite sur la taille et la dépasser renvoi une erreur :

Erreur : SQLSTATE[HY000]: General error: 1 too many SQL variables

Chez moi, la limite semble être de 1000 variables (au dessus ça foire, en dessous ça marche, et je n’ai pas trouvé comment modifier ça : elle doit être interne aux modules PDO de PHP).

On me dira que c’est énorme et que personne ne les utilise. Bah si, moi \o/.

Je les utilise dans le cas où je veux insérer de multiples lignes simultanément :

// en SQLite
$query = "INSERT INTO tbl ( one, two) SELECT ?, ? UNION ALL SELECT ?, ? UNION ALL SELECT ?, ? ";
// en MySQL
$query = "INSERT INTO tbl ( one, two) VALUES ( (?,?), (?,?), (?,?) ) ";
Puis le tableau :
$array = array($ar[0][0], $ar[0][1], $ar[1][0], $ar[1][1], $ar[2][0], $ar[2][1]);

Ici j’ajoute 3 ligne d’un seul coup, où chaque ligne contient deux variables (deux « ? » dans la requête), au total j’ai donc six variables.


Chaque insertion insère 2 nouvelles variables (deux « ? ») dans la requête.
On peut donc au maximum insérer 500 lignes d’un coup (500×2 = 1000). Dans un de mes script, chaque ligne ajoute 14 nouveaux « ? ». Il faut en tenir compte, et on peut dont entrer au maximum floor(1000/14) lignes à chaque requête.

Une solution, si vous avez un énorme tableau qui contient toute les variables à insérer, c’est de le couper en de multiples petits tableaux avec array_chunk(), et de reboucler ensuite là dessus, de façon à ce que le nombre de variables maximal par requête ne dépasse pas les 1000.


J’ajoute quand même un mot sur l’intérêt d’utiliser les insertions multiples : si en MySQL on peut facilement faire 20000 requêtes séparées en une secondes, faire la même chose en SQLite vous prend une demi-heure (littéralement) : chaque requête génère un accès disque vers le fichier .sqlite.
C’est pour ça qu’en SQLite, il faut mieux privilégier la minimisation du nombre de requêtes, quitte à faire d’énormes requêtes.

image de n3wjack

epic wallpaper
Parmi toute la musique que j’écoute, je suis un grand fan des musiques de films, de jeux vidéos ou de musique simplement épique.
Il y a de plusieurs genres dans cette liste, mais c’est typiquement la musique qui iraient parfaitement pour des fonds de jeux vidéos ou autre. Certains auteurs de ces musiques le font d’ailleurs spécialement pour l’industrie du jeu vidéo ou du cinéma.

Celles avec un cœur sont mes préférées de toutes.

Musiques de films

Alexandre Desplat

Statues (Harry Potter 8 - OST) ❤
The Imitation Game (The Imitation Game - OST)

Hans Zimmer

Chevaliers Of Sangreal (Da Vinci Code - OST) ❤
The Dark Knight End (Batman, The Dark Knight - OST)
Now We Are Free (Gladiator - OST)
I See Dead People In Boats (Pirates des Caraïbes - OST)
What Shall We Die For (Pirates des Caraïbes - OST) ❤
Angry And Dead Again (Pirates des Caraïbes - OST)
The Rock - Main Theme (The Rock - OST)
Leave No Man Behind (Black Hawk Down - OST)
Time - Inception (Inception - OST)

Vangelis

Conquest Of Paradise (1492, Conquest Of Paradize - OST)
Hymn
Chariots Of Fire
Across the Mountains

En vrac

Daft Punk - The Game Has Changed (Tron Legacy OST)
Daft Punk - Disk Wars (Tron Legacy OST)

Geoff Zanelli - You speak of the Trident (Pirates des caraïbes - OST)
Jerry Goldsmith - Nicaragua (feat. Pat Metheny) (Django Unchained OST) ❤
Thirteen Senses - Into The Fire (Les Chevaliers Du Ciel - OST)
Annie Lennox, Howard Shore - Into the West (The Lord of Rings - OST) ❤
Howard Shore - The Misty Mountains Cold (The Hobbit - OST)
Mark Motherbaugh - What Heroes Do (Thor Ragnarok - OST)
Ennio Morricone - L’arena (Kill Bill - OST)

Musiques de jeux vidéos

Andreas Waldetoft

Mare Atlanticum (Europa Universalis III - OST) ❤

Hanz Zimmer

Prophet Journey - Crysis 2

de Metal Gear Solid 3

Metal Gear Solid III Epic Theme

de Halo

Halo Theme
Warthog Run

de World Of Warcraft

The Shaping Of The World
A Call To Arms
Song of Elune
Enchanted Forest
Iron forge

de Bomberman Quest

Commander Zephyr Battle (Bomberman Quest GB Theme) ❤
Commander Aqua Battle (Bomberman Quest GB Theme)
Bomber Chaos Battle (Bomberman Quest GB Theme)

Musique de studios spécialisés

Audiomachine

Lost Riders
Farewell To Earth
Hymn of the Rising

Future World Music

Ascension
Fight (no choir)
Aspiration
Journey Of Life
New Beginings
Dream Chasers

Immediate Music

Crusade (choir)

Missing in Action

Fire and Ice
Pandora
Resurection

Epic Soul Factory

Hero Memories

Really Slow Motion

Iridescence
Sunder

Skanda Music

Indra

Two Steps From Hell / Thomas Bergensen

Atlantis
Magic Of Love
Strenght Of A Thousand Men
Breath
Sun & Moon
Feat. Merethe Soltvedt
A Place In Heaven
Friendship to last
Mercy in Darkness
Star Sky
Battleborne Instrumental
Casablanca
Celebrate Life
Never Winter
Undying Love
Pegasus
Colors of Love

BrunuhVille

The Wolf And The Moon

Musique de groupes

Dreamtale

The Dawn
Two Hundred Men

Equilibrium

Equilibrium - Heindalls Ruf
Equilibrium - Die Weide und die Fluss (et les paroles, que je trouve particulièrement magnifiques) ❤

En vrac

Wolfykh - Zer'Arya
Alestorm - 1741 The Battle of Carthagena
Enya - Angeles
God Is An Astronaut - Forever Lost
B.A.P - Voice Message (version instrumentale)


N’hésitez pas à chercher les artistes : Future World Music, Two Steps From Hell, Really Slow Motion ou Audiomachine ont fait des centaines de chansons différentes, y compris pour divers jeux vidéos, films et concernant Two Steps From Hell surtout, sur d’innombrables trailers de films.

Autrement, en dehors de ce style là, j’écoute aussi deux autres types de musique, dont voici mes tops :

(Mise à jour 2018-01-27)

Image de JanPhilippEckert