Case study: Tafsir al-Shaykhayn, web development for a library of 14 million words
Tafsir al-Shaykhayn (جامع تفسير الشيخين) brings together what Ibn Taymiyyah and his student Ibn al-Qayyim said about each verse of the Qur'an, and puts it in one free, searchable place. This case study explains the brief, the decisions we made and what the finished site does. It's a good example of the kind of web development we enjoy most: a site where the structure is designed around the content, not poured into a template.
At a glance
- Project: Tafsir al-Shaykhayn, a Qur'an commentary site in the words of Ibn Taymiyyah and Ibn al-Qayyim
- Link: tafsirshaikhain.com
- What we did: the whole website, end to end: structure and UX, interface design, development, processing the source books into verse-by-verse data, search, the offline app, automated text verification, multilingual SEO, hosting and releases
- Languages: Arabic and English content, with the interface in 48 languages
- Platforms: any browser, and installable on phones as an app
The brief
Neither of the two scholars wrote a complete commentary on the Qur'an. Their explanations of verses are spread across dozens of books, fatwas and letters, and most of what is online is scanned pages that can't be searched. Someone who wants both scholars' words on a single verse has to open many volumes.
The goal was simple to say and hard to build: gather everything both scholars said about each verse, quote it exactly, show where it comes from, and make it easy to read, search and share on any device, for free.
The scale
The project's own figures, which are updated as work continues, give an idea of what the site had to handle:
- 147 source books
- 76,400+ printed pages and about 14 million words read and indexed
- 50,400+ places where a verse is mentioned
- 5,428 verses with commentary from the two scholars
- 4,110 verses with a summary in their own words so far
- 1,305 quotations from earlier scholars, each with the position taken on it
On top of that sit a page for every verse in Arabic and in English (4,185 each), a page for each of the 114 chapters and for each source book, and more than 8,700 pages in the sitemaps.
What we built
- A page for every verse. The verse, then each scholar's words side by side, each line with its book, volume and page, and a button to copy it with the reference.
- Summary first, full text second. A short summary made only of the scholars' own words, then the complete passages for deeper study.
- The general meaning of every verse, from al-Tafsir al-Muyassar, shown in its own frame so it is never mixed with the scholars' words. English pages show a translation of the meaning, with its source and version.
- Quotations kept apart, each marked with the scholar's position: reported, approved, rejected, cited as evidence, or set aside for another view.
- Search across the whole Qur'an, by word or by verse, with suggestions as you type.
- A link for every verse, ready to share.
- Works offline. Readers can install the site on their phone, and every chapter they've opened stays available without a connection.
- Corrections from readers, through a short form, reviewed and included in later releases, with an updates page that records every change.
How we built it
Static pages, generated in advance
Every chapter, verse and book page is generated ahead of time as plain HTML, then served through a global content delivery network. Pages open almost instantly, hosting costs stay low, sudden traffic spikes aren't a worry, and search engines can read every page. That last point matters: most readers arrive by searching for a specific verse.
Data in small pieces
Texts, translations and meanings are split into small files per chapter and per language. A reader downloads only what they open, so the first visit stays light on a mid-range phone and a slow network.
Search in the browser
The search index is built once and searched inside the reader's browser. There's no search server to run, results update as you type, and search keeps working offline.
An installable, offline-first app
The site is a Progressive Web App. Its service worker fetches pages from the network first, so readers always see the latest release, and falls back to the saved copy offline. Data files come from the local cache first and refresh in the background.
Accuracy you can measure
For a reference of this kind, one wrong letter matters. We built the checks into the release process: every published passage is matched automatically, character by character, against its source, and the check runs again on every release. Passages that the system flags as higher-risk get a full manual review, random samples are reviewed independently to measure accuracy, and the work is cross-checked against the printed collections of each scholar's commentary.
One site, 48 languages
The interface is translated into 48 languages, and every page tells search engines which language versions exist, so readers land on the version in their own language.
The result
A body of scholarship that used to take an afternoon in a library to consult is now a few taps away, free, on any phone, with or without a connection. A teacher can send a student the exact verse. A researcher can see both scholars' words together with references to check them. And the site keeps growing: the figures above update with every release.
What this means for your project
Most websites aren't Qur'an commentaries, but many have the same problem: lots of content that people can't find or use. A product catalogue, a knowledge base, a law library or a university archive all benefit from the same approach:
- Give each item (a product, an article, a verse) its own fast page and link.
- Generate pages in advance wherever you can.
- Let people search the way they think, and make search fast.
- Build for slow networks and older phones, not just the office Wi-Fi.
- Check accuracy automatically on every release.
If you have a content-heavy website in mind, our web development team would be happy to talk about structure, speed and search. You can also see more of our work on the blog.
