timescale.info#399 · Descriptive page titles and a preview image for shared links
- timeline-app
- pull request
- sharing
Fixes #390 ## Titles that say what the site is The landing and audience pages (`LANDING_PAGE=1`) now have descriptive, searchable ` `s and `og:title`s, while each keeps its own line as the visible heading. The copy's front matter gains a `heading` key (the page's ` `, falling back to `title`), so an operator's own copy with only `title` works as before. Titles are followed by the site's name (`PLATFORM_NAME`) unless they already contain it, so nothing is hard-coded to one site. | Page | ` ` (on a default server; `· timescale.info` is appended there) | Heading | | --- | --- | --- | | `/` | OpenChronology: free timeline editor for history and research | Any span of time, on one exact line | | `/for` | Timelines for teaching, research, investigations and more · OpenChronology | Who OpenChronology is for | | `/for/educators` | Collaborative timeline maker for teachers and classrooms · OpenChronology | Timelines your class builds together | | `/for/researchers` | Timeline software for research, with sources and exact dates · … | Timelines you can cite and check | | `/for/investigators` | Investigation timelines and causal factors charts · … | The sequence of events, with the evidence behind it | | `/for/operations` | Log and incident timelines from syslog and journald · … | Your logs and incidents on one timeline | | `/for/writers` | Story timeline maker for writers and worldbuilders · … | Every thread of your story, in order | | `/for/developers` | Open-source timeline API, plugins and self-hosted server · … | Timelines you can script, extend and host | Meta descriptions were tightened to at most 160 characters (the unit test now holds them to that, and titles to 70). The home page's: "Free, open-source timeline editor for history, research and teaching. Exact dates at any scale, sources on every moment, and public timelines anyone can read." The site-wide default description (pages without their own) is now "A free, open-source timeline editor: exact times at any scale, sources on every moment, shared on your terms." ## A preview image for shared links - `platform/icons/social-preview.jpg` (served at `/social-preview.jpg`): a 1200 × 630 screenshot, 83 KB, of the Ancient Rome tour's sample timeline (171 BCE to 225 CE) in the editor, full screen, light theme. It was captured with Playwright from a locally run production build by the new `scripts/preview-image.mjs`, which fetches nothing but the local platform. - The root layout, the landing and audience pages and profiles set `og:image` (absolute, on `APP_ORIGIN`), `og:image:width`/`height`/`alt`, `twitter:image` and `twitter:card=summary_large_image`. Pages without metadata of their own (help, plugins, download…) inherit it. - Timeline, moment and duration pages are unchanged: they already preview with the timeline's own image (#339) or the drawn card of its moments; the tests check the site image doesn't override them. No external service is added. ## Tests - `npm test`, `npm run typecheck`, `npm run build`, `npx prettier --check` on the changed files. - `test/next-platform.mjs`: the image is served as a 1200 × 630 JPEG under 300 KB and linked with its size and alt (passes locally). - `test/landing-live-postgres.mjs`: the new home and educators titles and headings, the image, and an operator's file without `heading` (passes locally). - `test/sharing-postgres.mjs`: a timeline page has its drawn image alone; a profile previews with the site's (passes locally). - `test/next-postgres.mjs` passes locally.
Sources
Open #399 · Descriptive page titles and a preview image for shared links in the timeline