PROJET AUTOBLOG


le hollandais volant

Site original : le hollandais volant

⇐ retour index

Mise à jour

Mise à jour de la base de données, veuillez patienter...

Quelques astuces pour le français

lundi 15 février 2016 à 23:06

Malgré la récente polémique de la réforme pas du tout récente de l’orthographe, voici un article sur l’orthographe. Afin de réduire le nombre de fautes à l’écrit en français, je me suis constitué une petite liste d’astuces et de moyens mnémotechniques. En voici la plupart.
Je précise que je suis ne suis pas un expert littéraire, et certaines justifications peuvent contenir des erreurs malgré le fait d’avoir pris soin de faire pas mal de recherches… J’attache cependant une certaine importance aux langues quand-même, et cette liste est justement là pour m’aider à mieux la respecter et si elle peut vous servir aussi, tant mieux.

Soit / soient

« Soit » dans le sens de « ou bien » est invariable. Exemple : « soit je mange une pomme, soit je mange un biscuit ».
« Soient » est le subjonctif du verbe être à la troisième personne du pluriel : « qu’ils soient maudits ».

Quand on l’utilise dans le sens de « voici » ou « supposons », il devrait être invariant, même si la tournure « soient » est plus ou moins acceptée en maths. Exemple : « soit deux droites perpendiculaires » dont l’écriture « soient deux droites perpendiculaires » est également acceptée.

Tache / tâche

Sans accent, il désigne une salissure : « j’ai une tache sur ma chemise ».
Avec accent, il désigne une besogne, un travail à accomplir : « j’ai pour tâche de ranger les dossiers », « le gestionnaire des tâches ».

Une façon de s’en rappeler est de se souvenir que l’accent circonflexe marque très souvent un ancien « s » qui a fini par disparaître au fil des siècles. Pour le « â », ça aurait donné un « as ». Or le mot anglais pour « tâche » contient encore cette lettre : task. La traduction de task est donc « tâche » et non pas « tache ».

Le circonflexe qui remplace un ancien « s » est parfois visible dans les mots de la même racine : forêt/forestier, hôpital/hospitalier, arrêter/arrestation, fête/festival, château/castel, bête/bestial, île/insulaire, maître/master, connaître/connaissance, ancêtre/ancestral. Ce n’est pas systématique, mais on peut trouver un grand nombre d’exemples comme ça.

Les majuscules accentuées

Parlant d’accents, les lettres majuscules doivent être accentuées (ÉÀÙËÂÊÖ…) et il en va de même pour les ligatures et la cédille (njƅ). Ne pas le faire constitue une faute de français.
Il est néanmoins toléré de ne pas le faire si c’est impossible : les machines à écrire ne le permettaient pas, par exemple, alors que les claviers… c’est un autre débat, avec sa propre polémique :D.

Les capitales doivent également être accentuées, et suivent la même règle.

Où / ou

« Où » avec l’accent grave désigne un lieu : «  es-tu ? », « il doit être là je l’ai laissé ».
Sans accent, « ou » traduit une alternative, un choix : « fromage ou dessert », « tu viens ou pas ? ».

Pour info, « où » est le seul mot en français comportant un « ù ». La touche du clavier qui le porte ne sert qu’à ça.

Dés / dès

Avec l’accent aigu, « dés » représente le pluriel de « dé », l’objet que l’on jette au jeu de l’oie : « deux dés à six faces ».
Dans les autres cas il prend un accent grave : « dès » : « dès que tu as fini », « dès lors ».

Dû / du / dus

Quelque soit son sens, on n’utilise l’accent circonflexe que lorsque le mot est non-accordé. Les formes « dûe », « dûes », « dûs » n’existent pas. On écrit « due », « dues », « dus » respectivement.
La forme « du » (sans accent) désigne une quantité indéfinie : « du chocolat », « du fromage ».
Dans les autres cas, on met un accent : « un retard dû à la neige », « mon s’élève à 20 € », « j’ai me dépêcher ».

Votre / vôtre (et notre / nôtre)

