Displaying equations and maths formulas on a website

Would you like to include equations in your website? There are multiple open source software solutions that allow to include mathematical equations and formulas in your HTML website.

Depending on the content of your website you might be interested in publishing equations or formulas. Showing and explaining mathematical equations can help you to better communicate with your audience and improve user experience. Especially for technical websites the integration of some maths in your content can be very appealing for your visitors.

Including maths equations as an image

Of course you could simply publish euqations as an image on your website. You would first need to use software such as Word, LibreOffice or Latex to create the equation. You would then need to take a screenshot and include it in your website as any other image.

Using JavaScript to render maths

The alternative to using a static image is to include JavaScript to render equations in the browser. There are several libraries that allow for maths integration.

MathJax

MathJax is probably the most popular library to include mathematics on your website. It allows for lots of flexibility and has a rich documentation. I would like to give you some example of how you can include an equation on your website with MathJax. With the following minimal example you should be able to embed one of the most famous equations on your site:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
  </script>
</head>
<body>
<p>
  \[E=mc^2\]
</p>
</body>
</html>

MathJax has plenty of configuration options. You can render the output as HTML/CSS or SVG for instance. There are also plugins for content management systems such as WordPress to easily integrate equations with MathJax in your CMS.

In addition to using equations on your website it might also be interesting to use charts to visualize data and mathematical relations. We have compiled additional articles on presenting data on websites and including charts in blogs and websites.

Please do not hesitate to contact us in case you need help with integrating formulas and maths equations on your website.