A propos de l'auteur

Jonglant entre trois langues au quotidien, Iris est connue pour son amour de la linguistique, des arts, du web design et de la typographie, ainsi que pour sa mine d'or de…
Plus à propos
Iris

Un mois, c'est long pour rester au courant des choses. Dans la publication mensuelle d'aujourd'hui, vous trouverez un aperçu de tout ce sur quoi nous avons travaillé et que vous avez également aimé lire au cours du dernier mois.

En ces temps étranges d'isolement et de distanciation sociale (avec presque tous les événements et conférences annulés), il peut être assez difficile de se sentir connecté à la famille, aux amis et aux collègues. Chez Smashing, nous pensons qu'il est plus important que jamais de rester en contact et de se soutenir mutuellement. Dans les coulisses, l'équipe travaille sans relâche sur les moyens de garder la communauté connectée, et oh boy avons-nous beaucoup de choses en magasin pour vous! Vous ne pensiez pas vraiment que nous abandonnerions aussi facilement, n'est-ce pas?

Votre lieu de travail peut ressembler beaucoup à celui de Topple, mais même si ce n'est pas le cas, installez-vous confortablement! Nous vous aiderons à améliorer vos compétences en ligne et à obtenir des informations pratiques et exploitables par des experts de l'industrie.

Nous avons été occupés au cours des dernières semaines et nous ne nous arrêtons pas encore! Nous avons des ateliers en ligne, SmashingConf Live, Smashing Meets et enfin et surtout, Smashing TV à portée de main! Mais d'abord, voyons ce que nous avons fait d'autre …

Regardez ce qui est Cookin!

Des moments passionnants! Cliquez sur!, notre dernier livre Smashing, est disponible en pré-commande avec une remise amicale – vous pouvez déjà commencer à lire le livre électronique jusqu'à ce que votre copie imprimée arrive à votre porte. Écrit par Paul Boag et magnifiquement conçu par Veerle Pieters, le livre est divisé en 11 chapitres: de l'exploration de la psychologie de la prise de décision et de la mesure de la conversion à l'exploration des moyens d'encourager les utilisateurs à agir sans les aliéner.

Il n'y a pas de pénurie de livres sur le marketing et l'expérience utilisateur, mais lorsqu'il s'agit de combler l'écart entre les deux, beaucoup d'entre nous ont du mal à trouver le bon équilibre. Pré-commandez aujourd'hui →

Bien sûr, si vous vous sentez fracassant aujourd'hui, nous aimerions vous inviter à rejoindre la famille Smashing et obtenez l'eBook gratuitement (parmi de nombreux autres livres électroniques et quelques chats de fantaisie!).

Apprentissage et réseautage, The Smashing Way

Malgré les circonstances actuelles, nous sommes impatients de trouver des moyens d'offrir des expériences Smashing à toute personne intéressée à apprendre des experts de notre industrie – sans avoir à quitter votre bureau! Nous avons demandé quel type de ressources vous aimeriez avoir, et donc tous les événements en ligne suivants sont ce qui a atterri dans notre souhait de Smashing. Merci à tous ceux qui ont partagé leurs réflexions et leurs commentaires – nous avons été à l'écoute!

1. Ateliers en ligne (mai-juillet)

Renverser le chat prêt pour la nouvelle aventureNos ateliers en ligne conviviaux sur le front-end / UX sont destinés à améliorer vos compétences et à vous aider à obtenir des informations pratiques et exploitables par des experts de l'industrie – en direct. Il y aura beaucoup de plats à emporter perspicaces, d'exercices, de diapositives, d'enregistrements et de temps de questions-réponses amicaux. Bien sûr, nous sommes heureux d'offrir des réductions pour les grands groupes et les étudiants.

Nous vous avons déjà couvert pour les trois prochains mois – assurez-vous de sauvegarder votre place dès que possible:

Remarque: Si vous êtes également intéressé par la façon dont vous pouvez également organiser des ateliers en ligne, écoutez l'épisode 14 de Smashing Podcast avec Rachel Andrew dans lequel elle parle de l'organisation d'ateliers en ligne et de la façon dont un événement traditionnel peut s'adapter lorsque les participants ne peuvent pas y assister en personne.

2. SmashingConf Live (9-10 juin)

Renverser le chat assis sur un canapé confortable avec un ordinateur portable sur ses genouxRencontrez SmashingConf Live (9-10 juin), une conférence en ligne vraiment sympa et conviviale sur le front-end et l'UX. Avec des sessions interactives en direct, des informations pratiques, des conférenciers accessibles, des notes collaboratives et des conversations avec des gens partageant les mêmes idées. Aller aux premiers orateurs confirmés. Vérifier le calendrier →

