mirror of
https://github.com/flarum/core.git
synced 2025-07-17 06:41:21 +02:00
feat(seo): shift h1 tag from logo to discussion title (#3724)
* feat(seo): shift h1 tag from logo to discussion title Many times have we seen opponents of using h2 as the discussion title. Although my own SEO knowledge is limited, I have seen the importance of structuring pages according to the content you wish to prioritize. If we only take that into consideration there is zero reason for the app-wide identical logo to take precedence over any other heading. This change makes the logo a standard (visually identical) element, and makes the discussion hero title a h1. * feat(seo): rewrite remainder of hero titles and subtitles
This commit is contained in:
@@ -17,7 +17,7 @@ export default class ControlSection extends Component<ComponentAttrs> {
|
|||||||
<div className="ExtensionPage-permissions PackageManager-controlSection">
|
<div className="ExtensionPage-permissions PackageManager-controlSection">
|
||||||
<div className="ExtensionPage-permissions-header">
|
<div className="ExtensionPage-permissions-header">
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<h2 className="ExtensionTitle">{app.translator.trans('flarum-package-manager.admin.sections.control.title')}</h2>
|
<h1 className="ExtensionTitle">{app.translator.trans('flarum-package-manager.admin.sections.control.title')}</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="container">
|
<div className="container">
|
||||||
|
@@ -32,7 +32,7 @@ export default class QueueSection extends Component<{}> {
|
|||||||
<section id="PackageManager-queueSection" className="ExtensionPage-permissions PackageManager-queueSection">
|
<section id="PackageManager-queueSection" className="ExtensionPage-permissions PackageManager-queueSection">
|
||||||
<div className="ExtensionPage-permissions-header PackageManager-queueSection-header">
|
<div className="ExtensionPage-permissions-header PackageManager-queueSection-header">
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<h2 className="ExtensionTitle">{app.translator.trans('flarum-package-manager.admin.sections.queue.title')}</h2>
|
<h1 className="ExtensionTitle">{app.translator.trans('flarum-package-manager.admin.sections.queue.title')}</h1>
|
||||||
<Button
|
<Button
|
||||||
className="Button Button--icon"
|
className="Button Button--icon"
|
||||||
icon="fas fa-sync-alt"
|
icon="fas fa-sync-alt"
|
||||||
|
@@ -15,9 +15,9 @@ export default class TagHero extends Component {
|
|||||||
>
|
>
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<div className="containerNarrow">
|
<div className="containerNarrow">
|
||||||
<h2 className="Hero-title">
|
<h1 className="Hero-title">
|
||||||
{tag.icon() && tagIcon(tag, {}, { useColor: false })} {tag.name()}
|
{tag.icon() && tagIcon(tag, {}, { useColor: false })} {tag.name()}
|
||||||
</h2>
|
</h1>
|
||||||
<div className="Hero-subtitle">{tag.description()}</div>
|
<div className="Hero-subtitle">{tag.description()}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -1,7 +1,7 @@
|
|||||||
@inject('url', 'Flarum\Http\UrlGenerator')
|
@inject('url', 'Flarum\Http\UrlGenerator')
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2>{{ $tag->name }}</h2>
|
<h1>{{ $tag->name }}</h1>
|
||||||
<p>{{ $tag->description }}</p>
|
<p>{{ $tag->description }}</p>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
|
@@ -1,7 +1,7 @@
|
|||||||
@inject('url', 'Flarum\Http\UrlGenerator')
|
@inject('url', 'Flarum\Http\UrlGenerator')
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2>{{ $translator->trans('flarum-tags.forum.index.tags_link') }}</h2>
|
<h1>{{ $translator->trans('flarum-tags.forum.index.tags_link') }}</h1>
|
||||||
|
|
||||||
@foreach ([$primaryTags, $secondaryTags] as $category)
|
@foreach ([$primaryTags, $secondaryTags] as $category)
|
||||||
<ul>
|
<ul>
|
||||||
|
@@ -7,10 +7,10 @@ export default class AdminHeader extends Component {
|
|||||||
return [
|
return [
|
||||||
<div className={classList(['AdminHeader', this.attrs.className])}>
|
<div className={classList(['AdminHeader', this.attrs.className])}>
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<h2>
|
<h1>
|
||||||
{icon(this.attrs.icon)}
|
{icon(this.attrs.icon)}
|
||||||
{vnode.children}
|
{vnode.children}
|
||||||
</h2>
|
</h1>
|
||||||
<div className="AdminHeader-description">{this.attrs.description}</div>
|
<div className="AdminHeader-description">{this.attrs.description}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>,
|
</div>,
|
||||||
|
@@ -82,7 +82,7 @@ export default class ExtensionPage<Attrs extends ExtensionPageAttrs = ExtensionP
|
|||||||
{this.extension.icon ? icon(this.extension.icon.name) : ''}
|
{this.extension.icon ? icon(this.extension.icon.name) : ''}
|
||||||
</span>
|
</span>
|
||||||
<div className="ExtensionName">
|
<div className="ExtensionName">
|
||||||
<h2>{this.extension.extra['flarum-extension'].title}</h2>
|
<h1>{this.extension.extra['flarum-extension'].title}</h1>
|
||||||
</div>
|
</div>
|
||||||
<div className="ExtensionPage-headerTopItems">
|
<div className="ExtensionPage-headerTopItems">
|
||||||
<ul>{listItems(this.topItems().toArray())}</ul>
|
<ul>{listItems(this.topItems().toArray())}</ul>
|
||||||
@@ -115,7 +115,7 @@ export default class ExtensionPage<Attrs extends ExtensionPageAttrs = ExtensionP
|
|||||||
<div className="ExtensionPage-permissions">
|
<div className="ExtensionPage-permissions">
|
||||||
<div className="ExtensionPage-permissions-header">
|
<div className="ExtensionPage-permissions-header">
|
||||||
<div className="container">
|
<div className="container">
|
||||||
<h2 className="ExtensionTitle">{app.translator.trans('core.admin.extension.permissions_title')}</h2>
|
<h1 className="ExtensionTitle">{app.translator.trans('core.admin.extension.permissions_title')}</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="container">
|
<div className="container">
|
||||||
|
@@ -34,7 +34,7 @@ export default class DiscussionHero extends Component {
|
|||||||
items.add('badges', <ul className="DiscussionHero-badges badges">{listItems(badges)}</ul>, 10);
|
items.add('badges', <ul className="DiscussionHero-badges badges">{listItems(badges)}</ul>, 10);
|
||||||
}
|
}
|
||||||
|
|
||||||
items.add('title', <h2 className="DiscussionHero-title">{discussion.title()}</h2>);
|
items.add('title', <h1 className="DiscussionHero-title">{discussion.title()}</h1>);
|
||||||
|
|
||||||
return items;
|
return items;
|
||||||
}
|
}
|
||||||
|
@@ -49,7 +49,7 @@ export default class UserCard extends Component {
|
|||||||
: ''}
|
: ''}
|
||||||
|
|
||||||
<div className="UserCard-profile">
|
<div className="UserCard-profile">
|
||||||
<h2 className="UserCard-identity">
|
<h1 className="UserCard-identity">
|
||||||
{this.attrs.editable ? (
|
{this.attrs.editable ? (
|
||||||
[AvatarEditor.component({ user, className: 'UserCard-avatar' }), username(user)]
|
[AvatarEditor.component({ user, className: 'UserCard-avatar' }), username(user)]
|
||||||
) : (
|
) : (
|
||||||
@@ -58,7 +58,7 @@ export default class UserCard extends Component {
|
|||||||
{username(user)}
|
{username(user)}
|
||||||
</Link>
|
</Link>
|
||||||
)}
|
)}
|
||||||
</h2>
|
</h1>
|
||||||
|
|
||||||
{badges.length ? <ul className="UserCard-badges badges">{listItems(badges)}</ul> : ''}
|
{badges.length ? <ul className="UserCard-badges badges">{listItems(badges)}</ul> : ''}
|
||||||
|
|
||||||
|
@@ -39,7 +39,7 @@ export default class WelcomeHero extends Component<IWelcomeHeroAttrs> {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<div class="containerNarrow">
|
<div class="containerNarrow">
|
||||||
<h2 class="Hero-title">{app.forum.attribute('welcomeTitle')}</h2>
|
<h1 class="Hero-title">{app.forum.attribute('welcomeTitle')}</h1>
|
||||||
<div class="Hero-subtitle">{m.trust(app.forum.attribute('welcomeMessage'))}</div>
|
<div class="Hero-subtitle">{m.trust(app.forum.attribute('welcomeMessage'))}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -4,7 +4,7 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
color: var(--contrast-color, var(--hero-color));
|
color: var(--contrast-color, var(--hero-color));
|
||||||
|
|
||||||
h2 {
|
h1 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
@@ -34,7 +34,7 @@
|
|||||||
|
|
||||||
@media @tablet-up {
|
@media @tablet-up {
|
||||||
.Hero {
|
.Hero {
|
||||||
h2 {
|
h1 {
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
}
|
}
|
||||||
.container {
|
.container {
|
||||||
|
@@ -7,7 +7,7 @@
|
|||||||
<header id="header" class="App-header">
|
<header id="header" class="App-header">
|
||||||
<div id="header-navigation" class="Header-navigation"></div>
|
<div id="header-navigation" class="Header-navigation"></div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1 class="Header-title">
|
<div class="Header-title">
|
||||||
<a href="{{ $forum['baseUrl'] }}">
|
<a href="{{ $forum['baseUrl'] }}">
|
||||||
@if ($forum['logoUrl'])
|
@if ($forum['logoUrl'])
|
||||||
<img src="{{ $forum['logoUrl'] }}" alt="{{ $forum['title'] }}" class="Header-logo">
|
<img src="{{ $forum['logoUrl'] }}" alt="{{ $forum['title'] }}" class="Header-logo">
|
||||||
@@ -15,7 +15,7 @@
|
|||||||
{{ $forum['title'] }}
|
{{ $forum['title'] }}
|
||||||
@endif
|
@endif
|
||||||
</a>
|
</a>
|
||||||
</h1>
|
</div>
|
||||||
<div id="header-primary" class="Header-primary"></div>
|
<div id="header-primary" class="Header-primary"></div>
|
||||||
<div id="header-secondary" class="Header-secondary"></div>
|
<div id="header-secondary" class="Header-secondary"></div>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -9,7 +9,7 @@
|
|||||||
<header id="header" class="App-header">
|
<header id="header" class="App-header">
|
||||||
<div id="header-navigation" class="Header-navigation"></div>
|
<div id="header-navigation" class="Header-navigation"></div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1 class="Header-title">
|
<div class="Header-title">
|
||||||
<a href="{{ $forum['baseUrl'] }}" id="home-link">
|
<a href="{{ $forum['baseUrl'] }}" id="home-link">
|
||||||
@if ($forum['logoUrl'])
|
@if ($forum['logoUrl'])
|
||||||
<img src="{{ $forum['logoUrl'] }}" alt="{{ $forum['title'] }}" class="Header-logo">
|
<img src="{{ $forum['logoUrl'] }}" alt="{{ $forum['title'] }}" class="Header-logo">
|
||||||
@@ -17,7 +17,7 @@
|
|||||||
{{ $forum['title'] }}
|
{{ $forum['title'] }}
|
||||||
@endif
|
@endif
|
||||||
</a>
|
</a>
|
||||||
</h1>
|
</div>
|
||||||
<div id="header-primary" class="Header-primary"></div>
|
<div id="header-primary" class="Header-primary"></div>
|
||||||
<div id="header-secondary" class="Header-secondary"></div>
|
<div id="header-secondary" class="Header-secondary"></div>
|
||||||
</div>
|
</div>
|
||||||
|
Reference in New Issue
Block a user