Css

Dev front

Spätzi, l'assistant contrastes accessibles

Spatzi est un outil en ligne conçu pour aider designers et développeurs à créer des palettes de couleurs accessibles. Il vérifie les ratios de contraste selon les normes WCAG et APCA et utilise l'espace colorimétrique OKLCH. L'outil propose des aperçus en direct, des recommandations de couleurs accessibles, et des guides d'accessibilité intégrés, permettant aux utilisateurs de valider leurs combinaisons de couleurs pour une meilleure conformité aux normes d'accessibilité.

www.alsacreations.com

css
Dev front

Preventing scrollbar layout shifts

Cet article présente une solution en CSS pour éviter les décalages de mise en page causés par l'apparition soudaine de barres de défilement sur les pages web. En appliquant un petit ajout CSS, il est possible d'éviter que le contenu se déplace lorsque la barre de défilement apparaît, ce qui améliore l'expérience utilisateur. L'astuce est compatible avec tous les principaux navigateurs.

ryangjchandler.co.uk

css
Dev front

Quand CSS casse l'accessibilité, quelques écueils à éviter

Cet article explore comment certaines propriétés CSS peuvent affecter négativement l'accessibilité pour les utilisateurs de technologies d'assistance. Il met l'accent sur des pièges subtils liés à l'utilisation de propriétés spécifiques et propose des solutions pour les contourner. En particulier, il traite des effets négatifs de la propriété 'display:none' sur les éléments sémantiques, ainsi que des problèmes d'accessibilité découlant de la suppression des puces des listes. L'importance de tester avec de véritables technologies d'assistance est également soulignée.

www.alsacreations.com

css
Autre

We Built a Static Website on AWS S3 for $0.01/Month — Here’s the Exact Setup

Cet article décrit comment créer un site web statique sur AWS S3 à un coût d'un cent par mois. L'auteur partage son expérience de création d'un portefeuille sans backend ni base de données, en utilisant seulement HTML, CSS et un peu de JavaScript. Il explique les étapes de configuration de l'hébergement statique sur S3, de la création du bucket à la gestion des pages principales et des erreurs. L'article vise à aider ceux qui souhaitent un hébergement économique pour un projet simple.

medium.com

css
Dev front

Tuto CSS : Contour de Texte avec text-stroke & text-shadow

Cet article présente un tutoriel sur la création de contours de texte en CSS. Il explore deux méthodes principales : l'utilisation de la propriété text-stroke pour ajouter directement des contours aux textes, et l'utilisation de text-shadow, qui permet de simuler un contour sans les problèmes de compatibilité. Des recommandations de polices Google Fonts adaptées pour ces techniques sont également fournies, ainsi que des exemples de code.

www.gerits-aurelien.be

css
Dev front

Forcer l'application de conventions CSS avec Stylelint

L'article présente l'importance de Stylelint dans le développement front-end pour maintenir une qualité optimale du code CSS. Après une période d'adoption, son utilisation a été mise de côté en raison de conflits avec Prettier et de la pertinence réduite dans les projets à classes utilitaires. Toutefois, après des mises à jour, Stylelint a été réintégré, facilitant la détection des erreurs et l'application des conventions d'équipe. Le texte détaille également l'installation et la configuration de Stylelint dans un environnement de travail avec VS Code et encourage les développeurs à l'adopter pour améliorer la cohérence et la qualité du code.

www.alsacreations.com

css
Sécurité

NEW Spatie Package: One-Time Passwords

Un nouveau package de Spatie permet la mise en place de mots de passe à usage unique, facilitant ainsi la sécurité et l'authentification des utilisateurs dans les applications web. Ce nouvel outil offre une solution simple pour la gestion des sessions sécurisées, tout en étant compatible avec différentes plateformes de développement web.

www.youtube.com

css
"
Mobile

Google I/O 2025 : Les nouveautés à retenir pour les développeurs !

La Google I/O 2025 a révélé des avancées majeures pour les développeurs, notamment des outils web innovants comme des carrousels CSS et l'API Interest Invoker, facilitant la création d'interfaces interactives. Le développement mobile sur Android a également bénéficié de nouvelles mises à jour dans Jetpack Compose et l'intégration de Gemini dans Android Studio. De plus, des outils d'IA comme Stitch et Firebase Studio ont été présentés, offrant des solutions pour la conception d'applications et l'automatisation des services backend.

www.axopen.com

css
Dev front

CSS Painting API - Web APIs | MDN

L'API Painting CSS, partie des API Houdini, permet aux développeurs de créer des valeurs personnalisées pour la propriété background. Cela permet de dessiner directement dans l'arrière-plan, la bordure ou le contenu d'un élément à l'aide de fonctions JavaScript. Grâce à cette API, on peut générer un fond réactif qui change en fonction des styles calculés. Un exemple montre comment créer une image de fond dynamique qui alterne entre différentes couleurs, en utilisant un worklet de peinture externes pour accéder aux propriétés CSS.

developer.mozilla.org

css
Dev front

La valeur currentColor en CSS

L'article traite de la propriété `currentColor` en CSS, qui permet à un élément d'adopter la couleur du texte de manière dynamique, facilitant ainsi la maintenance des styles. Lorsque `currentColor` est utilisé, tout changement de couleur du texte se répercute automatiquement sur d'autres propriétés comme les bordures ou les ombres, rendant le code CSS plus lisible et évitant les répétitions. Des exemples d'applications pratiques sont fournis, notamment dans le cas des icônes SVG et des dégradés.

www.alsacreations.com

css