Fermer

octobre 16, 2020

Une mise à jour mensuelle avec de nouveaux guides et ressources communautaires


À propos de l'auteur

Jonglant quotidiennement entre trois langues, 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…
En savoir plus sur
Iris

Il est temps pour une autre mise à jour mensuelle! Rejoignez-nous pour partager les dernières nouvelles et mettre en évidence les choses que nous avons aimé lire au cours du mois dernier.

Que vous soyez motivé pour commencer à créer des œuvres d'art par code ou que vous dépensez trop cher. le temps de s'énerver à cause des pages de divulgation de politique de site Web laides nous aimons toujours avoir votre dos. Chez Smashing, nous nous engageons à nourrir la curiosité sur ce qui fonctionne et ce qui ne fonctionne pas, à aider les gens à améliorer leurs compétences et leurs flux de travail, et enfin et non des moindres, à affiner leur équilibre travail-vie personnelle.

La meilleure façon de s'améliorer ensemble est d'apprendre les uns des autres, et quel meilleur moyen existe-t-il que de promouvoir de nouvelles idées et la voie à suivre pour l'industrie du Web. Un rapide coup d'œil à nos guides en constante évolution vous montrera que nous sommes déterminés à rassembler une variété de sujets qui nous aideront tous à explorer et à apprendre de nouvelles choses.

Vous pouvez toujours suivez-nous sur Twitter Facebook LinkedIn et abonnez-vous à notre flux RSS mais c'est bien d'avoir un aperçu des plus importants les choses en un seul endroit.

Alors, Quoi de neuf?

Eh bien, les choses ne deviennent jamais ennuyeuses à Smashing, c'est sûr! Des réunions en ligne avec les membres de l'équipe et des sessions de brainstorming aux ateliers Smashing en ligne et aux événements en direct – chaque jour est super excitant et apporte de nouveaux défis. Cependant, il y a une chose qui fait rebondir toute l'équipe sur les murs: notre tout nouveau livre! « TypeScript In 50 Lessons » est un livre qui décompose les bizarreries de TypeScript en de courtes leçons faciles à gérer.

Si vous passez énormément de temps à programmer et que vous voulez être plus productif, ceci est le livre pour vous; mais c'est aussi pour les développeurs qui ont déjà plongé leurs orteils dans TypeScript et qui veulent maintenant se mouiller les pieds. Des systèmes de types à la définition de scénarios JavaScript complexes, nous nous sommes associés à Stefan Baumgartner pour vous aider à perdre beaucoup moins de sueur et de larmes dans vos projets!

Vous n'êtes pas convaincu? Vous pouvez accéder à la table des matières et même télécharger un échantillon gratuit (2,3 Mo, PDF).

 TypeScript en 50 leçons

Lecture recommandée sur SmashingMag:

Online Events: See You There?

 SmashingConf San Francisco Online 2020 Et ainsi le compte à rebours pour l'année 2021 commence! Nous avons un autre événement en direct à venir du 10 au 11 novembre: SmashingConf San Francisco . Les billets horaires et sont en ligne pour que vous puissiez les consulter. Nous ne manquerons pas d’organiser une grande fête pour notre dernier événement de 2020!

Pour ce qui est de nos ateliers en ligne nous avons encore un bon nombre de places disponibles pour vous! Nous espérons que vous trouverez au moins un atelier qui correspond à vos projets et à votre cheminement de carrière, et qui nous permettra également de vous simplifier la vie:

Smashing Podcast: Branchez-vous et inspirez-vous

Chaque deuxième mardi, ] Drew McLellan parle à des experts en conception et développement de leur travail sur le Web. Vous pouvez vous abonner via votre application préférée pour obtenir de nouveaux épisodes dès qu'ils sont prêts.

 The bi-hebdomadaire Smashing Podcast Pssst. ] Au fait, y a-t-il un sujet que vous aimeriez entendre et en savoir plus? Ou peut-être que vous ou quelqu'un que vous connaissez aimeriez parler d'un sujet lié au Web et au design qui vous tient à cœur? Nous aimerions recevoir de vos nouvelles! N'hésitez pas à nous contacter sur Twitter et nous ferons de notre mieux pour vous répondre dans les plus brefs délais.

Le prochain épisode de podcast sortira mardi prochain ( 20 octobre). ). Nous allons parler avec Stefan Baumgartner sur tout ce qui concerne Typescript ! Restez à l'écoute!

