Accessibility is like dirty laundry we all know we should worry about it but we never do until we have no choice and I'm the first one to admit that I suck at being proactive about addressing accessibility issues in my projects. Let's take this hypothetical example: Your team close to releasing an application that uses the latest and greatest technologies. It's a progressive web application that uses web components for the front end and Express application to talk to MongoDB and IndexedDB to store data in the user's browser. The app works wonderfully and your team gets a lot...
Another thing to do when looking at what our users do on our site is to see where they come from and what device they are browsing with. I used to not care as much about where users were coming from as much as I cared about what browsers they were using. But then I started looking at the logs and some strange browsers appeared in the logs. Not many and not often enough to warrant making changes but enough to take a look at these funky browsers: Opera Mini and UC browser. Opera Mini and UC browsers are proxy...
Figures 6 and 7, sideways writing modes, will not work on Chrome. If you want to see what they look like, try viewing the page in Firefox. People who I deeply admire and whose work I respect have been working on how to layout languages other than English and Latin languages on the web and how we can combine these languages in the same layout. I will concentrate on direction, writing modes, and text orientation as these are the easiest ones to work with and the ones that will have a big impact on how text appears on your web...
Before we jump into the mechanics of displaying content in languages other than English on the web, we need to take a little detour and speak about character encodings, character sets, code points, ASCII, Unicode and fonts. These definitions have helped me get a better handle on how to work with languages other than English. Character Sets, Code Pages, and Character encodings Information derived from Character sets, coded character sets, and encodingshttps://www.w3.org/International/articles/definitions-characters/charsets Whenever we work with text in a computer we need to worry about the language we're writing in and how will the interpreted and displayed to the user....
Walk a mile in their shoe is more than a platitude. I have to admit I'm the first one who some times takes for granted that the page will load in x seconds because that's how long it takes for the content to load in my laptop with my connection at home or in my phone. Some of the questions I should ask: - What devices do they use to access your content? - What accessibility tools do they use to work with your material? - Does their network connectivity influence how they interact with your content? Your app? -...
> Empathy – the action of understanding, being aware of, being sensitive to, and vicariously experiencing the feelings, thoughts, and experience of another of either the past or present without having the feelings, thoughts, and experience fully communicated in an objectively explicit manner; — -Merriam-Websterhttps://www.merriam-webster.com/dictionary/empathy How many times have we told a teammate or a potential client "that's easy" or "piece of cake" when it comes to doing something like a Wordpress theme or installing a web server from source? Even if you have the data to back up the assertion that it's easy we may still come across as...
I've dabbled in working with Docker ever since it first became available for the Mac as Boot2Docker but I never actually did anything with it. Not too long ago I started working with the idea of creating a Docker app to store all the tools I use when writng or creating a front end application. In building this container I will describe the basics of building a Dockerfile and using it to interact with your local filesystem. This will also go in a Github repo in case I need to duplicate the project at a later date. Quick Docker overview...
I'm not a fan of doing this but there are use cases when we need to retrieve an image from the network and place it in the page. One case that comes to mind is the need to retrieve generated images from a real time application to display in web pages or other parts of a web application. In the example below I've added comments to the specific lines to discuss. javascript fetch'https://rivendellweb.net/blog/wp-content/uploads/2016/10/IMG0813.jpg' // 1 .thenresponse => { return response.blob; // 2 } .thenimageBlob => { let img = document.createElementimg; // 3 img.src = window.URL.createObjectURLimageBlob; // 4 } // 5...
This post updates my April, 20016 post: Gulp Workflow: Looking at Gulp 4https://publishing-project.rivendellweb.net/gulp-workflow-looking-at-gulp-4/ and provides additional insights to what has changed and how to update existing Gulp 3 files to Gulp 4. Even though Gulp 4 is still at Alpha 2, I will begin moving my projects to Gulp 4. I will use Babel first to make sure the projects work with older versions of Gulp and will move away from Babel to using @std/esm as support for es6 becomes more widespread. Yes, Gulp 4.0 is real. Yes, it has been in development for a long time but it appears...
Does anyone remember Google Glass and their deployment nightmares? Stories like the Seattle restaurant that banned Google Glasshttp://www.cbsnews.com/news/seattle-restaurant-bans-google-glass-wearers/ citing privacy concerns presents one of the first challenges to public AR and VR but not the last or, by any means, the only one. For more information see this Huffington Post Summary Posthttp://www.huffingtonpost.com/news/google-glass-ban/ and this Guardianhttps://www.theguardian.com/film/2014/jun/11/google-glass-banned-cinemas-us-drafthouse outlining why Google Glass was banned in theaters. But the changes go beyond physical comfort with the technology and reach deep into what the technologies can do to people's real lives. In A Rape in Cyberspacehttp://www.villagevoice.com/news/a-rape-in-cyberspace-6401665 Julian Dibbell tells the story of a "virtual" rape...