Font and icon toolkit based on CSS and LESS
POPULARITY
2 episodes with Font Awesome
2 episodes with Font Awesome
2 episodes with Font Awesome
2 episodes with Font Awesome
2 episodes with Font Awesome
2 episodes with Font Awesome
2 episodes with Font Awesome
18 episodes with Font Awesome
In deze aflevering hebben we het over Font Awesome 7, heeft Michele het over ChatGPT 4o image generation en er bespreken we de mogelijke integratie van Flexbox en Grid in CSS voor efficiëntere lay-outs. Ook introduceerde Figma updates zoals FigPals, verbeterde lagenbeheer en toegankelijkheidsfuncties. Michele beoordeelde PenPot, een open-source alternatief voor Figma, dat design en code naadloos integreert. 0:00 - Intro 01:03 - Font Awesome 7 is te pre-orderen - https://fontawesome.com 08:22 - CSS Paint-order property - https://frontendmasters.com/blog/layered-text-headers/ 11:36 - ChatGPT 4o afbeeldingen genereren 20:29 - Flexbox en Grid worden wellicht samengevoegd? - https://webkit.org/blog/16587/item-flow-part-1-a-new-unified-concept-for-layout/ 26:49 - Figma updates - https://www.figma.com/release-notes/ 36:10 - Michele beoordeeld PenPot, het open source Figma alternatief - https://penpot.app/ 47:04 - Aqara U200 slot - https://www.aqara.com/eu/product/smart-lock-u200/ 51:22 - The Remarkable Life of Ibelin - https://www.netflix.com/nl/title/81759420
Shoelace creator Cory LaViska joins Amal & Jess to tell them all about the forward-thinking library of web components that just joined the Font Awesome family to create Web Awesome.
Shoelace creator Cory LaViska joins Amal & Jess to tell them all about the forward-thinking library of web components that just joined the Font Awesome family to create Web Awesome.
In deze aflevering klaagt Rick over zijn zoektocht naar een nieuwe auto met fatsoenlijk infotainmentsysteem, hebben we het over allerlei manieren waardoor je code uit Figma kunt krijgen of zelfs code in Figma kunt krijgen, Font Awesome begint een web component library genaamd Web Awesome en CSS is echt super in 2024. 0:00 - Intro 01:30 - Ranten over infotainment systemen 13:51 - Device eigenschappen simuleren in Chrome Devtools - https://twitter.com/jh3yy/status/1782176868080210159, Focussed pagina emuleren - https://frontendmasters.com/blog/devtools-tips-tricks/ 16:45 - Font Awesome komt met een nieuw project, Web Awesome - https://www.kickstarter.com/projects/fontawesome/web-awesome/description 25:50 - Rick is blij met nieuwe CSS Features 30:00 - Code connect voor Figma - https://github.com/figma/code-connect 35:15 - Figma styling op basis van Tailwind classes - https://twitter.com/burcs/status/1782829359050445295 37:45 - Zigbee led strip die ook werkt met Hue - https://www.aliexpress.com/item/1005005686420822.html 42:08 - Figma Typografie starter kit - https://www.figma.com/community/file/1362098125068472724/typography-variables-starter-kit 45:18 - Pocket Casts - https://pocketcasts.com/
Tu peux soutenir sur le podcast sur KissKissBankBank ou en mettant 5⭐️ sur Apple Podcasts ou Spotify !Vincent est le fondateur de Streamline.A l'origine, Vincent fait des études d'histoire. C'est sur un ordinateur de la fac qu'il découvre Photoshop et qu'il commence à faire des flyers dessus. Il demande ensuite une formation sur des logiciels comme Photoshop ou Illustrator, avant de devenir web-designer.Un jour, il fait de l'autostop et rencontre le fondateur de levillage.org, dont il rejoint l'entreprise dès le lendemain. Entreprise qu'il quitte au bout de 3 ans, car il est en désaccord avec la direction prise par le fondateur.Vincent devient alors designer freelance. Il commence par travailler sur des sites marketing, avant de travailler petit à petit vers des applications. Au bout de 6 ans, il déménage de Rennes à Hong Kong et voyage dans toute l'Asie. Au cours de son voyage, il lance plusieurs side projects. Le premier, Interface Design Framework, s'inspire des développeurs avec lesquels il travaille. Il s'agit alors d'élément pour designer facilement et rapidement dans Illustrator avec des couleurs et des icônes réutilisables simplement. Après cela, il lance Minicons, un set de 1500 icônes ! Au départ, il s'agit d'un set d'icônes par Vincent pour l'aider à avancer plus vite dans son travail. Et au fur et à mesure il enrichit son set d'icônes, avant de le mettre en ligne et de le voir exploser ! Rapidement, il enrichit son set et le rend en partie payant. Le succès continue et lui permet de se faire de l'argent. Au bout d'un temps, Vincent finit par faire de la création d'icônes son métier à temps plein et abandonne le freelance.Vincent lance alors plusieurs projet : les icônes Streamline, le logiciel Fontastic, les illustration Kameleon, ou encore d'autres packs d'icônes et d'illustrations. Puis Vincent se focalise sur Streamline et le transforme en site référence d'icônes sur le marché.Cet épisode est l'occasion de parler de la création d'une icône et d'un pack qui va avec. Vincent nous révèle sa sauce secrète :Déterminer un style unique Définir la parfaite harmonieTrouver la bonne symboliqueAvoir de la consistence entre les icônes Aujourd'hui, Vincent n'est plus seul. Il gère une équipe de 18 personnes. Il revient sur la façon dont il travaille avec son Directeur Artistique et ses graphistes pour créer toujours plus d'icônes, avec une qualité constante.Les ressources de l'épisodeStreamlineIndie MakersSpline Pour contacter VincentXHébergé par Ausha. Visitez ausha.co/politique-de-confidentialite pour plus d'informations.
Font Awesome is back with Web Awesome, an open source library of web components that will work with any framework because it's based on standards. Today on Syntax we have Konnor Rogers and Cory LaViska here to talk all things Web Awesome. Show Notes 00:00 Welcome to Syntax! 00:47 Brought to you by Sentry.io. 02:49 What is Shoelace? 07:21 What is Font Awesome? 08:07 Font Awesome is getting into Web Components? 11:35 What is Shoelace's relationship with Web Awesome? 13:33 Is the idea to make it quick to get up and running? 15:46 What is the autoloader? 16:29 Where does Web Awesome fit in the ecosystem? 18:13 What does the styling game look like? 20:33 What is Part in CSS? CSS Part mdn web docs 22:06 The reason we're so stoked with Web Components. 23:32 Custom elements are a natural progression. 24:51 What are your thoughts on Open UI initiatives? Floating UI Close Watcher Can I Use 27:40 Wes' escape key conundrum. 30:21 A bug on the Syntax site. 31:19 Let's talk about Kickstarter. 35:24 Do you know what premium inputs will be available in Web Awesome? 36:12 Rich text editor. 40:18 Setting goals. 41:48 Kickstarter giveaways. 42:47 Have you tried drag and drop? Pragmatic Drag and Drop 44:57 The layout component. 48:50 What are your favorite components? 50:29 Sick Picks + Shameless Plugs. Sick Picks Konnor: Enhance.dev, Extism.org Cory: Lit.dev Shameless Plugs Cory: Kickstarter Konnor: Everyone involved in open UI Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads
Ever wondered how the 'less is more' philosophy could revolutionize your coding practice? We're back with a treasure trove of insights on paring down to amp up performance and maintainability in your projects. Kicking things off, we share our experiences in decluttering codebases, inspired by the simplicity that Elon Musk champions. From the transition in Jumpstart to Hurrocons from Font Awesome to embracing Rails defaults for the sake of newbies, it's all about enhancing learning curves and reducing complexity. And if you've been juggling with the art of productivity, the Para method by Tiago Forte might just be your next audiobook binge!Transforming your home with smart automation isn't just a futuristic fantasy; it's a present reality that we dive into, discussing the ease and efficiency that smart devices bring to day-to-day life. Imagine controlling your home's ambiance and utilities with a simple voice command or a programmed routine; we chat about the marvels of voice-activated LEDs, the convenience of Home Assistant, and my personal plunge into the world of 3D printing. But it's not all play; we get technical about the Ruby 3.0 upgrade and the fine points of a JIT compiler, revealing the mix of excitement and challenge that comes with innovation.Lastly, let's talk about the future of database architecture and job processing in Ruby on Rails. The conversation includes the adaptability offered by feature flags, the strides of ActiveJob with Rails 7.1, and the refreshing simplicity of Sucker Punch. We're eagerly awaiting what Rails 8 will unveil, especially as we look back fondly at early MongoDB days and speculate on SQLite's potential. Join us as we share our trials, triumphs, and the thrilling future ahead for Rails enthusiasts and developers alike.
In our last installment of Programming By Stealth, Bart started teaching us how to bundle an app/website using our bundler of choice, Webpack. The app/website he's creating for us is very simplified but is intended to allow us to exercise every one of the kinds of things we'd want to bundle. This week we finish all of the tools he wanted to teach us to bundle. In PBS 138, after explaining to us why we would want to do this, and initializing things, he taught us to import a pure JavaScript library with jQuery as an example, and a pure CSS library with basic Bootstrap as the example. In this week's show, we learn how to install and use Mustache for templating in a Webpack world. The process is quite a bit different from how we originally learned to implement Mustache in Programming By Stealth. Then we learn how Bootstrap 5 now lets us import just what we need (instead of all of Bootstrap). We need some fancy icons so Bart teaches us about Bootstrap icons which he now favors for free icons over Font Awesome. Our web app wouldn't be complete if we didn't have a fun font, so we learn to import free web fonts from Fontsource all with Webpack. Like the first half of the Webpack worked example, Bart's process of doing repetitive actions but for different reasons definitely helped cement the concepts for me.
In our last installment of Programming By Stealth, Bart started teaching us how to bundle an app/website using our bundler of choice, Webpack. The app/website he's creating for us is very simplified but is intended to allow us to exercise every one of the kinds of things we'd want to bundle. This week we finish all of the tools he wanted to teach us to bundle. In PBS 138, after explaining to us why we would want to do this, and initializing things, he taught us to import a pure JavaScript library with jQuery as an example, and a pure CSS library with basic Bootstrap as the example. In this week's show, we learn how to install and use Mustache for templating in a Webpack world. The process is quite a bit different from how we originally learned to implement Mustache in Programming By Stealth. Then we learn how Bootstrap 5 now lets us import just what we need (instead of all of Bootstrap). We need some fancy icons so Bart teaches us about Bootstrap icons which he now favors for free icons over Font Awesome. Our web app wouldn't be complete if we didn't have a fun font, so we learn to import free web fonts from Fontsource all with Webpack. Like the first half of the Webpack worked example, Bart's process of doing repetitive actions but for different reasons definitely helped cement the concepts for me.
Manton Reece, founder of Micro.blog, comes on the podcast to talk about some of the new things that have been added to the platform just lately, such as: Location features New themes: Gateway and Alpine Font Awesome plug-in New status bubble No Robots plug-in for disabling search engine indexing Indie Microblogging book status update
2022-03-01 Weekly News - Episode 137Watch the video version on YouTube at https://youtu.be/kRi3dMfLPxA Hosts: Gavin Pickin - Senior Developer for Ortus SolutionsDan Card - Senior Developer for Ortus SolutionsThanks to our Sponsor - Ortus SolutionsThe makers of ColdBox, CommandBox, ForgeBox, TestBox and almost every other Box out there. A few ways to say thanks back to Ortus Solutions: Like and subscribe to our videos on YouTube. Help ORTUS reach for the Stars - Star and Fork our Repos https://github.com/coldbox/coldbox-platform https://github.com/Ortus-Solutions/ContentBox/ https://github.com/Ortus-Solutions/commandbox/ https://github.com/ortus-solutions/docker-commandbox https://github.com/Ortus-Solutions/testbox/ https://github.com/coldbox-modules/qb/ https://github.com/coldbox-modules/quick/ https://github.com/coldbox-modules/cbwire https://github.com/Ortus-Solutions/DocBox Star all of your Github Box Dependencies from CommandBox with https://www.forgebox.io/view/commandbox-github Subscribe to our Podcast on your Podcast Apps and leave us a review Sign up for a free or paid account on CFCasts, which is releasing new content every week Buy Ortus's Book - 102 ColdBox HMVC Quick Tips and Tricks on GumRoad (http://gum.co/coldbox-tips) Patreon SupportWe have 36 patreons providing 97% of the funding for our Modernize or Die Podcasts via our Patreon site: https://www.patreon.com/ortussolutions. News and EventsICYMI - Lucee 5.3.9.80 Release Candidate 1 - This release removes all traces of Log4j1With the advent of Lucee 5.3.9 -RC, we now have a build of CommandBox (5.5.0-alpha) which is 100% FREE OF LOG4J 1.x! https://downloads.ortussolutions.com/#/ortussolutions/commandbox/5.5.0-alpha/ Please help us test and use it if you need to get those #infosec monkeys off your back!
I neglected my visualizations web site, things made thinkable, for too long. Here's what I did to bring it back to life: Fixed the aspect ratio Made it reactive Embraced SVG Started a mailing list Stopped reusing code Switched to newer fonts Reduced bloat Added social meta tags Started tweeting about it Quit my jobs —Animating PNG images: Prototype, script.aculo.us and jQueryAnimating SVG: Snap.svgWeb-safe fontsMy go-to fonts: Bellefair and LatoSelf-hosting fontsBloatware: jsSocials, Font Awesome and Google AnalyticsMeta tagsMy Twitter handle: @markjjefferyAnother of my podcasts: The Quit Work PodcastCompare and contrast my first visualization:Trillion Dollar Economies (circa 2010, 960px wide)with my latest:Rivers of the Atlantic (circa 2022, scalable)Prefer to watch the video? Watch hereThe full article is here
In todays episode we are going to take a look at the new Visual Studio Code Aka VS Code Version 1.61 September 2021 updates and at Font Awesome V6 BETA. Watch the full episode on YouTube: https://youtu.be/HGhLHGDFeck Timestamps: 00:00 - Introduction 00:38 - What is Visual studio code? 00:49 - VS Code September 2021 version 1.61 updates overview 01:37 - Vs Code Split editors within the same group 01:59 - VS Code-Locked editor groups 02:06 - VS Code-Better display of deleted and readonly files 02:23 - VS Code Bracket pair guides 02:43 - VS Code-Fixed terminal dimensions 03:00 - VS Code - Jupyter Notebook improvements 03:30 - VS Code-Platform-specific extensions 03:47 - VS Code - Virtual Workspaces extension guide 04:11 - VS Code - Advanced container configuration 04:36 - Font Awesome V6 Beta 04:44 - What is Font Awesome --- This episode is sponsored by · Anchor: The easiest way to make a podcast. https://anchor.fm/app --- Send in a voice message: https://anchor.fm/menyhart-b-norbert9/message
We're talking about Cloudflare product updates, whether you should lie to the browser about image size, Chris is having Cloudinary issues, Dave's answering questions about upgrading from Vue 2 to Vue 3, a question about Font Awesome icons, and what's the deal with Webhint?
Justin Dorfman is Reblaze's Open Source Program Manager. He is also a bipolar who takes his time, sharing his experience on how he dealt with his mental health problems and succeed in his career. Professionally he is responsible for fostering the adoption of their project Curiefense in the cloud-native space. He also led similar initiatives for Gitcoin, Sticker Mule, & MaxCDN. Justin has contributed to Bootstrap, Font Awesome, jQuery, Nginx, GNU Bash, and many more. He also serves on the Selection Committee for Mozilla's Open Source Support (MOSS) program, as well as the Open Source Collective's board of directors. In 2017, he co-founded SustainOSS, which hosts events and podcasts for Open Source Software Sustainers.
There are so many tools that you open up each day to do your job as a WordPress website builder or developer. In fact, I'd go as far as say that if you actually counted up the tools that you use each month, it's going to be way more that you think. There's graphics to create, template to conjure up, themes and plugins to discover and implement, emails to send, ways of getting client content... Honestly, the list just goes on and on. Inspired by suggestions from the WP Builds Facebook Group, we decided to put together a podcast highlighting some of the resources you use. There's some real gems in here... honestly, so go check out the podcast today to find out more...
In this episode, James and Amy discuss the tech behind jamesqquick.com. This site was built on top of Gatsby and Sanity. They discuss the decisions James made along the way and the things he might do differently.SPONSORSPathwire / Mailgun / MailjetPathwire is a powerful email API and intuitive email marketing solution that delivers over 250 billion emails a year for 400,000 companies around the world.You can sign up now and try Mailgun or Mailjet for free today. Mailjet offers a trial that allows you to send 6,000 emails per month for free, forever. Mailgun offers a 3 month trial for 5,000 emails per month after which you only pay for what you send.For more information, simply visit Pathwire.comVercelVercel combines the best developer experience with an obsessive focus on end-user performance. Their platform enables frontend teams to do their best work. It is the best place to deploy any frontend app. Start by deploying with zero configuration to their global edge network. Scale dynamically to millions of pages without breaking a sweat.For more information, visit Vercel.comZEAL is hiring!Zeal is a computer software agency that delivers “the world's most zealous” and custom solutions. The company plans and develops web and mobile applications that consistently help clients draw in customers, foster engagement, scale technologies, and ensure delivery.Zeal believes that a business is “only as strong as” its team and cares about culture, values, a transparent process, leveling up, giving back, and providing excellent equipment. The company has staffers distributed throughout the United States, and as it continues to grow, Coding Zeal looks for collaborative, object-oriented, and organized individuals to apply for open roles.For more information visit their site.Show Notes0:00 Intro3:05 Context in building jamesqquick.com4:46 Deciding to rebuild the site on GatsbyGatsby - https://www.gatsbyjs.com/6:29 Upgrades and improvements from moving off WordPress8:28 The Gatsby Plugin Ecosystem9:03 Sending your RSS feed to Dev.to for cross-postingTutorial: Publishing a Post Pulled in via an RSS Feed12:18 Hosting13:00 Sponsor: Vercel13:49 Moving from Markdown to Sanity21:35 Email MarketingMailChimpConvertKitPodia22:25 Serverless Functions23:14 Sponsor: PathwireMailGun - http://mailgun.comMailJet - http://mailjet.com25:18 React Ecosystem26:12 React Awesome Reveal26:37 Font Awesome for Icons27:14 For styling, using ScssDifference between Scss and Sass30:45 Sponsor: ZEAL31:19 Things you'd do differentlyStyled ComponentsTailwind CSSNext.js35:14 Grab Bag Question #1: If you are the only updating Sanity, can you host it locally or does it need to be accessible online?36:12 Grab Bag Question #2: When will you migrate your site to Next.js?36:24 Grab Bag Question #3: How do you like Sanity as an authoring experience?37:29 Picks and Plugs37:40 James's Pick: Tripod with a Selfie Light38:34 James's Plug: James Q Quick on YouTube38:55 Amy's Pick: Hunt a Killer (30% off)40:30 Amy's Plug: SelfTeach.me on YouTube
The web is made up of Pictures and Words. Some of those pictures are moving (video), but it's basically just those two things. We have easy ways to deal with putting photos and other kinds of images onto our WordPress websites with the features that are baked in, but there's so much more to this topic. What kind of images are the best to use? How many thumbnail sizes should we be storing? Should we be serving our images over a CDN? Is it a good idea to compress our images so that they make a more lean loading experience? Where can we source our images? What software is good for quick alterations to the images that we've got. Honestly, there are a dozen more questions, but you get the idea that there's a lot more to images than meets the eye. Go listen to the podcast to find out more...
In this video I show you can use Font Awesome to create vector icons in your Xamarin.Forms app.Show Links:Blog - Embedded FontsFont AwesomeFont 2 C#Follow @JamesMontemagnoNever Miss an Episode: Follow @TheXamarinShowUseful Links:Learn more about XamarinLearn more about Xamarin.FormsLearn more about Cross-platform developmentXamarin Developer CenterXamarin BlogMicrosoft Learn Self-Guided TrainingCreate a Free Account (Azure)Xamarin Developers YouTube ChannelXamarin on TwitterGet your questions answered on the Microsoft Q&A for .NET
Sponsored by Linode Panelists Allen "Gunner" Gunn | Justin Dorfman | Pia Mancini | Richard Littauer Guest Tobie Langel Show Notes Welcome to Sustain! On today’s episode, we have special guest, Tobie Langel, the Founder of UnlockOpen, from Geneva, Switzerland. Tobie tells us all about UnlockOpen and what he does there. He tells us how he focuses on convincing companies that they need to contribute back to Open Source. Other topics we will talk about are DevOps culture, prototype JavaScript framework not being updated since 2015, which Tobie extensively explains what happened, as well as speaking about lessons to be learned and things we need to be aware of. There is so much great advice and stories shared on this episode. Download it now! [00:01:19] Tobie tells us about UnlockOpen and what he does. [00:02:30] Richard wants to know how do you get in the door as a consultant to try to talk to people about how they should use Open Source and how do you pitch that to people that don’t know what Open Source is? [00:08:04] Tobie discusses how he focuses on convincing companies that they need to contribute back to Open Source. Pia wonders if Tobie thinks we’re making progress towards cultural changes within the audience? [00:12:10] Allen asks Tobie if he’s advancing the notion of DevOps as a gateway drug for all of this open culture. Tobie mentions a book he’s reading called, Accelerate, that_ _talks about the benefits of DevOps culture to companies from a business perspective. [00:14:13] Justin wants to know where Tobie got his kind of background and he also wonders about project abandonment, and prototype JavaScript framework hasn’t been updated since 2015. So, what happened there and what lessons could be learned? [00:24:06] Tobie speaks about learning from history, about lessons to be learned, and things we have to be aware of. [00:26:06] Tobie mentions how he’s a huge fan of DHH and Basecamp and he gives some great advice that he’s learned on focusing on things that matter long term. Justin and Richard also have some positive advice and stories to share as well. [00:35:25] Richard makes an awesome statement here about being resilient. [00:36:20] Tobie tells us where we can find him to learn more about him. Spotlight [00:38:03] Justin’s spotlight is our first bonus podcast episode (#41) with Dave Gandy, and we discussed Font Awesome 6, the donut diet, commitments, and more. Check it out! ☺ [00:42:23] Allen’s spotlight is Open Tech Fund. [00:38:56] Richard’s spotlight is Aral Balkan, a cyborg rights activist. [00:39:17] Toby’s spotlight is a book by Nadia Eghbal called, Working in Public: The Making and Maintenance of Open Source Software. Quotes “It boils down to bottom line and top line. To some degree it’s more than that, obviously, culture, brand, making people feel happy to work in a company. All of those are critical for a company.” [00:10:45] “And we are at the point where we need to cross the chasm. So maybe move that from being something that is essentially something adopted by a few really performant companies at the helm of this effort and move that across to become more mainstream. [00:16:47] “And so the funny thing is I essentially learned JavaScript by reading the source code because there was no documentation and I started contributing to the library by writing documentation for it.” [00:17:44] “It took a lot of time for Sam to realize that he was burning out and just couldn’t spend the time that was needed to give more authority to other people on the project.” [00:21:58] “There was a lot of energy, and people are ready to do a lot of things for the rocket ship because you also benefit personally quite a bit when you’re investing your time in a rocket ship.” [00:25:19] “This goes right to the heart of what we’re trying to talk about here. And so I think one of the things that I’m really picking up from what you’re saying is that it’s better to dedicate yourself towards an ideology of working well in the open, of working with other people, of trying to consistently not just stay ahead of the curve, but work in a way that what you do will matter later.” [00:34:20] “At the same time you could carry that comparison even further kind of ad absurdum, like everything’s the same, because we all need to eat and we all get tired and we all get sleepy and we all get hungry, we’re all kind of anxious and we have to work with other people and what wears kind of annoying and it’s pretty tough.” Links Tobie Langel Twitter (https://twitter.com/tobie?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor) UnlockOpen (https://unlockopen.com/) Sustain Podcast-Episode 41: The Donut Diet, Commitments. and More Awesomeness with Dave Gandy (https://fireside.fm/s/fxw-Bcan+HH3L5owT) Open Technology Fund (https://www.opentech.fund/) Aral Balkan (https://ar.al/) [Working in Public: The Making and Maintenance of Open Source Software by Nadia Eghbal](https://www.amazon.com/Working-Public-Making-Maintenance-Software/dp/0578675862/ref=sr12?dchild=1&keywords=working+in+public%3A+the+making&qid=1592942530&sr=8-2) [Accelerate: The Science of Lean Software and DevOps:Building and Scaling High Performing Technology Organizations by Nicole Forsgren, PhD](https://www.amazon.com/Accelerate-Software-Performing-Technology-Organizations/dp/1942788339/ref=sr12?dchild=1&keywords=accelerate&qid=1592942345&sr=8-2) Credits Produced by Justin Dorfman (https://www.justindorfman.com/) Edited by Paul M. Bahr at Peachtree Sound (https://www.peachtreesound.com/) Show notes by DeAnn Bahr at Peachtree Sound (https://www.peachtreesound.com/) Ad Sales by Eric Berry Special Guest: Tobie Langel.
Sponsored By: Show Notes [00:01:32] Tessa heard in the Vue world, the pattern that you want to follow is props down events up, but a lot of pieces are a bit vague when it comes to abstractions. Tessa wants to learn more about the specific mechanics behind the approach versus something else like passing callbacks? Chris gives his thoughts on this. [00:07:53] Chris explains what .native does. He also gives some great recommendations. ☺ [00:10:36] Tessa wants Chris to expand more on what problems he has seen people trying to solve with .native. [00:13:40] Chris recommends some ways for communicating how a component is intended to be used in a way that’s more in keeping with props down events up versus passing callbacks. [00:16:43] V-bind attrs is explained as well as $attrs object. And Ben talks about concerns when people are justifying desire to document the callbacks. [00:19:55] Tessa explains an issue with passing down data you need via props and trying to build some kind of structure around that communication. Also, having several series of several generations of components and how does she get around this issue. Chris clarifies and Ben names it “The Prop Train Pattern.” Ari tells us what she does. [00:24:55] Chris talks about using Guillaume’s excellent v-tool tip component. [00:26:03] Tessa goes back to Chris’s example of Font Awesome and wants to confirm if she has some grandparent that has the Font Awesome data, then it’s going through a couple of other component layers to get to the icon component layer, can she just put v-bind attrs on the icon component or does she have to put that on every component in between as well? Chris explains. [00:30:01] Ben asks Chris to speak a little bit about the caveats when it comes to the reactivity part of refactoring everything to reply and inject. [00:33:24] Ben talks about one of the drawbacks of provide/inject. Chris shares some good naming tips and patterns that help developers when they’re looking at components. [00:48:00] Tessa brings up the EventBus and if anyone has any thoughts or experiences with it. Sponsor: Linode (https://promo.linode.com/vue/) Picks of the week: [00:54:09] Ben’s pick is Slay the Spire (Steam Game). [00:55:22] Tessa has three picks: An article called, “Respectability politics: How a flawed conversation sabotages black lives, ” a video on YouTube, “Tumblr’s Strangest Obsession: A History of the Onceler Fandom, and a movie review called, “Acrimony is the worst Tyler Perry movie OF ALL TIME.” [00:57:05] Chris’s pick is a show on Netflix called Avatar: The Last Airbender. [00:59:00] Ari’s pick is a song called, “Superliminal” by deadmau5. Resources mentioned: Vue enterprise boilerplate (https://github.com/chrisvfritz/vue-enterprise-boilerplate) v-tooltip (https://github.com/Akryum/v-tooltip) “Provide/Inject Have Nothing to Do With Dependency Injection” by Michael Thiessen (https://michaelnthiessen.com/provide-inject-not-dependency-injection/) Vue Style Guide: Order of words in component names (https://vuejs.org/v2/style-guide/#Order-of-words-in-component-names-strongly-recommended) Vue Patterns (https://learn-vuejs.github.io/vue-patterns/patterns/#component-declaration) Slay the Spire (Steam) (https://store.steampowered.com/app/646570/Slay_the_Spire/) “Respectability politics: How a flawed conversation sabotages black lives” (https://theundefeated.com/features/respectability-politics-how-a-flawed-conversation-sabotages-black-lives/) Tumblr’s Strangest Obsession: A History of the Onceler Fandom (https://www.youtube.com/watch?v=us5Y_Kba7To) “Acrimony is the worst Tyler Perry movie OF ALL TIME.” (https://www.youtube.com/watch?v=IoaTIGeeJ78) Avatar: The Last Airbender (https://en.wikipedia.org/wiki/Avatar:_The_Last_Airbender) deadmau5-“Superliminal” (https://www.youtube.com/watch?v=hKqprJwWH4M) EventBus (https://github.com/google/guava/wiki/EventBusExplained)
In deze laatste aflevering van De Debutanten Blijven Binnen bespreken we onze ervaringen met misschien wel 's werelds grootste debuut: de lockdown. Devin stelt zijn moeder voor de tweede aflevering op rij enorm teleur en Jeffrey doorziet een complot onder complotdenkers. Maar de belangrijkste vraag is wel: zouden we dat nog een keer doen, zo'n lockdown? Luister nu! Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen! De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
In de aller, aller, aller één-na-laatste aflevering van De Debutanten Blijven Binnen hebben we een online Escape Room gedaan. Jeffrey draaide, als doorgewinterde escaperoomer, zijn hand er niet voor om. Devin haalt oude herinneringen (of zijn het trauma's?) op over zijn enige ervaring in een escape room. Maar of we uiteindelijk zijn ontsnapt? Luister nu! Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen! De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Dat meer dan een week vegan eten wat met je doet blijkt wel uit deze aflevering van De Debutanten Blijven Binnen. Devin vertelt hoe hij (bijna) een borrel heeft verpest, en Jeffrey rekent uit voor hoeveel procent hij inmiddels uit kokos bestaat. Daarnaast natuurlijk antwoord op dé vraag: wat is de lekkerste hummus? Genoemd in de aflevering (Kijk, we hebben er aan gedacht!) * https://lisagoesvegan.com * http://degroenemeisjes.nl * https://www.huhisthisvegan.com Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen! Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen! De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
In deze vijfde aflevering van de Debutanten Blijven Binnen hebben we het over puzzelen, of nouja, dat proberen we. Ga met ons mee op een reis langs OnzeTaal, het Viva forum en een erotisch interview met ons nieuwe icoon Jan van Haasteren.Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen!Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen!De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Om dat binnen blijven een beetje vol te houden hadden Devin en Jeffrey wel behoefte aan wat rust en structuur, en wat helpt daar nou beter bij dan mediteren! Devin's mind wordt behoorlijk full van de Headspace app en Jeffrey laat zich verbazen door het Novelty Effect. Dat en meer in aflevering 4 van De Debutanten Blijven Binnen!Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen!Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen!De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Deze week zoeken Devin en Jeffrey het in de creatieve hoek: ze gaan tekenen. En niet zomaar tekenen, maar begrijpend tekenen, betekenen! Of nou ja, dat was de bedoeling. Geen spoilers, maar Pictionary verliezen we nog steeds.Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen!Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen!De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Sponsored By: Panelists Justin Dorfman | Eric Berry | Richard Littauer Guest Dave Gandy Font Awesome Founder | CEO Fonticons, Inc. Show Notes If you’ve never heard of Font Awesome, or even if you have, this episode is worth taking a listen to. Our special guest today is Dave Gandy, who is one of the main people behind Font Awesome. He has some super inspiring advice that we all could use right now with everything going on in the world. On a funny note, which way is the best way to hang toilet paper? There is a fascinating conversation on TP that you don’t want to miss.
Na onze hobby voor thuis vorige week nog niet te hebben gevonden in Nederland in Beweging, hebben we toch voor een iets meer calorierijke hobby gekozen: bakken! Jeffrey heeft duidelijk meer ervaring dan Devin, maar Devin heeft een enorm goed recept van stal gehaald. Maar het belangrijkste is natuurlijk: wat hebben we ervan gebakken?Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen!Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen!De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
In deze bijzondere tijden, waarin elke dag er thuis precies hetzelfde uitziet, hadden wij wel weer behoefte aan wat nieuwe dingen, om zo de sleur en verveling tegen te gaan. Hoog tijd dus om weer te gaan debuteren, maar dan wel binnen!Voor deze eerste editie van De Debutanten Blijven Binnen hebben we een week lang meegedaan met Nederland In Beweging. Wat vonden wij van Duco en Olga? Wat hebben wij gebruikt bij gebrek aan waterflesjes? En zijn onze stoelen nog van pas gekomen?Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan.Heb jij nou zelf ook behoefte om thuis de verveling tegen te gaan? Doe dan met ons mee! Elke week, of anderhalve week, of twee weken (we dekken onszelf alvast in), willen wij samen met jullie ons debuut maken in nieuwe activiteiten, hobbies of bezigheden. Na elke aflevering laten wij alvast weten wat we in de week daarna gaan doen, zodat jullie mee kunnen doen en jullie ervaringen met ons kunnen delen!De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Today is March 26, 2020, and for this Thursday Thoughts episode we're covering: GitHub Acquires npm Why Distributed Teams Are the Future of Workforce Bootstrap 5 Icons vs Font Awesome How to Manage Freelance Finances in a Crisis Let's dive in! ---- Last week GitHub announced that they would be acquiring the JavaScript package manager npm. GitHub stated that they would focus on the infrastructure, core experience, and engaging with the npm community. Additionally, GitHub will look to integrate npm into their services and structure. ---- A recent blog post by Taskade discussed why distributed teams are the future of the workforce. The post discusses benefits and how to build distributed teams. With the current COVID-19 pandemic many companies have been forced into a distributed workplace and are looking for ways to improve virtual work now and in the future. ---- Themesberg released a blog post comparing Font Awesome and Bootstrap 5 Icons, which will be available when Bootstrap 5 is released later this spring. Currently, the Bootstrap icons are open source SVGs that can be added on an individual basis to your website. While not as easy to use as Font Awesome this does have the benefit of a smaller file size because the entire library does not need to be included. ---- Webdesigner Depot posted about how to manage freelance finances during a crisis. With the current uncertainty around what the coming weeks or months will look like it is important to put your business on the best footing possible. Some tips include contacting clients, cutting expenses, and looking for ways to supplement your income. ---- Want to know more? Head to fewdaily.com for more of today's topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow! --- This episode is sponsored by · Anchor: The easiest way to make a podcast. https://anchor.fm/app
Neue Picks, warum Ansible auch im private Umfeld nicht die schlechteste Idee ist und Abschweifungen um den digitalen Kassenzettel und damit verbundene Einkaufserlebnisse. Podcast Landing Page - https://podcast.hack-the-planet.tv/ Bootstrap Framework - https://getbootstrap.com/ Font Awesome - https://fontawesome.com/start Hack-the-Planet Podcast auf Google: https://podcasts.google.com/?feed=aHR0cHM6Ly9wb2RjYXN0LmhhY2stdGhlLXBsYW5ldC50di9mZWVkL21wMy8&ved=0CAAQ4aUDahcKEwj46bfIrY_nAhUAAAAAHQAAAAAQAQ&hl=en-DE Marc Bosch als Bürgermeister - Neufahrn - https://www.boschneufahrn.de/ Bluetooth Adapter Mpow 2 in 1 - https://www.amazon.de/gp/product/B07X8VGV3G/ Amazon Order History - https://chrome.google.com/webstore/detail/amazon-order-history-repo/mgkilgclilajckgnedgjgnfdokkgnibi Camel Camel Camel - https://de.camelcamelcamel.com/ Ansible - https://www.ansible.com/ Ansible für Windows: https://docs.ansible.com/ansible/latest/user_guide/intro_windows.html Puppet - https://puppet.com/ YAML - https://en.wikipedia.org/wiki/YAML Chef - https://www.chef.io/ PSMQTT - https://github.com/eschava/psmqtt Bon Pflicht - Kassengesetz - https://www.haufe.de/steuern/gesetzgebung-politik/gesetz-gegen-manipulation-an-kassensystemen/kasseng-hintergrund-und-technische-sicherheitsmassnahmen_168_344414.html Teilnahmebedingungen eBon bei REWE: https://www.rewe.de/payback/teilnahmebedingungen-ebon/ BPA - https://en.wikipedia.org/wiki/Bisphenol_A Floating Point numbers not associative - https://floating-point-gui.de/
¡Buenos días! A puntito de empezar con los turrones y la "dieta" navideña, compartimos hoy con vosotros nuestros propósitos para el año nuevo en nuestros proyectos. Pero antes, como siempre... ¿Qué tal la semana? Semana esther Recuperando instalaciones de WordPress que han “petado” por estar sin actualizar desde años y que en su día no habían querido invertir en mantenimiento. Contenido esther Un par de artículos en el blog: Semana Nahuai Salió el taller de SemanaWP en el que explico como crear temas hijo de Genesis Framework: Contenido Nahuai Como cada semana, 5 tutoriales en Código Genesis, entre ellos uno para dar soporte a los ajustes de archivo de Genesis en un Custom Post Type Tema de la semana: Hoy comentamos nuestros propósitos laborables para el próximo año: esther: Proyectos de desarrollo: seguir reduciendo el número de proyectos, seleccionando aquellos que más me motivan.Tranquilidad WP: empezar una estrategia de marketing de contenidos en base a una nueva newsletter con curated content y guías puntuales. Seguir mejorando procesos internos y servicio al cliente. Blog y ZonaDPW: renovación de la web y seguir creando más contenidos, especialmente de front: CSS y JSNetworking: Menos Wordcamps pero más meetups locales y eventos de otro tipo. Nahuai: Controlar mejor los picos de trabajo → comentamos quasi-burnout en verano 2019 Planificar con fechas más ampliasGestionarlo mejor mentalmente Reducir la semana laboral → Bajar de 40h semanales → Largo plazo 25h Reducir / mejorar leads de creación de webMejorar procesos internos Rebranding / diseño web Freelance con las ideas claras y proyectos chulosNegocios sostenibles Potenciar la consultoría web Pensar cómo plantear mentoría Hacer crecer Código Genesis (escalable) Mejoras en la plataformaPotenciar la comunidadInvertir en publicidad Estudiar ofrecer formación bonificada Eventos WordCamps (6)Presentar charla en WordCamp Europe?Organizar el evento #GenesisBCN 2020MozFest / Sin Oficina… Novedades Jorge nos sugiere comentar el cambio de precio del plugin Advanced Custom Fields a partir de enero. Disponibles las charlas de WordCamp Granada en WordPress.tv Disponible programa de la WordCamp Zaragoza 2020 Juan Hernando se curra un post fantástico: Tip de la semana Una librería de iconos hechos con CSS, muy práctica si no quieres cargar una fuente completa como Font Awesome para pocos iconos: https://css.gg Menciones David Viña nos confunde con los Chatanoogos y nos propone dedicarle un episodio al tema de desarrollo sostenible. ????????♀️ ????????♂️ Victor Arévalo nos deja un comentario en iVoox sobre el checklist. ???????? Jordi García nos agradece la mención de Podcast Memberships Sites ????️ Dani Primo se pasa por los comentarios a compartir sus hitos del 2019 y nos desea feliz 2020. ???? David Perálvarez también se pasa por los comentarios para felicitarnos y Jorge nos dice que tiene envidia sana y que somos una inspiración por iVoox ????????
Het eerste seizoen van De Debutanten zit erop. Maar om het (voorlopig) afscheid iets te verzachten hebben Devin en Jeffrey nog 1 bonusaflevering in petto, waarin ze terugblikken op hun debuut als podcasters! Met op het einde natuurlijk de vraag of er nog een tweede seizoen komt, oftewel: zou je het nog een keer doen? Spoiler alert: je kan maar beter geabonneerd blijven!Bedankt voor het luisteren naar het eerste seizoen van De Debutanten!Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Na wekenlang steeds buiten hun comfortzone te zijn gestapt, was het voor Jeffrey en Devin tijd om weer even tot rust te komen. Met lachmeditatie, dat dan weer wel. Het lachen verging Jeffrey in ieder geval al snel toen ze in een groep moesten gaan dansen, en Devin kwam er achter dat meditatie minder zweverig is dan hij had verwacht. Vol vers opgedane endorfine bespreken ze hun ervaringen. Een ding is zeker: een aflevering met een lach en een traan is het sowieso, want dit is alweer de laatste reguliere aflevering van het eerste seizoen...Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?Omdat wij emotioneel nog niet klaar waren voor het afscheid met jullie, komen wij over twee weken nog een keer terug met een speciale bonusaflevering van De Debutanten, waarin we het hebben over ons debuut als podcasters! Te beluisteren vanaf dinsdag 26 november in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Deze aflevering heeft twee delen. Dit is deel 2: het nagesprek. Luister eerst deel 1 voor het voorgesprek, waarin we al onze verwachtingen bespreken, en over hoe we ons naar binnen hebben gewerkt bij Uber en Thuisbezorgd.Over de aflevering Een podcast zonder advertenties en sluikreclame (dat zouden we natuurlijk ook zeggen als het er wel was) brengt natuurlijk niet veel geld in het laatje, hoog tijd dus vonden Jeffrey en Devin om eindelijk eens flexibel groot geld te gaan verdienen. En waar kan dat nou beter dan bij de misschien wel meest besproken baan van de afgelopen jaren: maaltijdbezorgen. Jeffrey gaat aan de slag als bezorger bij Uber Eats en Devin bij Thuisbezorgd. In deze dubbele aflevering van de Debutanten bezorgen wij jullie graag al onze ervaringen, van sollicitatie tot daadwerkelijke werken tot ontslag.Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?De volgende aflevering is er één met een lach en een traan. In deze laatste aflevering van dit seizoen van De Debutanten dompelen wij ons onder in de wereld van lachmeditatie! Te beluisteren vanaf dinsdag 12 november in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Deze aflevering heeft twee delen. Dit is deel 1: het voorgesprek. Luister hierna (of hiervoor, als je lekker eigenwijs wilt zijn) deel 2 voor het nagesprek, met daarin al onze ervaringen.Over de aflevering Een podcast zonder advertenties en sluikreclame (dat zouden we natuurlijk ook zeggen als het er wel was) brengt natuurlijk niet veel geld in het laatje, hoog tijd dus vonden Jeffrey en Devin om eindelijk eens flexibel groot geld te gaan verdienen. En waar kan dat nou beter dan bij de misschien wel meest besproken baan van de afgelopen jaren: maaltijdbezorgen. Jeffrey gaat aan de slag als bezorger bij Uber Eats en Devin bij Thuisbezorgd. In deze dubbele aflevering van de Debutanten bezorgen wij jullie graag al onze ervaringen, van sollicitatie tot daadwerkelijke werken tot ontslag.Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?De volgende aflevering is er één met een lach en een traan. In deze laatste aflevering van dit seizoen van De Debutanten dompelen wij ons onder in de wereld van lachmeditatie! Te beluisteren vanaf dinsdag 12 november in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Een avondje heerlijk ontspannen wijn drinken, dat leek ons wel een goed idee voor deze aflevering van De Debutanten. Of beter gezegd, dat leek Devin wel een goed idee, want dat Jeffrey dat nog nooit eerder heeft gedaan is niet zo gek: hij lust geen wijn. Helpt de wijnproeverij hem om een nieuwe waardering voor wijn te vinden? Ondertussen hoopt Devin dat hij genoeg kan leren om in de toekomst lekker snobistisch mee te praten over wijn. Dat en meer in weer een nieuwe aflevering van De Debutanten. Proost! El Jeffrey Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?In de volgende aflevering gaan wij aan het werk bij misschien wel de meest besproken baan van de afgelopen jaren, we worden bezorger bij Uber Eats en Thuisbezorgd. Te beluisteren vanaf dinsdag 29 oktober in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
We zijn natuurlijk inmiddels wereldberoemde podcast-sterren, maar bekend van TV zijn we nog niet. Daar komt in deze aflevering van De Debutanten hopelijk verandering in, want we zitten in het publiek van De Wereld Draait Door! Maar of we ook in beeld zijn gekomen? Jeffrey hoopt in ieder geval dat wij het "meisje achter Matthijs" worden (het is immers 2019) en Devin is benieuwd hoe Matthijs van Nieuwkerk achter zal schermen zijn. Vonden wij het de moeite waard, of zitten we de volgende keer liever bij Jinek? De aflevering die wij hebben bijgewoond Tickets voor DWDD reserveren Het meisje achter Matthijs Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?De volgende aflevering van De Debutanten is vanaf dinsdag 15 oktober te beluisteren in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
In deze aflevering van De Debutanten gaan wij niet zomaar even een filmpje pakken. We dompelen ons onder in de wondere werld van de Pathé Ladies Night! Volgens de website van Pathé is dat "altijd een verrassend avondje uit," en dat was het voor ons zeker. Devin belt met de klantenservice van Pathé met de vraag of je als man überhaupt wel welkom bent bij de Ladies Night en Jeffrey sleept ons door het ongemak van de avond heen. Onze ervaring was in ieder geval niet te filmen… daarom hebben we er maar een podcast over gemaakt. Pathé Ladies Night De film die we bekeken hebben: Yesterday Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?In de volgende aflevering gaan wij voor het eerst in ons leven in het publiek zitten van De Wereld Draait Door. Te beluisteren vanaf dinsdag 1 oktober in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome, en we hebben muziek gebruikt van Orion Williams.
Voor deze aflevering zijn wij de natuur ingetrokken en hebben we onze oren en ogen goed open gehouden: we zijn gaan vogelspotten! Of vogelen, maar dan wel op zijn Nederlands. Devin probeert voor ons een verrekijker te regelen en Jeffrey krikt naast zijn Vlaams ook zijn vogelkennis op. En is onze zoektocht naar de befaamde IJsvogel geslaagd? De Nationale Vogelweek van Vogelbescherming Nederland Meer informatie over vogels kijken in het algemeen De schitterende IJsvogel Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?In de volgende aflevering dompelen wij ons onder in dé activiteit voor de moderne vrouw, de Pathé Ladies Night. Te beluisteren vanaf dinsdag 17 september in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De aflevering-specifieke icoontjes in ons artwork komen van Font Awesome.
Vanaf nu te beluisteren: De Debutanten! Een nieuwe podcast waarin wij, Jeffrey en Devin, elke aflevering verslag doen van iets dat wij nog nooit eerder hebben gedaan. In deze introductie leggen we je het concept verder uit. Je kan daarna meteen door met luisteren, want de eerste aflevering (waarvoor we een rechtszaak hebben bijgewoond) staat nu al voor je klaar.Als je de volgende afleveringen van De Debutanten niet wilt missen, abonneer je dan gratis op De Debutanten in de podcastspeler die je nu voor je hebt. (Een andere mag natuurlijk ook, maar dat is misschien wat omslachtig…) Je kan ons ook volgen op social media: Instagram, Facebook, en Twitter.De icoontjes in ons artwork komen van Font Awesome.
Voor deze allereerste aflevering van De Debutanten belanden wij in de rechtbank. Niet omdat we zelf terecht stonden, maar voor het bijwonen van een zitting. Wij beroepen ons gelukkig niet op ons zwijgrecht, maar bespreken alle details over onze ervaring. We hopen op een interessante (lees: bloederige) zaak, maar krijgen we die ook voorgeschoteld? En klopt het erg Amerikaanse beeld wat wij van rechtszaken hebben eigenlijk wel, of zullen we dat achteraf moeten rechtzetten? Zelf een zitting bijwonen Over De Debutanten De Debutanten is een podcast waarin wij, Devin en Jeffrey, elke aflevering iets gaan doen dat we nog nooit eerder hebben gedaan. De afleveringen bestaan uit twee delen. Een voorgesprek, die we vooraf opnemen, en een nagesprek, opgenomen direct na het debuut. Wat waren onze verwachtingen, en zijn die ook uitgekomen? Wat is ons opgevallen? En klopten onze vooroordelen eigenlijk wel?In de volgende aflevering trekken wij de natuur in (voor zover dat in omgeving Amsterdam kan) en gaan wij voor het eerst vogelspotten. Te beluisteren vanaf 3 september in je favoriete podcastspeler!Heb jij nou een goed idee voor wat wij in een komende aflevering moeten gaan doen? Laat het ons dan weten op www.dedebutanten.nl. Daar kan je tevens terecht voor meer informatie over de podcast en bonusmateriaal per aflevering. Vind je de podcast tof? Help ons dan door een review achter te laten of door de podcast te delen met je vrienden, familie, buren, die ene leuke caissière, Matthijs van Nieuwkerk of wie ook maar luisteren wil.Volg ons op social media: Instagram, Facebook, en Twitter. (RIP dansende bananen...)De icoontjes in ons artwork komen van Font Awesome.
Una semana más desde nuestra sauna en Bilbao, os traemos un episodio de este podcast que tanto os gusta a emprendedores y desarrolladores. Los hosting web subirán sus precios ya que al igual que ha ocurrido con CPanel, Plesk también aumentará el precio de dicha herramienta. Ambos siguen siendo los paneles más famosos pero os animamos a que echéis un vistazo a las alternativas en alternativeto.net.Origen
Recording date: 2018-11-13 John Papa https://twitter.com/john_papa Ward Bell https://twitter.com/wardbell Dan Wahlin https://twitter.com/danwahlin Jen Luker https://twitter.com/knitcodemonkey Resources: section 508 https://webaim.org/standards/508/checklist The a11y project https://a11yproject.com/ Jaws https://www.freedomscientific.com/Products/Blindness/JAWS ARIA https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA The https://www.starbucks.com/careers/ Starbucks career site WCAG https://www.w3.org/TR/WCAG20/ Jen helped author https://www.npmjs.com/package/eslint-plugin-jsx-a11y Husky https://www.npmjs.com/package/husky Google A11y https://developers.google.com/web/fundamentals/accessibility/ Lighthouse https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=en Azure text to speech https://azure.microsoft.com/en-us/services/cognitive-services/text-to-speech/ amazon polly https://aws.amazon.com/polly/ Amazon Polly on Dan's blog: https://blog.codewithdan.com/8-tips-for-maximizing-your-productivity/ *Someone to follow * Gleb Bahmutov https://twitter.com/bahmutov Tejas Kumar https://twitter.com/TejasKumar_ Rick Strahl https://twitter.com/RickStrahl Transcript { credit to Jen Luker } (Intro Music) 0:00:06.6 Voiceover Welcome to Real Talk JavaScript, the weekly talk show with advice and insight into the technologies and practices currently being used to build web applications in the real world. Each week John Papa and Ward Bell talk to industry experts about their experiences writing, deploying and maintaining web applications in HTML, CSS and JavaScript. And now, here are your hosts, John and Ward. 0:00:40.0 John Papa Welcome back to Real Talk JavaScript, this is Episode 11: Accessibility in JavaScript Apps and this week I’ve got my co-host, Dan Wahlin. How’s it going, Dan? 0:00:48.8 Dan Wahlin Going great, John. 0:00:49.9 John Papa And Dan, today we have a special guest of Jen Luker. How’re you doing, Jen? 0:00:54.6 Jen Luker Doing pretty well today. How are you? 0:00:56.0 John Papa We’re doing pretty good, thank you very much. Jen is a Senior Software Engineer at Formidable, BookBytes Podcast co-host, RxJS Learning Team member, and eslint-plugin-react-native-a11y core contributor. Jen has spent a majority of her career as a full stack developer but has a particular fondness for frontend technologies, thus why she’s here today. And she trains others in ReactJS and Accessibility, and enjoys removing obstacles that slow down productivity and loves optimizing webpack builds. When she’s not finding solutions or mentoring others, her spare time is spent spinning yarn from raw wool and knitting. She’s even better known to 3D print her own tools for the job. 0:01:33.3 Dan Wahlin Nice! 0:01:34.0 John Papa Welcome to the show, Jen. 0:01:35.2 Jen Luker Thank you! 0:01:36.0 John Papa There’s a lot in there. I mean, you’re not- 0:01:37.9 Jen Luker Yeah… 0:01:37.9 John Papa Just a JavaScript coder with ReactJS. It looks like you do a lot of teaching, and knitting! That’s pretty cool. 0:01:44.1 Jen Luker Haha, it’s… I like to say that I’m a knitter first and then a programmer second. So, it’s definitely a large part of my life. 0:01:53.3 John Papa You mean you do something besides coding all day? 0:01:56.1 Jen Luker It happens. 0:01:56.9 John Papa & Dan Wahlin (laughing) 0:01:58.9 Dan Wahlin You know, I have heard more and more people with knitting now. I, like, I hear that, I also do a lot of training, and I hear that all the time now, so it must be a big upcoming... trend I guess, I don’t know. 0:02:11.5 Jen Luker I think it has a little more to do with the fact that what we do as developers is often fleeting. It’s something that exists online, it’s not something tangible. Knitting is a programming language that sticks around long enough for you to wear it. So it’s- 0:02:28.9 John Papa I see. 0:02:30.4 Jen Luker Definitely caters to those that need that tangible aspect in their lives. But one of the coolest things I’ve seen knitting be used for, not just, you know, cryptography World War II, but also things like using it as a programming simulator for people that don’t have access to computers, such as people in Third World countries. So it’s definitely something that caters to the mind of programmers. 0:02:56.6 Dan Wahlin Interesting. Yeah, I’ve… Some of the people, too, have also mentioned it just helps them, it’s very relaxing they said. I don’t know how to knit, I haven’t tried it, but it looks fun. 0:03:04.3 John Papa So now, when we see Dan at his next conference, right before his talk, with a ball of yarn and some needles, we’ll know exactly why that happened. 0:03:10.7 Dan Wahlin Yeah. I’ll say, “Jen inspired me!” 0:03:13.0 John Papa & Dan Wahlin (laughing) 0:03:14.1 Jen Luker Well, you do know that at React Conf they actually had a fiberarts circle that I ran, so I ended up teaching quite a few people to knit, and crochet, and spin at that conference. So- 0:03:24.2 Dan Wahlin That’s so cool! 0:03:25.2 Jen Luker It is a possibility. 0:03:26.3 John Papa Huh! 0:03:26.8 Dan Wahlin There you go. 0:03:27.4 John Papa That is so cool. Yeah, I think we all have different ways of dealing with non programming mindsets. Like, what do you do when you’re not coding? And some people exercise, some people meditate, some people draw, some people play music, some people knit! So, I think it’s great to have something to kind of work different parts of your brain. 0:03:47.0 Jen Luker Definitely. 0:03:47.7 John Papa Hey, Dan! You had a question for us to kick things off about accessibility. 0:03:50.7 Dan Wahlin Yeah! So, I think we hear a lot… I used to work, one of my first jobs out of college was at a government agency and so there it was kind of required to learn about section 508 and things. But with corporations and with a lot of the developers I work with, I’ll have to admit I think we’re a little more in the dark on… 0:04:11.2 What are some of the ways, like, if I were to say, “Hey Jen, what are the key ways from a high level that I could add some accessibility things and like, who can I help with that?” Because I think a lot of us, we think, “Oh, well I just add a title to an image and call it a day.” 0:04:28.0 Jen Luker Mm-hmm (affirmative). 0:04:28.5 Dan Wahlin And I suspect there’s a lot more to it than that. 0:04:30.6 Jen Luker There is a lot more to it but there’s different ways of approaching accessibility on the web. One of the ways is technologically, which is oftentimes what developers deal with, but that’s only 30-50% of the problems you’re going to find in accessibility issues. The other half is going to be content and context and verbiage and language and ways that you say things that make it easier for people that have different disabilities, like neurological issues, or language barriers from interacting with the content on the site. 0:05:08.5 To deal with the technological side though, I tend to point people towards the aXe, Chrome, and Firefox extensions to begin with because it not only runs like, a technological audit on your site, but it also gives you more information. There’s always links that explain why there’s a problem, why the types of people that you’re focusing when you fix an issue, and different ways that you can fix an issue. So it’s a really great educational tool for just getting started. 0:05:43.6 John Papa Excellent. 0:05:44.2 Dan Wahlin Yeah, see, you already hit on a couple things like, you mentioned neurologically how maybe people interpret or have the context for different text. And I actually have a son with some disabilities so I’m very sensitive to this whole, you know, concept. It’s amazing how when you’re not around it, you just don’t think about it. But when you’re around it, it becomes, you know, your whole world. A big deal. So, you know, that’s when I hadn’t ever heard of- Can you tell me a little bit more about that? Is that related to the context you put into, like, the site, then, that helps them understand it better? Or how’s that work? 0:06:18.5 Jen Luker It is. Something that they recommend, or things that I’ve seen regarding recommendations for the level of content does vary depending on who your audience is. If you are a technical journal then chances are you’re going to be catering to a much more technical audience. However, if you’re a generic website you may want to keep your verbiage as low-level as possible, like anything between a third grade level to a high school level education, to allow for people to better understand the words that you’re actually putting on a page, and what the words are trying to tell you. 0:07:00.0 Like, you’ve got one side where you have people with ADHD that is not going to make it to the end of a 6-paragraph description of what it is you’re supposed to do. And then you have people on the other side of the spectrum that really need step-by-step instructions of what it is they need to do to get through your form. So trying to find that happy medium, or trying to find a way of giving a TLDR and then a longer context for different sides of that issue, is also something you may want to look at. 0:07:31.1 Dan Wahlin Interesting, yeah. I’ll have to admit that’s something that I haven’t really, you know, you mentioned third grade through, maybe, high school level and I think, as developers, we, especially if we’re in charge of putting some of the content, you know, out there ourselves, that’s something that I don’t think I’ve really thought through as to, you know, who’s my target that’s going to be reading this? As far as, you know, you think of, “I know these words and I’m sure everyone else will know these words.” But it sounds like you’re a lot better off if you can kind of reign that in a little bit, make it more focused. 0:08:02.3 Jen Luker Something that I’ve found that’s extremely different for even a dev when they’re onboarding into a new company is learning the names of things, and learning the acronyms for things. So if you’re using customized names for your products or your processes or you’re using acronyms, then you’re already losing part of your audience who just doesn’t understand what those things mean. 0:08:28.6 John Papa So, I think that’s a great point. This isn’t just for accessibility for, even for people like, let’s just say vision-impaired on one side. This is for anybody who doesn’t necessarily know your vernacular. 0:08:38.8 Jen Luker Exactly. 0:08:39.8 John Papa You go to a new company, what’s the first thing they do? “Hey, today we’re going to use the TLC with the EBY and then we’re going to talk with the XJ Bots.” And you’re like, “...What does any of that actually mean?” 0:08:49.4 Jen Luker I recently onboarded with a company and someone was very nice enough to put together a cheat sheet of acronyms for me and it was five pages long. 0:08:57.5 John Papa (laughs) 0:08:58.0 Dan Wahlin Wow! (laughs) 0:08:59.0 John Papa When I went to Disney one of my first things they did, like my first week there, was I got a book like that, too. 0:09:05.3 Jen Luker Mm-hmm (affirmative). 0:09:05.8 John Papa And the funny thing at Disney was the every TLA, which is a three-letter acronym which is kind of funny, the first letter of all of them begin with D for "Disney". Which really- 0:09:14.3 Jen Luker Yeah. 0:09:13.8 John Papa Only left two letters for all the rest. (laughs) 0:09:16.8 ALL (laughing) 0:09:17.9 John Papa I don't know if it's changed since then though. (laughs) But let's, let's start back. So on that same note, there's something I've seen a lot of over the years, and when I first encountered this, it's not an acronym but it's an abbreviation, I didn't know what the heck it meant. But, and maybe there's other people in the same boat so I wanted to talk about it with you. A-11-Y. 0:09:39.1 Jen Luker Yes. 0:09:40.0 John Papa Can you explain what that is and why people see that? 0:09:42.6 Jen Luker So back in the days of Twitter when there were only 140 characters, writing out a really long word like "accessibility" which is 13 letter long, took up a lot of space. So due to Twitter and their awesome audience, they shortened it to A11Y which is A-, the first letter in "accessibility", 11 letters, and then Y-, the last letter in "accessibility." You see the same thing with "Kubernetes" with K8S, or "internationalization" which is I18N. So any of those really long words end up getting shortened to first letter, number of characters in between first and last letter, and last letter. 0:10:26.0 John Papa Yeah, that's... that's kind of funny, you know? Once I realized that, I started going, "You know, I've been using I18N for years and I didn't know why it was called that." 0:10:33.1 Jen Luker Mm-hmm (affirmative). 0:10:33.2 John Papa Until I discovered it through A11Y, 'cause we, our nickname for it when we were talking about it was "ally". 0:10:39.0 Jen Luker Which I think is highly appropriate. 0:10:40.7 John Papa Yeah, yep. It kind of is a... 0:10:42.8 Dan Wahlin It fits it. 0:10:43.6 John Papa It kinda worked for us, too. 0:10:44.8 Dan Wahlin Yeah. 0:10:45.3 John Papa So, Dan, you're really D1N and Jen, you're J1n. It doesn't really work for our short first names, does it? 0:10:50.8 Dan Wahlin & Jen Luker (laughing) 0:10:52.0 Jen Luker Well, Jen is already shortened. 0:10:53.9 John Papa Yeah, yeah. It doesn't really help. What if your name is Al? What do you do? You only have two letters. 0:10:58.4 Dan Wahlin Yeah, there you're out of luck. 0:10:59.3 Jen Luker First and last. 0:11:01.0 John Papa A0L I guess? AOL! There you go! That's what AOL stood for. 0:11:05.4 Dan Wahlin Al. 0:11:06.4 John Papa The secret has been revealed, right here. 0:11:07.5 Dan Wahlin Who knew? 0:11:08.3 Jen Luker (laughs) 0:11:09.0 John Papa (laughs) So accessibility. One of the things I think that was really eye-opening to me was understanding how many people this actually affects. When I first started getting into it many years ago on some large projects the things that were introduced to me were,"Well, we're doing this because there are, you know, millions of people who are affected by this and we're really trying to make the web more accessible." You know, it sounds like a grandiose thing, but that was true. We were trying to make our websites more accessible to all these people who either couldn't use our websites, or they could but with much difficulty. 0:11:43.0 Jen Luker Right. 0:11:43.6 John Papa Now, what kind of scale is this really at? Is it just one guy down the street? Or is it, you know? How big is this? 0:11:48.8 Jen Luker Well the World Health Organization estimates that about 15% of the entire world has some sort of disability. This is a highly conservative number. Not everyone wants to identify with the fact that they have a disability. There's definitely a level of taboo that comes with the word "disability." So- 0:12:13.3 Dan Wahlin Yep, I can vouch for that. 0:12:15.6 Jen Luker Right? So there's a lot of people that will not identify with that label and therefore the 15% is, in fact, a very limited number. You know, if you're looking just in the U.S. they estimate, as of the 2012 census so it's been a while, 19% of people, so almost 1 in 5. If you're looking at other numbers we're looking at 8% of you men who are colorblind of some fashion, and it's not an on and off switch, there's a varying degree. There's also people with multiple versions of color blindness. There are people with very slight color blindness so it's almost unnoticeable. The range is quite large and about 1% of women also are colorblind. So you're looking at about 4.5% of the population as a whole just for one type of disability. 0:13:10.8 John Papa That's fascinating, and it hits, at part for me, that's at home, too. 'Cause I also identify as being partially colorblind, I guess you could say. I'm on that scale. 0:13:19.8 Jen Luker Mm-hmm (affirmative). 0:13:20.4 John Papa I don't have full blown color blindness because I can still determine some colors but others I have struggles with. 0:13:25.8 Jen Luker Mm-hmm (affirmative). 0:13:26.4 John Papa But I've also found that when I identify with this I get a lot of backlash from people of, "Well you're not really colorblind." Or, you know, there's a lot of disbelief. It's almost like it's become, "Oh, I'm sorry." So I can totally empathize with you on why people wouldn't want to identify with any of these things ‘cause it's almost like they put them in a category of, "Oh, well... the pity category." 0:13:48.0 Jen Luker Right? And there's differences in color blindness. It's not just grayscale in everything. There's the red/green, there's blue/green, there's you know, the trichotomy side, there's... there's a lot of different variations, and then there's some people that can see the differences between but the colors are all still muted. The more muted they are the less likely you're going to be able to tell the difference between them which really starts to rear its ugly head when you're looking at images or text color changes. So, it gets complicated fast. 0:14:25.8 John Papa Is this the real answer to what color that dress is on the internet streams? 0:14:29.6 ALL (laughing) 0:14:31.5 Dan Wahlin Oh my gosh. 0:14:32.5 Jen Luker That's a whole other fascinating concept- 0:14:34.6 John Papa (laughs) 0:14:34.9 Jen Luker When it comes to how each person perceives color- 0:14:39.2 Dan Wahlin Yeah. That was- 0:14:39.1 Jen Luker And how no one actually perceives them the same way. 0:14:41.5 Dan Wahlin That was pretty freaky, actually. 0:14:42.9 John Papa Yeah, I know. (laughs) Yeah, I get that a lot from folks on, themes for example. I like to create themes for VS Code or for other tools and when you create a theme people get very personal over what theme they choose. And the reason I created my own is because I like mine to look the way I look and it makes me feel good, it makes me more productive, but not everybody likes one theme. There's probably, you know, 100 great themes out there. It's because everybody looks at things differently and they have varying degrees of sensitivity to the colors, too. 0:15:14.0 Jen Luker Mm-hmm (affirmative). 0:15:14.4 John Papa So, you're building an app and you have to pull accessibility in. What kind of apps should use accessibility? 0:15:21.1 Jen Luker All of them. 0:15:22.0 John Papa Good answer. (laughs) 0:15:23.5 Dan Wahlin Yeah, it's a good one. I was gonna say, "Great answer." 0:15:24.3 Jen Luker (laughs) 0:15:25.0 John Papa What does it cost for money? I mean, I a business manager now. Does it cost more money? How much more time is it going to take? Do I need to teach my people how to build web apps for accessibility? What kind of things are affected by it? I don't have time for this, no, let's not do it. I bet you've heard all these things? 0:15:40.3 Jen Luker Oh yeah! Absolutely. 0:15:41.7 John Papa How do you answer those? 0:15:42.9 Jen Luker Well, there's a couple different ways. The not so passive-aggressive way is to find the person closest to them that's colorblind and then sit them down and say, "Can you explain to them why we're not going to write the website in a way that they can use it? This person in that company that works for you." That tends to drop, you know, that tends to pull up some people's shorts. 0:16:06.6 But the other ways is you can start talking about those financials. If you're looking at the return on investment take those 15% of the population. If you are, you know, a $10 million company, by making your website accessible it's an $11.5 million company, and that's just your slice of the 15%. Only 1 in 10 websites is accessible, which means you still have the opportunity to corner the market in your region, your demographic. That means that that 15% could very well be larger than the rest of the people that use your website. 0:16:53.4 Dan Wahlin That's an interesting concept from a, you know, purely financial standpoint. I’d never even thought about that, even cornering your own market. 0:17:00.1 John Papa And that's what a lot of people make decisions on, right? If you're gonna make more money, it's still making- Think like a business manager. You're telling me my $10 million app I can pull in $11.5 million instead; an extra 1.5 million a year, which is, pick some fake numbers for a minute. 0:17:13.9 Jen Luker Mm-hmm (affirmative). 0:17:14.5John Papa What's the cost though? Of building that app, what's the additional cost? 0:17:18.7 Jen Luker If you're designing it from the ground up it's very little additional cost. So a lot of the major issues have to do with color contrasts. Other ones have to do with making sure, you know, as you've said before, title tags on HTML or hrefs or ALT tags on images. A lot of it has to do with the fact that the platform, HTML, is inherently accessible and we, as JavaScript developers, go ahead and run through and override it and make it inaccessible. So, sticking closer to the platform is usually enough to cover the majority of accessibility issues. 0:18:03.4 John Papa Let's take a quick break for a word from our sponsors. 0:18:05.8 Voiceover Looking to learn more about the state of software security? Check out VeraCode’s recently released report, "State of Software Security Volume 9." This year's report highlights the more important open source vulnerabilities and the latest dev sec-ops trends. Dev sec-ops, by the way, is kind of like "devops" plus "security". This is VeraCode’s most developer-focused volume ever. So don't miss out. Get your copy today by visiting www.VeraCode.com/SOSS for State of Software Security. That's www. v-e-r-a- code.com slash S-O-S-S-. 0:18:47.0 John Papa And we're back. Jen, you were just talking about how you can stick to the platform and that might help you build accessible apps. Can you kind of explain what you mean by that? 0:18:55.4 Jen Luker I usually mean by using semantic HTML as much as possible for the reasons it's made. For instance there's a lot of... A lot of developers that still would rather use a div over a button, but the complexities inmaking a div accessible like a button go deeper than you'd expect. So it's not just adding a highlight, adding text or a keyboard interaction. It's also weird things like, in some versions of ios, if you don't add a cursor pointer in the CSS, ios won't detect that it's a link, even if you tell it that it is. 0:19:39.0 John Papa Hmm. That's interesting. 0:19:40.0 Dan Wahlin Yeah, I don't think I've run into that, myself. 0:19:42.5 John Papa Oh, we hear about semantic HTML a lot, right Dan? About, "Don't use divs everywhere!" But yet, I don't know about you, but a lot of apps I get called in to look at it's like, div craziness. 0:19:52.5 Jen Luker Mm-hmm (affirmative). 0:19:53.2 Dan Wahlin I call it div soup. 0:19:54.7 John Papa (laughs) Div soup! 0:19:55.0 Jen Luker (laughs) 0:19:56.4 Dan Wahlin Yeah. How much, so Jen, are there numbers out there, and I'm sure there are, for people- 'cause I know probably the only program I've heard of would be for people with vision, you know, various issues from they're completely blind to partially. How many different apps are out there? What, is there a number one app that you use to actually read these pages to them? Like, I've heard "JAWS", is that still a thing these days? 0:20:21.1 Jen Luker JAWS is definitely a huge things, particularly for windows systems. Other screen readers would be just the default screen reader that Mac uses. Chrome has its own that you can implement, too. There's a dozen major, major players. 0:20:44.0 Dan Wahlin Okay. 0:20:46.1 Jen Luker So, and not all of them, just like the browsers, read the text or the website in the same way. Even ios and android devices have different readers of their own. So, each one kind of reads things a little bit differently. It's important to be aware of those differences once you start really digging deep into accessibility, especially if you're trying to customize something away from semantic HTML. 0:21:13.5 Dan Wahlin Now does, you mentioned, I mean, the thing that I think most developers probably have heard of are title attributes, and like you mentioned, the ALT on images, things like that. One that probably most people have come across, and you're going to have to correct me if I say this wrong, I've already said "ARIA?" [pronounced are-ee-uh] 0:21:30.7 Jen Luker Mm-hmm (affirmative). 0:21:31.3 Dan Wahlin Is it ARIA [pronounced are-ee-uh] or ARIA [pronounced air-ee-uh?] Is it ARIA [pronounced are-ee-uh]? 0:21:32.6 Jen Luker I call it ARIA [pronounced are-ee-uh]. It's WAI-ARIA [pronounced why-are-ee-uh]. 0:21:34.2 Dan Wahlin Okay then. I'm going with you then. So, okay. See, I'm right, everyone! 0:21:38.6 John Papa & Jen Luker (laughing) 0:21:39.3 Dan Wahlin 'Cause Jen says! 0:21:40.8 Jen Luker Ha! 0:21:42.1 Dan Wahlin Now that's one I've only seen a few of the, I guess you could say core attributes that you can do with ARIA, but do those play a, I would assume, a pretty big role then? With some of the screen readers out there? 0:21:54.3 Jen Luker Yes and no. Going back to semantic HTML, if you're using just HTML then there's really no need for the ARIA roles. The roles themselves are built in to the platform-specific HTML; however, if you are deviating from that plan or you are using something a little closer to HTML5 then ARIA can play a role in making sure that exactly what you want read to a screen reader is defined. So, usually the first rule of ARIA is "Don't use ARIA." But there's definitely a place for it. 0:22:40.9 Dan Wahlin Okay, good to know. Yeah. I think that's one area that, you know, I'm comfortable with the semantic tags and it's good to hear that those are still the, kind of, I guess, goal. 0:22:51.3 Jen Luker Mm-hmm (affirmative). 0:22:52.1 Dan Wahlin But I'm not as familiar with the ARIA stuff. You know, you'll see it, for instance, even in some of the, if you use Bootstrap all, the CSS. 0:22:59.2 Jen Luker Mm-hmm (affirmative). 0:22:59.5 Dan Wahlin I've noticed they'll add it here and there. If you use Font Awesome I've noticed there'll even be some ARIA-type stuff. But kind of one of those where you copy and paste it and don't really know what it does, you know, without looking it up more. 0:23:10.5John Papa You bring up a great point there with Font Awesome, Dan. Font Awesome, if my memory serves me right, you take a icon tag, right? The i and then you almost always have to stick in an ARIA attribute into there because you're effectively making a button, sometimes, out of that. So you're making a button out of an icon, which isn't really a button, and maybe you don't want it to be inside of a button control. Which almost always leads to end up using the ARIA attributes on there. Is that a bad thing, Jen? Or is that, I mean, 'cause that's what I see a lot out there. I mean, just 'cause I see it doesn't mean that it's right. 0:23:45.7 Jen Luker For the most part what you want in a button is text; however, we often use icons for those buttons. If you can possibly wrap it in a button control that would be better than just trying to add ARIA items to the icon itself. However, that is a way to get around that. Ideally you'd add a button, you'd tell the button its title and its value and that's what ends up getting read instead of just an empty icon. 0:24:20.0 John Papa Yeah, I hear you. Ideally, I try to do that as well, and I'm actually trying to pull up some code of where I've done this before to kind of get sense for, you know, "Why did I do that as opposed to actually using a button, in that case?” And I think sometimes it's more about styling and maybe it's just about effort. Like, you could put it inside of a button. If you didn't really want it to look like a button you could then restyle the button so it didn't look that way. 0:24:44.7 Jen Luker It is so easy to restyle a button- 0:24:48.1 John Papa Mm-hmm (affirmative). 0:24:47.8 Jen Luker So that it doesn't actually look like a button. 0:24:49.4 John Papa Yeah. 0:24:49.9 Jen Luker It is so easy. It's like three lines of CSS and suddenly it's just your icon. 0:24:55.9 John Papa I think you're right on that. I mean, and that's actually gets back to a thing of, Daniel you'll laugh at this, it makes me think of Silverlight. (laughs) The old Silverlight days. 0:25:04.2 Jen Luker (laughs) Mm-hmm (affirmative). 0:25:05.3 John Papa Where everything was described as a lookless control. And I kind of wish, in some ways, HTML was like that. 0:25:11.8 Dan Wahlin Yeah. 0:25:12.4 John Papa Whereas, out of the box, a button has a certain look and a feel. I wish it didn't. Like, you had to add those things because I feel like because there already is a standard way these things are represented... Like, you stick a button on a page you get a certain look, and it's almost never exactly what you want it to look like anyway. So maybe if there was a lookless feel to these HTML elements- 0:25:32.6 Dan Wahlin Or at least an option for that, right? 0:25:34.7 John Papa Yeah! 0:25:35.0 Dan Wahlin Where if you want it out of the box, great. But if you don't, here's how you can start from scratch and just add your own CSS in. Which wouldn't be too bad because we typically use, especially for public facing, you know, reset-type CSS, stylesheets anyway. So you could just kind of say, "Nope. Start from scratch and here's what I'm using." 0:25:52.3 John Papa Yeah. 0:25:52.8 Jen Luker Mm-hmm (affirmative). 0:25:53.1 Dan Wahlin But on that topic, Jen. Is, you know, for your... You obviously specialize in this and I saw in some of the info John was sharing with me that you worked on a website that implemented some automated accessibility testing to meet, is it WCAG? Is that how you say the standard there? 0:26:10.5 Jen Luker Yeah. 0:26:11.1 Dan Wahlin WCAG 2.0? Okay. 0:26:12.5 Jen Luker Mm-hmm (affirmative). 0:26:13.4 Dan Wahlin Can you tell us more about, kind of that process? And what you need to do there? 0:26:17.6 Jen Luker I actually worked on the Starbucks Careers Site project that was recently released. The benefit of that project is that when they started with a rewrite they started from design up with the intention to comply with WCAG 2.0 AA accessibility. So it was literally baked in from the design up and everybody was on board with engineering it to be as accessible as possible. So it was very much a collaborative effort between the design team, the different developers that worked on it, and even the engineering managers and the product owners. It was a really great process. 0:27:05.2 As far as the testing goes, we actually went through a few different layers of testing. The very first one is we implemented the eslint-jsx... or the eslint-plugin-jsx-a11y ... ESLint plugin. That (laughs)- 0:27:24.8 John Papa Oh, sorry, wait. Just let me make sure I got that one right. It's the eslint-plugin-jsx-a11y, right? 0:27:30.9 Jen Luker Yes! 0:27:31.8 John Papa Okay. Perfect. (laughs) 0:27:32.8 Dan Wahlin Say that 10 times fast. 0:27:33.7 Jen Luker I know. 0:27:34.0 John Papa Exactly. 0:27:34.9 Jen Luker It's really long. Especially when you start talking about the fact that I wrote another one for React Native. So... 0:27:39.4 John Papa (laughs) 0:27:40.0 Jen Luker It's even longer. That was kind of the first line of defense. It was utilized right there with Prettier, which was great. We used husky to run Prettier and the accessibility linter at the same time before someone could push code to the repo. In addition to that, we moved on to using axe-core as implemented into Jest for unit testing. And then we also use axe-core in Enzyme for end-to-end testing once the content was compiled down to static pages. 0:28:26.4 So this allowed us to hit the developers before they even pushed, hit the unit test of each one to make sure that they would comply if given the ideal data, and then made sure that it was still compliant once the data from the APIs was inserted into the page on a real time level. 0:28:52.2 That essentially meant that at every step of the process we made sure that everything was compliant before it made it to live. 0:29:02.1 Dan Wahlin Excellent. This would be public, I guess, right? Is this where people would go to look for a job? Or... is that what it was? It says the careers website, it looks like. 0:29:10.0 Jen Luker Yes, it was actually the... Yeah, it's just Starbucks.com/Careers. 0:29:14.8 John Papa Okay. 0:29:15.5 Jen Luker It was multiple pages, it had its own menu navigation. Once you actually go to look for a job by submitting your resume and stuff, you're transported out to the portal that they use, which we didn't get to go over, but the careers section of the Starbucks.com website is, in fact, accessible. And they're using those to expand that project. 0:29:43.4Dan Wahlin For people that want to learn more about it learn more about it, obviously I guess you could go right click view source on, you know, the careers site, but is there a recommended site that it out there that's considered a really good, almost like cheat sheet of how to get started adding stuff into your site? 0:29:59.5 Jen Luker There is. WCAG 2.0 website. 0:30:03.1Dan Wahlin Okay. 0:30:03.0 Jen Luker Which we will add to the show notes for this. It is on W3's website. That's usually a great place to go dig in and find out what's kind of covered in compliance. If you dig in deep enough you can find examples of how to implement code in an accessible way. They give different formats of how you could implement a menu, different ways of, you know, drop downs, so they do give you examples that would comply with accessibility compliance that I've found isn't always exactly going to suit your needs but gives you a very good idea of what's going to be necessary. 0:30:46.5 Dan Wahlin Okay. And is there, when it comes to, you know, if I'm vision-impaired, as a, from developer standpoint is there a way to really test that? Short of using like JAWS or maybe one of the built in readers you mentioned? Or is there an actual tool out there than can help you, you know, make sure that what you wanted them to hear is actually what gets heard? 0:31:08.0 Jen Luker It's literally manually testing at that point. 0:31:10.8 Dan Wahlin Okay, I kinda figured. But, yeah I'm wondering if there's anything out there. 0:31:14.4 Jen Luker Something I do want to mention about that is when you are dealing with testing screen readers, among other different types of ... you know, accessibility technologies, assistive technologies that help you. Being cold, not knowing them, and going in and trying to test them actually develops a huge amount of frustration. That can actually develop enough frustration that you decide that it's not even worth it for someone else to have to try to deal with this pain even with something is ideal. 0:31:52.0 What you should do is find someone who uses that technology day in and day out. You'll be amazed at how much faster and much easier they navigate through tools. And something that I have found extremely interesting is how they've learned to adapt their interactivity with your site based on how it's already broken. So it can be very fascinating to see how people that interact with it have their actual pain points, which things aren't, and those aren't things that you're going to be able to identify as just a casual user. 0:32:28.8 John Papa Let's take a quick break for a word from our sponsors. 0:32:32.0 Voiceover Are you building a web application? Need to deliver it soon and don’t have the people to do it? Maybe you’re not sure your company has the skillset or experience to do it. Then maybe we can help. 0:32:42.4 I’m your host, Ward Bell, and my day job is building applications for companies like yours. I don’t do it alone, I’m president of IdeaBlade, a consultancy that specializes in enterprise web application development. We’re particularly strong in Angular, RxJS, NgRx Redux on the frontend, and .Net Microsoft technologies on the server. 0:33:03.2 We’re a small tight knit group of people, hand picked by me, for their expertise, experience,integrity, and team spirit. Maybe we can help you with architectural guidance and hands-on development. And if there’s something we don’t know (and in our field, really, there’s too much to know), we can draw on our personal connections in the Microsoft RD, MVP, and Google GDE Networks as well as our international circle of really great developers, people we know and trust personally. 0:33:29.8 If you’ve got a project that’s keeping you up at night shoot us an email at info@ideablade.com. That’s info@IdeaBlade.com. And now back to the show! 0:33:42.0 John Papa And we’re back. Jen, Dan brought up a good question ‘cause I had this same thought, and I know it’s changed throughout the years, too; it’s how do you test for your site being accessible, and I realize, you know, the manual test is the best one. But there’s, and you do some automating as well for this. I noticed you mentioned the eslint plugin that you had. 0:34:01.5 Years ago there was, well it still exists, a Chrome plugin for screen reader which is now labeled as deprecated, and I notice they always link you over to the Lighthouse tools now, the Chrome plugin for that, which does an accessibility audit. I don’t know how you feel but I’m curious, like on, I see for example, the Starbucks Careers site has a, right now, 100 out of 100 score for accessibility. That doesn’t make me feel like it’s done, but it does make me feel like at least, like if there were something missing in that list of what wasn’t 100, I’d know I have some work to do. But when it’s 100 I’m then stuck with the, “What’s my next step?” Like, running Lighthouse step one: make sure those things aren’t barking at you. 0:34:44.9 Jen Luker Mm-hmm (affirmative). 0:34:45.6 John Papa But what do you do after that? 0:34:47.2 Jen Luker After that is when you starting bringing in actually user testers. So previously we were talking about return on investments of adding accessibility features from the viewpoint of someone who wants to add the accessibility demographic, right? The addition of adding those accessibility features actually expands far beyond those with accessibility issues, but also everybody. So, for instance, say that you’re sitting in a really noisy bar and you want to share a video with your friends. You can’t just sit there and play the video and expect them to get everything that’s being said. It’s too loud in the area that you’re in. With either a transcript or subtitles you can actually understand everything that’s going on in the video without having sound. 0:35:39.9 John Papa I’m so glad you brought that up ‘cause that’s something that is near and dear to me on videos. Not just for people who have issues, but it’s also… Just think about the financial side of this, too, and the marketing side. If you want somebody to watch your video and it’s scrolling past them on a screen in a Twitter feed, or Linkedin, or Instagram, or any kind of social media even, or even on the TV. If there’s no sound, if they can see the words sometimes that grabs their attention. 0:36:08.0 And I’ll, gonna share something about myself here, when I watch TV shows, and I love science fiction, things like Game of Thrones for example- 0:36:17.1 Jen Luker (laughs) 0:36:17.5 John Papa I actually put the closed captions on because I can’t tell what the heck name they’re saying. 0:36:21.7 Dan Wahlin I do the same thing. 0:36:23.0 John Papa You know? (laughs) 0:36:23.4 Dan Wahlin Not with Game of Thrones but with other stuff, yeah. 0:36:25.8 John Papa Yeah, I mean if their name was “Dan” I could get it. But when some of these names comes on I’m like, “...” So I love the fact that we… It’s not just for people who can’t understand names like me, but it’s a great thing for videos ‘cause now you’re reading an audience who maybe they don’t understand the slang you’re using, maybe English isn’t their first language. If you’re recording in English. 0:36:46.3 Jen Luker Mm-hmm (affirmative). 0:36:47.9 John Papa So when I talk with other countries they use the closed captions a lot for trying to figure out, “What did John say?” There’s just so many good ways and good reasons to do it and it’s not hard. 0:36:58.4 Jen Luker Unh-unh (negative). It’s not necessarily hard but it is time consuming. And it can be a little bit costly, depending on whether you do it yourself or whether you’re hiring someone to- 0:37:08.6 John Papa Yes. 0:37:09.2 Jen Luker Provide those transcriptions for you. 0:37:11.3 John Papa There are some free ones. Like if you go to YouTube and you upload it they give you one free translation, but then you run the risk of something like, my good buddy, Asim Hussain, his name is spelled A-S-I-M. 0:37:22.9 Jen Luker Mm-hmm (affirmative). 0:37:23.4 John Papa And when he recorded one of the videos it came out on the closed captioning as “Hello, everyone. My name is Awesome Hussein.” 0:37:29.3 Jen Luker (laughs) 0:37:30.2 ALL (laughing) 0:37:31.1 Dan Wahlin We should call him that now, when I see him. 0:37:32.6 John Papa Yes! So that’s now his nickname. (laughs) 0:37:34.6 Jen Luker That’s awesome. Ha ha! 0:37:35.9 John Papa Literally! 0:37:38.2 Jen Luker Oh, goodness. Yeah, YouTube is… I’m so proud of YouTube for at least trying to add like, automated transcriptions to all of the videos that are available. So there is a button you can click on that will show just a real time transcription as it’s developed. Unfortunately our ability to write machine learning that can fully understand different accents, different dialects, different contexts is still lagging behind how quickly communication and language evolves. So it’s not the best. It’s like trying to use Google Translate and it can be difficult. 0:38:23.3 Dan Wahlin Yeah, it’s- I started playing with, so Azure has it, and Amazon has had it though, for quite a while, has a few more voices at this point on AWS, but they have a service on some of my, I guess you could say wordier posts, meaning that there’s not as much code ‘cause it’s hard to convert. 0:38:43.0 This is kinda opposite of what we’re talking about, this is text-to-speech, and I said, you know, it doesn’t really cost me. I mean, it’s negligible, almost free it’s so minimally used by people and looking at the stats, but it’s you know, Amazon Polly and then Azure… I don’t remember what it’s called. what’s it called, John? They have their text-to-speech service. Do you know off the top of your head? I don’t think I remember the name. It’s probably part of the cognitive speech APIs I’m guessing. 0:39:12.9 But anyway it'll, you know, take your text and convert it into like, an mp3. So I’ve been doing that recently on just some of my more text based posts. ‘Case like I said, it’s hard to get context out of code, of course. But, you know, I like having it. I look at the stats. There’s not a ton of usage, per se. Although somebody could download it, almost like a podcast, but what I like about it is somebody that, you know, was vision impaired in some way, and I swear the older I get I’m starting to fall into that category anyway where I’d almost rather listen to it, you know, than read it. 0:39:49.4 But there’s a lot of different things out there like that that I think as technology progresses, you know, hopefully as you’ve mentioned, Jen, the YouTube closed captioning-type thing just keeps getting better and better. Text to speech is definitely getting pretty awesome. The voice I picked I’m just amazed with how high the quality is. So, a lot of cool stuff out there for this. 0:40:08.2 John Papa Yeah, that is called Azure’s text-to-speech cognitive services is the piece of it. You’re right it’s Amazon Polly. I put both those links in the show notes for everybody. 0:40:16.3 Jen Luker I think the biggest take away from all of this is that accessibility isn’t just for the people with disabilities. It literally is for everyone and it’s not just for old people or young people or people suffering from a specific disability. It’s also for people that have temporary or circumstantial disabilities. It’s for people that have you know, issues today, but no issues tomorrow. Or maybe they’re watching a TV show that has really loud explosions and really quiet text and your baby’s sleeping- 0:40:52.9 John Papa Yeah, what’s up with that anyway? 0:40:53.8 Jen Luker (laughs) Right? That’s why I use a screen… You know, that’s why I use subtitles. But, you know, it’s just the more you step back and look at it the more you realize that accessibility isn’t just keyboard tabbing and it’s not just a screen reader. It’s being able to allow people to interact with your content no matter who they are, or where they are, or what they are; and that has a real power. 0:41:22.9 That has the ability to take people that, I mean, arguably needs to be the ones that have the work flexibility in order to support themselves, and to be able to have the insurance to take care of their medical issues, and give them a job that gives them that freedom. I mean we, as devs, have a huge amount of freedom. We can work from anywhere as long as we’ve got an internet connection and a laptop. And as long as we’re working towards making the entire web accessible, whether that’s Game of Thrones, or that’s our technological documentation it really opens up the world to people that would not have otherwise had the opportunity to be able to make the best of it. 0:42:10.9 Dan Wahlin Absolutely. I think that’s, you know, that’s just a win all around for everyone. To kind of tag on that again, real quick… So I was at Dick’s Sporting Goods, which if you’re in the United States listening to this you’ll probably know who that is, they’re a pretty big sporting goods company. But I was out there doing some angular training and we were talking briefly- Jen, that’s why I asked more about the ARIA labels ‘cause that’s came up. And they actually have a full-time, at least one person maybe more but at least one I know full-time for accessibility. 0:42:41.0 So I think kind of challenge we might be able to issue all of us as devs is, if your company’s currently not doing that, there are companies that are. Now, you know, some of them I think are doing it purely out of what you just said, Jen. They just want to make it more accessible to everybody. Some of them probably it’s financial and okay, I think it’s a win either way, whatever they choose. 0:43:02.6 John Papa Sure. 0:43:03.1 Dan Wahlin But I think that’s a challenge we could all probably take on to try to be a little more educated on that and use it more. 0:43:09.6 John Papa there’s even little things you can do that may not fall under the exact category but how many times have you been to a website where there’s so much text jammed onto a screen you can’t actually discern what you’re supposed to be looking at? You know, so just making sites easier to read and having a better user experience. I find user experience and accessibility really flow together, personally. And when you’ve got one and the other together it’s like the beauty of the web. When you have neither of those that’s like when you go back to one of those 1996 websites where you can't figure out what’s going on. 0:43:42.2 Jen Luker (laughs) It’s absolutely true. It’s definitely a situation where making it fantastic for one group of people ends up helping everyone. So I mean, even if you do one thing today, if you add one more ALT tag, or you convert one more div to a button, or one button to a link, you know? That’s one more thing that’s going to be useable. You don’t have to flip the switch and have your entire website accessible tomorrow, but you can make one step today. 0:44:13.9 John Papa Awesome. Jen, we would like to wrap up this show with a section we call “Someone to Follow” where we talk about somebody who may be well known, or may not in the industry who we just want people to take a closer look at. And I’ll kick things off. Today, and I seem to be picking names that I can’t pronounce recently, so I apologize Gleb, but the person I want to point out is Gleb Bahmutov, and it’s… I’ll put his Twitter link up here on the page. He is one of the JavaScript ninjas behind the tool called cyprus.io which, Dan you did a show with us on that a couple of weeks or months ago. 0:44:47.6 Dan Wahlin I love it. Yeah. 0:44:49.1 John Papa Gleb is amazing. I’ve talked with him a few times on, he’s another Twitter friend, and the reason I wanted to call him out was I was working with cyprus.io, ‘cause I switched, Dan convinced me to switch. And I absolutely loved it and I was trying to solve some problems with it and I resent it to him on Twitter and he helped me get over those issues right away. And I just really love how open and friendly he was and he’s just done some amazing technology products that he’s had on the web over the years and cyprus io is just the recent one of those. Dan, do you have somebody to follow? 0:45:20.4 Dan Wahlin Yeah. So I had the chance to have dinner recently with one of my buddies, Rick Strahl. You know Rick, John. 0:45:27.6 John Papa Oh, yeah. 0:45:28.3 Dan Wahlin And for those that don’t know Rick he’s like, world champion I think. He windsurfs a lot (laughs). But Rick’s just a all-around very cool guy and very knowledgeable about frontend and backend type technologies, so he’s @Rick- We’ll put it in the show notes, but @RickStrahl on Twitter. 0:45:51.7 John Papa And Jen, do you have someone to follow? 0:45:53.1 Jen Luker I do. So there’s someone that I’ve been seeing a lot in the conference circuit this year. His name is Tejas Kumar. He is one of the nicest, most upbeat, most enthusiastic, and kindest, and most patient people you will ever meet in your entire life. He has more energy than my child and he’s basically the person who touts love and tolerance and kindness throughout Twitter. It’s a definite highlight in my feed. So I will definitely include his link in the show notes as well. But he’s my person to follow. 0:46:34.2 John Papa Actually I think I met Tejas last week at dotJS in Paris. Super nice guy. I hadn’t met him before but he was just a Twitter friend, so. It’s so nice when you actually meet people in person who you meet on the internet. (laughs) 0:46:46.0Jen Luker Absolutely. 0:46:47.1John Papa Well hey, Jen, it was great having you on here and thank you for coming on and talking to us about accessibility and for everybody who’s listening, thanks for listening to this show. We’re putting a bunch of links in the show notes so go check those out and please listen to us every Tuesday morning. 0:47:03.3 Jen Luker Thank you. (Exit Music) 0:47:08.4 Voiceover Thanks for listening to Real Talk JavaScript. This show and all of our shows are available at www.RealTalkJS.com with links and notes. John and Ward would love to hear what you think, especially about potential guests and topics for future shows. Follow and send them a message on Twitter @RealTalkJS.
How to add Font Awesome icons to your WordPress menu items using CSS.
Nolan Erck talks about “Font Awesome and ColdFusion (never build icons again)” in this episode of the CF Alive Podcast, with host Michaela Light. Tired of having to make “delete”, “edit”, “new”, “save”, “confirm”, and “purchase” icons for your clients? In 3 different sizes (desktop, tablet, mobile)? And new versions for each color scheme you use? […] The post 069 Font Awesome and ColdFusion (never build icons again) with Nolan Erck appeared first on TeraTech.
In this episode, Scott and Wes chat about 20 different ways you can improve the perf, speed and overall user experience of your websites. Cloudinary - Sponsor Cloudinary is the best way to host, compress and transform your images on the web. Sign up for their free tier and get 10GB of bandwidth for free! Also check out Cloudinary's ImageCon conference - use the code SYNTAX99 for a discount when checking out. Fluent Conf - Sponsor Developers, software engineers, designers, and web performance professionals flock to Fluent in pursuit of a common goal: building a better web. That means delivering fast, secure, accessible experiences to users and customers. Fluent covers a broad range of technologies and topics to provide web programming professionals with the skills, connections, and inspiration needed to build better online and mobile experiences. Fluent is this June 11-14 in San Jose, CA. Save 20% today with code: SYNTAX Show Notes So many perf tips came in over twitter, so in addition to this podcast I'd recommend you read all the replies to this tweet 0:00 We just cracked 1,000,000 downloads! Thank you! 4:00 Network Tips Reducing the amount of HTTP requests A little bit about HTTP2 An interview about http2 8:00 Use Caching and LocalStorage Turn on aggressive caching on your server - long expire times What is gzip? / Enabling gzip 12:00 Using a CDN Listen to our episode on CDNs and #BigZips 13:00 When to load your JS Blocking Requests 15:00 Use Lazy Loading 17:00 Preloading content with Link rel="preload" rel="prefetch" 19:00 Picture, picturefill and srcset="" Article on srcsrc and Picture srcset vs picture/source elements 25:00 Image Compression One less jpg Serve less data 26:00 Inline SVG Talk about Font Awesome 33:00 CSS and JS Code Critical CSS 37:00 Remove unused code Purify CSS no-unused-imports with ESlint 38:00 Code Splitting 40:00 Transpile less babel-preset-env 41:00 Tree shaking Hoyyyy its a tree shaker 42:00 Async ans defer attributes on your script tags Amazing site that visualizes async and defer 45:00 Icon Fonts Web Fonts Native Font Stack: Good: font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 47:00 font-display 49:00 Troubleshooting Performance Simulate Slow Network Speed Google Page Speed Wes' Page Speed Video SIIIIICKkkkkkkkk PIXXXXX Scott: WiFi Surge Protector Wes: KitSound Bluetooth Airline Converter Shameless Plugs Scott is working on a Vue course! Wes is working on his Advanced React course! Tweet us your tasty treats! Scott's Instagram LevelUpTutorials Instagram Wes' Instagram Wes' Twitter Wes' Facebook Scott's Twitter Make sure to include @SyntaxFM in your tweets
¿Quieres generar altos índices de tráfico en tu sitio web hecho con Divi? ¿Generas contenidos pero no recibes muchas visitas? ¿Como es eso que Divi es malo para el SEO? Bueno, pues en este episodio de Divipod les voy a mencionar como optimizar el SEO de su sitio web con Divi, cuales son los plugins recomendados para el SEO en WordPress, qué cosas debemos optimizar en nuestro sitio web para mejorar el SEO y que configuraciones debemos hacer fuera de nuestro sitio web para crear un impacto directo en el SEO de nuestra Página web hecha con DIVI. Mi nombre es Jefferson Maldonado, Yo soy Emprendedor, diseñador web, Divi lover y consultor UX, y estas escuchando el episodio #20 DiviPod, el podcast donde aprenderás todo lo relacionado con el diseño web, WordPress, los negocios online y el amado y odiado Divi. Pero antes les recuerdo que en wpdivi.club podrán encontrar tutoriales, artículos, vídeos y herramientas para aprender a usar WordPress de una manera francamente sencilla. Recuerda que al entrar en el sitio web puedes ir a apartado de cursos, y apuntarte sin compromiso para recibir una oferta única de suscripción inicial a la plataforma de cursos de Divi, que será lanzada en los próximos meses. ¡Puedes obtener hasta un 75% de descuento y además participarás por el sorteo de 3 meses de membresía completamente gratuita! No esperes más entra en wpdivi.club y únete al club. Veamos los puntos tratados en el episodio de esta semana en Divipod: ¿Que es el SEO? ¿Plugins Recomendados para ayudarnos con el SEO en WordPress? Primeros Pasos para mejorar el SEO Instalación y configuración del plugin Yoast SEO Detalles importantes a configurar en Yoast No se te puede olvidar el Site map. Optimización de Imágenes Optimización del SEO del contenido Optimización de las Páginas Optimización de los Custom Post Tipe Configuración de nuestro sitio web en Google Search Console Generación de contenido de calidad. Conclusiones. Toda la información de este podcast la puedes encontrar en https://wpdivi.club/podcast/ Patrocinador de este episodio: KINSTA HOSTING es un proveedor de hosting con un servicio especializado en WordPress. Dentro de las características principales de este hosting tenemos: Más 10 años de experiencia trabajando con WordPress Usan la tecnología más moderna como Nginx, PHP 7.2, contenedores LXD y Maria DataBase para asegurarse que tú sitio web cargue en un abrir y cerrar de ojos. Tu sitio está monitoreado y asegurado 24/7. Potenciado por Google Cloud Platform y sus 13 centros de datos globales. Migraciones de sitios gratuitas Tu sitio web siempre respaldado Escalamiento automático Y por supuesto lo más importante Soporte experto de WordPress Atención las 24 horas del día por diferentes canales Monitoreo web todo el día, todos los días ¡Ningún problema quedará sin resolver! Sitios de desarrollo de un solo clic. (Staging) Y Construido por desarrolladores para desarrolladores. Recuerda! kinsta hosting, tu hosting especializado para wordpress Noticia de la semana sobre Divi: ¡Nueva Actualización disponible! Elegant Themes acaba de lanzar una nueva super actualización. Wow! Esta semana los aficionados a Divi conseguimos nuevamente una super mega mejora en nuestras posibilidades de diseño con este hermoso tema. En esta ocasión la gente de Elegant Themes hizo una mejora en el tema, incluyendo una nueva función en el Divi Builder con la cual podremos cambiar las formas de los divisores en las secciones de Divi, a múltiples diseños que estan ahora incorporados en nuestro maquetador visual. Todos manejabamos por defecto que los divisores de estas secciones, pues eran simplemente una línea plana que separa un área de otra área de Divi, ahora tendremos diferentes formas prediseñadas, con las que podremos jugar con los tamaños y las posiciones, para crear efectos de división en las secciones de Divi realmente espectaculares. Vamos lo que nos comenta la gente de Elegant Themes: En palabras de Elegant Themes: Hoy nos complace presentar Divi Shape Dividers, una nueva opción que le brinda la posibilidad de agregar formas y efectos personalizados a tus páginas, creando transiciones dinámicas entre los bloques de contenido y agregando ese toque personal adicional a tu sitio web. Los divisores se pueden colocar encima y debajo de cada sección de tu sitio web, lo que le permite crear fácilmente sorprendentes efectos de transición entre diferentes partes de tu página. Puedes elegir entre 26 formas diferentes, cada una de las cuales se puede voltear, cambiar de tamaño, repetir, combinar y personalizar para crear una amplia gama de diseños personalizados. Como lo ven, Elegant Themes no esta jugando a crear un buen maquetador de Páginas, sino está trabajando para ser el mejor y más grande maquetador de sitios web de este momento. ¿Ya probaste esta nueva función? ¿Dame tus impresiones en cualquiera de mis redes sociales o en las notas del programa de este episodio? Plugin de WordPress y Divi Recomendado de la semana: Plugin Recomendado de la semana: Divi Icon King Tomando en cuenta una de las solicitudes o preguntas que hicieron en el grupo de Divi en Español, decidi presentar esta semana un plugin que responde precisamente a una de esas Dudas. ¿Como obtener más iconos en nuestro menú de iconos disponibles en Divi? Divi viene con alrededor de 380 iconos integrados que se pueden usar en blurbs, superposiciones, botones, etc. A pesar de todo eso, siempre hay la necesidad de más. Algunos de los mejores recursos para iconos gratuitos son Font Awesome. Afortunadamente, estos iconos se pueden agregar a Divi fácilmente con un plugin highlight llamado Divi Icon King. Este plugin de terceros nos permite agregar cerca de 2000 iconos más para usar en nuestros diseños web. Lo que hace este plugin es agregar 4 nuevas pestañas a la galería de iconos de nuestros constructor visual. Nos presenta nueva paquetería de iconos de FontAweson, Material Icon, Outline Icon o Solind Icon lo cual nos da grandes opciones para escoger el icono deseado para nuestro diseño web con Divi. Otra de las opciones que tiene este maravilloso plugin es que nos permite hacer una busqueda del icono que necesitamos por palabra clave. Así, si necesitamos por ejemplo un icono de carrito para nuestra tienda Online, podemos solo typear la palabra “Cart” y nos aparecerán las opciones de iconos disponibles para esta palabra. Este Plugin funciona con Extra e incluso funciona con plugins de terceros siempre que sigan los estándares de codificación de ET. Si estás buscando una manera fácil de agregar íconos gratuitos desde Font Awesome e íconos de material a Divi, Divi Icon King es el plugin que necesitas. Puedes encontrar este plugin en Elegant Marketplace y tiene un valor de 20 USD Puedes ver la más información de este plugin en: https://elegantmarketplace.com/downloads/divi-icon-king/ ¿Te ha gustado? ¡Valoranos! Por último recuerden que para todos los podcaster es de gran ayuda que puedan dejar una valoración en iTunes y likes o comentarios en iVoox. Así podemos llegar a más personas y eso nos permite seguir generando este contenido de calidad para ustedes. Recuerda solo debes buscar en tu app de podcast buscar Divipod y dejar por alli tu valoración de 5 estrellas con tu comentario acerca del podcast. Si te ha gustado este contenido no olvides compartirlo en tus redes sociales con todos tus conocidos en los botones de la parte inferior de las notas de este programa. Feliz de estar aquí con ustedes una vez más. ¡Un saludo!
FreeBSD 11.1-RELEASE is out, we look at building at BSD home router, how to be your own OpenBSD VPN provider, and find that glob matching can be simple and fast. This episode was brought to you by Headlines FreeBSD 11.1-RELEASE (https://www.freebsd.org/releases/11.1R/relnotes.html) FreeBSD 11.1 was released on July 26th (https://www.freebsd.org/releases/11.1R/announce.asc) You can download it as an ISO or USB image, a prebuilt VM Image (vmdk, vhd, qcow2, or raw), and it is available as a cloud image (Amazon EC2, Microsoft Azure, Google Compute Engine, Vagrant) Thanks to everyone, including the release engineering team who put so much time and effort into managing this release and making sure it came out on schedule, all of the FreeBSD developers who contributed the features, the companies that sponsored that development, and the users who tested the betas and release candidates. Support for blacklistd(8) has been added to OpenSSH The cron(8) utility has been updated to add support for including files within /etc/cron.d and /usr/local/etc/cron.d by default. The syslogd(8) utility has been updated to add the include keyword which allows specifying a directory containing configuration files to be included in addition to syslog.conf(5). The default syslog.conf(5) has been updated to include /etc/syslog.d and /usr/local/etc/syslog.d by default. The zfsbootcfg(8) utility has been added, providing one-time boot.config(5)-style options The efivar(8) utility has been added, providing an interface to manage UEFI variables. The ipsec and tcpmd5 kernel modules have been added, these can now be loaded without having to recompile the kernel A number of new IPFW modules including Network Prefix Translation for IPv6 as defined in RFC 6296, stateless and stateful NAT64, and a module to modify the TCP-MSS of packets A huge array of driver updates and additions The NFS client now supports the Amazon® Elastic File System™ (EFS) The new ZFS Compressed ARC feature was added, and is enabled by default The EFI loader has been updated to support TFTPFS, providing netboot support without requiring an NFS server For a complete list of new features and known problems, please see the online release notes and errata list, available at: FreeBSD 11.1-RELEASE Release Notes (https://www.freebsd.org/releases/11.1R/relnotes.html) FreeBSD 11.1-RELEASE Errata (https://www.freebsd.org/releases/11.1R/errata.html) For more information about FreeBSD release engineering activities, please see: Release Engineering Information (https://www.freebsd.org/releng/) Availability FreeBSD 11.1-RELEASE is now available for the amd64, i386, powerpc, powerpc64, sparc64, armv6, and aarch64 architectures. FreeBSD 11.1-RELEASE can be installed from bootable ISO images or over the network. Some architectures also support installing from a USB memory stick. The required files can be downloaded as described in the section below. SHA512 and SHA256 hashes for the release ISO, memory stick, and SD card images are included at the bottom of this message. PGP-signed checksums for the release images are also available at: FreeBSD 11.1 Release Checksum Signatures (https://www.freebsd.org/releases/11.1R/signatures.html) A PGP-signed version of this announcement is available at: FreeBSD 11.1-RELEASE Announcement (https://www.FreeBSD.org/releases/11.1R/announce.asc) *** Building a BSD home router - ZFS and Jails (https://eerielinux.wordpress.com/2017/07/15/building-a-bsd-home-router-pt-8-zfs-and-jails/) Part of a series of posts about building a router: Part 1 (https://eerielinux.wordpress.com/2017/05/30/building-a-bsd-home-router-pt-1-hardware-pc-engines-apu2/) -- discussing why you want to build your own router and how to assemble the APU2 Part 2 (https://eerielinux.wordpress.com/2017/06/03/building-a-bsd-home-router-pt-2-the-serial-console-excursion) -- some Unix history explanation of what a serial console is Part 3 (https://eerielinux.wordpress.com/2017/06/10/building-a-bsd-home-router-pt-3-serial-access-and-flashing-the-firmware/) -- demonstrating serial access to the APU and covering firmware update Part 4 (https://eerielinux.wordpress.com/2017/06/15/building-a-bsd-home-router-pt-4-installing-pfsense/) -- installing pfSense Part 5 (https://eerielinux.wordpress.com/2017/06/20/building-a-bsd-home-router-pt-5-installing-opnsense/) -- installing OPNsense instead Part 6 (https://eerielinux.wordpress.com/2017/06/30/building-a-bsd-home-router-pt-7-advanced-opnsense-setup/) -- Comparison of pfSense and OPNsense Part 7 (https://eerielinux.wordpress.com/2017/06/30/building-a-bsd-home-router-pt-7-advanced-opnsense-installation/) -- Advanced installation of OPNsense After the advanced installation in part 7, the tutorials covers converting an unused partition into swap space, and converting the system to ZFS After creating a new pool using the set aside partition, some datasets are created, and the log files, ports, and obj ZFS datasets are mounted The tutorial then goes on to cover how to download the ports tree, and install additional software on the router I wonder what part 9 will be about. *** Be your own VPN provider with OpenBSD (v2) (https://networkfilter.blogspot.com/2017/04/be-your-own-vpn-provider-with-openbsd-v2.htm) This article covers how to build your own VPN server with some advanced features including: Full Disk Encryption (FDE) Separate CA/signing machine (optional) Multiple DNSCrypt proxy instances for failover OpenVPN: Certificate Revocation List/CRL (optional) OpenVPN: TLS 1.2 only OpenVPN: TLS cipher based on AES-256-GCM only OpenVPN: HMAC-SHA512 instead of HMAC-SHA1 OpenVPN: TLS encryption of control channel (makes it harder to identify OpenVPN traffic) The article starts with an explanation of the differences between OpenVPN and IPSEC. In the end the author chose OpenVPN because you can select the port it runs on, and it has a better chance of working from hotel or coffee shop WiFi. The guide them walks through doing an installation on an encrypted disk, with a caution about the limitations of encrypted disk with virtual machines hosted by other parties. The guide then locks down the newly installed system, configuring SSH for keys only, adding some PF rules, and configuring doas Then networking is configured, including enabling IP forwarding since this machine is going to act as the VPN gateway Then a large set of firewall rules are created that NAT the VPN traffic out of the gateway, except for DNS requests that are redirected to the gateways local unbound Then some python scripts are provided to block brute force attempts We will use DNSCrypt to make our DNS requests encrypted, and Unbound to have a local DNS cache. This will allow us to avoid using our VPS provider DNS servers, and will also be useful to your future VPN clients which will be able to use your VPN server as their DNS server too Before configuring Unbound, which is the local DNS cache which will make requests to dnscrypt_proxy, we can configure an additional dnscrypt instance, as explained in the pkg readme. Indeed, dnscrypt DNS servers being public ones, they often goes into maintenance, become offline or temporarily unreachable. To address this issue, it is possible to setup multiple dnscrypt instances. Below are the steps to follow to add one, but you can add more if you wish Then a CA and Certificate are created for OpenVPN OpenVPN is installed and configured as a server Configuration is also provided for a client, and a mobile client Thanks to the author for this great tutorial You might also want to check out this section from their 2015 version of this post: Security vs Anonymity (https://networkfilter.blogspot.nl/2015/01/be-your-own-vpn-provider-with-openbsd.html#security_anonymity) *** Essen Hackathon Trip - Benedict Reuschling (https://www.freebsdfoundation.org/blog/2017-essen-hackathon-trip-report-benedict-reuschling/) Over on the FreeBSD Foundation Blog, Benedict provides a detailed overview of the Essen Hackathon we were at a few weeks ago. Head over there and give it a read, and get a feel for what these smaller type of community events are like. Hopefully you can attend, or better yet, organize, a similar event in your area. News Roundup Blog about my self-hosted httpd blog (https://reykfloeter.com/posts/blog-about-my-blog) I really like Twitter because it allows me to share short messages, we have a great community, and 140 characters are enough for everybody. And this statement was exactly 140 characters, but sometimes I want to say more than that. And that's why I finally created this new blog. I was never really into blogging because I barely had time or the audience to write long articles. I sometimes wrote short stories for sites like undeadly.org, I collected some of them here, but my own blog was hosted on tumblr and never saw any activity. I want to try it again, and this time I decided to create a self-hosted blog. Something that runs on my own server and with httpd, the web server that I wrote for OpenBSD. So I was looking for potential blogging tools that I could use to run my own blog. Besides the popular and heavyweight ones such as WordPress, there are countless other options: I looked at blogs from fellow developers, such as Ted Unangst's flak (I like the fact that it is written in Lua but the implementation is a bit over my head), or Pelican that is used by Peter Hessler for bad.network (but, sorry, I don't like Python), and finally Kristaps Dzonsons' sblg that is used for all of his projects and blogs. I decided to use sblg. Kristaps keeps on releasing very useful free software. Most well-known is mandoc, at least everyone is using it for manpages these days, but there is is also his BCHS (beaches) web stack which strongly advertises OpenBSD's httpd. Great. I also use kcgi whenever I have to write small CGIs. So sblg seemed like the right choice to me. Let me quickly iterate over my current Makefile. I keep on tweaking this file, so it might have been changed by the time you are reading this article. Please note that the Makefile is written for OpenBSD's make, a distant derivative of pmake which is not like GNU make. I'm not a designer or web developer, but I appreciate good looking web pages. I wanted to have something that is responsive, works on desktops and mobiles, looks somewhat modern, works without JavaScript, but doesn't disqualify me for all the eye candy from a geek point of view. I bootstrapped the theme by creating a simple grid layout with a fairly typical blog style: banner, top menu, middle text, sidebar. In 2017, bootstrap is probably a vintage (or retro) framework but it makes it very easy to create responsive pages with a proper layout and without caring about all the CSS and HTML5 madness too much. I also use Font Awesome because it is awesome, provides some fancy icons, and was suggested in sblg's example templates (let's blame Kristaps for it). I do not include any JavaScript which prevents me from using bootstrap's responsive hamburger menu. I have to admit that "reykfloeter" is not an ideal name for a blog. My actual name is "Reyk Flöter", and I normally just use my first name "reyk" as a user- and nickname, but it was taken when I registered my Twitter account and the related domain. So I picked reykfloeter in a few places. I'm aware that my German last name is nearly unpronounceable for others, so "reykfloeter" appears like a random concatenation of letters. As most of us, I own a number of domains and maybe I should move the blog to bsd.plumbing (which is used as a home for relayd and httpd), arc4random.com (but I intended to use it as a fine OpenBSD-powered Entropy-as-a-Service for poor Linuxers), or even copper.coffee? In addition to the domain, I also need a good blog name or tag line. A very memorable example in the BSD world is Peter Hansteen's THAT GRUMPY BSD GUY blog. So what should I use? Reyk Flöter's blog OpenBSD hacker. Coffee nerd. Founder. Ask Reyk (imaginary how-tos and 10 step guides) Sewage, Drainage and BSD Plumbing (bsd.plumbing/blog) A Replacement Call for Random (arc4random.com) Coffee with Reyk (copper.coffee) For now it will just be reykfloeter - blog iXsystems releases the X10 (https://www.ixsystems.com/blog/serverenvy-truenas-x10/) TrueNAS X10 is the the 3rd generation of the TrueNAS unified storage line. The X10 is the first of a new TrueNAS series, and will be expandable to up to 360TB with the TrueNAS ES12 expansion shelf. The X10 is cost effective, at a 30% lower price point than the Z20, making it an effective addition to your backup/DR infrastructure. The street price of a 20TB non-HA model falls under $10K. It's designed to move with six predefined configurations that match common use cases. The dual controllers for high availability are an optional upgrade to ensure business continuity and avoid downtime. The X10 boasts 36 hot swap SAS using two expansion shelves, for up to 360TB of storage, allowing you to backup thousands of VMs or share tens of thousands of files. One of the use cases for TrueNAS X10 is for backup, so users can upgrade the X10 to two ports of blazing 10GigE connectivity. The 20TB non-HA model enables you to backup over 7,000 VDI VMs for under $3.00 per VM. Overall, the X10 is a greener solution than the TrueNAS Z product line, with the non-HA version boasting only 138 watts of power and taking up only 2U of space. Best of all, the TrueNAS X10 starts at $5,500 street. You can purchase a 120TB configuration today for under $20K street. Glob Matching Can Be Simple And Fast Too (https://research.swtch.com/glob) Here's a straightforward benchmark. Time how long it takes to run ls (a)nb in a directory with a single file named a100, compared to running ls | grep (a.)nb. Superscripts denote string repetition and parentheses are for grouping only, so that when n is 3, we're running ls aaab in a directory containing the single file aaa…aaa (100 a's), compared against ls | grep a.a.a.b in the same directory. The exception seems to be the original Berkeley csh, which runs in linear time (more precisely, time linear in n). Looking at the source code, it doesn't attempt to perform glob expansion itself. Instead it calls the C library implementation glob(3), which runs in linear time, at least on this Linux system. So maybe we should look at programming language implementations too. Most programming languages provide some kind of glob expansion, like C's glob. Let's repeat the experiment in a variety of different programming languages: Perhaps the most interesting fact evident in the graph is that GNU glibc, the C library used on Linux systems, has a linear-time glob implementation, but BSD libc, the C library used on BSD and macOS systems, has an exponential-time implementation. PHP is not shown in the graph, because its glob function simply invokes the host C library's glob(3), so that it runs in linear time on Linux and in exponential time on non-Linux systems. (I have not tested what happens on Windows.) All the languages shown in the graph, however, implement glob matching without using the host C library, so the results should not vary by host operating system. The netkit ftpd runs quickly on Linux because it relies on the host C library's glob function. If run on BSD, the netkit ftpd would take exponential time. ProFTPD ships a copy of the glibc glob, so it should run quickly even on BSD systems. Ironically, Pure-FTPd and tnftpd take exponential time on Linux because they ship a copy of the BSD glob function. Presumably they do this to avoid assuming that the host C library is bug-free, but, at least in this one case, the host C library is better than the one they ship. Additional Reading This post is an elaboration of an informal 2012 Google+ post showing that most shells used exponential-time glob expansion. At the time, Tom Duff, the author of Plan 9's rc shell, commented that, “I can confirm that rc gets it wrong. My excuse, feeble as it is, is that doing it that way meant that the code took 10 minutes to write, but it took 20 years for someone to notice the problem. (That's 10 ‘programmer minutes', i.e. less than a day.)” I agree that's a reasonable decision for a shell. In contrast, a language library routine, not to mention a network server, today needs to be robust against worst-case inputs that might be controlled by remote attackers, but nearly all of the code in question predates that kind of concern. I didn't realize the connection to FTP servers until I started doing additional research for this post and came across a reference to CVE-2010-2632 in FreeBSD's glob implementation. BSD VPS Providers Needed (https://torbsd.github.io/blog.html#bsd-vps) One of TDP's recent projects is accumulating a list of virtual private server services (VPS) that provide a BSD option. VPS's are generally inexpensive services that enable the user to only concern themselves with software configuration, and not be bothered with hardware or basic operating system setup. In the pre-Cloud era, VPS providers were the “other people's computers” that users outsourced their systems to. The same shortcomings of cloud services apply to VPS providers. You don't control the hardware. Your files are likely viewable by users up the directory hierarchy. The entropy source or pool is a single source for multiple systems. The same time drift applies to all time-keeping services. Nevertheless, VPS services are often cheap and provide a good spread in terms of geography. All a provider really needs is a few server-grade computers and a decent network connection. VPS's are still a gateway drug to bare-metal servers, although it seems more and more of these gateway users stop at stage one. Cheap systems with a public IP are also a great way to tinker with a new operating system. For this reason, TDP created this list of BSD VPS providers. Some explicitly deny running Tor as a server. Some just reference vague “proxy services.” Others don't mention Tor or proxies at all. The list is a start with currently just under 70 VPS providers listed. Input through various channels already started, and TDP intends to update the list over the coming months. A first draft email and open letter addressed to the providers were drafted, and we are looking to speak directly to at least some of the better-known BSD VPS providers. We may be able to convince a few to allow public Tor relays, or at least published bridges. These providers could be new BSD users' gateway drug into the world of BSD Tor nodes. Running a Tor relay shouldn't be considered a particularly risky activity. Maybe we can adjust that perception. Let us know any input via email or GitHub, and we'll be glad to make updates. Beastie Bits Avoid OS Detection with OpenBSD (https://blog.cagedmonster.net/avoid-os-detection-openbsd/) TrueOS update to fix updating (https://www.trueos.org/blog/update-fix-updating/) MidnightBSD 0.8.5 VirtualBox Install (https://www.youtube.com/watch?v=I08__ZWaJ0w) BSD Pizza Night in Portland (http://calagator.org/events/tag/BSD) *** Feedback/Questions Andrew - BSDCan videos? (http://dpaste.com/08E90PX) Marc - The Rock64 Board (http://dpaste.com/08KE40G) Jason - Follow up on UEFI and Bhyve (http://dpaste.com/2EP7BFC) Patrick - EFI booting (http://dpaste.com/34Z9SFM) ***
Kris Van Houten: @krivaten | krivaten.com | Q2 Show Notes: 00:55 - Kris' Interest and Passion for Accessibility 06:07 - Using Ember for Accessibility: Pattern Adoption 10:13 - Context Switch Awareness and Managing Focus 12:08 - Asynchrony and Desired Interaction 14:04 - Building a Form Input Component 19:05 - Things That Are Hard to Catch 22:41 - Assistive Browsers? 28:17 - Making Things Accessible From the Start Resources: Building for Accessibility by Nathan Hammond @ Wicked Good Ember 2015 The A11y Project: Web Accessibility Checklist WCAG 2.0 checklists Why Don't Screen Readers Always Read What's on the Screen? Part 1: Punctuation and Typographic Symbols Mozilla Accessibility Kris' Blog Post Series on Accessibility: Part 1: What is accessibility and why should we care? Part 2: A Primer on Accessibility Part 3: Getting Our Apps Ready for Accessibility Part 4: Building an Accessible Icon Component in Ember Part 5: Building an Accessible Input Component in Ember Part 6: Building an Accessible Alert Component in Ember Part 7: Building an Accessible Numbers Component in Ember Part 8: Building an Accessible Currency Component in Ember Transcript: CHARLES: Hello, everybody and welcome to The Frontside Podcast, Episode 72. My name is Charles Lowell, a developer here at The Frontside and podcast host-in-training. With me today is Wil. WIL: Hello. CHARLES: Hey, Wil. Today, we're going to be talking about accessibility in single page applications with Kris Van Houten who is a developer at Q2. Hey, Kris. Thank you for coming on the show. Today, we're going to talk about something that I know a lot of people's minds here and probably elsewhere on the internet, it's a topic that's getting a lot more attention, which is a good thing and that's accessibility. We're going to explore the niche of accessibility as it applies to single page applications. Now, you're a frontend developer at Q2, what initially got you interested in and passionate about accessibility in general? KRIS: I honestly feel my path to passion in this area has been a little bit unorthodox in a number of ways. I basically started out in total apathy of this topic and over the last year, it has turned into a genuine interest of mine. About three years ago, I remember listening to an episode of ShopTalk Show with Dave Rupert and Chris Coyier and they kind of went on this large rant about accessibility and why more developers need to be concerned and compassion about it. Dave Rupert was talking about his contributions to the accessibility project and I'm sitting back and thinking to myself and this is back then, obviously, "Why would anyone who is blind want to use anything that I'm working on." I basically balked at the idea and disregarded it entirely. At that time, I was just getting my feet wet with Ember working on an application with a company here in Cincinnati and we had these conversations about, "I notice that we put this action or a clickable event on a div element, should we not be doing that? Is it that not something that we should be doing?" I remember sitting back and having this conversation and saying, "The ads been crawled by SEO and Ember isn't yelling at us for doing it. It still works fine so what the heck? Let's just go with it." Basically, every single app that come into since then has basically adopted that same mindset even before I joined the team so I know it's not just me who is thinking this. A lot of developers that have been exercising the same way of doing their code. CHARLES: Right, it's the path of least resistance. Everybody's got a job to do. Everybody's got features to deliver so that practice can be very easily self-perpetuating, right? KRIS: Exactly and I think a lot of developers just don't understand the semantic difference between a div or a label or a button or a link and how browsers can actually treat these difference HTML attributes or HTML tags differently because of how assistive technology can utilize them for per person's benefit. That's where I was a little over a year ago basically. When I first started at Q2, that first week, I got pulled into a discussion about design patterns which is another passion of mine and somehow, that turned into me joining a group that was to establish to figure out how to tackle the task of making our large app accessible. Basically, we had a company come in, audit our application and we got a big fat F for accessibility so it's something that we said, "We need to start tackling this problem." Being that, I just started at the company that week, I was going to tell them no but internally, I was panicking and saying, "I got to figure out what is this whole accessibility thing is and why it's important." I started looking for books, articles on the topic and trying to basically flood myself with information. Two things that really transformed my way of thinking was actually a talk given by Nathan Hammond at that Wicked Good Ember in 2015, where he shows an example of building an application without accessibility in mind so basically, doing what I was doing before which is we're adding actions to div tags, we're not really caring about semantic HTML, we're just making the feature or the application work. But then what he does, which I think is super powerful is he pulled up a colleague of his who is blind and had him try to use the application. He just goes through and you can see the struggle and he's actually vocalizing and talking about where he's [inaudible] with this application. Long story short, Nathan comes back up and makes a few adjustments. DHTML has [inaudible] up again and it's night and day difference just by changing the markup and by dropping in the Ember A11y add-on which helps with focusing the browser in certain areas of the content. He's able to totally transform how's individuals able to use the app. For me, that was a super powerful to come in and see that and see someone actually struggle with a website that they were trying to use. I think, [inaudible] where I always saw accessibility was it will only affects people who can't see and I think that's the other area where I've really started to have that paradigm shift was when I realized that this isn't just people who can't see. It's for people who have motor difficulties, who can't use a mouse and how to use a keyboard instead. People who have various vision issues, whether that's cataracts, colorblindness, glaucoma, dyslexia, some in these effects, not just DHTML but also affects color contrast, the fonts that we're using that impacts every area of application design and development and that's where I started to realize that that was where the paradigm shift happened in my mind where I started thinking to myself we really need to start talking about this more and getting other developers on board in general on this. CHARLES: It can be intimidating, especially when it feels like on a single page application, your divs have to do more, so to speak in the sense that it feels that your HTML is fatter. It's not just a thin layer but your HTML is actually part of the UI. KRIS: Exactly, yeah. CHARLES: When it comes to having this paradigmatic shift that you're describing, when you're looking at your single page applications, are there any insights into the general structure of the application that you feel like you've gained that are foundational, they kind of transcend accessibility? I guess, what I'm saying is, is there any way that you become like a better developer or been able to recognize foundational patterns because of having these insights surrounding accessibility? KRIS: I've been working with Ember for about three or four years now, basically since it was still in beta. Over the last several years, I have started to accumulate a lot of knowledge as to how we can utilize Ember to do a lot of the heavy lifting for us. When I started getting more passionate about the area of accessibility, first question that came into my mind are how can we use Ember to do some of the heavy lifting for us. For example, some of the things that I had done was go through and start working on developing a couple of components that basically cover a lot of things that I find ourselves doing [inaudible] a lot. Whether that might be a component to just plain icon on a page or a component to display input on a page. What we're able to do is using Ember, we can say, "Here's the icon I want to display but if I don't happen to pass in an aria-label attribute, for example. The component will add the 'aria-hidden=true' for me. Being able to really utilize the power of Ember to do some of that stuff for us on the back side of things, I guess you could say it magically. CHARLES: Let me stop you there for a second and unpack that example. What you're saying is, if I'm going to put an input on the page, if I actually don't assign an ARIA role, it's going to hide it from me? KRIS: No. I was thinking of an icon components, say if I'm using Font Awesome, for example and I want this with the trash icon so I wrote a component for our specific icon library that we're using. We pass in the icon that we want to display, again that could be the trash icon and we can also pass in an aria-label attribute to add a label to that span that will be read to the user. But if we don't pass that attribute in, the component will automatically add the 'aria-hidden=true' attribute for us so basically it skips over it. CHARLES: Yes so it won't be just garbage for a screen reader or someone navigating with a keyboard. WIL: Yeah, otherwise the screen reader tries to read the content of the icon CSS which is just the Unicode. CHARLES: Right. KRIS: Yeah. What we really is trying to figure out and what I've spent a lot of my time, especially in writing my blog series on this was while we are using React or Vue or Angular or Ember or whatever, how can we utilize the power of the single page application frameworks to do some of that heavy lifting for us in the background without us needing to explicitly define everything. I'd say, especially when you work on a large team like what I work on currently, we can't expect everybody to be extremely well-versed in the area of accessibility so if we can do some of the work for them and just encourage them to adopt these components in their daily workflow, it does some of the work for us. That's what we're working on and talking a lot about at Q2 is basically this pattern adoption. CHARLES: Right so it sounds like to kind of paraphrase, whether you're working in any framework most of them have this concept of components so really leaning hard on that idea to make components at the very granular level aware of their own accessibility. Is that fair to say? KRIS: Yeah, obviously there's more I'm sure as we go for the conversation about some of the things that I've tackled in this area but long story short, being able to utilize and recognize, you have this extremely powerful JavaScript framework at your disposal to do some of work for you so why not equip to do just that. CHARLES: Yeah. I guess that falls into my next question, which is there are component level concerns and if there are other component level concerns, I definitely want to hear about them but what immediately leaps to mind is there are also cross-cutting concerns of any single page application, what's the state of your URL and if you're using a router. Some of the content on the page is going to be changing and others isn't like how do you cope with that? What are the cross-cutting concerns of an application that span components and then how do you cope with them? KRIS: I think one thing that comes to mind as you're talking is the whole area of context switch awareness. If I click a link, if I go from the home page of an application to my profile page, how does a screen reader know that that content has now changed to present this new information to the user? I know what we were able to do was we were able to drop in the focusing out with component that's put out by the Ember accessibility team, which basically whenever we render to an outlet, that's utilizing this focusing outlet component, it will focus the browser to that main area and start presenting that information back to the users. One area that was at the top of our list as we start tackling accessibility was we need to figure out this whole context switch awareness thing because -- this is back then obviously when we first got started -- back then there was no way for a user to know when the page changed so they would basically be sitting there, waiting for any kind of feedback or whatsoever to be presented back to them and it just wasn't happening. I would say, managing focus is probably one of the top level concerns when it comes to single page applications because it's a single page application so if you click a link, the page isn't completely refreshing, prompting the screen reader to present the information back to user. That's one of the key areas that I think of. CHARLES: What about things like asynchrony because a lot of times, these context switches are not boom-boom, one-two. The content on which you want to focus isn't available yet. Usually, the analog from a visual UI would be a loading spinner or a progress bar. How do you deal with those to say, "Your content is not quite ready. If you're made to wait it's because we want your content to be of the highest quality." KRIS: Sure, yeah. We were able to drop in the focusing outlet components in our application and it took care of a good chunk of the work but it seems like in our application, we're doing something that might not be as conventional as the rest of the Ember community would like them to be so we might not use the model hook as we should. It's hard for the page to know when the contents actually ready, when it's been rendered to the DOM to present back to the user. One thing that I'm currently trying to tackle right now, to figure out how we can remedy that problem. I probably say, honestly that's the challenge I'm working on right now. I don't have a solid answer to that one at the moment. CHARLES: Irrespective of how it plugs into the tool that you're using, what would just be the desired interaction there, regardless of how you make it work? KRIS: I guess, conceptually what I'd be thinking about is how can we notify the user we're loading content right now and whether that we have an alert box that has the ARIA alerts, basically attributes set on it, that we could pass in new, basically notifications to it to let the user know, "Loading content. Please wait," and then once that content resolves, focus them on that main outlet where the content has been displayed to read that content back to the user. That's how we're trying to think about tackling this issue but we haven't have a time to implement it to see how it's going to work across all the different avenues of application. CHARLES: I did want to come back at the component level. are there any other ways that you can lean on Ember or lean on React or lean on Vue, if you're using a component or in framework, just talk a little bit more about how you use those to unlock your application and make it more accessible. KRIS: One thing I can think of is a way that we can enforce better usage of the framework that we're using is one that comes to mind is a component that I worked out in the blog series that I wrote was building a form input component. Especially, when you're trying to write an accessible app, I think about how can we enforce certain patterns when other developers come in later on and want to add a field to a form or use this component somewhere else in the application. What are some ways that we can enforce that they're doing everything, using the component correctly so that way it renders accessible mark up? What I tinkered around with and we actually just landed in our application is basically a form group component to where we pass in, obviously the value that the input is bound to. But we also pass in a label that is tied to the input and whenever you hit save and the app goes to refresh, if you don't pass the label, there's an assert statement that basically fires up an error into the console and lets you know, "You're trying to use this component, you need to pass into label attribute for the purposes of accessibility and here's the instructions on how to do it." We've been kind of toying around with this idea of enforcing patterns because again, we have several dozen developers at Q2 that are working on this stuff and they're not all wizards when it comes to accessibility but how can we gradually start getting them to the place where they're adopting these patterns and best practices. I'd say, doing things like that, we are enforcing patterns in the usage of the components as well is really a key. One thing that we implement it in our testing framework is the use of a Deque Labs' aXe engine to basically go through, we can pass it a chunk of HTML and it will give us any suggestions that it has to make that content more accessible. We're using that in our test library right now, in our test build and encouraging developers as they write new components, as they go in and modify components to throw new snippets in to make sure that the content that's being spit out here is accessible and then submit your PR again. Just trying to be more hands on in that way. CHARLES: So you actually running a GitHub agent or something that's actually in the same vein as your test suite or if you're taking like snapshotting with Percy for doing visual diff so you're actually running a third check, which is an accessibility check? KRIS: Right now, we were able to land the aXe engine into our test build a couple months back so we're just slowly incrementing that over time. We have a couple challenges in the way of getting Percy implemented but that is in our list of goals to have that running as well. But one thing that I really like about aXe engine in particular is that if your check fails, it refines improvements that you should be making. The nice thing about it is also spits out a link to a page on Deque Labs website. They give an explanation of what have found and basically educates your developers for you. To me, I think that's huge because again, we can't educate every single developer and expect them to be pros at this but we can utilize tooling like the aXe engine or the [inaudible] Chrome extensions or stuff like that to do some education for us. As we work towards automating this further and further by using the aXe engine in our development side of things or using Percy on the test build as well. See, there's all kinds of stuff you can do but that's where we are right now. CHARLES: I really like that idea because in comparison with what we talked about at the top of the show, about how there's this path of least resistance that developers will follow quite naturally and quite rationally, which can lead to not accessible applications. It sounds to me like what you're doing is a establishing the same path of least resistance but having that path guide you towards accessible applications and saying, "This path of least resistance thing, it can be an asset or a liability so we might as well make it an asset." KRIS: Yeah, for sure. We sit down once a week and we talk about whatever challenges we're trying to work through in terms of accessibility. We have a weekly meeting where we sit down and talk about it. I thought one of the key topics to those conversations is how do we get the other developers that are not in these meetings more aware, more informed and more up to speed with this that they care about it, that they're working on it and it's part of their inner dialogue as they're writing out new features that are going to be deployed out to our clients. Lots of challenges there. CHARLES: Yeah. We've talked about some of these problems that you catch, you're actually writing some assertions there on the test build so you'll actually fail if there's certain requirements that aren't met but what are the things that are more intangible? How do those come up in terms of accessibility? What are the things that you can't catch through automated testing? KRIS: Right now, some of things that we're having a hard time testing which Percy will help once we get that implemented is contrast ratios and stuff like that. That's one of the key things that comes to mind for me when I think of the things that are a little hard to catch. I think another thing that's hard to catch, especially at the aXe engine and stuff like that, won't necessarily catch is the flow of your dialogue. When I turn on a screen reader and it starts reading back this page and content to me, sure we can make it so that it doesn't read out the icons character code and a lot of stuff. It presents the information we want back to us but I think, having that information presented back to the user in a way that's legible, that makes sense to them is probably one of the bigger challenges that I've been working on a little bit. One that comes to my mind is like the reading of currencies or numbers. One thing that I found way helpful was Deque put out a very thorough article on how the different screen reader like JAWS, NVDA, Apple's VoiceOver, how they read different types of punctuation, different types of graphics symbols, how they read [inaudible], $123.50, what does a screen reader actually read back to you. That's where I've actually been spending so much of time lately is building on some components that instead of reading back what the streaming will read back by default, which should be, "Dollar sign, one-two-three-five-zero," having actually read back, "One hundred twenty-three dollars and fifty cents," so basically, writing a series of components, I would do some of that, again heavy-lifting force, in that way, our developers don't have to go in and manually add-ons aria-labels obviously. That's been a nice little challenge where something that's we are working on just testing right now and making sure it works right if there is any downsides to doing this but I want a person using a screen reader or other types of assistive technology to hear the information as I'm thinking about it. When I see $123.50, I'm thinking in my head that's, "One hundred twenty-three dollars and fifty cents," not in single digits one right after the other. Those are things that a lot of the automated software isn't catching. It's not catching like, "Your grammar is bad," or, "This isn't making any sense to me." It is catching like are you passing in or applying the attributes to HTML elements that you should be. Are you using semantic structure in your headings and stuff like that?" I think that's one of the areas where developer is need to get their hand dirty, turn on the a screen reader or use any array of different voice-over tools to actually listen to the content being present back to them to see how it's presented. CHARLES: Yeah, it's almost a difference between a syntax error versus a runtime error like we've got a lot tools that can catch the syntax errors and you can put those in and catch where you have something that's malformed but some sentences can be perfectly formed but make no sense and it takes a human set of eyes to make sure if that content is coherent. One of the things that if you're going to ship applications to people, you need to be able to try and measure as closely as possible the environments in which the people will be using your software so you can actually have an accurate measure of whether it works or not. For example, in the Ember world lately in the stuff that we've been doing with acceptance testing in React, we admit people are going to be using a multiplicity of browsers to access this application so it's very typical to use Testem or use Karma to fire up five different browsers, which if you're using BrowserStack, you can do fifty. You know, people are going to be using IE8.1 on Edge or on a Surface. They're going to be using Safari. They're going to be using Chrome and those often surface those issues but I feel like there's no access to the actual screen reader and assistive technologies to be able to make real assertions against those things. I imagine that it would be cool if there was some way that in Testem or in Karma, you could have one of your browsers be like an assistive browser that you could actually assert, I want to assert that it read it as, "One hundred fifty-three dollars and twenty-five cents," and is that on the horizon? Is that even possible? But it seems like something that we have to shoot for if we actually want to measure that these things are working if we actually want to capture data points. KRIS: Yeah, I totally agree. If you look at the documentation on W3 for how these different HTML attributes should be treated by the browser or by the assistive technology, long story short is this is not how -- in several cases -- certain screen readers are presenting the information back to you. It's not how it's treating the content. That's again, one of the areas I thought was way interesting about that. Deque article on punctuation and typographic symbols, which is like we should expect that this software is operating at this level to present this information back to user in such a way where it understands what the dollar symbol in front of a series of numbers means but it just isn't there yet. There's still work to be done. I'm hopeful for the day where our screen readers are a lot more powerful in that capacity. One that makes me a lot more hopeful about that is I don't know if it's just because I've been more interested about this over the last year but it does seem like I'm seeing a lot more people talk about accessibility. I'm seeing Apple putting out videos, talking about the efforts that they're making to make their software more accessible. It does give me hope that there's a lot more visibility on this now. There's a lot more people fighting for this cause to cause these companies to come back and say, "We're going to put more effort into this. We not just going to make a standard screen reader and ship it and just leave it there for five years and no one was going to touch it," but, "We're going to start making improvements." One thing that I did notice just over the last couple months even was that out of nowhere, we use Apple VoiceOver in Chrome, which isn't typically how people use it. They typically use it with Safari. But if you use in Chrome, it will actually read back to you as, "One hundred twenty-three dollars and fifty cents." When I came across that, I was kind of dumbfounded but then I was thinking to myself, the vast majority of people who are using screen readers aren't using this browser but that's really interesting that they're doing this now. I dream of that day where we can basically run a series of mark up through in a test or into a function and basically have to spit back, here's how screen readers going to present this back to you. I'm hopeful for that day. CHARLES: I'm wondering now like why don't major browser vendors, why is this not just a piece of a puzzle that comes when I download Firefox. Firefox has access to my speakers, why isn't there a web standard for how screen readers will treat content? Maybe there's an effort under way. KRIS: I sure hope so. Looking through documentation, we know how things are supposed to work, how we've agreed that they should work and now basically, we're just waiting for the different browser vendors and Microsoft and Apple to make the updates to their streaming technology as well as JAWS and NVDA. I'm hopeful that these changes come soon. These are improvements to the interface. CHARLES: Yeah. Any time there's a gap, you can see that's an opportunity for someone -- KRIS: For sure. CHARLES: -- To write some software that has some real impact. I know certainly, I would love to see some way to roll these things into our automated test suites. KRIS: Yeah. I searched for it but with no avail and it's a little bit beyond my knowledge of how to build something of that caliber. I hope someone else does it because I don't know how. [Laughter] CHARLES: Well, maybe in a year, maybe in two years, maybe in 10, although hopefully a lot sooner than that. KRIS: Yeah. I would judge that at the speed of things were going right now, I'm optimistic that we're going to have some much better solutions within the next year or two on this field. Especially of how much I'm seeing people talk about it now, how much it's becoming a part of the regular conversation of web development, application development. I'm really optimistic that we're going to see some strides in this area over the next couple years. CHARLES: Okay. With the time that we have left, I'm going to ask one more question. Kris, there is something that I wanted to ask you, which is let's say that I am a developer who is working on a team that is maybe it's big, maybe it's small. I've got an application or I'm starting an application and I have a desire to make it accessible. How do I establish that path of least resistance? What advice do you have for someone who's just about to take the first step on that journey to make sure that they have the outcome that they're looking for which is the most accessible single page app that they can have? KRIS: I think it's a great question. I would start out that answer by simply saying to encourage you to be somebody who cares enough to speak up and become an evangelist, become an educator and become an enforcer in your workplace for this work. You don't have to be the most knowledgeable person in the world on the topic. God knows I'm not and I still there were people come to me, asking me, "How do I make this feature, make the guidelines, make it accessible to screen readers," but I'm passionate about this topic and I'm interested in learning as much as I can about those. Step one, just being an evangelists for it. Be interested in it, care about it. I'd say, the next thing is just learn more about semantic HTML. I would say from a lot of the things that I've been trying to tackle with the application that I'm working on, just simply writing semantic markup takes care about 80% of my challenges. In just understanding what are the different elements, what are the different tags are for and how screen readers and other assistive technology see those things. To get started, I would say there's beginner, intermediate and advance stuff. I would say go to the accessibility project, which is just A11yProject.com and read through the content there. It's very entry-level. You can probably read through most of the content within an hour or two and really start to get a grasp as to what level of effort you're looking at in terms of your application. Once you get through that, if you still want to learn more, I'd say go over to Mozilla's developer network -- MDN -- and read through their documentation. On the topic, there is a little bit more exhaustive but it's still really easy to read and really easy to grasp. Based on a content they have shared there, I'd say more of an advance level is actually go through all the documentation on the W3. It's a lot more verbose, it covers a lot more of use cases, it has a lot more suggestions and just stuff ready to go over. I'm still working through that information. There's so much of it but I would say that's as a good place to get started with understanding the different attributes, what they're for and just the importance of writing semantic HTML. I would say some definitely good things to start tinkering with to find some of the low-hanging fruit in your application would be to use some of the assessment tools that are already out there. You have the [inaudible] little JavaScript snippet that you can put in your Chrome favorite's bar or you can use the aXe engine or if you even have an aXe Chrome extension that you could pop up in your application to basically give you report on some of the areas that you should be looking to make some improvements. I think it's important to view accessibility kind of like how a lot of bloggers view SEO, is that there's always more work to be done, there's always improvements you can make but the key is to take those first steps and start making those improvements. One of the nice things about the accessibility project and there's a couple other websites out there that have some of the lists, they basically have a checklist for you to go down. If you're just getting started with accessibility, they have a checklist of all the first things that you should be covering to get your app started in that realm, to start making those improvements. I know you guys do links in the show notes. I can definitely send you those things to those items to get people started. Another thing I find myself doing a lot is while we're talking about something in our chat at work in or just go off in the code pin and mock something out in HTML and then see how the screen reader reads our content back to me and then kind of tinker with it and do a little bit of self-discovery in how this all works together. There's a lot of options out there. I know just threw a lot at your listeners but I'd say, it all starts with being someone who cares about the topic and cares enough to start asking others to care as well. CHARLES: I think that's a fantastic answer and a great note to end on. But before we go, obviously we will include those things in the show notes but also the other thing that we're going to include is a link that you actually, I understand, have a series of blog posts related to all of the things that you've been talking about, which we'll also include. KRIS: Awesome. Thanks. CHARLES: Everybody, go read it. Thank you so much Kris for coming and talking with us about accessibility. I think you're right. It is a topic that's gaining a lot more traction and a lot more mind share in the mainstream that can only be a good thing.
Aaaahh contact forms, a necessary on practically every website these days. We discuss our favorite contact form plugins we use on our Divi sites and some of their best features. Hosts Present: David Blackmon - Aspen Grove Studios / FB / @aspengrovellc Sarah Oates - Endure Web Studios / FB / @endureweb Tammy Grant - Sunflower Creatives / FB / @yourblogplace Tim Strifler - Divi Life / FB / @timstrifler Leslie Bernal - A Girl and Her Mac / FB / @agirlandhermac Adam Inlay – AdamInlay.com / FB / @AdamInlay Resources Mentioned (and some not mentioned but helpful): FAVORITE FREE Caldera Forms PROS: entry database / drag-n-drop style / many available add-ons and integrations / conditional logic / easy to create columns CONS: needs CSS to add styling FAVORITE PREMIUM Gravity Forms PROS: entry database / drag-n-drop style / many available add-ons and integrations / conditional logic CONS: needs CSS or plugin to add styling / no column selections but they can be added with Gravity ready classes. Posts by Elegant Themes on various contact form plugins Formidable Forms Ninja Forms WPForms Contact Form 7 (CF7) CSS tutorial for styling Gravity Style like Divi + bonus looks Surbma plugin for Gravity CSS tutorial for styling Caldera Style like Divi + bonus looks Material design look Opaque colored background Transparent background with Font Awesome (says Genesis but can be used on any theme) Sendgrid Cleantalk WP Mail SMTP Postman SMTP https://youtu.be/rem4sY2y8oQ
I don’t want to jinx anything here, but I feel like I’m finally starting to “get” this JavaScript programming thing. In this episode of Programming By Stealth, Bart starts by talking about how we solved the challenges from last week, getting rid of “bad smells” by learning how to reuse our code. Then Bart teaches us about another bad smell, where inadvertently point two variables point the same object and he teaches us about the clone function to eradicate that problem. With that bite-sized JavaScript lesson behind us, he takes us forward into learning about Glyph Icons, a way of having scalable icons on our web pages instead of pixel-based icons. He introduces us to Font Awesome tool to get free access to (awesome) scalable glyph icons. The full tutorial is available at bartbusschots.ie/….
Mike and Steve talk about all the announcements from the recent Adobe MAX conference, Apple heralding the arrival of dongle-mageddon, the Font Awesome 5 Kickstarter and the imminent release of the Hamilton mixtape.
Dave Gandy joined the show to talk about the history of Font Awesome, what’s to come in Font Awesome 5 and their Kickstarter to fund Font Awesome 5 Pro, and how everything they’re doing is funneling back into the forever free and open source — Font Awesome Free.
Dave Gandy joined the show to talk about the history of Font Awesome, what’s to come in Font Awesome 5 and their Kickstarter to fund Font Awesome 5 Pro, and how everything they’re doing is funneling back into the forever free and open source — Font Awesome Free.
関連リンク JSer.info | 2016-11-01のJS: Node.js v7、Node.js v0.10 EOL、WebAssembly Browser Preview Node v7 で入った WHATWG URL 実装について WebAssembly Browser Preview domenic/proposal-dynamic-import: import() proposal for JavaScript pelotoncycle/resize-observer Why We Chose Vue.js | GitLab Bilibili/flv.js: HTML5 FLV Player GLITCH GIF VJ SHOP Font Awesome 5 by Dave Gandy — Kickstarter
Taro Minowa さんをゲストに迎えて、インターン、キャリアパス、IoT、機械学習、数学などについて話しました。 Show Notes シリコンバレーでインターンしたい学生さんへ | 上杉周作 Rebuild: Aftershow 130: Ice Break With Visa Status (tksohishi) 夏の技術職インターンシップ講義資料公開 - クックパッド開発者ブログ Rebuild: 127: Post-mature Optimization (omo) #define CTO Particle (formerly Spark) | Build your IoT 月刊「大学への数学」 エンジニアの生存戦略：連載 Far East Network Machine Learning Library (MLlib) - Spark TensorFlow -- an Open Source Software Library for Machine Intelligence Building a Fast and Reliable Purging System | Fastly H2O and Casper Papers We Love Font Awesome Rebuild: Supporter
This week on WPwatercooler we'll be discussing how you can create better WordPress navigation menus.Show aired Feb 8 at 11am PST / 2pm EST / 7PM UTC* Class Reference/Walker « WordPress Codex 00:04* #14134 (Menus item are limited to 16 item and will not save more than that) – WordPress Trac 00:12* GitHub – ivycat/Network-Nav-Menus: Network-wide Navigation Menus for WordPress Multisite 00:21* Menu Image — WordPress Plugins 00:22* Font Awesome, the iconic font and CSS toolkit 00:23* Max Mega Menu — WordPress Plugins 00:24* Menu Social Icons — WordPress Plugins 00:28* Off-canvas | Foundation Docs 00:29* Sticky Menu (or Anything!) on Scroll — WordPress Plugins 00:30[LISTATTENDEES event_identifier=”ep174-creating-better-wordpress-navigation-menus-5-56b82624a4b36″ show_gravatar=”true”] See acast.com/privacy for privacy and opt-out information.
This week on WPwatercooler we'll be discussing the Latest WordPress Design Trends.SVG & Font Icons* Iconichttp://useiconic.com* Dashiconshttps://github.com/melchoyce/dashicons by mel* Fontawesomehttp://fortawesome.github.io/Font-Awesome/http://fontawesome.io/Examples and inspiration* Swiss Style graphic design* Grid Based Design* airbnb microsite – Will and Chain* I Touched Myself Breast Cancer site (safe for work!)* Kickstarter* Ali Edwards* mobile first design book[LISTATTENDEES event_identifier=”ep110-latest-wordpress-design-trends-nov-9-2014-5-5460212313103″ show_gravatar=”true”] See acast.com/privacy for privacy and opt-out information.
Heartbleed, DA role in the community, Drupal Dev Days, Hacked, yUML, Focla point, CEO, Font Awesome och många fler nyheter. Heartbleed Heartbleed info Heartbleed testare Drupal.org Sajter drabbad av Heartbleed Drupal Association Nya medlemsikoner Defining Our Roles in the Drupal Community This week-ish in Drupal Core Drupalcon Austin Drupal8 Code spring @ Stockholm Drupal Theming 2014 Dev Days Szeged DevDays Slides Initial Sprint for Search API Drunomics Cocomore Blocks in D8 Acquia Certification Webchick takes the exam Tanay Sai Daniel @ Wunderkraut Tomi @ Wunderkraut Mikke @ Wunderkraut Mikke round 2 @ Wunderkraut Jim @ Wunderkraut Jow @ Commercial Progression Modultipset Hacked Speed Reader yUML Focal point Coffee Blogposter 99 little bugs in the code Remarketing SEO ändringar SEO misstag Commerce Analytics Font Awesome PHP 5.4 för Ubuntu 12.04
伊藤直也さん、長山武史さんをゲストに迎えて、Rebuild.fm リニューアル, Middleman, Bootstrap, iOS アプリデザインなどについて話しました。 Show Notes Rebuild.fm miyagawa デカール Jekyll middleman Yeoman Grunt Bootstrap Bootstrap 3 RC1 FontAwesome FeedPress Task Lists in GFM HBFav2 HBFav2 をリリースしました Icon Finder Pixate Why I'm Not Using RubyMotion in Production What does the term "full-stack programmer" mean? いろいろデザイン YAPC::Asia Rubyの良いところ語ってください PDX Bus
Unsupported Operation 85 Misc VertX 2.0 not far away now, remains a fast option for deploymentJDK 7 and 8 to get RetinaTM support in next update JDK8 b91 didn’t solve my method handle issue, which has now been reported upstream.Interesting research with release of Groovy 2.1.4JSR-352 RI - Batch Applications for the Java Platform 1.0 release, available in maven central ( part of EE 7 I believe )Semantic Merge gets Java supportApache Archiva 1.4 M4 released Maven Plugin of the Week - Maven License Plugin Allows you to check all your source files have licenses in the right formatYou can set it to prevent release if they don’tYou can tell it to add the necessary formatting Scala Lift 2.5 releasedStackifier for Scala Other Google has released an Admin app) for Google Apps users on Android Aspiring writers - Asciidoc 0.1.3 released, includes Font Awesome icons
© 2020-2025 Ivy Podcast Discovery LLC