Les deux jours commencent à 8 heures PDT (vérifiez votre heure), avec des sessions interactives, suivies d'un temps pour les questions et réponses et les zones de discussion.

Ah, et le meilleur: une conférence dans laquelle vous jouez un rôle actif – prenant part à des sessions en direct, des questions-réponses, des zones de discussion et des défis. Au programme. Mais bien sûr, ce n’est pas tout! Soyez prêt pour les défis de conception et de codage, la chasse au trésor et les séances de cheminée avec des invités mystères. Et pour garder le style, bien sûr, nous organiserons une Smashing Party.

Aimez-vous ce que vous voyez, mais avez-vous peur de vous absenter du travail? Eh bien, vous ne pensiez sûrement pas que nous laisserions votre pendaison? Nous savons à quel point cela peut parfois être difficile, et nous avons donc préparé un petit modèle Convaincre votre patron pour vous aider. Bonne chance!

3. Smashing Meets (gratuit)

Topple assis à côté d'un feu de campNous sommes ravis de diriger notre tout premier Meetup Smashing la semaine prochaine! Nous nous concentrerons sur le front-end et l'UX, mais couvrirons également toutes sortes de sujets, des performances à l'accessibilité. Smashing Meets ne serait pas possible sans des communautés incroyables du monde entier, donc un autre merci à toutes les personnes impliquées!

4. Smashing TV (Webinaire gratuit le 19 mai)

Photo de Carie Fisher et Harris SchneidermanVous cherchez des moyens de vous aider à étendre votre couverture de test d'accessibilité au-delà de l'automatisation? Avec très peu de ressources, vous pouvez faire une différence significative. Rejoignez-nous avec Carie Fisher et Harris Schneiderman à 19 h 00 HEC / 13 h 00 HAE qui vous montrera les bases des tests automatisés et partagera des leçons clés sur la maximisation de votre impact sur l'accessibilité.

Partage d'expériences et d'histoires personnelles

Smashing Podcast modéré par Drew McLellanNous passons à notre 16e épisode du Smashing Podcast la semaine prochaine! Le podcast Smashing est le moyen idéal pour emporter un peu de Smashing avec vous lors de vos promenades matinales, tout en lavant la vaisselle ou à tout moment que vous aimez vraiment. Vous pouvez vous abonner dans votre application préférée pour obtenir de nouveaux épisodes dès qu'ils sont prêts.

Votre travail de conception mérite votre attention

Avez-vous des illustrations que vous aimeriez partager avec la communauté du design? Si oui, faites-le! Nous sommes toujours à la recherche de talents créatifs, donc si vous avez une idée de design de papier peint, n'hésitez pas à la soumettre. Se joindre à! →

Nous publions chaque jour un nouvel article sur divers sujets d'actualité dans l'industrie du Web. En voici quelques-uns que nos lecteurs ont semblé apprécier le plus et ont recommandé davantage:

  • «Définition de TypeScript pour les projets Modern React à l'aide de Webpack et Babel»
    par Bénédiction Krofegha
    Cet article présente Typescript, un exposant de JavaScript qui présente la fonctionnalité de type statique pour repérer les erreurs courantes sous forme de codes de développeurs, ce qui améliore les performances, d'où des applications d'entreprise robustes. Vous apprendrez également à configurer efficacement TypeScript dans un projet React lors de la création d'une application Money Heist Episode Picker, en explorant TypeScript, des crochets React tels que useReducer, useContext et Reach Router.
  • «Un guide complet des claviers mécaniques»
    par Ben Frain
    Combien de réflexion avez-vous mis sur votre périphérique d'entrée principal? Avez-vous déjà pensé à quel point votre interface avec votre ordinateur pourrait être meilleure? Dans cet article, nous plongeons dans les possibilités des claviers mécaniques. Les différentes dispositions, types de commutateurs et même le matériau des touches. Attachez-vous – ce sera une plongée profonde!
  • «Micro-typographie: comment espacer et marquer les signes de ponctuation et autres symboles»
    par Thomas Bohm
    Depuis des centaines d'années, nous utilisons l'espace blanc en typographie. Aujourd'hui, en 2020, comment ajouter de l'espacement aux signes de ponctuation et aux autres symboles, et comment ajuster l'espace à gauche et à droite de manière simple et cohérente? Ce n'est pas aussi facile et rapide qu'il devrait l'être.
  • "Comment passer des données entre les composants dans Vue.js"
    par Matt Maribojoc
    Avec autant de façons différentes de partager des données entre les composants, vous devez savoir quelle technique est la mieux adaptée à votre situation. Analysons trois des moyens les plus courants de transmettre des données dans VueJS.
  • «Réduire les risques liés à la conception»
    par Eric Olive
    La pression de précipiter la recherche sur le marché et l'utilisabilité comporte des risques. Nous proposons quatre techniques pratiques pour atténuer ce risque et créer des conceptions qui servent mieux les clients et l'entreprise: le contexte plutôt que la commodité, le compromis, les meilleures décisions de conception, la réduction de la conception.

