3 min read
You’ve probably seen these on the web. A Northwestern University Knight Lab project, JuxtaposeJS lets you easily compare two images, side by side, with a slider between them.
The modern web supports multimedia in lots of different kinds of ways. With SoundCiteJS, you can take a snippet of MP3 or OGG audio - whether uploaded using Known’s audio plugin, using FTP to a third-party server, or on SoundCloud - and play it inline. Suddenly, you can make your text real with clickable environmental audio, quotes, music and more.
By the way: we could list all of the Knight Lab projects here, but we’ll stop with this one. Visit their website to see all the incredible things they do.
If you’re a developer, sharing source code is essential. Unfortunately, while your Integrated Development Environment highlights your code to make it easy to read, you immediately lose that formatting when you publish it to the web.
Highlight.js solves this problem by highlighting your code. It even automatically detects which language you’re using, so there’s no need to use any extra markup. Once you’ve installed the library, you can paste your source code inside the HTML
tag anywhere on your page.
Bonus: there’s no need to add this code to Known - it’s built in!
If you’re sharing scientific or mathematical content, there’s every chance that you’ll want to include a formula or two. Unfortunately, on the web this is usually ugly, inaccessible to screenreaders, and incredibly hard to do. Furthermore, TeX, the formatting language most often used by scientists in academia, isn’t usually supported by web browsers.
MathJax changes that by allowing you to use TeX in your content as well as MathML and ASCIImath. The formatting is beautiful and it uses web fonts so it’s responsive and accessible. It even works on legacy web browsers like Internet Explorer 6.
These are just a handful of libraries to get started with. Are there any others that you would recommend for people who are just getting started adding dynamic content to their own websites? Let us know in the comments.