I don’t just mean immersive, interactive web applications. I’m talking blogs. Portfolio sites. Marketing micro-sites. They all stop working in some critical way.
These are all stupid problems that are cost you money and visitors, and (mostly) have some reasonably easy fixes.
- The CDN you’re serving your file from is having issues and fails.
- An overly aggressive ad blocker flags your script as an ad and blocks it (this one happens to me a lot with Ghostery).
- Your visitor is on a slower connection or older device, so while they’re waiting, they have no JS and can’t use your site (even though all of the content is already loaded and ready).
So… what can you do about it? #
Navigation menus? Show all of the links as an inline list until the script loads, and then hide them behind the expand-and-collapse menu. I’ve even seen some sites display them in the footer, with the menu button acting as an anchor link by default. Once JS is available, the menu moves off campus and the button works the way you’d normally expect it to. (Check out the Financial Times for a great example of this.)
Show-and-hide widgets and tabbed menus? Show all of the content until your script loads and treat them like anchor links. Same goes for modals. Or, if you’d prefer, you can host the modal content on another page and pull it asynchronously into the modal when someone clicks the link.
This sounds complicated #
🔥 Hot off the press! I just launched a new pocket guide. Learn about ES6 arrow functions,
const, function hoisting, and more.