Quand il s’agit d’un déterminant (placé devant un nom), il ne prend pas d’accent circonflexe : « votre voiture ».
Dans les autres cas, il en prend un. C’est assez simple à se souvenir : si on a « le(s)/la » ou « du » devant ou si on peut mettre un de ces mots sans que ça change le sens, il prend un accent : « c’est le vôtre », « il faut y mettre du vôtre », « la clé est vôtre », « restez donc avec les vôtres (les gens de votre famille) ».

Majuscules des dates

Les noms des mois, des jours, sont communs : ils ne prennent pas de majuscules : « […] vendredi 1er décembre […] », « le 23 juillet ».

Ils prennent évidemment une majuscule quand ils sont en début de phrase : « Juillet est mon mois préféré ». L’autre cas de la majuscule, c’est quand on parle d’une date historique, d’une fête : « le 14 Juillet », « Le 11 Novembre »…

Appeler / apeller / appeller

Une seule de ces orthographes existe : appeler.

Pour se souvenir de l’orthographe, rappelez vous ceci : le « e » sans accent suivi de deux consonne identiques (ou pas) se prononce généralement « è » ou « é » (comme dans terre, cassette ou vert). S’il est suivi d’une seule consonne, il se dit « e » (comme dans retenir ou jeter).

Appeler s’écrit avec un seul « l » pour que le e se prononce e (et non pas é ou è).
Or, je sais qu’il y a une double consonne quelque part dans le mot et ce n’est pas le « L » : c’est donc le « P » : « appeler ». On a le même raisonnement pour le mot « enveloppe ».

Par contre, dans la phrase « j’appelle la police », on met bien deux « l » pour avoir le son è.

Quand / quant

Celui-ci est également bizarre mais assez simple à comprendre : ce mot peut prendre deux sens.
Le premier est celui référent à un moment dans le temps. Il est alors synonyme de « lorsque » et il s’écrit « quand » : « Quand il fait beau, je me promène. », « J’aime quand il neige. », « Quand viendras-tu ? ».
Le second est celui où il a le sens de « concernant » ou « en ce qui concerne ». Dans ce cas, il s’écrit « quant » : « Quant à moi, je mange une pizza. », « Quant au père Noël, je n’y crois pas. ».

Il est préférable de retenir cette astuce plutôt que celle du « quant » suivi de « à/au/aux », car elle ne marche pas à tous les coups, comme le montre ce contre-exemple : « Quand à Noël il neige, les enfants sont contents. » (source), où il faut bien un « d », car il a le sens de « lorsque ».

Ceci sera tout pour mes astuces aujourd’hui. Je ne parlerai pas des fautes de l’accord des verbes du premier groupe (« j’ai manger » ou « il faut marché »), ou le « sa/ça » qui sont assez lourdes.
Si vous avez d’autres astuces, publiez-les ! Plus elles sont ridicules, plus elles fonctionnent, donc n’hésitez pas \o/.

[CSS] Pseudo-éléments & pseudo-classes

jeudi 11 février 2016 à 05:33

En CSS, on a à faire à des classes, des ID, des éléments… Parfois on rencontre aussi ce que l’on appelle des pseudo-classes et des pseudo-éléments.
Il ne faut pas confondre les deux : la différence est tout à fait logique mais je vais la réexpliquer ici.

Quand on a le code HTML suivant :

<p class="auth-date">
    Écrit par <span class="author">Moi</span>, <span>Aujourd’hui</span>.
</p>

Qui affiche :

Écrit par Moi, Aujourd’hui.

On a trois éléments :

Ce sont des éléments HTML. On les appelait parfois « balises » ou « tag », mais ce sont des éléments. Selon l’élément, la disposition peut varier (un <table> organisera les données sous la forme d’un tableau, par exemple), mais globalement ce sont les éléments qui contiennent les données affichées à l’écran.

En plus des éléments HTML, on a des classes CSS. Ici on en a deux :

Les classes seules servent à rien : elles ne modifient pas ce qui est affiché à l’écran, ne sont pas visibles, etc. C’est en CSS qu’elles sont utiles : elles permettent de modifier le comportement des éléments.
Le CSS permet par exemple d’afficher tous les éléments de classe "author" en rouge. Dans ce cas là, le « Moi » sera en rouge.

