L’attribut contenteditable="plaintext-only"
en HTML offre une alternative sécurisée et simplifiée à contenteditable="true"
: il permet de rendre un élément modifiable par l’utilisateur, mais en ne conservant que du texte brut, sans aucun formatage HTML ni balises (comme <script>
, <b>
, etc.). Contrairement à la valeur par défaut, qui accepte tout code HTML collé ou saisi (avec les risques de failles XSS ou de styles indésirables), plaintext-only
supprime automatiquement tout balisage, garantissant un contenu propre et prévisible. Idéal pour les champs de titre, commentaires ou tags dans un CMS, il simplifie aussi la récupération du contenu en JavaScript (textContent
et innerHTML
renvoient la même chose). Bien que pratique, il ne dispense pas d’une validation côté serveur, car l’attribut peut être contourné. Compatible avec les navigateurs modernes, il évite les surprises tout en restant simple à implémenter.
L'auteur présente 3 techniques pour déclencher un téléchargement de fichier :
- un attribut introduit en HTML5
- la simulation d'un clic en JavaScript, par exemple suite à une action utilisateur
- dans le cas du téléchargement de données générées dynamiquement, les transformer en Blob et utiliser la méthode précédente
Une présentation très complète de l'élément meter : accessibilité, sémantique, etc.
Tout est dans le titre
Tout est dans le titre
Des choses intéressantes sur les boutons Submit
Tout est dans le titre
L'auteur démontre plusieurs utilisations d'éléments HTML ou de styles CSS3 qui remplacent avantageusement le JavaScript. Il commence par rappeler une règle : utiliser le langage le moins puissant possible (HTML d'abord, CSS ensuite et enfin JavaScript)
Les exemples :
- des custom switches
- Datalist
- un color picker
- un accordéon
- les modales
Tout est dans le titre
Tout est dans le titre
L'auteur présente ces 2 balises HTML5
Il s'agit d'un tutoriel pour créer un générateur de cartes de Noël basé sur une photo prise par webcam.
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
Tout est dans le titre
La liste :
- React Bits
- Vue.js Complete API Cheat Sheet
- CSS Grid Cheat Sheet
- Flexbox Cheatsheet
- Inclusive Components
- A11y Style Guide
- Front-end tooling recipes
- ES6 Features
- A Complete Guide to CSS Grid
- HTML Reference
- The HTML5 Robot
- CSS Triggers
- CSS property syntax cheatsheet
- HTML5 Pattern
- 2016 JavaScript Rising Stars
- What Web Can Do Today
- Moving to HTTPS Guide
- WAI-ARIA Authoring Practices 1.1
- Grid “fallbacks” and overrides
- Flexible Boxes
Tout est dans le titre (via https://stephaniewalter.design/fr/blog/semaine-pixels-27-janvier-2017/ )
Présentation sur HTML5 et sécurité