Smashing Newsletter: Meilleurs choix

 The hebdomadaire Smashing Newsletter Comme nous avons commencé à envoyer des éditions hebdomadaires du Smashing Newsletter, nous visons des éditions plus courtes et problèmes spécifiques à un sujet. Jusqu'à présent, nous avons envoyé des éditions axées sur CSS accessibilité frontale JavaScript UX et même une sur petits outils utiles et extensions de navigateur . Bien sûr, nous aimons ajouter un mélange d'autres sujets, juste pour qu'il y ait quelque chose pour tout le monde! 😉

Nous adorons partager toutes les choses intéressantes que nous voyons faire à travers les communautés de l'industrie du Web, et nous espérons que vous contribuerez à faire passer le mot! Voici quelques-uns des projets que nos abonnés ont trouvés les plus intéressants et les plus précieux:

Une bibliothèque fiable de sélecteur de dates

Il existe des dizaines de bibliothèques de sélecteurs de dates, mais c'est toujours formidable d'avoir des bêtes de somme fiables qui fonctionnent uniquement sur tous les navigateurs , n'ont pas de dépendances lourdes, sont écrits raisonnablement bien et répondent à toutes les principales exigences d'accessibilité.

 A Reliable Date Picker Library "border =" 0

Duet Date Picker est juste comme ça. Il s'agit d'un sélecteur de dates accessible et conforme aux WCAG 2.1 qui peut être implémenté et utilisé dans n'importe quel framework JavaScript ou pas du tout. Il est livré avec une fonctionnalité intégrée qui vous permet de définir une date minimale et maximale autorisée, et pèse environ 10 Ko minifiés et gzipés (cela inclut tous les styles et icônes).

Si vous avez besoin d'une alternative, consultez React Dates une bibliothèque publiée par Airbnb qui est optimisée pour l'internationalisation, tout en étant accessible et adaptée aux mobiles.

The Deck Of Brilliance

Vous trouvez parfois face à une page blanche avec peu ou pas inspiration que ce soit? La concurrence avec des créations des quatre coins du monde ne facilite certainement pas la création de nouvelles idées, surtout lorsque vous avez l'impression qu'elles ont toutes déjà été prises.

 The Deck of Brilliance "border =" 0

Le Deck of Brilliance vous offre 52 outils gratuits qui ne manqueront pas de vous aider à trouver des idées en peu de temps. Tout ce que vous avez à faire est de choisir un outil l'un après l'autre et d'être prêt à noter vos idées lorsqu'elles commencent à arriver. Plus vous générez d'idées, meilleures sont les chances de réussir la grande!

BD accessible [19659039] Lorsque nous utilisons des formes et des mises en page légèrement plus complexes sur le Web, il semble parfois beaucoup plus facile de simplement l'enregistrer en tant qu'image de premier plan ou d'arrière-plan et de diffuser différentes images sur de petits et grands écrans. Cela est vrai pour les tableaux et graphiques compliqués ainsi que pour les bonnes vieilles bandes dessinées avec des bulles parlantes, mais que se passerait-il si nous pouvions réinventer l'expérience complètement?

 Accessibilité des bandes dessinées "border =" 0

Comica11y est une expérience de Paul Spencer qui vise à réaliser une expérience de lecture de bande dessinée en ligne tout compris. Et si nous pouvions avoir différents modes de lecture pour la bande dessinée, par exemple avec sous-titres codés, gestion appropriée de la mise au point pour naviguer entre les panneaux, mode à contraste élevé, filtres de daltonisme SVG, bulles programmatiques, texte sélectionnable et traduisible, support LTR et RTL, et même tailles de police réglables? Une merveilleuse initiative qui montre à quel point nous pouvons relever les défis de l'interface utilisateur et utiliser le Web pour améliorer considérablement l'expérience.

Une bibliothèque de ressources gratuite pour les concepteurs de produits

De nos jours, il ne nous faut pas trop de temps pour rechercher un sujet nous voulons en savoir plus sur. Les réponses sont littéralement à un clic. Mais vous souvenez-vous de la dernière fois que vous avez jeté un coup d'œil aux signets de votre navigateur? Enregistrer des pages pour les lire ou les consulter plus tard est sûrement utile, mais ne serait-il pas pratique si notre source d’inspiration était prête et disponible en un seul endroit?

 Design Notes "border =" 0