Tout ce qui précède est tout à fait basique, mais ça va servir pour comprendre les pseudo-classes et les pseudo-éléments.

Il faut retenir deux choses :

À partir de là, on peut trier les pseudo-classes et les pseudo-éléments en CSS:

Vous le comprenez donc, je présume :

Avant le CSS3, on notait les pseudo-classes et les pseudo éléments de la même façon, avec les deux-points « : ». Depuis le CSS3, il a été introduit le fait de noter les pseudo-classes avec les deux-points « : » et les pseudo-éléments avec deux fois deux-points « :: ».

Les pseudo-éléments sont au nombre de quatre depuis bien longtemps, ::before, ::after, ::first-letter et ::first-line.
Les pseduo-classes sont plus nombreuses : on avait déjà les :hover, :focus, :active, :link ou :visited, maintenant on a plein d’autres, en particulier pour les formulaires, comme :valid, :invalid, :checked, :not(), etc.

Et… on peut très bien combiner tout ça : un élément peut avoir une classe ? Et bien un pseudo-élément peut avoir une pseudo-classe ! On peut très bien faire un des exemples ci-dessous :

element::after:hover {
    // ici le CSS pour modifier le ::after lors du survol du ::after
}
element:hover::after {
    // ici le CSS pour modifier le ::after lors du survol de l’élément auquel est attaché le le ::after
}
element:not(:hover) {
    // ici le CSS pour modifier l’élément quand il n’est pas survolé (utile dans certains cas).
}

Ou encore, plus compliqué :

element:invalid:hover::after {
    // le CSS pour un ::after attaché à un formulaire invalide lors du survol
}

