openvibers/openvibe.blog Commits

Blog: the home page has one h1 (the blog title under the showcase is an h2) (#51)

OP OpenVibers committed 29 days ago · 11665fbf45 · 3 files, +8 −4

openvibe.blog's home had two `<h1>`s: the showcase hero ("Write on OpenVibe") and the official blog's title ("The OpenVibe blog") under it. A metadata audit of every site flagged it.

Under the showcase, the blog's title is now an `<h2>`, as News did with its list header. Every other blog's front page, and page 2 onwards, keeps its `<h1>`. `test/layout.test.js` checks the home has one `<h1>`.

Changes

ddiff --git a/server/http/public.js b/server/http/public.js
iindex 6427aeb..1f9139d 100644
---- a/server/http/public.js
++++ b/server/http/public.js
@@@ -146,6 +146,7 @@ function createPublicRoutes(ctx) {
                  blog, blogUrl: `/@${blog.handle}`, items, pager, feeds,
                  series: seriesShown, categories: await prune(await reading.categoriesTree(blog)),
                  canWrite: await access.canWrite(store, req.viewer, blog, 'create'),
++                showcase: home && pager.page === 1,
              }) + (home && pager.page === 1 ? frame.shipped({ service: 'blog', title: 'Recently shipped on OpenVibe.Blog' }) : ''),
          }, { cacheable: !scope.restricted && !scope.restrictedAuthor });
      }
ddiff --git a/server/render/pages.js b/server/render/pages.js
iindex 6e3b6fe..149221e 100644
---- a/server/render/pages.js
++++ b/server/render/pages.js
@@@ -57,10 +57,10 @@ function feedLinksHtml(feeds) {
      return h`<p class="feeds">Follow: ${feeds.map((f) => h`<a href="${f.href}" type="${f.mime}">${f.label}</a> `)}</p>`;
  }
  
--/** A blog's front page. */
--function blogIndex({ blog, blogUrl, items, pager, feeds, series, categories, canWrite }) {
++/** A blog's front page. Under the network blog's showcase (its hero is the page's h1) the blog's title is an h2. */
++function blogIndex({ blog, blogUrl, items, pager, feeds, series, categories, canWrite, showcase = false }) {
      return String(h`<header class="blog-header">
--<h1>${blog.title}</h1>
++${showcase ? h`<h2>${blog.title}</h2>` : h`<h1>${blog.title}</h1>`}
  ${blog.description ? h`<p class="lede">${blog.description}</p>` : ''}
  ${raw(feedLinksHtml(feeds))}
  ${canWrite ? h`<p><a class="button" href="/write/@${blog.handle}">Write on this blog</a></p>` : ''}
ddiff --git a/test/layout.test.js b/test/layout.test.js
iindex 383ea2d..3e40b58 100644
---- a/test/layout.test.js
++++ b/test/layout.test.js
@@@ -60,7 +60,10 @@ const split = (html) => ({ head: html.slice(0, html.indexOf('</head>')), body: h
          const { head } = split((await t.get('/write', { as: eve })).text);
          assert.strictEqual(count(head, /<title>/g), 1);
          assert.ok(/<meta name="robots" content="noindex[^"]*">/.test(head), 'the editor is noindex');
--        const home = split((await t.get('/')).text).head;
++        const homePage = (await t.get('/')).text;
++        const home = split(homePage).head;
++        // The showcase hero is the page's one h1; the blog's own title under it is an h2.
++        assert.strictEqual(count(homePage, /<h1\b/g), 1, 'one h1 on the home');
          assert.strictEqual(count(home, /<title>/g), 1);
          assert.ok(home.includes('<link rel="canonical" href="https://openvibe.blog/">'));
          // The home carries the Blog JSON-LD and, since llms-full.txt, the site summary's WebPage JSON-LD.