Catégories
Astuces et Design

Comment ajouter du texte dans les bordures à l'aide d'éléments HTML de base

Certains éléments HTML sont livrés avec des conceptions prédéfinies, comme les petits carrés peu pratiques de éléments, les barres de couleur limitée de éléments, et les flèches «quelque chose à leur sujet me dérange» éléments. Nous pouvons les personnaliser pour qu'ils correspondent à l'esthétique moderne de nos sites Web tout en utilisant leurs fonctionnalités. Il […]

Catégories
Astuces et Design

Une machine à états complète faite avec des cases à cocher HTML et CSS

Les machines d'état sont généralement exprimées sur le Web en JavaScript et souvent via la bibliothèque XState populaire. Mais le concept de machine à états est adaptable à à peu près n'importe quel langage, y compris, étonnamment, HTML et CSS. Dans cet article, nous allons faire exactement cela. J'ai récemment construit un site Web qui […]

Catégories
Astuces et Design

Une barre latérale collante de taille dynamique avec HTML et CSS

Créer un contenu de page qui colle à la fenêtre lorsque vous faites défiler, quelque chose comme un menu de saut à l'ancre ou des en-têtes de section, n'a jamais été aussi simple. Jeter un position: sticky dans votre jeu de règles CSS, définissez le décalage directionnel (par exemple top: 0) et vous êtes prêt […]

Catégories
Astuces et Design

Le passé, le présent et l'avenir des contrôles de formulaire HTML natifs – Smashing Magazine

A propos de l'auteur Stephanie est technologue en conception et gestionnaire de programme pour les expériences de développement Microsoft Edge. Son travail de conception et de gestion de programme s'est concentré sur… Plus à propos Stéphanie … Travailler avec des contrôles de formulaire HTML natifs a été un tel problème pour les développeurs Web, du […]

Catégories
Astuces et Design

Copyediting avec HTML sémantique | Astuces CSS

Le suivi des modifications est une fonctionnalité de copie d'édition par excellence pour comparer les versions de contenu. Bien que nous soyons habitués à suivre les modifications dans un document de traitement de texte, nous avons en fait des éléments HTML capables de le faire. Il existe de nombreux éléments que nous pouvons utiliser pour […]

Catégories
Astuces et Design

Des moyens plus intelligents pour générer une structure HTML imbriquée profonde

Disons que nous voulons avoir la structure HTML suivante: C’est vraiment pénible d’écrire manuellement. Et la raison pour laquelle ce message est né était horrifié de le voir généré avec Haml comme ceci: .boo .boo .boo .boo .boo Il y avait en fait une vingtaine de niveaux d'imbrication dans le code que j'ai vu, mais […]

Catégories
Astuces et Design

Un guide des formulaires HTML et CSS (pas de piratage!)

Historiquement, les formulaires HTML ont été assez délicats – d'une part, parce qu'au moins un peu de JavaScript était nécessaire, et d'autre part, parce qu'aucune quantité de CSS ne pourrait jamais les faire se comporter. Cependant, ce n'est pas nécessairement vrai dans le cas du Web moderne, alors apprenons à baliser des formulaires en utilisant […]

Catégories
Astuces et Design

15+ meilleurs tutoriels de conception d'e-mails responsive et HTML

Comment concevez-vous un e-mail qui se traduira par de nombreuses ouvertures et des taux de clics élevés? Il y a un peu d'art – et de chance – dans la conception des e-mails. Que vous vous intéressiez à la conception graphique et visuelle ou au développement HTML réactif, la conception d'e-mails peut être une entreprise […]

Catégories
Astuces et Design

Au-delà des requêtes multimédias: utilisation de nouvelles fonctionnalités HTML et CSS pour des conceptions réactives

Au-delà de l'utilisation de requêtes multimédias et de mises en page CSS modernes, comme la flexbox et la grille, pour créer des sites Web réactifs, il y a certaines choses négligées que nous pouvons bien faire pour créer des sites réactifs. Dans cet article, nous allons explorer un certain nombre d'outils (tournant autour du HTML […]

Catégories
Astuces et Design

HTML pour les sous-titres et les titres

Disons que vous avez un double titre situation en cours. Un petit sur un grand. Cela revient, je ne sais pas, un milliard de fois par jour, je dirais. Quel HTML préférez-vous? Oserais-je dire, ça dépend? Mais avez-vous envisagé toutes les options? Et comment ces options se jouent sémantiquement et accessibilité-y? Comme nous le faisons […]

Catégories
Astuces et Design

Traduire des wireframes de conception en HTML / CSS accessible – Smashing Magazine

A propos de l'auteur Harris est un développeur Web passionné par l'égalité numérique. Il travaille chez Deque Systems en tant qu'ingénieur principal de l'interface utilisateur, créant de superbes applications Web. … Plus à propos Harris … Le moyen le plus efficace de créer des sites Web et des applications accessibles est de «passer à gauche» […]

Catégories
Astuces et Design

Où apprenez-vous le HTML et le CSS en 2020?

La question de savoir comment et où apprendre HTML & CSS est une question très raisonnable à poser. La réponse dépend de toutes sortes de choses: à quel point vous êtes sérieux, votre fondation actuelle, quelles autres ressources sont à votre disposition, ce que vous espérez faire avec ce que vous apprenez, et combien de […]

Catégories
Astuces et Design

Guide de la syntaxe des images réactives en HTML

Ce guide concerne les Syntaxe HTML pour des images réactives (et un peu de CSS pour faire bonne mesure). La syntaxe des images réactives consiste à servir une image à partir de plusieurs options en fonction des règles et des circonstances. Il existe deux formes d'images réactives, et elles correspondent à deux choses différentes: Si […]

Catégories
Astuces et Design

20 modèles HTML minimaux pour les sites Web d'entreprise

Lors de la création d'un site Web d'entreprise, il est essentiel d'avoir une conception et une mise en page qui servent bien votre contenu. Mais cela peut sembler une tâche monumentale si vous n'avez pas de compétences en conception vous-même. C’est pourquoi les modèles HTML minimaux sont si utiles, bien sûr. Ils vous font gagner […]

Catégories
Astuces et Design

Du plaisir innocent avec la vidéo HTML et les progrès

L'idée est venue en regardant une vidéo de formation obligatoire sur l'intimidation en milieu de travail. Je peux juste entendre le lycée Geoff LOL-ing parler d'une mauviette comme moi qui doit regarder cette chose. Mais nous y voilà. L'interface utilisateur de la vidéo était vraiment belle, mais c'est la barre de progression qui a vraiment […]