Si vous êtes dans la conception de produits, Design Notes est une bibliothèque qui s'avérera être un véritable gain de temps. Il renvoie actuellement à 334 ressources que vous pouvez filtrer en fonction du sujet que vous recherchez: des ressources liées à l'expérience utilisateur aux outils de conception et de prototypage. N'importe qui peut contribuer au site, alors n'hésitez pas à partager si quelque chose manque!

The UX Of Banking

Chaque banque prétend offrir la meilleure expérience bancaire globale, et pourquoi ne le ferait-elle pas, n'est-ce pas? Eh bien, afin de découvrir ce que les banques challenger ont fait différemment, le spécialiste UX Peter Ramsey a décidé qu'il était temps d'en mettre quelques-unes à l'épreuve.

 The UX Of Banking "border =" 0

Premièrement, il a ouvert 12 comptes bancaires réels au Royaume-Uni et a tout enregistré. Ce qui suivit fut six chapitres détaillés de son parcours utilisateur : ouvrir un compte, effectuer son premier paiement, geler sa carte, effectuer des paiements internationaux, ouvrir des banques et enfin, le support client. Un guide de référence fantastique pour vous aider à créer de meilleures expériences!

Comment faire fonctionner les tableaux de données partout

L'une des principales difficultés lors de la conception de tableaux est que nous devons trouver un moyen d'afficher la table entière (ou du moins sa structure complètement) – que ce soit sur de petits écrans ou de grands écrans. Avec la navigation, on pourrait trouver un moyen avec des tabulations, des accordéons ou même des carrousels, mais les tables sont la bête d'un autre genre. Alors, comment pouvons-nous les apprivoiser? Dans son article, « Design Better Data Tables », Andrew Coyle met en évidence quelques modèles de conception que nous pourrions appliquer (par exemple en permettant aux utilisateurs d'afficher / masquer des colonnes ou de diviser les lignes en cartes).

 Comment faire fonctionner les tableaux de données partout "border =" 0

Molly Hellmuth " The Ultimate Guide to Designing Data Tables " fournit un ensemble complet de bonnes pratiques pour la conception de tableaux, ainsi que avec un kit gratuit pour les tables. « Comment créer des tableaux Web complexes » explique comment créer un système maintenable pour des tableaux complexes avec redimensionnement, filtrage, troncature et divers états pour chaque cellule. Besoin de faire fonctionner une table pour mobile?

De plus, « Concevoir une table complexe pour mobile » montre comment transformer une table d'entreprise complexe en un ensemble gérable de cartes, de filtres et de vues sur mobile en explorant il ligne par ligne ou colonne par colonne. Un grand ensemble d'articles pour se plonger dans ces tables délicates!

Git Cheatsheets

Aw, Git! C’est toujours un défi de se souvenir de toutes les bonnes commandes au bon moment, donc avoir quelques feuilles de triche peut être très utile. Git log présente des façons courantes d'utiliser le journal Git pour suivre ce qui a changé ou rechercher des commits. Git Branch cheatsheet montre comment lister les branches, en créer de nouvelles, renommer et changer de branche, ainsi que les supprimer.

 Git Cheatsheets "border =" 0

Need quelque chose d'un peu plus avancé? Git Cheatsheet d'Atlassian explique plus en détail les bases de Git, l'annulation des modifications, la réécriture de l'historique Git, les branches Git et les dépôts distants, et les GitHub Cheat Sheet montrent comment inspecter et comparer, suivre le chemin changez, partagez et mettez à jour, ignorez les modèles et ajoutez des validations temporaires.

Liste croissante des ressources d'accessibilité

Il est fort probable qu'au moment où vous avez besoin de rechercher une solution ou une technique, il soit assez difficile de la trouver il rapidement. Hannah Milan A11yresources fournit une liste croissante d'outils et de ressources d'accessibilité, allant des articles et extensions de navigateur aux newsletters, podcasts et vidéos.

 Growing List Of Accessibility Resources "border =" 0

Une liste assez complète, bien organisée et structurée – avec à peu près tout ce dont vous pourriez avoir besoin pour résoudre rapidement ce problème d'accessibilité. Pour les signets!

L'état des systèmes de conception et du prototypage 2020

