L'animation dans les interfaces numériques : moins, mais mieux. - Alsacreations

Résume :

Amen.

  • On définit le but : est-ce que c'est pour expliquer, guider, ou juste faire plaisir ?
  • On pense à la fréquence : plus c'est utilisé, moins ça doit bouger
  • On reste rapide, toujours sous les 300 ms
  • On donne le contrôle, en respectant toujours les préférences de la personne qui utilise l'interface.

(oui, l'image de titre est bien un troll )

YoutubeRSS

Hier, je me suis aperçu que le bookmarklet que j'avais fait pour trouver le flux RSS d'une chaîne youtube ne fonctionnait pas toujours 🤬: en effet, si l'URL de la chaîne n'est pas du type www.youtube.com/channel/xxxCHANNEL_IDxxx ça ne fonctionne pas... Or, les chaînes peuvent être aussi sous une forme dans laquelle le channel_id n'apparaît pas.

zut flûte et cacaboudin

Du coup, je m'y mets

Au lieu de laisser youtube me chier dans les bottes, je me suis dit que, si le channel_id n'est pas dans l'URL, il doit être planqué quelque part dans le html de la page.

En fouillant un peu, twingo bongo jannielongo bingo 🥳 J'ai trouvé ça en parsant avec (presque) la même regex que pour l'URL.

con.jpeg

J'ai donc codé vite fait une «api» qui renvoie l'URL du flux RSS d'une chaîne Youtube dont on fournit l'adresse.

On peut l'utiliser avec le frontend minimaliste prévu, en faisant une requête GET ou via le bookmarklet qui va bien.

Le tout est bien entendu utilisable, autohébergeable et modifiable, comme d'habitude

Allez !

Réglette Volga, LED 1 x 35 W, LED intégrée blanc froid | Leroy Merlin

Rhaa lala ! J'ai acheté deux réglette led pour mon atelier il y a quelques mois et depuis trois jours, il y en a une qui s'est foutu à clignoter mon vieux, mais façon stroboscope en boite...

Je la branche ailleurs, en parallèle, en série... rien n'y fait.

J'en achète une autre, je vire la première, je branche la nouvelle, j'allume... elle s'allume et ne clignote pas du tout. En fait, elle se contente de s'éteindre systématiquement au bout de deux secondes.

Re tests variés, re rien à faire.

Je me prends de ramener le bouzin au magasin puis, je me dis que je vais chercher sur le net: deux produits défectueux sur trois, ça a du faire du shprounz quelque part.

Dans les commentaires, un gars dit l'avoir démontée pour trouver avec stupeur une série de potars permettant des réglages même pas mentionnés dans la doc.

Solution

En fait, tu vires le cache blanc côté leds et effectivement, tu trouves les trois boutons à tourner.

IMG 20200228 154614.jpg

Donc

Les mecs foutent des boutons de réglages DANS l'appareil - bravo l'ergonomie - et ils n'en parlent même pas dans la doc.

Une fois les potars tournés, la lampe reste allumée.

Conclusion

  1. ne doutez JAMAIS de la connerie des concepteurs (du produit ou de la doc)
  2. regardez TOUJOURS sur le net si d'autres n'ont pas souffert avant vous.

Quoting in HTML: Quotations, Citations, and Blockquotes | CSS-Tricks

Bon article sur la façon d'afficher les citations en HTML.

Je retiens une façon de mettre l'apostrophe en retrait


/* Fallback */
blockquote {
  text-indent: -0.45em;
}

/ If there's support, erase the indent and use the property instead / @supports ( hanging-punctuation: first) { blockquote { text-indent: 0; hanging-punctuation: first; } }

“Stop Using CSS Selectors for Non-CSS”

Une réflexion intéressante que je garderai en mémoire: ne réserver les classes css que pour styler, pas pour cibler en js.
Donc en résumé, au lieu de


<article class="article"><br />
</article><br />
<br />
et <br />
<br />
$(".article") <br />
```<br />
<br />
Préférer:<br />
<br />
```<br />
<article class="article" data-hoverable><br />
</article><br />
<br />
et <br />
<br />
$("[data-hoverable]")<br />
```<br />
<br />
On sépare ainsi les classes (styling) des attributs data-* (scripting js)<br />
<br />
<br/><br/><div class="img_source"><a href="https://www.inetsolutions.org/wp-content/uploads/2016/03/JavaScript-And-CSS-Includes-Do-Overload-Googles-Fetch-And-Mobile-Testing-Tools-1030x644.jpg">Source image</a></div>

APLOMB : Si vous êtes harcelé par un huissier ou un cabinet de recouvrement, envoyez leur cette lettre. Elle a un pouvoir… apaisant.

Messieurs,

Vous m’avez prévenu que l’organisme XXX vous a mandaté pour recouvrir une certaine créance.

Cette somme étant l’objet d’une contestation de ma part, j’use de mon droit de demander l’arbitrage de l’autorité judiciaire.

Il appartient donc à cet organisme de solliciter le juge d’instance aux fins d’obtenir une « ordonnance portant injonction de payer ».

Le cas échéant, dès que celle-ci me sera signifiée par voie d’huissier, et en fonction des éléments présentés, je me réserve le droit, soit de payer, soit d’y faire opposition dans le délai d’un mois.

Le juge d’instance ou de proximité me convoquera en audience et je pourrais alors lui exposer mon point de vue, documents à l’appui.

Le juge pourra alors valablement trancher sur la validité de ladite créance ou non.

Il n’y a pas d’autres procédures. Je vous demande donc expressément de cesser vos relances et d’informer l’organisme qui vous a mandaté de ma position.

A partir de la date de réception de cette lettre, toutes relances de votre part, tant par courrier que par téléphone, seront considérées comme du harcèlement et de l’intimidation. Je n’hésiterai pas à porter plainte pour ce motif, ce qui hypothèquera sérieusement vos chances d’obtenir la validation de la dette par les voies judiciaires.

Je vous prie de croire, messieurs, en l’expression de mes sentiments respectueux.






<3

Via crashweb


Gagner du temps quand on cherche un mobile

En passant, je vous file un petit bookmarklet que j'ai bricolé quand je cherchais un smartphone pas trop cher: il suffit de sélectionner le nom d'un portable sur une page web et de cliquer sur le bookmarklet; il ouvre alors une nouvelle page avec une recherche sur lesnumériques.com.

C'est tout con, mais ça m'a fait gagner du temps.

javascript:(function(){if(window.getSelection){sel=window.getSelection();}else%20if(document.getSelection){sel=%20document.getSelection();}else{var%20selection=document.selection&&document.selection.createRange();if(selection.text){sel=selection.text;}};window.open('https://www.lesnumeriques.com/recherche?q='+sel,'infos');})()

Chercher sur les numériques

Glissez-déposez ce lien vers les bookmarks pissétou.

(...)

Fil RSS des articles