Hronomer – a text duration calculator with an SEO-ready product presentation
This is not just a form with a character counter. Hronomer is a full web application that transforms raw text into calculation-ready content, can strip HTML, URLs, emails, numbers and bracketed fragments, converts numbers into words and shows a meaningful time range for reading or voice-over instead of a random static number.
cleanup and normalization stages before the final calculation
switches that actually affect calculation-ready text
estimation modes: optimal and slow delivery pace
meta, canonical, OG, semantic article structure and schema.org
Why Hronomer is more than just another “character counter”
Most similar services count everything: HTML junk, service symbols, links, emails, numbers and code fragments. Hronomer does the opposite – it first converts the raw input into a text that is actually readable by a narrator or editor and only then calculates metrics.
For a regular user it feels simple. For a technical client it clearly shows a controlled sanitization pipeline, adaptive layout, SEO-aware content structure and a real product mindset.
Accuracy through cleanup, not magic
The result is based on cleaned text after multiple preprocessing stages.
- HTML, script/style, template blocks and comments removal
- URL and email stripping
- invisible character and junk cleanup
Numbers and symbols do not break the logic
Numbers can be excluded or converted to words, while symbols get readable text equivalents.
- 125 → number-to-words conversion
- special token replacement for %, №, #, @, $, kW, km/h, UAH and more
- Latin, bracket and digit toggles
Time is shown honestly – as a range
The app does not pretend to know a single perfect duration. It shows a base and a slower scenario.
- separate optimal / slow calculation
- human-readable 00:00:00 formatting
- clear presentation without technical clutter
The interface looks like a product, not a demo
The same visual language as in the app: soft shadows, rounded cards, concise typography and responsive grid.
- Bootstrap 5.3 without visual noise
- responsive layout for desktop and mobile
- case page visually matches the product
What is done for SEO and proper page visibility
A case-study page must not only look good – it has to be indexable. That is why this layout includes unique title/description, canonical, Open Graph, Twitter Cards, semantic article structure and JSON-LD for Article and WebApplication.
Hronomer
The application is permanently available by a direct link. This is a real working tool, not a mockup.
https://result.productions/app/hronomerСергій Трушин – VideoNova®
Interface development, calculation logic architecture, page content structure, SEO preparation and product-focused presentation.
What this case sells
Not just a text calculator. It sells the level of thinking: from UX and data processing to SEO and product packaging.
Code fragments that show the implementation level
Below are not full sources, but the parts that best demonstrate the approach: text sanitization, timing logic and SEO page setup.
chronoCalc.calcIt = function (text, option) {
text = String(text || '');
var cleaned = text;
if (option.excludeHtml) {
cleaned = this.stripHtml(cleaned);
}
if (option.excludeUrl) {
cleaned = this.stripUrl(cleaned);
}
if (option.excludeMails) {
cleaned = this.stripMails(cleaned);
}
cleaned = this.stripInvisible(cleaned);
cleaned = this.normalizeSpaces(cleaned);
if (option.cyrillicOnly) {
cleaned = this.exclude(cleaned, 'latin');
}
if (option.excludeBreckets) {
cleaned = this.exclude(cleaned, 'brackets');
}
if (option.excludeNumbers) {
cleaned = this.exclude(cleaned, 'digits');
}
if (option.numbersToWords && !option.excludeNumbers) {
cleaned = converter.convertInts(cleaned).text;
}
cleaned = this.replaceReadableWords(cleaned);
cleaned = this.stripGarbage(cleaned);
cleaned = this.normalizeSpaces(cleaned);
return this.analize(cleaned);
};chronoCalc.analize = function (c) {
var tokens = this.tokenize(c);
var f = 0;
var h = 2;
var i = 0.5;
var g = 0;
jQuery.each(tokens, function (a, b) {
if (b && b.length > 2) {
f++;
}
});
if (f > 120) {
h = Math.round(f * 0.0334);
i = 0.6294;
} else {
g = f === 0 ? 0 : f < 20 ? 1 : 2;
}
var baseTime = Math.ceil(f * i) + g;
this.data.mintime = baseTime;
this.data.maxtime = baseTime + h;
this.data.time = this.getTimeRange(this.data.mintime, this.data.maxtime);
return this.data;
};<meta name="description" content="Hronomer case study: an online text duration calculator with HTML, URL, email and number cleanup, calculation text preview, estimated reading and voice-over time, SEO setup and adaptive Bootstrap 5.3 interface.">
<link rel="canonical" href="https://result.productions/app/hronomer/case">
<meta property="og:title" content="Hronomer – web development case study of a text duration calculator">
<meta property="og:description" content="Hronomer case study: an online text duration calculator with HTML, URL, email and number cleanup, calculation text preview, estimated reading and voice-over time, SEO setup and adaptive Bootstrap 5.3 interface.">
<meta property="og:type" content="article">
<meta property="og:url" content="https://result.productions/app/hronomer/case">
<meta property="og:image" content="https://result.productions/app/img/og/hronomer-og-cover.jpg">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebApplication",
"name": "Hronomer",
"url": "https://result.productions/app/hronomer"
}
</script>This page presents a product, not just code
The result is a strong case: regular users see a useful online tool, while potential clients see a developer who thinks in terms of product, interface and search visibility.