Il est toujours intéressant d'explorer ce qui a fonctionné ou échoué pour d'autres professionnels, afin que nous puissions prendre certaines des leçons et les appliquer à notre contexte. L'enquête 2020 Design Systems Survey de Sparkbox met en évidence les résultats de l'enquête annuelle menée auprès des organisations qui ont fortement investi dans le bon fonctionnement des systèmes de conception. L'enquête se penche sur les défis courants du système de conception et les stratégies pour les surmonter. L'étude se penche également sur les systèmes de conception internes, la maturité du système de conception et les contributions d'un système de conception à une culture positive au sein de ces organisations.

 The State of Design Systems and Prototyping 2020 "border =" 0

Dirigé par l'équipe derrière Framer, The State of Prototyping 2020 fournit un rapport PDF de 31 pages explorant les défis actuels et les avantages du prototypage. Seul un tiers des répondants est en mesure de fournir un prototype en 12h. Les défis communs sont les courbes d'apprentissage raides lorsque vous commencez à utiliser un outil pour la première fois, et souvent l'outil de prototypage ne répond pas aux exigences exactes. Une inscription par e-mail est requise.

Pas assez bien? Vous pouvez également explorer le State of Email 2020 qui présente les tendances actuelles en matière de conception et de développement d'e-mails, fourni par Litmus.

Get Stuff Done With The Command Line

Pour certains, la ligne de commande est un meilleur ami du codeur, pour les autres, il pourrait se sentir plus comme un ennemi redoutable. Le fait est qu'il y a beaucoup de choses géniales que vous pouvez faire avec le terminal. Marcel Bischoff organise une liste qui regorge d'applications de ligne de commande utiles .

 Awesome Command Line Apps "border =" 0

La liste couvre tout, de l'automatisation et sauvegarde vers le chiffrement, la productivité, le contrôle de version et bien plus encore, ce qui facilitera la vie d'un développeur. Même les jeux sont présentés pour adoucir une longue session de codage. Votre application de ligne de commande préférée ne fait pas encore partie de la liste? Vous êtes bien entendu vivement encouragé à y contribuer. Un pour les signets.

Testez vos formulaires avec des données factices

Le test des formulaires peut prendre du temps, mais heureusement, c'est une tâche qui peut être facilement automatisée. L'extension de navigateur Fake Filler a été conçue pour cela.

 Fake Filler "border =" 0

Disponible pour Chrome et Firefox Fake Filler vous aide à tester vos formulaires rapidement et efficacement en remplissant toutes les entrées de formulaire avec des données factices et en sélectionnant au hasard des boutons radio, des menus déroulants et des cases à cocher. L'outil prend en charge la propriété maxlength et ignore les champs CAPTCHA, hidden, disabled et readonly . Un excellent petit ajout à la boîte à outils numérique de tout développeur.

Faites des appels d'équipe sans bruits de fond

Le chien qui aboie, les enfants crient ou un chantier de construction juste devant votre fenêtre – il y a beaucoup de bruits qui interrompent un appel ou un réunion d'équipe virtuelle en ces temps où le travail à domicile est devenu la nouvelle norme. Si vous êtes entouré d'une agitation constante et que vous craignez que cela ne distrait vos interlocuteurs, pourquoi ne pas laisser l'IA soulager la situation?

 Krisp "border =" 0

The AI – l'outil alimenté par Krisp fait exactement cela: en cliquant sur un bouton, il supprime le bruit de fond entre vous et les autres participants à l'appel lorsque vous parlez, et inversement. Que vous souhaitiez organiser des réunions virtuelles sans bruit ou que vous prévoyiez d'enregistrer un podcast même si votre appartement est situé dans une rue animée, Krisp fonctionne dans plus de 800 applications de conférence, de messagerie vocale, de streaming et d'enregistrement. Le traitement audio se produit localement, ce qui signifie qu'aucune voix ou audio ne quittera l'appareil. Cela vaut la peine d'essayer.

Plus de trucs sensationnels

Ces dernières années, nous avons eu beaucoup de chance d'avoir travaillé avec des personnes talentueuses et attentionnées de la communauté Web pour publier leur riche expérience sous forme de livres imprimés qui résister à l'épreuve du temps . Paul et Alla font partie de ces personnes. Avez-vous déjà consulté leurs livres?