Apprendre le marketing sur le net
"The Shorthand-Longhand Problem in Atomic CSS" de Robin Weser dans un parcours intéressant à travers un problème délicat. Le fait est que lorsque vous prenez la tâche de convertir quelque chose de semblable à HTML et CSS en HTML et CSS réels, il y a des cas extrêmes dont vous devrez vous programmer, si vous […]
Lorsque je visite une page, je suis ennuyé lorsque j'essaie d'interagir avec des éléments pendant que le site Web est toujours en cours de chargement. Souvent, les choses bougent, les polices ne sont pas tout à fait chargées et cela semble cassé. Je sais qu’aujourd’hui, nous sommes obsédés dans ce secteur par le fait de […]
Imaginez que vous ayez une liste d'articles. Dites, fruit: banane, pomme, orange, poire, nectarine Nous pourrions mettre ces virgules (,) dans le HTML, mais voyons comment nous pourrions le faire en CSS à la place, ce qui nous donne un niveau de contrôle supplémentaire. Nous nous assurerons que le dernier élément n’a pas de virgule […]
Je pense que l'animation sur le Web est non seulement amusante, mais aussi engageante de telle sorte qu'elle a converti le site visiteurs dans les clients. Pensez au bouton «J'aime» sur Twitter. Lorsque vous «aimez» un tweet, de minuscules bulles colorées se répandent autour du bouton en forme de cœur alors qu'il semble se transformer […]
Les animations printanières sont un excellent moyen de donner vie aux interactions de l'interface utilisateur. Plutôt que de simplement changer une propriété à une vitesse constante sur une période de temps, les ressorts nous permettent de déplacer des objets en utilisant la physique des ressorts, ce qui donne l'impression d'une chose réelle en mouvement et […]
Nous avons vu le piratage de la case à cocher et comment il peut être utilisé pour créer une machine à états complète en CSS. Aujourd'hui, nous allons pousser cette pensée un peu plus loin et créer un jeu simple de Whack-A-Mole, où le joueur doit réagir rapidement pour gagner… le tout sans une touche […]
Voici une idée amusante de James Stanley: un fichier CSS (qui est vraisemblablement mis à jour quotidiennement) contenant des propriétés CSS personnalisées pour les couleurs «saisonnières» (par exemple, le printemps est vert, l'automne est oranges). Vous utiliserez ensuite les valeurs pour thématiser votre site, sachant que ces couleurs changent légèrement d'un jour à l'autre. Voici […]
Hasura est l'un de mes moyens préférés de créer une API GraphQL gérée pour mes applications. Je trouve cela simple et direct et adapté à un large éventail de cas d'utilisation. Cependant, depuis que je travaille avec Hasura, j'ai vu la même question se poser encore et encore: comment faire un tableau? Compte tenu du […]
Spencer Miskoviak sur le blog Wealthfront: En créant des DevTools personnalisés spécifiques à une application, ils peuvent fonctionner à une abstraction encore plus élevée pour gérer des éléments tels que les interactions des utilisateurs ou le débogage des événements de suivi. Bien que cela nécessite la création et la maintenance des DevTools personnalisés, cela signifie […]
Suivez 5 techniques de centrage au cours d'une série de tests pour voir laquelle est la plus résistante au changement. 16 déc.2020 Le centrage en CSS est un défi notoire, plein de blagues et de moqueries. 2020 CSS a grandi et maintenant nous pouvons rire de ces blagues honnêtement, pas à travers les dents serrées. […]
Un an, hein? Comme nous le faisons chaque année, je voudrais vous donner un énorme Merci pour lire CSS-Tricks, et récapituler l'année. Plus de bas que de hauts, tout compte fait. Ici, à CSS-Tricks, c'était plus un lavage. Permettez-moi de partager avec vous quelques chiffres, jalons et réflexions sur notre voyage de 2020. Faisons les […]
Le blog WebKit explique comment utiliser les propriétés de transformation CSS individuelles dans la dernière version de Safari Technology Preview. Cela met le navigateur en conformité avec la spécification CSS Transforms Module Level 2, qui éclate le translate(), rotate() et scale() fonctions du transform propriété dans leurs propres propriétés individuelles: translate, scale, et rotate. Donc, […]
Créer une vidéo prend du temps. Une vidéo bien conçue de 5 minutes peut prendre des heures à planifier, enregistrer et éditer – et c’est avant nous commençons à parler de rendre cette vidéo cohérente avec toutes les autres vidéos de votre site. Lorsque nous avons entrepris le projet Jamstack Explorers (une ressource pédagogique vidéo […]
Demandez à une centaine de développeurs front-end, et la plupart, sinon tous, auront utilisé le box-shadow propriété dans leur carrière. Les ombres sont toujours populaires et peuvent ajouter un effet élégant et subtil si elles sont utilisées correctement. Mais les ombres occupent une place étrange dans le modèle de boîte CSS. Ils n’ont aucun effet […]
J'ai repensé le site! Je ne peux jamais penser au mot refonte sans penser aussi réaligner, extrait de l’article fondateur de Cameron Moll. J'ai fait ne pas partir de rien. Cette conception n’était pas une toile de conception vierge et un éditeur de code vide. Je doute qu'une refonte future le soit non plus. J'ai […]
Alec Pollak n'était guère plus qu'un directeur artistique junior qui créait des publicités imprimées lorsqu'il a reçu un appel qui allait changer le chemin de sa carrière. Il a travaillé à l'agence de publicité Gray Entertainment, appelée plus tard Gray Group. L'agence avait passé des décennies à acquérir certains des plus gros clients du secteur. […]
J'ai toujours aimé les nuages de tags. J'aime l'expérience UX de voir quelles balises sont les plus populaires sur un site Web en voyant la taille de police relative des balises, les balises populaires étant plus grandes. Ils semblent ne plus être à la mode, bien que vous en voyiez souvent des versions utilisées dans […]
Svelte est l'un des plus récents frameworks JavaScript et sa popularité augmente rapidement. Il s’agit d’un cadre basé sur des modèles, mais qui permet un JavaScript arbitraire dans les liaisons de modèles; il a une superbe histoire de réactivité qui est simple, flexible et efficace; et en tant que framework compilé à l'avance (AOT), il […]
Il s'agit d'une tentative de démontrer comment CSS Grid Layout permet de créer un calendrier avec seulement trois lignes de CSS. Alors que beaucoup diraient qu'un calendrier devrait être construit sémantiquement en utilisant une table, il y en a d'autres qui pensent qu'une liste serait également appropriée. Et le élément pourrait également être une solution […]
Il existe un mot «C» dans le développement Web auquel nous n’accordons pas suffisamment d’attention. Non, je ne parle pas d ’« intégration continue », ni même de« CSS ». Le mot «C» dont je parle est "contraintes". La compréhension des contraintes est un élément essentiel de la création d'un logiciel qui fonctionne le mieux […]