Les meilleurs choix de notre newsletter

Soyons honnêtes: toutes les deux semaines, nous avons du mal à garder les numéros de Smashing Newsletter à une longueur modérée – il y a juste donc beaucoup de gens talentueux qui travaillent sur des projets brillants! Bravo à toutes les personnes impliquées!

Intéressé par le parrainage? N'hésitez pas à consulter nos options de partenariat et à contacter l'équipe à tout moment – ils seront sûrs de vous recontacter immédiatement.

P.S. Un grand merci à Cosima Mielke pour avoir écrit et préparé ces articles!

Création de palettes de couleurs accessibles

Trouver la teinte ou la nuance parfaite d'une couleur n'est pas seulement une question de goût mais aussi d'accessibilité. Après tout, si le contraste des couleurs fait défaut, un produit pourrait, dans le pire des cas, même devenir inutilisable pour les personnes ayant une déficience visuelle. Un vérificateur de contraste très détaillé pour vous aider à détecter les pièges potentiels à l'avance provient de Gianluca Gini: Geenes.

Geenes "border =" 0

L'outil vous permet de bricoler les plages de teintes et la saturation et d'appliquer les palettes de couleurs à l'une des trois maquettes d'interface utilisateur sélectionnables. Une fois appliqué, vous pouvez déclencher différents types de déficiences visuelles pour voir comment les personnes affectées voient les couleurs et, enfin, prendre une décision éclairée sur les meilleurs tons pour votre palette. Pour utiliser les couleurs immédiatement, copiez et collez leur code ou exportez-les vers Sketch.

Amour en ligne de commande

Il n'est pas rare que la documentation technique soit sèche et intimidante, en particulier pour les personnes qui commencent tout juste avec un nouvel outil. Cela peut devenir assez frustrant, en particulier lorsqu'un manuel est difficile à lire ou à suivre, ou lorsque les explications sont verbeuses et manquent d'exemples.

Dash Dash "border =" 0

Dash Dash prend les pages de manuel open source Unix (Linux, BSD, macOS) et définit le contenu dans un type et une mise en page magnifiques. Il fournit non seulement des explications sur toutes les commandes, mais également des sections de recherche, des exemples et TL; DR. En outre, The Art of Command Line vous emmène dans un voyage vers la ligne de commande des bases au débogage du système.

Et si vous préférez les techniques de ligne de commande avancées, cmdchallenge vous invite à résoudre les tâches avec une seule ligne de bash. (vf)

Bibliothèques de composants accessibles

Alors que de nombreuses bibliothèques de composants que nous créons tentent de couvrir tous les suspects habituels (les accordéons, les tableaux, les carrousels, les listes déroulantes, ainsi que la typographie, les couleurs et les ombres de boîte), No Style Design System by Adam Silver est concentré principalement autour de l'accessibilité et des formulaires Web.

Bibliothèques de composants accessibles "border =" 0

En tant que système créé pour et utilisé dans son livre sur les modèles de conception de formulaires, la bibliothèque d'Adam fournit un ensemble de composants accessibles pour tout, de la saisie semi-automatique, des cases à cocher et de la révélation des mots de passe aux radios, des boîtes de sélection et des steppers. La plupart d'entre eux ont un style CSS minimal avec un balisage propre et accessible. Et si vous avez besoin de composants légèrement plus avancés, les composants inclusifs de Heydon Pickering sont là pour vous: avec des didacticiels complets sur les cartes accessibles, les tableaux de données, les notifications, les curseurs, les inerfaces à onglets, les info-bulles, les menus et les bascules. (vf)

Cascades CSS personnalisées

Miriam Suzanne a construit une démo pour illustrer une façon très intelligente de définir une cascade de propriétés personnalisées. Celui qui vous permet de déterminer quelle intention doit avoir la priorité, sans se soucier de la spécificité de la façon dont la valeur est définie.