Enfin un petit mot concernant la spécificité des pseudo-classes et pseudo-sélecteurs (voir la spécificité des sélecteurs CSS : là c’est très simple car les pseudo-classes ont la même spécificité que les classes normales et les pseudo-éléments ont la même spécificité que les éléments normaux.

Autrement, les possibilités apportées par ces choses sont énormes, c’est à vous d’étudier ça maintenant !

La compensation équitable

mardi 9 février 2016 à 16:44

Ah non, ce n’est pas un truc du genre « revenu de base » qui serait quelque chose égalitaire et une avancée sociale majeure.
La « compensation équitable » c’est, pour quelques députés, de la novlangue pour désigner la rémunération copie privée. C’est tout de suite moins cool, hein ?

Selon la loi actuelle, quand on achète un CD (ou un DVD, ou n’importe quelle œuvre audio, vidéo…), nous [consommateurs] avons le droit d’en faire des copies à des fin d’archive personnelles et de sauvegarde : si le CD acheté se casse, la musique ou les données ne sont alors pas perdues et on peut continuer à l’écouter. La loi autorise ça, et c’est bien.

Après on a les éditeurs qui sont venus avec des protections anti-copie sur les disques ou les fichiers. Ceci nous empêche donc de faire des copies, et nous empêche de jouir de notre droit à la copie privée. Ça, c’est un problème.

Ensuite, même si les éditeurs nous empêchent de copier le CD qu’on a acheté, ils considèrent qu’on le fait quand-même (paye ta logique, là, hein). Du coup ils ont fait passer une loi pour taxer les appareils électroniques.
Cette taxe serait justifiée car ces appareils peuvent faire tourner des musiques ou des vidéos. Les appareils concernés sont les téléphones, les cartes mémoires, les clé USB, les ordinateurs, les CD vierges, les GPS (!), les autoradios (!) et à peu près tout ce qui est électronique.
Cette taxe est est donc un racket qui considère qu’on achète un support pour y copier des données illégales. En gros, on est coupable avant même d’avoir commis une faute, qui n’en n’est d’ailleurs pas une puisque le droit à la copie privée est prévue par la loi. C’est un autre problème.

C’est cette taxe qui se nomme « rémunération pour la copie privée ».

Si je résume, toutes ces choses s’apparentent :

  1. à une double peine : on paye la taxe de copie, mais en plus cette copie est illégale et réprimandée ;
  2. à la présomption de culpabilité : taxe est payée avant l’acte de copie, et avant même de savoir si elle va être comise ;
  3. à du racket : on paye cette taxe pour quelque chose qu’on a le droit mais plus la possibilité de faire, à cause des protections anti-copie.

Triple enfoncement dans le derrière pour l’acheteur par le CopyReich.

Donc finalement, vous le voyez aussi : ça n’a rien d’équitable du tout.

Une solution serait de payer la taxe et d’accepter de la payer, mais dans ce cas qu’ils nous fichent la paix avec le partage (Hadopi & co) : on paye la taxe, on paye notre « crime » par avance, ça suffit.
Ça se nomme la licence globale : un abonnement mensuel et on peut télécharger et partager un peu ce qu’on veut. Mais pour l’industrie du disque en plastique, ça ne peut pas marcher (alors que Google, Amazon, Netflix, Apple… sont la preuve que ça marche très bien) :

la licence globale
La licence globale, par Commit-Strip

Des icônes pour le web : PNG, SVG ou Icon-font ?

lundi 8 février 2016 à 18:00

Il y a quelques temps, je vous montrais une petite astuce pour faire des icônes « propres » sur mobile et desktop, puis une astuce pour faire un formulaire avec des icônes pouvant bénéficier de la première méthode

Depuis j’ai essayé de voir les autres techniques pour faire des icônes dans une page web.
Aujourd’hui, principalement 3 méthodes sont possibles :

Les PNG

La première technique avec les images de fond en PNG, tout le monde la connaît : c’est la plus utilisée, la plus supportée par les navigateurs, la plus simple… mais c’est aussi la moins malléable !
En effet, si ont veut afficher une icône plus grande, on peut le faire, mais l’image sera floue et pixelisée. Même chose si on veut afficher les icônes sur un écran où la densité de pixels est plus grande (écrans « Retina® », par exemple, mais Apple et ses Mac Book sont loin d’être un cas isolé aujourd’hui).
On peut créer plusieurs images avec différentes résolutions pour plusieurs types d’écran, mais ce n’est pas pratique.

Le second problème c’est si on veut changer la couleur de son thème graphique : les icônes doivent être adaptées aussi. Or pour ça, on ne peut pas faire grand chose : pour changer la couleur des icônes, il faut modifier l’image, ou là encore créer des images différentes pour chaque thème…

Les SVG

Les SVG permettent d’avoir des images nettes quelque soit la taille : c’est très pratique lors du zoom, ou lorsque votre site est susceptible d’être affiché sur un mobile (où la densité de pixels est bien plus grande que sur un écran d’ordinateur).
On peut obtenir le même effet avec du PNG, mais il faut pour cela partir d’icônes à haute résolution, et donc d’images très lourdes, ce qui va poser problème lors du chargement de la page, particulièrement sur mobile et surtout avec des connexions pourries. Le SVG, lui, reste précis avec le même fichier.

Le seul problème ici c’est que si on a toujours besoin de faire plusieurs images si on veut changer la couleur du thème. On peut faire ça en JavaScript (je fais cela dans cet exemple), mais pour le thème en CSS, ce n’est pas pratique.

Les Icon-fonts

Alors ici on conserve la netteté du SVG lors de la mise à l’échelle, mais on a en plus l’avantage très important de pouvoir colorier les icônes comme on veut !

En effet, tout se fait en simple CSS : on dit que l’on veut afficher tel ou tel caractère contenu dans la webfont et ensuite c’est du simple texte : on peut l’agrandir (avec font-size), la colorier (avec color), ajouter une ombre CSS (avec text-shadow), etc. C’est la méthode la plus pratique pour le designer final.

Pour créer un fichier de police avec les icônes dedans, il faut disposer d’icônes initiales (PNG ou SVG) et utiliser un programme pour transformer ça en une police. Je n’ai pas trouvé d’outil facile pour faire ça en local, mais cet outil en ligne fonctionne bien : IcoMoon.io.
Ensuite il suffit d’utiliser la police d’écriture comme c’est fait dans le fichier demo.html fourni au téléchargement.

Il y a quand même quelques inconvénients. J’en ai noté deux principaux :

Si vous voulez quand-même utiliser une icône sur un input, il faut ruser, et l’appliquer par exemple sur un label qui est rendu invisible.

L’usage des Icon-fonts est assez simple. Comme je l’ai dit, on utilise un code pour accéder à un caractère en particulier dans la police. Le CSS se charge d’afficher ce caractère à l’écran grâce à la propriété content :

.icon::before {
    content: "\1a02";
}

Ce que l’on fait parfois, c’est qu’on place ce code directement dans un attribut de l’élément HTML, puis le CSS affiche le contenu de cet attribut dans le content (oui, on peut faire tout ça :D) :

<span data-icon="&#x1a02;">Text</span>
[
@font-face {
    font-family: "icons";
    src: url("icons.woff") format("woff");
}

data-icon]::before {
    font-family: icons;
    content: attr(data-icon);
}

Et on peut changer la couleur, etc :

[data-icon]::before {
   [ …]
    color: red;
    font-size: 3em;
}

Bref, une fois qu’on a créé notre fichier d’icônes, l’usage est très simple, les possibilités sont énormes (couleurs, taille, ombres, animations — y compris sur la couleur, donc pour faire des couleurs arc-en-ciel \o/ — etc.), c’est supporté par les bon navigateurs récents (y compris mobiles).

Et concernant la lourdeur et le poids, je trouve que ça va tranquillement : mon fichier d’Icon-fonts fait 48 ko et contient 400 icônes différentes. Mon fichier PNG avant contenait environ 60 icônes pour 25 ko (certaines étaient en doubles pour pouvoir avoir des couleurs différentes).

Petit mot sur Google Password Manager

lundi 1 février 2016 à 17:10

Le navigateur Google Chrome a une fonction pour enregistrer vos mots de passe et les envoyer en ligne pour vous connecter facilement à tous vos comptes sur tous vos appareils connectés (ordinateur, tablette, téléphone…).

Ça peut sembler séduisant comme idée.
Perso je trouve l’idée terrifiante.

Vous donneriez vos clés de maison/voiture/garage/moto/vélo/boîte aux lettres à une personne qui dit « désormais, j’ouvrirais les portes pour vous, vous n’avez qu’à m’appeler. » ?

Ici pourtant vous donnez les clés de votre vie numérique à une entreprise a but lucrative dont vous ne connaissez que le nom.

Alors oui, je sais : « vie numérique », ce n’est rien. Ce n’est pas votre vie.

Ben en fait si, figurez vous.

Votre vie numérique, c’est tout ce que vous faites sur les sites web, sur votre ordinateur, sur votre téléphone, votre tablette ou votre console de jeu.
Cela englobe donc toutes vos photos, vos posts, vos commits (pour ceux qui codent), vos vidéos, votre bibliothèque (y compris musicale et vidéo), vos discussions, vos emails, vos SMS, vos abonnements, votre historique d’achat en ligne, l’accès à votre compte en banque en ligne, votre numéro de carte de crédit (enregistré sur tous les sites où vous achetez). Et bien plus de choses encore.

Si votre vie numérique ne compte pas, laissez-moi effacer tous vos disques durs, vos comptes en ligne, vos favoris et tout le reste et dites-moi si ça vous manque. Si la réponse est oui (je suis sûr que c’est oui, sinon vous n’auriez pas d’ordinateur), alors votre vie numérique compte pour vous et vous devriez la protéger.

Utiliser un service comme Google Password Manager, c’est donner tout ça à Google pour qu’ils en fassent ce qu’ils veulent (et par ça je veux dire vraiment ce qu’ils veulent).

Et ceci compte pour Google, mais également Firefox ou Opera, qui proposent la même chose (mais c’est pas activé par défaut, ceci dit). En règle général, ne laissez pas jamais un programme — quel qu’il soit — retenir vos mots de passe.

À vous de voir, mais soyez prévenu.
Personnellement je ne ferais jamais ça.