Voir le stylo [Custom Cascades](https://codepen.io/smashingmag/pen/JjYawPP) par Miriam Suzanne.

Voir le Pen Custom Cascades de Miriam Suzanne.

Miriam montre comment cela fonctionne à l'exemple d'un bouton. En raison de la disposition de la cascade, le bouton par défaut revient toujours sur --btn-bg - par défaut. Ajout du désactivée , remplace toujours toutes les autres couleurs de bouton, peu importe où elles sont définies et, lorsque de nouveaux types de bouton sont créés, --btn-bg - type garantit que seules les valeurs par défaut sont remplacées, mais pas l'état. L'approche vous permet également de définir ces valeurs de manière contextuelle. Une solution intelligente pour éviter les dangers habituels que les styles en ligne hautement spécifiés entraînent généralement.

Signets frontaux

Certains d'entre nous enregistrent tous les articles et discussions utiles qu'ils rencontrent dans un dossier de signets en constante augmentation (ce qui peut parfois rendre difficile la recherche de ce que vous recherchez), d'autres ont une approche plus organisée. Comme Manuel Matuzović.

Signets frontaux "border =" 0

Manuel recueille des articles et parle de HTML, CSS et JavaScript sur son site Signets frontaux, regroupés alphabétiquement par éléments, attributs, propriétés, sélecteurs, méthodes et expressions. Peu importe si vous cherchez des informations sur la façon d'utiliser correctement aria-labelledby ou ce que le ::marqueur pseudo-élément est tout au sujet, les chances sont bonnes que Manuel a déjà compilé des ressources utiles sur le sujet. Soit dit en passant, si vous pensez qu'une ressource manque dans la collection, n'hésitez pas à y contribuer sur GitHub.

Trucs et astuces GitHub

Savez-vous comment écraser automatiquement les validations sur GitHub lors de la fusion des demandes d'extraction? Ou comment ouvrir un dépôt dans le navigateur à l'aide de GitHub CLI? Sinon, la collection de trucs et astuces de GitHub de Joe Previte pourrait être pour vous.

Trucs et astuces GitHub "border =" 0

Dans des vidéos de petite taille, Joe partage de petits conseils puissants pour faire passer votre flux de travail GitHub au niveau supérieur. Et pour ceux d'entre vous qui préfèrent apprendre en lisant, la plupart des conseils sont également disponibles sous forme de courts articles de blog. Petits gains de temps pratiques.

Le son des collègues

Le travail à domicile peut avoir de réels avantages par rapport au travail à partir d'un bureau, mais soyons honnêtes, cela peut aussi être une expérience plutôt solitaire, lorsqu'il n'y a pas de collègues autour. Si vous sentez que votre bureau à domicile devient trop calme et que vous avez besoin d'un peu d'agitation en arrière-plan pour rester concentré, Le son des collègues a ton dos.

The Sound Of Colleagues "border =" 0

Le son des collègues vous permet de mélanger les bruits de bureau pour créer votre bruit ambiant de bureau personnalisé. Les gens tapent et parlent, les téléphones sonnent, la machine à café, l'imprimante – toutes ces petites choses s'additionnent pour apporter un peu de sensation de bureau à votre maison. Peut-être que cela vous aidera même à augmenter votre productivité, qui sait?

Une bibliothèque de lecteur multimédia minimaliste et moderne

Si vous souhaitez intégrer un lecteur multimédia sur votre site, Vime pourrait être utile de regarder de plus près. Construite autour de l'idée que vous contrôlez le lecteur, et non l'inverse, la bibliothèque open source offre une alternative à Videojs et Plyr et prend en charge HTML5, HLS, Dash, YouTube, Vimeo et Dailymotion.

Vime "border =" 0

Vime ne brille pas seulement avec un look minimaliste et élégant, mais il est également réactif, accessible, modulaire et léger. Il se débrouille sans aucune dépendance externe et est disponible dans différents packages adaptés à différents besoins afin que vous puissiez choisir exactement ce qui est requis pour votre cas d'utilisation. Et comme minimaliste ne signifie pas fade, Vime est soutenu par un système de plugins qui offre beaucoup de place pour la personnalisation – pensez aux contrôles personnalisés, aux paramètres, aux info-bulles, etc. Les deux dernières versions de tous les navigateurs modernes ainsi que IE11 sont prises en charge.

Smashing Editorial(cm, vf, ra)