diff --git a/.vscode/moodle.code-snippets b/.vscode/moodle.code-snippets
index 6028e1f1d..6647cdec2 100644
--- a/.vscode/moodle.code-snippets
+++ b/.vscode/moodle.code-snippets
@@ -7,7 +7,7 @@
             "",
             "@Component({",
             "    selector: '$2${TM_FILENAME_BASE}',",
-            "    templateUrl: '${TM_FILENAME_BASE}.html',",
+            "    templateUrl: '$2${TM_FILENAME_BASE}.html',",
             "})",
             "export class ${1:${TM_FILENAME_BASE}}Component {",
             "",
diff --git a/src/addons/badges/pages/issued-badge/issued-badge.html b/src/addons/badges/pages/issued-badge/issued-badge.html
index fab2dabc6..cb131d0e3 100644
--- a/src/addons/badges/pages/issued-badge/issued-badge.html
+++ b/src/addons/badges/pages/issued-badge/issued-badge.html
@@ -3,8 +3,8 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="badge">{{ badge.name }}</ion-title>
-        <ion-title *ngIf="!badge">{{ 'addon.badges.badges' | translate }}</ion-title>
+        <h1 *ngIf="badge">{{ badge.name }}</h1>
+        <h1 *ngIf="!badge">{{ 'addon.badges.badges' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/badges/pages/user-badges/user-badges.html b/src/addons/badges/pages/user-badges/user-badges.html
index f2c91a9d6..965f35d70 100644
--- a/src/addons/badges/pages/user-badges/user-badges.html
+++ b/src/addons/badges/pages/user-badges/user-badges.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.badges.badges' | translate }}</ion-title>
+        <h1>{{ 'addon.badges.badges' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -23,7 +23,7 @@
                         <img [src]="badge.badgeurl" [alt]="badge.name" core-external-content>
                     </ion-avatar>
                     <ion-label>
-                        <h2>{{ badge.name }}</h2>
+                        <p class="item-heading">{{ badge.name }}</p>
                         <p>{{ badge.dateissued * 1000 | coreFormatDate :'strftimedatetimeshort' }}</p>
                     </ion-label>
                     <ion-badge slot="end" color="danger" *ngIf="badge.dateexpire && currentTime >= badge.dateexpire">
diff --git a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
index 62267a363..db63e5599 100644
--- a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
+++ b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
@@ -21,10 +21,10 @@
                         <ion-label>
                             <!-- Add the icon title so accessibility tools read it. -->
                             <span class="sr-only" *ngIf="item.iconTitle">{{ item.iconTitle }}</span>
-                            <h2>
+                            <p class="item-heading">
                                 <core-format-text [text]="item.name" contextLevel="module" [contextInstanceId]="item.cmid"
                                     [courseId]="item.courseid"></core-format-text>
-                            </h2>
+                            </p>
                             <p>
                                 <core-format-text [text]="item.coursename" contextLevel="course" [contextInstanceId]="item.courseid">
                                 </core-format-text>
diff --git a/src/addons/block/timeline/components/events/addon-block-timeline-events.html b/src/addons/block/timeline/components/events/addon-block-timeline-events.html
index 8a3c70adc..bc1e38ddb 100644
--- a/src/addons/block/timeline/components/events/addon-block-timeline-events.html
+++ b/src/addons/block/timeline/components/events/addon-block-timeline-events.html
@@ -1,6 +1,6 @@
 <ion-item-group *ngFor="let dayEvents of filteredEvents">
     <ion-item-divider [color]="dayEvents.color">
-        <ion-label><h2>{{ dayEvents.dayTimestamp * 1000 | coreFormatDate:"strftimedayshort" }}</h2></ion-label>
+        <ion-label><h3>{{ dayEvents.dayTimestamp * 1000 | coreFormatDate:"strftimedayshort" }}</h3></ion-label>
     </ion-item-divider>
     <ng-container *ngFor="let event of dayEvents.events">
         <ion-item class="ion-text-wrap core-course-module-handler item-media" detail="false" (click)="action($event, event.url)"
@@ -9,11 +9,11 @@
             <ion-label>
                 <!-- Add the icon title so accessibility tools read it. -->
                 <span class="sr-only" *ngIf="event.iconTitle">{{ event.iconTitle }}</span>
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="event.name" contextLevel="module" [contextInstanceId]="event.id"
                         [courseId]="event.course && event.course.id">
                     </core-format-text>
-                </h2>
+                </p>
                 <p *ngIf="showCourse && event.course">
                     <core-format-text [text]="event.course.fullnamedisplay" contextLevel="course"
                         [contextInstanceId]="event.course.id">
diff --git a/src/addons/blog/pages/entries/entries.html b/src/addons/blog/pages/entries/entries.html
index f2a1c50f3..e168d0f2b 100644
--- a/src/addons/blog/pages/entries/entries.html
+++ b/src/addons/blog/pages/entries/entries.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title | translate }}</ion-title>
+        <h1>{{ title | translate }}</h1>
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
 </ion-header>
@@ -24,14 +24,14 @@
                 <ion-item class="ion-text-wrap">
                     <core-user-avatar [user]="entry.user" slot="start" [courseId]="entry.courseid"></core-user-avatar>
                     <ion-label>
-                        <h2>
+                        <p class="item-heading">
                             <core-format-text [text]="entry.subject" [contextLevel]="contextLevel"
                                 [contextInstanceId]="contextInstanceId">
                             </core-format-text>
                             <ion-note class="ion-float-end ion-padding-left ion-text-end">
                                 {{ 'addon.blog.' + entry.publishTranslated! | translate}}
                             </ion-note>
-                        </h2>
+                        </p>
                         <p>
                             <ion-note class="ion-float-end ion-padding-left ion-text-end">
                                 {{entry.created | coreDateDayOrTime}}
diff --git a/src/addons/calendar/components/calendar/addon-calendar-calendar.html b/src/addons/calendar/components/calendar/addon-calendar-calendar.html
index ccae4c3f1..62d65cc20 100644
--- a/src/addons/calendar/components/calendar/addon-calendar-calendar.html
+++ b/src/addons/calendar/components/calendar/addon-calendar-calendar.html
@@ -18,7 +18,7 @@
                 </ion-button>
             </ion-col>
             <ion-col class="ion-text-center addon-calendar-period">
-                <h3 id="addon-calendar-monthname">{{ periodName }}</h3>
+                <h2 id="addon-calendar-monthname">{{ periodName }}</h2>
             </ion-col>
             <ion-col class="ion-text-end" *ngIf="canNavigate">
                 <ion-button fill="clear" (click)="loadNext()" [attr.aria-label]="'core.next' | translate">
diff --git a/src/addons/calendar/components/upcoming-events/addon-calendar-upcoming-events.html b/src/addons/calendar/components/upcoming-events/addon-calendar-upcoming-events.html
index a4e1a3590..d8ac7e917 100644
--- a/src/addons/calendar/components/upcoming-events/addon-calendar-upcoming-events.html
+++ b/src/addons/calendar/components/upcoming-events/addon-calendar-upcoming-events.html
@@ -16,8 +16,10 @@
                         {{ 'addon.calendar.type' + event.formattedType | translate }}
                         <span class="sr-only" *ngIf="event.moduleIcon && event.iconTitle">{{ event.iconTitle }}</span>
                     </span>
-                    <h2><core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
-                        [contextInstanceId]="event.contextInstanceId"></core-format-text></h2>
+                    <p class="item-heading">
+                        <core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
+                        [contextInstanceId]="event.contextInstanceId"></core-format-text>
+                    </p>
                     <p [innerHTML]="event.formattedtime"></p>
                 </ion-label>
                 <ion-note *ngIf="event.offline && !event.deleted" slot="end">
diff --git a/src/addons/calendar/pages/day/day.html b/src/addons/calendar/pages/day/day.html
index 8e8c6f3a2..c548b1e84 100644
--- a/src/addons/calendar/pages/day/day.html
+++ b/src/addons/calendar/pages/day/day.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.calendar.calendarevents' | translate }}</ion-title>
+        <h1>{{ 'addon.calendar.calendarevents' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="openFilter($event)" [attr.aria-label]="'core.filter' | translate">
                 <ion-icon slot="icon-only" name="fas-filter" aria-hidden="true"></ion-icon>
@@ -71,8 +71,10 @@
                             {{ 'addon.calendar.type' + event.formattedType | translate }}
                             <span class="sr-only" *ngIf="event.moduleIcon && event.iconTitle">{{ event.iconTitle }}</span>
                         </span>
-                        <h2><core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
-                            [contextInstanceId]="event.contextInstanceId"></core-format-text></h2>
+                        <p class="item-heading">
+                            <core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
+                            [contextInstanceId]="event.contextInstanceId"></core-format-text>
+                        </p>
                         <p [innerHTML]="event.formattedtime"></p>
                     </ion-label>
                     <ion-note *ngIf="event.offline && !event.deleted" slot="end">
diff --git a/src/addons/calendar/pages/edit-event/edit-event.html b/src/addons/calendar/pages/edit-event/edit-event.html
index d6d001ebd..f970a57e6 100644
--- a/src/addons/calendar/pages/edit-event/edit-event.html
+++ b/src/addons/calendar/pages/edit-event/edit-event.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title | translate }}</ion-title>
+        <h1>{{ title | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/calendar/pages/event/event.html b/src/addons/calendar/pages/event/event.html
index ff3795550..00acf2531 100644
--- a/src/addons/calendar/pages/event/event.html
+++ b/src/addons/calendar/pages/event/event.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="event">
+        <h1 *ngIf="event">
             <img *ngIf="event.moduleIcon" src="{{event.moduleIcon}}" alt="" role="presentation" class="core-module-icon">
             <ion-icon *ngIf="event.eventIcon && !event.moduleIcon" [name]="event.eventIcon" aria-hidden="true"></ion-icon>
             <!-- Add the icon title so accessibility tools read it. -->
@@ -13,7 +13,7 @@
             </span>
             <core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
                 [contextInstanceId]="event.contextInstanceId"></core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The context menu will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/calendar/pages/event/event.scss b/src/addons/calendar/pages/event/event.scss
index 02d96ff3c..bc2bb8cb3 100644
--- a/src/addons/calendar/pages/event/event.scss
+++ b/src/addons/calendar/pages/event/event.scss
@@ -2,7 +2,7 @@
     ion-card ion-note {
         font-size: 1.6rem;
     }
-    ion-title ion-icon, ion-title img {
+    h1 ion-icon, h1 img {
         margin-left: 10px;
         margin-right: 10px;
     }
diff --git a/src/addons/calendar/pages/index/index.html b/src/addons/calendar/pages/index/index.html
index 0b41603c6..b8d37ec78 100644
--- a/src/addons/calendar/pages/index/index.html
+++ b/src/addons/calendar/pages/index/index.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ (showCalendar ? 'addon.calendar.calendarevents' : 'addon.calendar.upcomingevents') | translate }}</ion-title>
+        <h1>{{ (showCalendar ? 'addon.calendar.calendarevents' : 'addon.calendar.upcomingevents') | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="openFilter($event)" [attr.aria-label]="'core.filter' | translate">
                 <ion-icon slot="icon-only" name="fas-filter" aria-hidden="true"></ion-icon>
diff --git a/src/addons/calendar/pages/list/list.html b/src/addons/calendar/pages/list/list.html
index dcf423a82..55fc48d6d 100644
--- a/src/addons/calendar/pages/list/list.html
+++ b/src/addons/calendar/pages/list/list.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.calendar.calendarevents' | translate }}</ion-title>
+        <h1>{{ 'addon.calendar.calendarevents' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="openFilter($event)" [attr.aria-label]="'core.filter' | translate">
                 <ion-icon slot="icon-only" name="fas-filter" aria-hidden="true"></ion-icon>
@@ -40,7 +40,7 @@
             <ion-list *ngIf="filteredEvents && filteredEvents.length" class="ion-no-margin">
                 <ng-container *ngFor="let event of filteredEvents">
                     <ion-item-divider *ngIf="event.showDate">
-                        <ion-label><h2>{{ event.timestart * 1000 | coreFormatDate: "strftimedayshort" }}</h2></ion-label>
+                        <ion-label><p class="item-heading">{{ event.timestart * 1000 | coreFormatDate: "strftimedayshort" }}</p></ion-label>
                     </ion-item-divider>
                     <ion-item class="addon-calendar-event ion-text-wrap" [attr.aria-label]="event.name" (click)="gotoEvent(event.id)"
                         [attr.aria-current]="event.id == eventId ? 'page' : 'false'"
@@ -51,7 +51,7 @@
                             aria-hidden="true">
                         </ion-icon>
                         <ion-label>
-                            <h2>
+                            <p class="item-heading">
                                 <!-- Add the icon title so accessibility tools read it. -->
                                 <span class="sr-only">
                                     {{ 'addon.calendar.type' + event.formattedType | translate }}
@@ -60,7 +60,7 @@
                                 <core-format-text [text]="event.name" [contextLevel]="event.contextLevel"
                                     [contextInstanceId]="event.contextInstanceId">
                                 </core-format-text>
-                            </h2>
+                            </p>
                             <p>
                                 {{ event.timestart * 1000 | coreFormatDate: "strftimetime" }}
                                 <span *ngIf="event.timeduration && event.endsSameDay">
diff --git a/src/addons/calendar/pages/settings/settings.html b/src/addons/calendar/pages/settings/settings.html
index 7c0a539a2..c408d5f2e 100644
--- a/src/addons/calendar/pages/settings/settings.html
+++ b/src/addons/calendar/pages/settings/settings.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.settings.settings' | translate }}</ion-title>
+        <h1>{{ 'core.settings.settings' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/competency/pages/competencies/competencies.html b/src/addons/competency/pages/competencies/competencies.html
index 6ab4dd8f4..516b5f6f6 100644
--- a/src/addons/competency/pages/competencies/competencies.html
+++ b/src/addons/competency/pages/competencies/competencies.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -17,7 +17,7 @@
                     [attr.aria-label]="competency.competency.shortname" (click)="competencies.select(competency)"
                     [attr.aria-current]="competencies.getItemAriaCurrent(competency)" button>
                     <ion-label>
-                        <h2>{{ competency.competency.shortname }} <em>{{competency.competency.idnumber}}</em></h2>
+                        <p class="item-heading">{{ competency.competency.shortname }} <em>{{competency.competency.idnumber}}</em></p>
                     </ion-label>
                     <ion-badge slot="end" *ngIf="competency.usercompetency"
                         [color]="competency.usercompetency.proficiency ? 'success' : 'danger'">
diff --git a/src/addons/competency/pages/competency/competency.html b/src/addons/competency/pages/competency/competency.html
index 84559bc90..f093e2a13 100644
--- a/src/addons/competency/pages/competency/competency.html
+++ b/src/addons/competency/pages/competency/competency.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="competency">
+        <h1 *ngIf="competency">
             {{ competency.competency.competency.shortname }} <small>{{ competency.competency.competency.idnumber }}</small>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -121,7 +121,7 @@
                     [courseId]="courseId">
                     <core-user-avatar [user]="evidence.actionuser" slot="start"></core-user-avatar>
                     <ion-label>
-                        <h2>{{ evidence.actionuser.fullname }}</h2>
+                        <p class="item-heading">{{ evidence.actionuser.fullname }}</p>
                         <p>{{ evidence.timemodified * 1000 | coreFormatDate }}</p>
                     </ion-label>
                 </ion-item>
diff --git a/src/addons/competency/pages/competencysummary/competencysummary.html b/src/addons/competency/pages/competencysummary/competencysummary.html
index dfd7a5f39..f497b008c 100644
--- a/src/addons/competency/pages/competencysummary/competencysummary.html
+++ b/src/addons/competency/pages/competencysummary/competencysummary.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="competency">
+        <h1 *ngIf="competency">
             {{ competency.competency.shortname }} <small>{{ competency.competency.idnumber }}</small>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/competency/pages/coursecompetencies/coursecompetencies.html b/src/addons/competency/pages/coursecompetencies/coursecompetencies.html
index 091bd1676..ad3af37bb 100644
--- a/src/addons/competency/pages/coursecompetencies/coursecompetencies.html
+++ b/src/addons/competency/pages/coursecompetencies/coursecompetencies.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.competency.coursecompetencies' | translate }}</ion-title>
+        <h1>{{ 'addon.competency.coursecompetencies' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -44,9 +44,9 @@
             </ion-item>
         </ion-card>
 
-        <h3 class="ion-margin-horizontal" *ngIf="competencies && competencies.statistics.competencycount > 0">
+        <h2 class="ion-margin-horizontal" *ngIf="competencies && competencies.statistics.competencycount > 0">
             {{ 'addon.competency.coursecompetencies' | translate }}
-        </h3>
+        </h2>
         <ion-card *ngIf="user">
              <ion-item class="ion-text-wrap">
                 <core-user-avatar [user]="user" slot="start"></core-user-avatar>
@@ -62,7 +62,9 @@
                 <ion-item class="ion-text-wrap" (click)="openCompetency(competency.competency.id)"
                     [attr.aria-label]="competency.competency.shortname" detail="true" button>
                     <ion-label>
-                        <h2><strong>{{competency.competency.shortname}} <em>{{competency.competency.idnumber}}</em></strong></h2>
+                        <p class="item-heading">
+                            <strong>{{competency.competency.shortname}} <em>{{competency.competency.idnumber}}</em></strong>
+                        </p>
                     </ion-label>
                     <ion-badge slot="end" *ngIf="competency.usercompetencycourse && competency.usercompetencycourse.gradename"
                         [color]="competency.usercompetencycourse.proficiency ? 'success' : 'danger'">
diff --git a/src/addons/competency/pages/plan/plan.html b/src/addons/competency/pages/plan/plan.html
index 6ad9a93b9..0331c370a 100644
--- a/src/addons/competency/pages/plan/plan.html
+++ b/src/addons/competency/pages/plan/plan.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="plan">{{plan.plan.name}}</ion-title>
+        <h1 *ngIf="plan">{{plan.plan.name}}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -78,7 +78,9 @@
                 <ion-item class="ion-text-wrap" *ngFor="let competency of plan.competencies"
                     (click)="openCompetency(competency.competency.id)"
                     [attr.aria-label]="competency.competency.shortname" detail="true" button>
-                    <ion-label><h2>{{competency.competency.shortname}} <em>{{competency.competency.idnumber}}</em></h2></ion-label>
+                    <ion-label>
+                        <p class="item-heading">{{competency.competency.shortname}} <em>{{competency.competency.idnumber}}</em></p>
+                    </ion-label>
                     <ion-badge *ngIf="competency.usercompetencyplan" slot="end"
                         [color]="competency.usercompetencyplan.proficiency ? 'success' : 'danger'">
                             {{ competency.usercompetencyplan.gradename }}
diff --git a/src/addons/competency/pages/planlist/planlist.html b/src/addons/competency/pages/planlist/planlist.html
index bd25bfd5b..b25476471 100644
--- a/src/addons/competency/pages/planlist/planlist.html
+++ b/src/addons/competency/pages/planlist/planlist.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.competency.userplans' | translate }}</ion-title>
+        <h1>{{ 'addon.competency.userplans' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -19,7 +19,7 @@
                 <ion-item class="ion-text-wrap" *ngFor="let plan of plans.items" [attr.aria-label]="plan.name"
                     (click)="plans.select(plan)" [attr.aria-current]="plans.getItemAriaCurrent(plan)" button>
                     <ion-label>
-                        <h2>{{ plan.name }}</h2>
+                        <p class="item-heading">{{ plan.name }}</p>
                         <p *ngIf="plan.duedate > 0">
                             {{ 'addon.competency.duedate' | translate }}:&nbsp;
                             {{ plan.duedate * 1000 | coreFormatDate :'strftimedatetimeshort' }}
diff --git a/src/addons/coursecompletion/pages/report/report.html b/src/addons/coursecompletion/pages/report/report.html
index 9ede505cc..bc71b97f4 100644
--- a/src/addons/coursecompletion/pages/report/report.html
+++ b/src/addons/coursecompletion/pages/report/report.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.coursecompletion.coursecompletion' | translate }}</ion-title>
+        <h1>{{ 'addon.coursecompletion.coursecompletion' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -32,7 +32,9 @@
             </ion-item-divider>
             <ion-item class="ion-hide-md-up ion-text-wrap" *ngFor="let criteria of completion.completions">
                 <ion-label>
-                    <h2><core-format-text clean="true" [text]="criteria.details.criteria" [filter]="false"></core-format-text></h2>
+                    <p class="item-heading">
+                        <core-format-text clean="true" [text]="criteria.details.criteria" [filter]="false"></core-format-text>
+                    </p>
                     <p><core-format-text clean="true" [text]="criteria.details.requirement" [filter]="false"></core-format-text></p>
                 </ion-label>
                 <strong slot="end">{{ criteria.status }}</strong>
diff --git a/src/addons/messageoutput/airnotifier/pages/devices/devices.html b/src/addons/messageoutput/airnotifier/pages/devices/devices.html
index 844c76279..de1e6f880 100644
--- a/src/addons/messageoutput/airnotifier/pages/devices/devices.html
+++ b/src/addons/messageoutput/airnotifier/pages/devices/devices.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messageoutput_airnotifier.processorsettingsdesc' | translate }}</ion-title>
+        <h1>{{ 'addon.messageoutput_airnotifier.processorsettingsdesc' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/messages/components/conversation-info/conversation-info.html b/src/addons/messages/components/conversation-info/conversation-info.html
index 129cbdcb9..8a311ea57 100644
--- a/src/addons/messages/components/conversation-info/conversation-info.html
+++ b/src/addons/messages/components/conversation-info/conversation-info.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.messages.groupinfo' | translate }}</ion-title>
+        <h2>{{ 'addon.messages.groupinfo' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden="true"></ion-icon>
@@ -37,12 +37,12 @@
             <core-user-avatar [user]="member" [linkProfile]="false" [checkOnline]="member.showonlinestatus" slot="start">
             </core-user-avatar>
             <ion-label>
-                <h2>
+                <p class="item-heading">
                     {{ member.fullname }}
                     <ion-icon name="fas-user-slash" *ngIf="member.isblocked"
                         [attr.aria-label]="'addon.messages.contactblocked' | translate">
                     </ion-icon>
-                </h2>
+                </p>
             </ion-label>
         </ion-item>
 
diff --git a/src/addons/messages/messages-common.scss b/src/addons/messages/messages-common.scss
index a9dfebf33..8b480f462 100644
--- a/src/addons/messages/messages-common.scss
+++ b/src/addons/messages/messages-common.scss
@@ -6,7 +6,7 @@
             margin-left: 0;
         }
 
-        h2 {
+        .item-heading {
             core-format-text {
                 font-weight: bold;
             }
@@ -52,7 +52,7 @@
     }
 
     .addon-message-discussion {
-        h2 {
+        .item-heading {
             margin-top: 10px;
         }
     }
@@ -66,7 +66,7 @@
 :host-context([dir=rtl]) {
     .addon-messages-conversation-item,
     .addon-message-discussion {
-        h2 ion-icon {
+        .item-heading ion-icon {
             margin-right: 2px;
             margin-left: 0;
         }
diff --git a/src/addons/messages/pages/contacts-35/contacts.html b/src/addons/messages/pages/contacts-35/contacts.html
index 358567cc7..d929dd496 100644
--- a/src/addons/messages/pages/contacts-35/contacts.html
+++ b/src/addons/messages/pages/contacts-35/contacts.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.contacts' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.contacts' | translate }}</h1>
         <ion-buttons slot="end">
             <!-- Add an empty context menu so discussion page can add items in split view,
                 otherwise the menu disappears in some cases. -->
@@ -31,7 +31,7 @@
             <ion-list *ngFor="let contactType of contactTypes" class="ion-no-margin">
                 <ng-container *ngIf="contacts[contactType] && (contacts[contactType].length > 0 || contactType === searchType)">
                     <ion-item-divider>
-                        <ion-label><h2>{{ 'addon.messages.type_' + contactType | translate }}</h2></ion-label>
+                        <ion-label><p class="item-heading">{{ 'addon.messages.type_' + contactType | translate }}</p></ion-label>
                         <ion-note slot="end" class="ion-padding-end"><ion-badge>{{ contacts[contactType].length }}</ion-badge></ion-note>
                     </ion-item-divider>
                     <ng-container *ngFor="let contact of contacts[contactType]">
@@ -41,7 +41,7 @@
                             [attr.aria-label]="contact.fullname" (click)="gotoDiscussion(contact.id)" detail="true" button
                             [attr.aria-current]="contact.id == discussionUserId ? 'page' : 'false'">
                             <core-user-avatar [user]="contact" slot="start" [checkOnline]="contact.showonlinestatus"></core-user-avatar>
-                            <ion-label><h2>{{ contact.fullname }}</h2></ion-label>
+                            <ion-label><p class="item-heading">{{ contact.fullname }}</p></ion-label>
                         </ion-item>
                     </ng-container>
                 </ng-container>
diff --git a/src/addons/messages/pages/contacts/contacts.html b/src/addons/messages/pages/contacts/contacts.html
index f78025708..43623185f 100644
--- a/src/addons/messages/pages/contacts/contacts.html
+++ b/src/addons/messages/pages/contacts/contacts.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.contacts' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.contacts' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="gotoSearch()" [attr.aria-label]="'addon.messages.searchcombined' | translate">
                 <ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
@@ -33,13 +33,13 @@
                                     [checkOnline]="contact.showonlinestatus" [linkProfile]="false">
                                 </core-user-avatar>
                                 <ion-label>
-                                    <h2>
+                                    <p class="item-heading">
                                         <core-format-text [text]="contact.fullname" contextLevel="system" [contextInstanceId]="0">
                                         </core-format-text>
                                         <ion-icon *ngIf="contact.isblocked" name="fas-user-slash" slot="end"
                                             [attr.aria-label]="'addon.messages.contactblocked' | translate">
                                         </ion-icon>
-                                    </h2>
+                                    </p>
                                 </ion-label>
                             </ion-item>
                         </ion-list>
diff --git a/src/addons/messages/pages/discussion/discussion.html b/src/addons/messages/pages/discussion/discussion.html
index 079b182dc..a6a1c9216 100644
--- a/src/addons/messages/pages/discussion/discussion.html
+++ b/src/addons/messages/pages/discussion/discussion.html
@@ -3,8 +3,8 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
-            <div class="toolbar-title">
+        <h1>
+            <div class="addon-messages-discussion-title">
                 <img *ngIf="loaded && !otherMember && conversationImage" class="core-bar-button-image" [src]="conversationImage"
                     alt="" onError="this.src='assets/img/group-avatar.png'" core-external-content role="presentation"
                     [siteId]="siteId || null">
@@ -20,7 +20,7 @@
                     [attr.aria-label]="'addon.messages.mutedconversation' | translate">
                 </ion-icon>
             </div>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
     <core-navbar-buttons slot="end">
@@ -73,12 +73,14 @@
             <p class="ion-text-center"><i>{{ 'addon.messages.selfconversationdefaultmessage' | translate }}</i></p>
         </ng-container>
 
+        <h2 class="sr-only">{{ title }}</h2>
+
         <ion-list class="addon-messages-discussion-container" [class.addon-messages-discussion-group]="isGroup"
             [attr.aria-live]="'polite'">
             <ng-container *ngFor="let message of messages; index as index; last as last">
-                <h6 class="ion-text-center addon-messages-date" *ngIf="message.showDate">
+                <h3 class="ion-text-center addon-messages-date" *ngIf="message.showDate">
                     {{ message.timecreated | coreFormatDate: "strftimedayshort" }}
-                </h6>
+                </h3>
 
                 <ion-chip class="addon-messages-unreadfrom" *ngIf="unreadMessageFrom && message.id == unreadMessageFrom"
                     color="light">
@@ -93,7 +95,7 @@
                     [@coreSlideInOut]="message.useridfrom == currentUserId ? '' : 'fromLeft'">
                     <ion-label>
                         <!-- User data. -->
-                        <h2 class="addon-message-user" [attr.aria-label]="message.useridfrom == currentUserId ?
+                        <div class="item-heading addon-message-user" [attr.aria-label]="message.useridfrom == currentUserId ?
                             ('addon.messages.you' | translate) : members[message.useridfrom].fullname">
                             <core-user-avatar slot="start" [user]="members[message.useridfrom]" [linkProfile]="false"
                                 *ngIf="message.showUserData"></core-user-avatar>
@@ -104,7 +106,7 @@
                             <ion-note *ngIf="message.pending">
                                 <ion-icon name="fas-clock" [attr.aria-label]="'core.notsent' | translate" role="status"></ion-icon>
                             </ion-note>
-                        </h2>
+                        </div>
 
                         <!-- Some messages have <p> and some others don't. Add a <p> so they all have same styles. -->
                         <p class="addon-message-text">
diff --git a/src/addons/messages/pages/discussion/discussion.scss b/src/addons/messages/pages/discussion/discussion.scss
index a521f3d57..5582fd11b 100644
--- a/src/addons/messages/pages/discussion/discussion.scss
+++ b/src/addons/messages/pages/discussion/discussion.scss
@@ -183,7 +183,7 @@
 
     ion-item.addon-message.addon-message-mine + ion-item.addon-message.addon-message-no-user.addon-message-mine,
     ion-item.addon-message.addon-message-not-mine + ion-item.addon-message.addon-message-no-user.addon-message-not-mine {
-        h2 {
+        .item-heading {
             margin-bottom: 0;
         }
         margin-top: -8px;
@@ -217,7 +217,7 @@
         }
     }
 
-    ion-header ion-toolbar .toolbar-title {
+    ion-header ion-toolbar .addon-messages-discussion-title {
         display: flex;
         align-items: center;
         padding: 0;
@@ -240,7 +240,7 @@
 }
 
 :host-context([dir=rtl]) {
-    ion-header ion-toolbar .toolbar-title {
+    ion-header ion-toolbar .addon-messages-discussion-title {
         .core-bar-button-image {
             margin-left: 6px;
             margin-right: 0;
@@ -291,7 +291,7 @@
 }
 
 :host-context(.ios) {
-    ion-header ion-toolbar .toolbar-title {
+    ion-header ion-toolbar .addon-messages-discussion-title {
         justify-content: center;
     }
 
diff --git a/src/addons/messages/pages/discussions-35/discussions.html b/src/addons/messages/pages/discussions-35/discussions.html
index 01d19dfa5..7340b0c1a 100644
--- a/src/addons/messages/pages/discussions-35/discussions.html
+++ b/src/addons/messages/pages/discussions-35/discussions.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.messages' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.messages' | translate }}</h1>
         <ion-buttons slot="end">
             <!-- Add an empty context menu so discussion page can add items in split view,
                 otherwise the menu disappears in some cases. -->
@@ -43,7 +43,7 @@
                         [attr.aria-current]="result.userid == discussionUserId ? 'page' : 'false'">
                         <core-user-avatar [user]="result" slot="start" [checkOnline]="result.showonlinestatus"></core-user-avatar>
                         <ion-label>
-                                <h2>{{ result.fullname }}</h2>
+                            <p class="item-heading">{{ result.fullname }}</p>
                             <p><core-format-text clean="true" singleLine="true" [text]="result.lastmessage" contextLevel="system"
                                 [contextInstanceId]="0"></core-format-text></p>
                         </ion-label>
@@ -56,7 +56,7 @@
                         <core-user-avatar [user]="discussion" slot="start" checkOnline="false"></core-user-avatar>
                         <ion-label>
                             <div class="flex-row ion-justify-content-between">
-                                <h2>{{ discussion.fullname }}</h2>
+                                <p class="item-heading">{{ discussion.fullname }}</p>
                                 <ion-note *ngIf="discussion.message!.timecreated > 0 || discussion.unread">
                                     <span *ngIf="discussion.message!.timecreated > 0" class="addon-message-last-message-date">
                                         {{discussion.message!.timecreated / 1000 | coreDateDayOrTime}}
diff --git a/src/addons/messages/pages/group-conversations/group-conversations.html b/src/addons/messages/pages/group-conversations/group-conversations.html
index a88794403..c0b9cfb62 100644
--- a/src/addons/messages/pages/group-conversations/group-conversations.html
+++ b/src/addons/messages/pages/group-conversations/group-conversations.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.messages' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.messages' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="gotoSearch()" [attr.aria-label]="'addon.messages.searchcombined' | translate">
                 <ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
@@ -163,13 +163,13 @@
 
         <ion-label>
             <div class="flex-row ion-justify-content-between">
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="conversation.name" contextLevel="system" [contextInstanceId]="0"></core-format-text>
                     <ion-icon name="fas-user-slash" *ngIf="conversation.isblocked"
                         [title]="'addon.messages.contactblocked' | translate"></ion-icon>
                     <ion-icon *ngIf="conversation.ismuted" name="fas-volume-mute"
                         [title]="'addon.messages.mutedconversation' | translate"></ion-icon>
-                </h2>
+                </p>
                 <ion-note *ngIf="conversation.lastmessagedate > 0 || conversation.unreadcount">
                     <span *ngIf="conversation.lastmessagedate > 0" class="addon-message-last-message-date">
                         {{conversation.lastmessagedate | coreDateDayOrTime}}
diff --git a/src/addons/messages/pages/search/search.html b/src/addons/messages/pages/search/search.html
index fc47fd778..9ebab182e 100644
--- a/src/addons/messages/pages/search/search.html
+++ b/src/addons/messages/pages/search/search.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.searchcombined' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.searchcombined' | translate }}</h1>
         <ion-buttons slot="end">
             <!-- Add an empty context menu so discussion page can add items in split view,
                 otherwise the menu disappears in some cases. -->
@@ -47,13 +47,13 @@
             button>
             <core-user-avatar slot="start" [user]="result" [checkOnline]="true" [linkProfile]="false"></core-user-avatar>
             <ion-label>
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="result.fullname" [highlight]="result.highlightName" [filter]="false">
                     </core-format-text>
                     <ion-icon name="fa-ban" *ngIf="result.isblocked"
                         [attr.aria-label]="'addon.messages.contactblocked' | translate">
                     </ion-icon>
-                </h2>
+                </p>
                 <ion-note *ngIf="result.lastmessagedate > 0">
                     {{result.lastmessagedate | coreDateDayOrTime}}
                 </ion-note>
diff --git a/src/addons/messages/pages/settings/settings.html b/src/addons/messages/pages/settings/settings.html
index 9b530c8ed..4f3aafeac 100644
--- a/src/addons/messages/pages/settings/settings.html
+++ b/src/addons/messages/pages/settings/settings.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.messages.messages' | translate }}</ion-title>
+        <h1>{{ 'addon.messages.messages' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/assign/components/edit-feedback-modal/edit-feedback-modal.html b/src/addons/mod/assign/components/edit-feedback-modal/edit-feedback-modal.html
index ee19a1f3b..6e5868cce 100644
--- a/src/addons/mod/assign/components/edit-feedback-modal/edit-feedback-modal.html
+++ b/src/addons/mod/assign/components/edit-feedback-modal/edit-feedback-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ plugin.name }}</ion-title>
+        <h2>{{ plugin.name }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/assign/pages/edit/edit.html b/src/addons/mod/assign/pages/edit/edit.html
index b206f6ee0..986695272 100644
--- a/src/addons/mod/assign/pages/edit/edit.html
+++ b/src/addons/mod/assign/pages/edit/edit.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="moduleId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="save()" [attr.aria-label]="'core.save' | translate">
                 {{ 'core.save' | translate }}
diff --git a/src/addons/mod/assign/pages/index/index.html b/src/addons/mod/assign/pages/index/index.html
index ab4344d33..8e1a710bc 100644
--- a/src/addons/mod/assign/pages/index/index.html
+++ b/src/addons/mod/assign/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/assign/pages/submission-list/submission-list.html b/src/addons/mod/assign/pages/submission-list/submission-list.html
index 3161afb6b..b8c02f174 100644
--- a/src/addons/mod/assign/pages/submission-list/submission-list.html
+++ b/src/addons/mod/assign/pages/submission-list/submission-list.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="moduleId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
@@ -43,10 +43,10 @@
                         [attr.aria-current]="submissions.getItemAriaCurrent(submission)">
                         <core-user-avatar [user]="submission" [linkProfile]="false" slot="start"></core-user-avatar>
                         <ion-label>
-                            <h2 *ngIf="submission.userfullname">{{submission.userfullname}}</h2>
-                            <h2 *ngIf="!submission.userfullname">
+                            <p class="item-heading" *ngIf="submission.userfullname">{{submission.userfullname}}</p>
+                            <p class="item-heading" *ngIf="!submission.userfullname">
                                 {{ 'addon.mod_assign.hiddenuser' | translate }}{{submission.blindid}}
-                            </h2>
+                            </p>
                             <p *ngIf="assign && assign!.teamsubmission">
                                 <span *ngIf="submission.groupname">{{submission.groupname}}</span>
                                 <span *ngIf="assign!.preventsubmissionnotingroup && !submission.groupname && submission.noGroups
diff --git a/src/addons/mod/assign/pages/submission-review/submission-review.html b/src/addons/mod/assign/pages/submission-review/submission-review.html
index aaff81bf1..c6e25a660 100644
--- a/src/addons/mod/assign/pages/submission-review/submission-review.html
+++ b/src/addons/mod/assign/pages/submission-review/submission-review.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="moduleId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
diff --git a/src/addons/mod/book/components/toc/toc.html b/src/addons/mod/book/components/toc/toc.html
index b35e48b95..7c40642a7 100644
--- a/src/addons/mod/book/components/toc/toc.html
+++ b/src/addons/mod/book/components/toc/toc.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_book.toc' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_book.toc' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/addons/mod/book/pages/index/index.html b/src/addons/mod/book/pages/index/index.html
index 6219fc40f..495b0b976 100644
--- a/src/addons/mod/book/pages/index/index.html
+++ b/src/addons/mod/book/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/chat/components/users-modal/users-modal.html b/src/addons/mod/chat/components/users-modal/users-modal.html
index dac82f510..248b463f5 100644
--- a/src/addons/mod/chat/components/users-modal/users-modal.html
+++ b/src/addons/mod/chat/components/users-modal/users-modal.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_chat.currentusers' | translate }}</ion-title>
+        <h2>{{ 'addon.mod_chat.currentusers' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
@@ -18,7 +18,7 @@
 
             <core-user-avatar [user]="user" slot="start" [linkProfile]="false"></core-user-avatar>
             <ion-label>
-                <h2>{{ user.fullname }}</h2>
+                <p class="item-heading">{{ user.fullname }}</p>
                 <ng-container *ngIf="currentUserId != user.id && isOnline">
                     <ion-button fill="clear" (click)="talkTo(user)">
                         <ion-icon name="fas-comments" slot="start" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/chat/pages/chat/chat.html b/src/addons/mod/chat/pages/chat/chat.html
index 8ffa984d2..d741b541e 100644
--- a/src/addons/mod/chat/pages/chat/chat.html
+++ b/src/addons/mod/chat/pages/chat/chat.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="loaded" (click)="showChatUsers()" [attr.aria-label]="'core.users' | translate">
                 <ion-icon name="fas-users" slot="icon-only" aria-hidden="true"></ion-icon>
@@ -19,9 +19,9 @@
         <ion-list class="addon-messages-discussion-container" aria-live="polite">
             <ng-container *ngFor="let message of messages; index as index; last as last">
 
-                <h6 class="ion-text-center addon-messages-date" *ngIf="message.showDate">
+                <p class="ion-text-center addon-messages-date" *ngIf="message.showDate">
                     {{ message.timestamp * 1000 | coreFormatDate: "strftimedayshort" }}
-                </h6>
+                </p>
 
                 <div class="ion-text-center addon-mod_chat-notice" *ngIf="message.special">
                     <ion-badge class="ion-text-wrap" color="success" *ngIf="message.system && message.message == 'enter'">
diff --git a/src/addons/mod/chat/pages/index/index.html b/src/addons/mod/chat/pages/index/index.html
index 6309d2f3f..b228480b8 100644
--- a/src/addons/mod/chat/pages/index/index.html
+++ b/src/addons/mod/chat/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/chat/pages/session-messages/session-messages.html b/src/addons/mod/chat/pages/session-messages/session-messages.html
index fef14e9fe..4fbc6d40a 100644
--- a/src/addons/mod/chat/pages/session-messages/session-messages.html
+++ b/src/addons/mod/chat/pages/session-messages/session-messages.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_chat.messages' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_chat.messages' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -14,9 +14,9 @@
         <ion-list class="addon-messages-discussion-container" aria-live="polite">
             <ng-container *ngFor="let message of messages; index as index;">
 
-                <h6 class="ion-text-center addon-messages-date" *ngIf="message.showDate">
+                <div class="ion-text-center addon-messages-date" *ngIf="message.showDate">
                     {{ message.timestamp * 1000 | coreFormatDate:"strftimedayshort" }}
-                </h6>
+                </div>
 
                 <div class="ion-text-center addon-mod_chat-notice" *ngIf="message.special">
                     <ion-badge class="ion-text-wrap" color="success" *ngIf="message.issystem && message.message == 'enter'">
diff --git a/src/addons/mod/chat/pages/sessions/sessions.html b/src/addons/mod/chat/pages/sessions/sessions.html
index 6c8427d5b..cdd256681 100644
--- a/src/addons/mod/chat/pages/sessions/sessions.html
+++ b/src/addons/mod/chat/pages/sessions/sessions.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_chat.chatreport' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_chat.chatreport' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -36,7 +36,7 @@
 
                 <ion-item class="ion-text-wrap">
                     <ion-label>
-                        <h2>{{ session.sessionstart * 1000 | coreFormatDate }}</h2>
+                        <p class="item-heading">{{ session.sessionstart * 1000 | coreFormatDate }}</p>
                         <p *ngIf="session.duration">{{ session.duration | coreDuration }}</p>
                     </ion-label>
                 </ion-item>
diff --git a/src/addons/mod/choice/components/index/addon-mod-choice-index.html b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
index da0c85063..ebeb7e43b 100644
--- a/src/addons/mod/choice/components/index/addon-mod-choice-index.html
+++ b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
@@ -131,11 +131,11 @@
                     <ion-item-group *ngFor="let result of results">
                         <ion-item-divider class="ion-text-wrap">
                             <ion-label>
-                                <h2>
+                                <h3 class="item-heading">
                                     <core-format-text [text]="result.text" contextLevel="module" [contextInstanceId]="module.id"
                                         [courseId]="courseId">
                                     </core-format-text>
-                                </h2>
+                                </h3>
                                 <p>
                                     {{ 'addon.mod_choice.numberofuser' | translate }}: {{ result.numberofuser }}
                                     ({{ 'core.percentagenumber' | translate: {$a: result.percentageamountfixed} }})
diff --git a/src/addons/mod/choice/pages/index/index.html b/src/addons/mod/choice/pages/index/index.html
index 78d41b815..9497c99fb 100644
--- a/src/addons/mod/choice/pages/index/index.html
+++ b/src/addons/mod/choice/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/data/components/search/search.html b/src/addons/mod/data/components/search/search.html
index f4eb45f86..dbbe340e0 100644
--- a/src/addons/mod/data/components/search/search.html
+++ b/src/addons/mod/data/components/search/search.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_data.search' | translate }}</ion-title>
+        <h2>{{ 'addon.mod_data.search' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/addons/mod/data/pages/edit/edit.html b/src/addons/mod/data/pages/edit/edit.html
index 545721abc..699f9e99d 100644
--- a/src/addons/mod/data/pages/edit/edit.html
+++ b/src/addons/mod/data/pages/edit/edit.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button *ngIf="entry" fill="clear" (click)="save($event)" [attr.aria-label]="'core.save' | translate">
                 {{ 'core.save' | translate }}
diff --git a/src/addons/mod/data/pages/entry/entry.html b/src/addons/mod/data/pages/entry/entry.html
index 5fec6445b..36ae9d58c 100644
--- a/src/addons/mod/data/pages/entry/entry.html
+++ b/src/addons/mod/data/pages/entry/entry.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/data/pages/index/index.html b/src/addons/mod/data/pages/index/index.html
index d9d8edfcf..669549eb4 100644
--- a/src/addons/mod/data/pages/index/index.html
+++ b/src/addons/mod/data/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
index ccb014c3f..24da6b68d 100644
--- a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
+++ b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
@@ -204,11 +204,11 @@
             <ion-list *ngIf="items && items.length">
                 <ion-item class="ion-text-wrap core-analysis" *ngFor="let item of items">
                     <ion-label>
-                        <h2>
+                        <p class="item-heading">
                             {{item.num}}. <core-format-text [component]="component" [componentId]="componentId" [text]="item.name"
                             contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
                             </core-format-text>
-                        </h2>
+                        </p>
                         <p>
                             <core-format-text [component]="component" [componentId]="componentId" [text]="item.label"
                                 contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
diff --git a/src/addons/mod/feedback/pages/attempt/attempt.html b/src/addons/mod/feedback/pages/attempt/attempt.html
index feba1e37d..77edc5f38 100644
--- a/src/addons/mod/feedback/pages/attempt/attempt.html
+++ b/src/addons/mod/feedback/pages/attempt/attempt.html
@@ -3,12 +3,12 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <ng-container *ngIf="attempt">{{ attempt.fullname }}</ng-container>
             <ng-container *ngIf="anonAttempt">
                 {{ 'addon.mod_feedback.response_nr' |translate }}: {{anonAttempt.number}}
             </ng-container>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/feedback/pages/form/form.html b/src/addons/mod/feedback/pages/form/form.html
index 5a9f07171..2a2af980e 100644
--- a/src/addons/mod/feedback/pages/form/form.html
+++ b/src/addons/mod/feedback/pages/form/form.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/feedback/pages/index/index.html b/src/addons/mod/feedback/pages/index/index.html
index f8903ac80..f7c6c173a 100644
--- a/src/addons/mod/feedback/pages/index/index.html
+++ b/src/addons/mod/feedback/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/feedback/pages/nonrespondents/nonrespondents.html b/src/addons/mod/feedback/pages/nonrespondents/nonrespondents.html
index 8ec8a826c..295618b17 100644
--- a/src/addons/mod/feedback/pages/nonrespondents/nonrespondents.html
+++ b/src/addons/mod/feedback/pages/nonrespondents/nonrespondents.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_feedback.responses' |translate }}</ion-title>
+        <h1>{{ 'addon.mod_feedback.responses' |translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -32,7 +32,7 @@
                 <ion-item *ngFor="let user of users" class="ion-text-wrap">
                     <core-user-avatar [user]="user" slot="start"></core-user-avatar>
                     <ion-label>
-                        <h2>{{ user.fullname }}</h2>
+                        <p class="item-heading">{{ user.fullname }}</p>
                         <p>
                             <ion-badge color="success" *ngIf="user.started">
                                 {{ 'addon.mod_feedback.started' | translate}}
diff --git a/src/addons/mod/feedback/pages/respondents/respondents.html b/src/addons/mod/feedback/pages/respondents/respondents.html
index 91c4a941c..ecc01d72e 100644
--- a/src/addons/mod/feedback/pages/respondents/respondents.html
+++ b/src/addons/mod/feedback/pages/respondents/respondents.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_feedback.responses' |translate }}</ion-title>
+        <h1>{{ 'addon.mod_feedback.responses' |translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -36,7 +36,7 @@
                         (click)="responses.select(attempt)" [attr.aria-current]="responses.getItemAriaCurrent(attempt)">
                         <core-user-avatar [user]="attempt" slot="start"></core-user-avatar>
                         <ion-label>
-                            <h2>{{ attempt.fullname }}</h2>
+                            <p class="item-heading">{{ attempt.fullname }}</p>
                             <p *ngIf="attempt.timemodified">{{attempt.timemodified * 1000 | coreFormatDate }}</p>
                         </ion-label>
                     </ion-item>
diff --git a/src/addons/mod/folder/components/index/addon-mod-folder-index.html b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
index 29460ae3d..b07882a73 100644
--- a/src/addons/mod/folder/components/index/addon-mod-folder-index.html
+++ b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
@@ -39,7 +39,7 @@
             <ion-item class="item-file" (click)="openFolder(folder)" detail="true" button>
                 <ion-icon name="fas-folder" slot="start" [attr.aria-label]="'core.folder' | translate"></ion-icon>
                 <ion-label>
-                    <h2>{{folder.filename}}</h2>
+                    <p class="item-heading">{{folder.filename}}</p>
                 </ion-label>
             </ion-item>
         </ng-container>
diff --git a/src/addons/mod/folder/pages/index/index.html b/src/addons/mod/folder/pages/index/index.html
index baca3eb36..198e37e5f 100644
--- a/src/addons/mod/folder/pages/index/index.html
+++ b/src/addons/mod/folder/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/forum/components/edit-post/edit-post.html b/src/addons/mod/forum/components/edit-post/edit-post.html
index 812574c03..21a433fd8 100644
--- a/src/addons/mod/forum/components/edit-post/edit-post.html
+++ b/src/addons/mod/forum/components/edit-post/edit-post.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_forum.yourreply' | translate }}</ion-title>
+        <h2>{{ 'addon.mod_forum.yourreply' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/forum/components/index/index.html b/src/addons/mod/forum/components/index/index.html
index 677ba239c..0a672a7ee 100644
--- a/src/addons/mod/forum/components/index/index.html
+++ b/src/addons/mod/forum/components/index/index.html
@@ -89,7 +89,7 @@
                 (click)="discussions.select(discussion)" button>
                 <ion-label>
                     <div class="addon-mod-forum-discussion-title">
-                        <h2 class="ion-text-wrap">
+                        <p class="ion-text-wrap item-heading">
                             <ion-icon name="fa-map-pin" *ngIf="discussion.pinned"
                                 [attr.aria-label]="'addon.mod_forum.discussionpinned' | translate"></ion-icon>
                             <ion-icon name="fa-star" class="addon-forum-star" *ngIf="!discussion.pinned && discussion.starred"
@@ -98,7 +98,7 @@
                                 [text]="discussion.subject"
                                 contextLevel="module" [contextInstanceId]="module && module.id" [courseId]="courseId">
                             </core-format-text>
-                        </h2>
+                        </p>
                         <ion-button *ngIf="canPin || discussion.canlock || discussion.canfavourite"
                             fill="clear" color="dark"
                             [attr.aria-label]="('core.displayoptions' | translate)"
@@ -111,7 +111,7 @@
                         <core-user-avatar *ngIf="discussion.userfullname" [user]="discussion" slot="start" [courseId]="courseId">
                         </core-user-avatar>
                         <div class="addon-mod-forum-discussion-author">
-                            <h3 *ngIf="discussion.userfullname">{{discussion.userfullname}}</h3>
+                            <span *ngIf="discussion.userfullname">{{discussion.userfullname}}</span>
                             <p *ngIf="discussion.groupname">
                                 <ion-icon name="fas-users" [attr.aria-label]="'addon.mod_forum.group' | translate">
                                 </ion-icon> {{ discussion.groupname }}
diff --git a/src/addons/mod/forum/components/index/index.scss b/src/addons/mod/forum/components/index/index.scss
index f5baa1efb..d07dae27d 100644
--- a/src/addons/mod/forum/components/index/index.scss
+++ b/src/addons/mod/forum/components/index/index.scss
@@ -11,7 +11,7 @@
         ion-label {
             margin-top: 4px;
 
-            h2 {
+            .item-heading {
                 margin-top: 8px;
                 margin-bottom: 8px;
                 font-weight: bold;
@@ -36,7 +36,7 @@
             align-items: center;
         }
 
-        .addon-mod-forum-discussion-title h2,
+        .addon-mod-forum-discussion-title .item-heading,
         .addon-mod-forum-discussion-info .addon-mod-forum-discussion-author {
             flex-grow: 1;
         }
diff --git a/src/addons/mod/forum/components/post/post.html b/src/addons/mod/forum/components/post/post.html
index e149dba0d..93910f69a 100644
--- a/src/addons/mod/forum/components/post/post.html
+++ b/src/addons/mod/forum/components/post/post.html
@@ -31,7 +31,7 @@
                     <core-user-avatar *ngIf="post.author && post.author.fullname" [user]="post.author" slot="start" [courseId]="courseId">
                     </core-user-avatar>
                     <div class="addon-mod-forum-post-author">
-                        <h3 *ngIf="post.author && post.author.fullname">{{post.author.fullname}}</h3>
+                        <span *ngIf="post.author && post.author.fullname">{{post.author.fullname}}</span>
                         <p *ngIf="post.author && post.author.groups">
                             <ng-container *ngFor="let group of post.author.groups">
                                 <ion-icon name="fas-users" [attr.aria-label]="'addon.mod_forum.group' | translate">
diff --git a/src/addons/mod/forum/components/post/post.scss b/src/addons/mod/forum/components/post/post.scss
index dfb13f112..bea8f1b1b 100644
--- a/src/addons/mod/forum/components/post/post.scss
+++ b/src/addons/mod/forum/components/post/post.scss
@@ -50,7 +50,7 @@
             margin-top: 0px;
         }
 
-        .addon-mod-forum-post-title h2,
+        .addon-mod-forum-post-title .item-heading,
         .addon-mod-forum-post-info .addon-mod-forum-post-author {
             flex-grow: 1;
         }
diff --git a/src/addons/mod/forum/components/sort-order-selector/sort-order-selector.html b/src/addons/mod/forum/components/sort-order-selector/sort-order-selector.html
index 5ea950f83..278563d0c 100644
--- a/src/addons/mod/forum/components/sort-order-selector/sort-order-selector.html
+++ b/src/addons/mod/forum/components/sort-order-selector/sort-order-selector.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title id="addon-mod-forum-sort-order-label">{{ 'core.sort' | translate }}</ion-title>
+        <h2 id="addon-mod-forum-sort-order-label">{{ 'core.sort' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/forum/pages/discussion/discussion.html b/src/addons/mod/forum/pages/discussion/discussion.html
index f367cd91b..426832a08 100644
--- a/src/addons/mod/forum/pages/discussion/discussion.html
+++ b/src/addons/mod/forum/pages/discussion/discussion.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="startingPost">
+        <h1 *ngIf="startingPost">
             <core-format-text contextLevel="module" [text]="startingPost.subject" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The context menu will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/forum/pages/index/index.html b/src/addons/mod/forum/pages/index/index.html
index 29de8d747..c98bfc3a1 100644
--- a/src/addons/mod/forum/pages/index/index.html
+++ b/src/addons/mod/forum/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/forum/pages/new-discussion/new-discussion.html b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
index 999ed8eae..b93e09ee3 100644
--- a/src/addons/mod/forum/pages/new-discussion/new-discussion.html
+++ b/src/addons/mod/forum/pages/new-discussion/new-discussion.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_forum.addanewdiscussion' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_forum.addanewdiscussion' | translate }}</h1>
         <ion-buttons slot="end">
             <!-- The context menu will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/glossary/pages/edit/edit.html b/src/addons/mod/glossary/pages/edit/edit.html
index 73907dc34..b533fdfa0 100644
--- a/src/addons/mod/glossary/pages/edit/edit.html
+++ b/src/addons/mod/glossary/pages/edit/edit.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="glossary">
+        <h1 *ngIf="glossary">
             <core-format-text [text]="glossary.name" contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/glossary/pages/entry/entry.html b/src/addons/mod/glossary/pages/entry/entry.html
index 703403d8d..836e8bd5b 100644
--- a/src/addons/mod/glossary/pages/entry/entry.html
+++ b/src/addons/mod/glossary/pages/entry/entry.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="entry">
+        <h1 *ngIf="entry">
             <core-format-text [text]="entry.concept" contextLevel="module" [contextInstanceId]="componentId" [courseId]="courseId">
             </core-format-text>
-            </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -30,10 +30,10 @@
             </ion-item>
             <ion-item class="ion-text-wrap" *ngIf="!showAuthor">
                 <ion-label>
-                    <h2>
+                    <p class="item-heading">
                         <core-format-text [text]="entry.concept" contextLevel="module" [contextInstanceId]="componentId">
                         </core-format-text>
-                    </h2>
+                    </p>
                 </ion-label>
                 <ion-note slot="end" *ngIf="showDate">{{ entry.timemodified | coreDateDayOrTime }}</ion-note>
             </ion-item>
diff --git a/src/addons/mod/glossary/pages/index/index.html b/src/addons/mod/glossary/pages/index/index.html
index 6f2f65ee1..2183e2bf6 100644
--- a/src/addons/mod/glossary/pages/index/index.html
+++ b/src/addons/mod/glossary/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/h5pactivity/pages/attempt-results/attempt-results.html b/src/addons/mod/h5pactivity/pages/attempt-results/attempt-results.html
index 831442deb..85afe5c01 100644
--- a/src/addons/mod/h5pactivity/pages/attempt-results/attempt-results.html
+++ b/src/addons/mod/h5pactivity/pages/attempt-results/attempt-results.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text *ngIf="h5pActivity" [text]="h5pActivity.name" contextLevel="module"
                 [contextInstanceId]="h5pActivity.coursemodule" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/h5pactivity/pages/index/index.html b/src/addons/mod/h5pactivity/pages/index/index.html
index 9a711437a..2f3d19f98 100644
--- a/src/addons/mod/h5pactivity/pages/index/index.html
+++ b/src/addons/mod/h5pactivity/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/h5pactivity/pages/user-attempts/user-attempts.html b/src/addons/mod/h5pactivity/pages/user-attempts/user-attempts.html
index 82d659613..8ac65463c 100644
--- a/src/addons/mod/h5pactivity/pages/user-attempts/user-attempts.html
+++ b/src/addons/mod/h5pactivity/pages/user-attempts/user-attempts.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text *ngIf="h5pActivity" [text]="h5pActivity.name" contextLevel="module"
                 [contextInstanceId]="h5pActivity.coursemodule" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/imscp/components/toc/toc.html b/src/addons/mod/imscp/components/toc/toc.html
index af5669a1f..6255e5c4a 100644
--- a/src/addons/mod/imscp/components/toc/toc.html
+++ b/src/addons/mod/imscp/components/toc/toc.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_imscp.toc' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_imscp.toc' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/addons/mod/imscp/pages/index/index.html b/src/addons/mod/imscp/pages/index/index.html
index 3d93da89c..fd8b7e083 100644
--- a/src/addons/mod/imscp/pages/index/index.html
+++ b/src/addons/mod/imscp/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
index 21180d618..5167c12a2 100644
--- a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
+++ b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
@@ -300,7 +300,7 @@
                             <core-user-avatar [user]="student" slot="start" [userId]="student.id" [courseId]="courseId">
                             </core-user-avatar>
                             <ion-label>
-                                <h2>{{ student.fullname }}</h2>
+                                <p class="item-heading">{{ student.fullname }}</p>
                                 <core-progress-bar [progress]="student.bestgrade" a11yText="addon.mod_lesson.grade">
                                 </core-progress-bar>
                             </ion-label>
diff --git a/src/addons/mod/lesson/components/menu-modal/menu-modal.html b/src/addons/mod/lesson/components/menu-modal/menu-modal.html
index 421608bda..4904e7d5f 100644
--- a/src/addons/mod/lesson/components/menu-modal/menu-modal.html
+++ b/src/addons/mod/lesson/components/menu-modal/menu-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ pageInstance?.lesson?.name }}</ion-title>
+        <h2>{{ pageInstance?.lesson?.name }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/addons/mod/lesson/components/password-modal/password-modal.html b/src/addons/mod/lesson/components/password-modal/password-modal.html
index 4996d156f..fe3013504 100644
--- a/src/addons/mod/lesson/components/password-modal/password-modal.html
+++ b/src/addons/mod/lesson/components/password-modal/password-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'core.login.password' | translate }}</ion-title>
+        <h2>{{ 'core.login.password' | translate }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/addons/mod/lesson/pages/index/index.html b/src/addons/mod/lesson/pages/index/index.html
index 664d7ee48..4c5603526 100644
--- a/src/addons/mod/lesson/pages/index/index.html
+++ b/src/addons/mod/lesson/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/lesson/pages/player/player.html b/src/addons/mod/lesson/pages/player/player.html
index bdf332aef..816db0f4e 100644
--- a/src/addons/mod/lesson/pages/player/player.html
+++ b/src/addons/mod/lesson/pages/player/player.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="lesson?.coursemodule"
                 [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="displayMenu || mediaFile" [attr.aria-label]="'addon.mod_lesson.lessonmenu' | translate"
                 (click)="showMenu()">
diff --git a/src/addons/mod/lesson/pages/user-retake/user-retake.html b/src/addons/mod/lesson/pages/user-retake/user-retake.html
index 0684f5507..0145af03c 100644
--- a/src/addons/mod/lesson/pages/user-retake/user-retake.html
+++ b/src/addons/mod/lesson/pages/user-retake/user-retake.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_lesson.detailedstats' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_lesson.detailedstats' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/lti/pages/index/index.html b/src/addons/mod/lti/pages/index/index.html
index eeeadf2ef..bd9a3da32 100644
--- a/src/addons/mod/lti/pages/index/index.html
+++ b/src/addons/mod/lti/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/page/pages/index/index.html b/src/addons/mod/page/pages/index/index.html
index 7e79e8da2..464a81a0b 100644
--- a/src/addons/mod/page/pages/index/index.html
+++ b/src/addons/mod/page/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/quiz/components/navigation-modal/navigation-modal.html b/src/addons/mod/quiz/components/navigation-modal/navigation-modal.html
index 0fae0ca38..7f2b2f447 100644
--- a/src/addons/mod/quiz/components/navigation-modal/navigation-modal.html
+++ b/src/addons/mod/quiz/components/navigation-modal/navigation-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_quiz.quiznavigation' | translate }}</ion-title>
+        <h2>{{ 'addon.mod_quiz.quiznavigation' | translate }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/addons/mod/quiz/components/preflight-modal/preflight-modal.html b/src/addons/mod/quiz/components/preflight-modal/preflight-modal.html
index c45b9eeee..870360c9e 100644
--- a/src/addons/mod/quiz/components/preflight-modal/preflight-modal.html
+++ b/src/addons/mod/quiz/components/preflight-modal/preflight-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ title | translate }}</ion-title>
+        <h2>{{ title | translate }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/addons/mod/quiz/pages/attempt/attempt.html b/src/addons/mod/quiz/pages/attempt/attempt.html
index 58ad1ab4e..e709c561d 100644
--- a/src/addons/mod/quiz/pages/attempt/attempt.html
+++ b/src/addons/mod/quiz/pages/attempt/attempt.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text *ngIf="quiz" [text]="quiz.name" contextLevel="module" [contextInstanceId]="quiz.coursemodule"
                 [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/mod/quiz/pages/index/index.html b/src/addons/mod/quiz/pages/index/index.html
index 24a3fc0de..9fcb5b5c2 100644
--- a/src/addons/mod/quiz/pages/index/index.html
+++ b/src/addons/mod/quiz/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/quiz/pages/player/player.html b/src/addons/mod/quiz/pages/player/player.html
index 4472f7879..d3df9686d 100644
--- a/src/addons/mod/quiz/pages/player/player.html
+++ b/src/addons/mod/quiz/pages/player/player.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text *ngIf="quiz" [text]="quiz.name" contextLevel="module" [contextInstanceId]="quiz.coursemodule"
                 [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" id="addon-mod_quiz-connection-error-button" [hidden]="!autoSaveError"
diff --git a/src/addons/mod/quiz/pages/review/review.html b/src/addons/mod/quiz/pages/review/review.html
index fe8e12505..214c2e0e9 100644
--- a/src/addons/mod/quiz/pages/review/review.html
+++ b/src/addons/mod/quiz/pages/review/review.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_quiz.review' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_quiz.review' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="navigation.length" [attr.aria-label]="'addon.mod_quiz.opentoc' | translate"
@@ -74,7 +74,7 @@
                 </ion-item>
                 <ion-item class="ion-text-wrap" *ngFor="let data of additionalData">
                     <ion-label>
-                        <h2>{{ data.title }}</h2>
+                        <p class="item-heading">{{ data.title }}</p>
                         <core-format-text [component]="component" [componentId]="cmId" [text]="data.content"
                             contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
                         </core-format-text>
diff --git a/src/addons/mod/resource/pages/index/index.html b/src/addons/mod/resource/pages/index/index.html
index d671e4643..0a03b540b 100644
--- a/src/addons/mod/resource/pages/index/index.html
+++ b/src/addons/mod/resource/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/scorm/components/toc/toc.html b/src/addons/mod/scorm/components/toc/toc.html
index 9866e283c..6240aebd5 100644
--- a/src/addons/mod/scorm/components/toc/toc.html
+++ b/src/addons/mod/scorm/components/toc/toc.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_scorm.toc' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_scorm.toc' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/scorm/pages/index/index.html b/src/addons/mod/scorm/pages/index/index.html
index 0e46a4efe..8b0a62177 100644
--- a/src/addons/mod/scorm/pages/index/index.html
+++ b/src/addons/mod/scorm/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/scorm/pages/player/player.html b/src/addons/mod/scorm/pages/player/player.html
index bf33b88fc..f0bbd46b8 100644
--- a/src/addons/mod/scorm/pages/player/player.html
+++ b/src/addons/mod/scorm/pages/player/player.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="showToc && !loadingToc && toc.length" (click)="openToc()"
                 [attr.aria-label]="'addon.mod_scorm.toc' | translate" aria-haspopup="true">
diff --git a/src/addons/mod/survey/pages/index/index.html b/src/addons/mod/survey/pages/index/index.html
index c18b2ebba..e4c9e1717 100644
--- a/src/addons/mod/survey/pages/index/index.html
+++ b/src/addons/mod/survey/pages/index/index.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id"></core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/url/pages/index/index.html b/src/addons/mod/url/pages/index/index.html
index 6d3fc16ea..6b546f69f 100644
--- a/src/addons/mod/url/pages/index/index.html
+++ b/src/addons/mod/url/pages/index/index.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id"></core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/wiki/components/map/map.html b/src/addons/mod/wiki/components/map/map.html
index d5b9aa890..8a818a2f5 100644
--- a/src/addons/mod/wiki/components/map/map.html
+++ b/src/addons/mod/wiki/components/map/map.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.mod_wiki.map' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_wiki.map' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/wiki/pages/edit/edit.html b/src/addons/mod/wiki/pages/edit/edit.html
index 35e4dc684..29534e664 100644
--- a/src/addons/mod/wiki/pages/edit/edit.html
+++ b/src/addons/mod/wiki/pages/edit/edit.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="cmId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="save()" [attr.aria-label]="'core.save' | translate">
diff --git a/src/addons/mod/wiki/pages/index/index.html b/src/addons/mod/wiki/pages/index/index.html
index 2c6edfd8b..fab061635 100644
--- a/src/addons/mod/wiki/pages/index/index.html
+++ b/src/addons/mod/wiki/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
diff --git a/src/addons/mod/workshop/components/phase/phase.html b/src/addons/mod/workshop/components/phase/phase.html
index cbbe51e3b..63ba0446c 100644
--- a/src/addons/mod/workshop/components/phase/phase.html
+++ b/src/addons/mod/workshop/components/phase/phase.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_workshop.userplan' | translate }}</ion-title>
+        <h2>{{ 'addon.mod_workshop.userplan' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/addons/mod/workshop/pages/assessment/assessment.html b/src/addons/mod/workshop/pages/assessment/assessment.html
index b1ef56b06..85a95f37a 100644
--- a/src/addons/mod/workshop/pages/assessment/assessment.html
+++ b/src/addons/mod/workshop/pages/assessment/assessment.html
@@ -3,11 +3,11 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="workshop && workshop.coursemodule"
                 [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end" [hidden]="!evaluating">
             <ion-button fill="clear" (click)="saveEvaluation()" [attr.aria-label]="'core.save' | translate">
                 {{ 'core.save' | translate }}
diff --git a/src/addons/mod/workshop/pages/edit-submission/edit-submission.html b/src/addons/mod/workshop/pages/edit-submission/edit-submission.html
index cf4067cdf..f66fd99d1 100644
--- a/src/addons/mod/workshop/pages/edit-submission/edit-submission.html
+++ b/src/addons/mod/workshop/pages/edit-submission/edit-submission.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.mod_workshop.editsubmission' | translate }}</ion-title>
+        <h1>{{ 'addon.mod_workshop.editsubmission' | translate }}</h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="save()" [attr.aria-label]="'core.save' | translate">
                 {{ 'core.save' | translate }}
diff --git a/src/addons/mod/workshop/pages/index/index.html b/src/addons/mod/workshop/pages/index/index.html
index fded8cdc1..409e997b4 100644
--- a/src/addons/mod/workshop/pages/index/index.html
+++ b/src/addons/mod/workshop/pages/index/index.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <!-- The buttons defined by the component will be added in here. -->
         </ion-buttons>
diff --git a/src/addons/mod/workshop/pages/submission/submission.html b/src/addons/mod/workshop/pages/submission/submission.html
index e04214159..33c542f47 100644
--- a/src/addons/mod/workshop/pages/submission/submission.html
+++ b/src/addons/mod/workshop/pages/submission/submission.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text *ngIf="title" [text]="title" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end" [hidden]="!loaded">
             <ion-button *ngIf="assessmentId && access.assessingallowed" fill="clear" (click)="saveAssessment()"
                 [attr.aria-label]="'core.save' | translate">
diff --git a/src/addons/notes/components/add/add-modal.html b/src/addons/notes/components/add/add-modal.html
index ad401e126..c3fe269d6 100644
--- a/src/addons/notes/components/add/add-modal.html
+++ b/src/addons/notes/components/add/add-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'addon.notes.addnewnote' | translate }}</ion-title>
+        <h2>{{ 'addon.notes.addnewnote' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/addons/notes/pages/list/list.html b/src/addons/notes/pages/list/list.html
index 2b4d264e7..9bf24e43b 100644
--- a/src/addons/notes/pages/list/list.html
+++ b/src/addons/notes/pages/list/list.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'addon.notes.notes' | translate }}</ion-title>
+        <h1>{{ 'addon.notes.notes' | translate }}</h1>
         <ion-buttons slot="end">
         </ion-buttons>
     </ion-toolbar>
@@ -64,7 +64,7 @@
                 <ion-item class="ion-text-wrap">
                     <core-user-avatar [user]="note" [courseId]="courseId" slot="start" *ngIf="!userId"></core-user-avatar>
                     <ion-label>
-                        <h2 *ngIf="!userId">{{note.userfullname}}</h2>
+                        <p class="item-heading" *ngIf="!userId">{{note.userfullname}}</p>
                         <p *ngIf="!note.deleted && !note.offline" slot="end">
                             <span class="ion-text-wrap">{{note.lastmodified | coreDateDayOrTime}}</span>
                         </p>
diff --git a/src/addons/notifications/pages/list/list.html b/src/addons/notifications/pages/list/list.html
index 7eab388e4..2afd03877 100644
--- a/src/addons/notifications/pages/list/list.html
+++ b/src/addons/notifications/pages/list/list.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.notifications.notifications' | translate }}</ion-title>
+        <h1>{{ 'addon.notifications.notifications' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -36,7 +36,7 @@
                     role="presentation" class="core-notification-icon" slot="start">
 
                 <ion-label>
-                    <h2>{{ notification.subject }}</h2>
+                    <p class="item-heading">{{ notification.subject }}</p>
                     <p *ngIf="notification.userfromfullname">{{ notification.userfromfullname }}</p>
                 </ion-label>
                 <ion-note slot="end" class="ion-float-end ion-padding-left ion-text-end">
diff --git a/src/addons/notifications/pages/settings/settings.html b/src/addons/notifications/pages/settings/settings.html
index b8c711b94..efa57cdfd 100644
--- a/src/addons/notifications/pages/settings/settings.html
+++ b/src/addons/notifications/pages/settings/settings.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.notifications.notifications' | translate }}</ion-title>
+        <h1>{{ 'addon.notifications.notifications' | translate }}</h1>
         <ion-buttons slot="end">
         </ion-buttons>
     </ion-toolbar>
diff --git a/src/addons/privatefiles/pages/index/index.html b/src/addons/privatefiles/pages/index/index.html
index 2f145c520..dcac42b7e 100644
--- a/src/addons/privatefiles/pages/index/index.html
+++ b/src/addons/privatefiles/pages/index/index.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/addons/storagemanager/pages/course-storage/course-storage.html b/src/addons/storagemanager/pages/course-storage/course-storage.html
index dc6499dfd..ed63678c3 100644
--- a/src/addons/storagemanager/pages/course-storage/course-storage.html
+++ b/src/addons/storagemanager/pages/course-storage/course-storage.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.storagemanager.managestorage' | translate }}</ion-title>
+        <h1>{{ 'addon.storagemanager.managestorage' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -16,7 +16,7 @@
                 <ion-item class="size ion-text-wrap ion-no-padding" lines="none">
                     <ion-icon name="fas-archive" slot="start" aria-hidden="true"></ion-icon>
                     <ion-label>
-                        <h2 class="ion-text-wrap">{{ 'addon.storagemanager.storageused' | translate }}</h2>
+                        <p class="item-heading ion-text-wrap">{{ 'addon.storagemanager.storageused' | translate }}</p>
                     </ion-label>
                     <p slot="end" class="ion-text-end">{{ totalSize | coreBytesToSize }}</p>
                     <ion-button slot="end" (click)="deleteForCourse()" [disabled]="totalSize == 0">
@@ -32,7 +32,7 @@
                 <ion-card-header>
                     <ion-item class="ion-no-padding">
                         <ion-label>
-                            <h2 class="ion-text-wrap">{{ section.name }}</h2>
+                            <p class="item-heading ion-text-wrap">{{ section.name }}</p>
                         </ion-label>
                         <p slot="end" class="ion-text-end">{{ section.totalSize | coreBytesToSize }}</p>
                         <ion-button slot="end" (click)="deleteForSection(section)">
diff --git a/src/addons/storagemanager/pages/course-storage/course-storage.scss b/src/addons/storagemanager/pages/course-storage/course-storage.scss
index c1c3a4bf0..4e413a248 100644
--- a/src/addons/storagemanager/pages/course-storage/course-storage.scss
+++ b/src/addons/storagemanager/pages/course-storage/course-storage.scss
@@ -4,7 +4,7 @@
         padding-top: 8px;
         padding-bottom: 8px;
     }
-    ion-card.section h2 {
+    ion-card.section .item-heading {
         font-weight: bold;
         font-size: 1.2rem;
     }
diff --git a/src/addons/storagemanager/pages/courses-storage/courses-storage.html b/src/addons/storagemanager/pages/courses-storage/courses-storage.html
index c76e8c07f..17f41b5d7 100644
--- a/src/addons/storagemanager/pages/courses-storage/courses-storage.html
+++ b/src/addons/storagemanager/pages/courses-storage/courses-storage.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'addon.storagemanager.managestorage' | translate }}</ion-title>
+        <h1>{{ 'addon.storagemanager.managestorage' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -30,9 +30,11 @@
                 <ion-list>
                     <ion-item *ngFor="let course of downloadedCourses" class="course">
                         <ion-label class="ion-text-wrap">
-                            <h2 *ngIf="course.displayname">{{ course.displayname }}</h2>
-                            <h2 *ngIf="!course.displayname">{{ course.fullname }}</h2>
-                            <h3 *ngIf="course.isDownloading">{{ 'core.downloading' | translate }}</h3>
+                            <p class="item-heading" *ngIf="course.displayname">{{ course.displayname }}</p>
+                            <p class="item-heading" *ngIf="!course.displayname">{{ course.fullname }}</p>
+                            <p class="item-heading item-heading-secondary" *ngIf="course.isDownloading">
+                                {{ 'core.downloading' | translate }}
+                            </p>
                         </ion-label>
                         <p slot="end" class="ion-text-end">{{ course.totalSize | coreBytesToSize }}</p>
                         <ion-button slot="end" (click)="deleteCourse(course)" [disabled]="course.isDownloading">
diff --git a/src/addons/storagemanager/pages/courses-storage/courses-storage.scss b/src/addons/storagemanager/pages/courses-storage/courses-storage.scss
index 92372be0b..1861562ad 100644
--- a/src/addons/storagemanager/pages/courses-storage/courses-storage.scss
+++ b/src/addons/storagemanager/pages/courses-storage/courses-storage.scss
@@ -2,11 +2,11 @@
 
 :host {
     ion-item.course {
-        h2 {
+        .item-heading {
             font-weight: bold;
         }
 
-        h3 {
+        .item-heading.item-heading-secondary {
             color: $subdued-text-color;
         }
     }
diff --git a/src/core/components/file/core-file.html b/src/core/components/file/core-file.html
index 4b0dd5522..d3e199421 100644
--- a/src/core/components/file/core-file.html
+++ b/src/core/components/file/core-file.html
@@ -3,7 +3,7 @@
         <img [src]="fileIcon" alt="" role="presentation" />
     </ion-thumbnail>
     <ion-label>
-        <h2>{{fileName}}</h2>
+        <p class="item-heading">{{fileName}}</p>
         <p *ngIf="fileSizeReadable">{{ fileSizeReadable }}</p>
         <p *ngIf="showTime">{{ timemodified * 1000 | coreFormatDate }}</p>
     </ion-label>
diff --git a/src/core/components/local-file/core-local-file.html b/src/core/components/local-file/core-local-file.html
index 1fb756998..ed990252c 100644
--- a/src/core/components/local-file/core-local-file.html
+++ b/src/core/components/local-file/core-local-file.html
@@ -6,7 +6,7 @@
 
         <ion-label>
             <!-- File name and edit button (if editable). -->
-            <h3 *ngIf="!editMode">{{fileName}}</h3>
+            <p class="item-heading" *ngIf="!editMode">{{fileName}}</p>
             <!-- More data about the file. -->
             <p *ngIf="size && !editMode">{{ size }}</p>
             <p *ngIf="timemodified && !editMode">{{ timemodified }}</p>
diff --git a/src/core/features/comments/components/add/add.html b/src/core/features/comments/components/add/add.html
index cb848f344..45d8f93e6 100644
--- a/src/core/features/comments/components/add/add.html
+++ b/src/core/features/comments/components/add/add.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'core.comments.addcomment' | translate }}</ion-title>
+        <h2>{{ 'core.comments.addcomment' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/core/features/comments/pages/viewer/viewer.html b/src/core/features/comments/pages/viewer/viewer.html
index e53d03497..7f48bfdd6 100644
--- a/src/core/features/comments/pages/viewer/viewer.html
+++ b/src/core/features/comments/pages/viewer/viewer.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" [contextLevel]="contextLevel" [contextInstanceId]="instanceId" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button *ngIf="canDeleteComments" slot="end" fill="clear" (click)="toggleDelete()"
                 [attr.aria-label]="'core.toggledelete' | translate">
@@ -47,7 +47,7 @@
             <ion-item class="ion-text-wrap">
                 <core-user-avatar [user]="offlineComment" slot="start"></core-user-avatar>
                 <ion-label>
-                    <h2>{{ offlineComment.fullname }}</h2>
+                    <p class="item-heading">{{ offlineComment.fullname }}</p>
                     <p>
                         <ion-icon name="fas-clock" aria-hidden="true"></ion-icon> {{ 'core.notsent' | translate }}
                     </p>
@@ -70,7 +70,7 @@
             <ion-item class="ion-text-wrap">
                 <core-user-avatar [user]="comment" slot="start"></core-user-avatar>
                 <ion-label>
-                    <h2>{{ comment.fullname }}</h2>
+                    <p class="item-heading">{{ comment.fullname }}</p>
                     <p *ngIf="!comment.deleted">{{ comment.timecreated * 1000 | coreFormatDate: 'strftimerecentfull' }}</p>
                     <p *ngIf="comment.deleted">
                         <ion-icon name="fas-trash" aria-hidden="true"></ion-icon> <span class="ion-text-wrap">
diff --git a/src/core/features/contentlinks/components/choose-site-modal/choose-site-modal.html b/src/core/features/contentlinks/components/choose-site-modal/choose-site-modal.html
index a23667308..173e993fb 100644
--- a/src/core/features/contentlinks/components/choose-site-modal/choose-site-modal.html
+++ b/src/core/features/contentlinks/components/choose-site-modal/choose-site-modal.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.contentlinks.chooseaccount' | translate }}</ion-title>
+        <h2>{{ 'core.contentlinks.chooseaccount' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
@@ -27,7 +27,7 @@
                         onError="this.src='assets/img/user-avatar.png'">
                 </ion-avatar>
                 <ion-label>
-                    <h2>{{site.fullName}}</h2>
+                    <p class="item-heading">{{site.fullName}}</p>
                     <p><core-format-text [text]="site.siteName" clean="true" [siteId]="site.id"></core-format-text></p>
                     <p>{{site.siteUrl}}</p>
                 </ion-label>
diff --git a/src/core/features/course/components/module/core-course-module.html b/src/core/features/course/components/module/core-course-module.html
index 4035c3865..c8b4fb3c7 100644
--- a/src/core/features/course/components/module/core-course-module.html
+++ b/src/core/features/course/components/module/core-course-module.html
@@ -17,11 +17,11 @@
                 class="core-module-icon">
 
             <ion-label class="core-module-title">
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="module.handlerData.title" contextLevel="module" [contextInstanceId]="module.id"
                         [courseId]="courseId" [attr.aria-label]="module.handlerData.a11yTitle + ', ' + modNameTranslated">
                     </core-format-text>
-                </h2>
+                </p>
                 <ion-badge
                     *ngIf="module.handlerData.extraBadge"
                     [color]="module.handlerData.extraBadgeColor"
diff --git a/src/core/features/course/components/section-selector/section-selector.html b/src/core/features/course/components/section-selector/section-selector.html
index 8d7a051ee..c30817397 100644
--- a/src/core/features/course/components/section-selector/section-selector.html
+++ b/src/core/features/course/components/section-selector/section-selector.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title id="core-course-section-selector-label">{{ 'core.course.sections' | translate }}</ion-title>
+        <h2 id="core-course-section-selector-label">{{ 'core.course.sections' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
@@ -18,8 +18,10 @@
 
                 <ion-icon name="fas-folder" slot="start" aria-hidden="true"></ion-icon>
                 <ion-label>
-                    <h2><core-format-text [text]="section.name" contextLevel="course" [contextInstanceId]="course?.id">
-                    </core-format-text></h2>
+                    <p class="item-heading">
+                        <core-format-text [text]="section.name" contextLevel="course" [contextInstanceId]="course?.id">
+                        </core-format-text>
+                    </p>
                     <core-progress-bar *ngIf="section.progress >= 0" [progress]="section.progress"
                         a11yText="core.course.aria:sectionprogress">
                     </core-progress-bar>
diff --git a/src/core/features/course/components/tag-area/core-course-tag-area.html b/src/core/features/course/components/tag-area/core-course-tag-area.html
index 4373c44c4..c6a412e44 100644
--- a/src/core/features/course/components/tag-area/core-course-tag-area.html
+++ b/src/core/features/course/components/tag-area/core-course-tag-area.html
@@ -2,7 +2,7 @@
     button>
     <ion-icon name="fas-graduation-cap" slot="start" aria-hidden="true"></ion-icon>
     <ion-label>
-        <h2>{{ item.courseName }}</h2>
+        <p class="item-heading">{{ item.courseName }}</p>
         <p *ngIf="item.categoryName">{{ 'core.category' | translate }}: {{ item.categoryName }}</p>
     </ion-label>
 </ion-item>
diff --git a/src/core/features/course/pages/index/index.html b/src/core/features/course/pages/index/index.html
index 558d1cc76..592166aad 100644
--- a/src/core/features/course/pages/index/index.html
+++ b/src/core/features/course/pages/index/index.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="course" [contextInstanceId]="course?.id"></core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
diff --git a/src/core/features/course/pages/list-mod-type/list-mod-type.html b/src/core/features/course/pages/list-mod-type/list-mod-type.html
index 9d369d50a..831d6939d 100644
--- a/src/core/features/course/pages/list-mod-type/list-mod-type.html
+++ b/src/core/features/course/pages/list-mod-type/list-mod-type.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/course/pages/preview/preview.html b/src/core/features/course/pages/preview/preview.html
index 02223dce5..dadee07f0 100644
--- a/src/core/features/course/pages/preview/preview.html
+++ b/src/core/features/course/pages/preview/preview.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="course?.fullname" contextLevel="course" [contextInstanceId]="course?.id"></core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -55,7 +55,7 @@
                         [courseId]="isEnrolled ? course.id : null">
                     </core-user-avatar>
                     <ion-label>
-                        <h2>{{contact.fullname}}</h2>
+                        <p class="item-heading">{{contact.fullname}}</p>
                     </ion-label>
                 </ion-item>
                 <core-spacer></core-spacer>
@@ -83,7 +83,7 @@
             <div *ngIf="!isEnrolled" detail="false">
                 <ion-item class="ion-text-wrap" *ngFor="let instance of selfEnrolInstances">
                     <ion-label>
-                        <h2>{{ instance.name }}</h2>
+                        <p class="item-heading">{{ instance.name }}</p>
                         <ion-button expand="block" class="ion-margin-top" (click)="selfEnrolClicked(instance.id)">
                             {{ 'core.courses.enrolme' | translate }}
                         </ion-button>
diff --git a/src/core/features/course/pages/unsupported-module/unsupported-module.html b/src/core/features/course/pages/unsupported-module/unsupported-module.html
index 8067085b8..417963a21 100644
--- a/src/core/features/course/pages/unsupported-module/unsupported-module.html
+++ b/src/core/features/course/pages/unsupported-module/unsupported-module.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="module?.name" contextLevel="module" [contextInstanceId]="module?.id" [courseId]="courseId">
             </core-format-text>
-        </ion-title>
+        </h1>
 
         <ion-buttons slot="end">
             <core-context-menu>
diff --git a/src/core/features/courses/components/course-progress/core-courses-course-progress.html b/src/core/features/courses/components/course-progress/core-courses-course-progress.html
index 02f3d39e6..2327c187b 100644
--- a/src/core/features/courses/components/course-progress/core-courses-course-progress.html
+++ b/src/core/features/courses/components/course-progress/core-courses-course-progress.html
@@ -24,13 +24,13 @@
                     </core-format-text>
                 </span>
             </p>
-            <h2>
+            <p class="item-heading">
                 <ion-icon name="fas-star" *ngIf="course.isfavourite" [attr.aria-label]="'core.courses.favourite' | translate">
                 </ion-icon>
                 <span class="sr-only" *ngIf="course.isfavourite">{{ 'core.courses.aria:favourite' | translate }}</span>
                 <span class="sr-only">{{ 'core.courses.aria:coursename' | translate }}</span>
                 <core-format-text [text]="course.fullname" contextLevel="course" [contextInstanceId]="course.id"></core-format-text>
-            </h2>
+            </p>
         </ion-label>
 
         <div class="core-button-spinner" *ngIf="downloadCourseEnabled && !courseOptionMenuEnabled && showDownload" slot="end">
diff --git a/src/core/features/courses/components/course-progress/course-progress.scss b/src/core/features/courses/components/course-progress/course-progress.scss
index 4d59d8515..f0a4cda3e 100644
--- a/src/core/features/courses/components/course-progress/course-progress.scss
+++ b/src/core/features/courses/components/course-progress/course-progress.scss
@@ -48,7 +48,7 @@
                 margin: 5px 0;
                 flex-grow: 1;
 
-                h2 ion-icon {
+                .item-heading ion-icon {
                     margin-right: 4px;
                     color: var(--core-star-color);
                 }
@@ -99,7 +99,7 @@
             .core-course-title {
                 margin: 3px 0;
 
-                h2 ion-icon {
+                .item-heading ion-icon {
                     margin-right: 2px;
                 }
 
diff --git a/src/core/features/courses/components/self-enrol-password/self-enrol-password.html b/src/core/features/courses/components/self-enrol-password/self-enrol-password.html
index b1c6c8b3b..d0d755fbb 100644
--- a/src/core/features/courses/components/self-enrol-password/self-enrol-password.html
+++ b/src/core/features/courses/components/self-enrol-password/self-enrol-password.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'core.courses.selfenrolment' | translate }}</ion-title>
+        <h2>{{ 'core.courses.selfenrolment' | translate }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="close()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/core/features/courses/pages/available-courses/available-courses.html b/src/core/features/courses/pages/available-courses/available-courses.html
index 8de7b899f..07aebce00 100644
--- a/src/core/features/courses/pages/available-courses/available-courses.html
+++ b/src/core/features/courses/pages/available-courses/available-courses.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.courses.availablecourses' | translate }}</ion-title>
+        <h1>{{ 'core.courses.availablecourses' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/courses/pages/categories/categories.html b/src/core/features/courses/pages/categories/categories.html
index 269573fc2..dece679a1 100644
--- a/src/core/features/courses/pages/categories/categories.html
+++ b/src/core/features/courses/pages/categories/categories.html
@@ -3,10 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             <core-format-text [text]="title" contextLevel="coursecat" [contextInstanceId]="currentCategory && currentCategory!.id">
             </core-format-text>
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/courses/pages/my-courses/my-courses.html b/src/core/features/courses/pages/my-courses/my-courses.html
index 6e7d6f8a6..dcb81531f 100644
--- a/src/core/features/courses/pages/my-courses/my-courses.html
+++ b/src/core/features/courses/pages/my-courses/my-courses.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.courses.mycourses' | translate }}</ion-title>
+        <h1>{{ 'core.courses.mycourses' | translate }}</h1>
 
         <ion-buttons slot="end">
             <core-navbar-buttons>
diff --git a/src/core/features/courses/pages/search/search.html b/src/core/features/courses/pages/search/search.html
index e57de06df..fb33940a9 100644
--- a/src/core/features/courses/pages/search/search.html
+++ b/src/core/features/courses/pages/search/search.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.courses.searchcourses' | translate }}</ion-title>
+        <h1>{{ 'core.courses.searchcourses' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/emulator/components/capture-media/capture-media.html b/src/core/features/emulator/components/capture-media/capture-media.html
index d3d3825e3..e44f37942 100644
--- a/src/core/features/emulator/components/capture-media/capture-media.html
+++ b/src/core/features/emulator/components/capture-media/capture-media.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title *ngIf="title">{{ title | translate }}</ion-title>
+        <h1 *ngIf="title">{{ title | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="cancel()">{{ 'core.cancel' | translate }}</ion-button>
diff --git a/src/core/features/grades/pages/course/course.html b/src/core/features/grades/pages/course/course.html
index 7b99e353a..bd5b09d97 100644
--- a/src/core/features/grades/pages/course/course.html
+++ b/src/core/features/grades/pages/course/course.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.grades.grades' | translate }}</ion-title>
+        <h1>{{ 'core.grades.grades' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/grades/pages/courses/courses.html b/src/core/features/grades/pages/courses/courses.html
index 4a4ef30bf..c977b811f 100644
--- a/src/core/features/grades/pages/courses/courses.html
+++ b/src/core/features/grades/pages/courses/courses.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.grades.grades' | translate }}</ion-title>
+        <h1>{{ 'core.grades.grades' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/grades/pages/grade/grade.html b/src/core/features/grades/pages/grade/grade.html
index a5431de85..4b3198ee2 100644
--- a/src/core/features/grades/pages/grade/grade.html
+++ b/src/core/features/grades/pages/grade/grade.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.grades.grade' | translate }}</ion-title>
+        <h1>{{ 'core.grades.grade' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/login/components/site-help/site-help.html b/src/core/features/login/components/site-help/site-help.html
index ecbc3ad2a..17f803afe 100644
--- a/src/core/features/login/components/site-help/site-help.html
+++ b/src/core/features/login/components/site-help/site-help.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'core.login.help' | translate }}</ion-title>
+        <h2>{{ 'core.login.help' | translate }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeHelp()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/core/features/login/pages/change-password/change-password.html b/src/core/features/login/pages/change-password/change-password.html
index a2704e19d..4ac4410a5 100644
--- a/src/core/features/login/pages/change-password/change-password.html
+++ b/src/core/features/login/pages/change-password/change-password.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.changepassword' | translate }}</ion-title>
+        <h1>{{ 'core.login.changepassword' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="showHelp()" [attr.aria-label]="'core.help' | translate">
diff --git a/src/core/features/login/pages/credentials/credentials.html b/src/core/features/login/pages/credentials/credentials.html
index e124b7293..26230ae7d 100644
--- a/src/core/features/login/pages/credentials/credentials.html
+++ b/src/core/features/login/pages/credentials/credentials.html
@@ -4,7 +4,7 @@
             <ion-back-button></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.login' | translate }}</ion-title>
+        <h1>{{ 'core.login.login' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate">
diff --git a/src/core/features/login/pages/email-signup/email-signup.html b/src/core/features/login/pages/email-signup/email-signup.html
index 8649fc066..928bdbce5 100644
--- a/src/core/features/login/pages/email-signup/email-signup.html
+++ b/src/core/features/login/pages/email-signup/email-signup.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.newaccount' | translate }}</ion-title>
+        <h1>{{ 'core.login.newaccount' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="authInstructions" (click)="showAuthInstructions()"
@@ -169,7 +169,7 @@
             <!-- Other categories. -->
             <ng-container *ngFor="let category of categories">
                 <ion-item-divider class="ion-text-wrap">
-                    <ion-label><h3>{{ category.name }}</h3></ion-label>
+                    <ion-label><p class="item-heading">{{ category.name }}</p></ion-label>
                 </ion-item-divider>
                 <core-user-profile-field *ngFor="let field of category.fields" [field]="field" [edit]="true" [signup]="true"
                     registerAuth="email" [form]="signupForm"></core-user-profile-field>
diff --git a/src/core/features/login/pages/forgotten-password/forgotten-password.html b/src/core/features/login/pages/forgotten-password/forgotten-password.html
index c25d7e423..ddf156f93 100644
--- a/src/core/features/login/pages/forgotten-password/forgotten-password.html
+++ b/src/core/features/login/pages/forgotten-password/forgotten-password.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.passwordforgotten' | translate }}</ion-title>
+        <h1>{{ 'core.login.passwordforgotten' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/login/pages/reconnect/reconnect.html b/src/core/features/login/pages/reconnect/reconnect.html
index a0b93d75f..e97773e35 100644
--- a/src/core/features/login/pages/reconnect/reconnect.html
+++ b/src/core/features/login/pages/reconnect/reconnect.html
@@ -4,7 +4,7 @@
             <ion-back-button></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.reconnect' | translate }}</ion-title>
+        <h1>{{ 'core.login.reconnect' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content class="ion-padding" (keydown)="keyDown($event)" (keyup)="keyUp($event)">
@@ -19,9 +19,9 @@
             <img *ngIf="!logoUrl" src="assets/img/login_logo.png" role="presentation" alt="">
         </div>
 
-        <h6 *ngIf="siteName" class="ion-padding core-sitename">
+        <p *ngIf="siteName" class="ion-padding core-sitename">
             <core-format-text [text]="siteName" [filter]="false"></core-format-text>
-        </h6>
+        </p>
         <p class="core-siteurl">{{siteUrl}}</p>
 
         <ion-item *ngIf="!isLoggedOut" class="ion-text-center core-login-reconnect-warning" lines="none">
diff --git a/src/core/features/login/pages/site-policy/site-policy.html b/src/core/features/login/pages/site-policy/site-policy.html
index 4fdefb8e6..4d870ab9a 100644
--- a/src/core/features/login/pages/site-policy/site-policy.html
+++ b/src/core/features/login/pages/site-policy/site-policy.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.policyagreement' | translate }}</ion-title>
+        <h1>{{ 'core.login.policyagreement' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/login/pages/site/site.html b/src/core/features/login/pages/site/site.html
index 4556094d4..6540d53d4 100644
--- a/src/core/features/login/pages/site/site.html
+++ b/src/core/features/login/pages/site/site.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.login.connecttomoodle' | translate }}</ion-title>
+        <h1>{{ 'core.login.connecttomoodle' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate">
@@ -128,7 +128,7 @@
             <img src="assets/icon/icon.png" *ngIf="!site.imageurl" class="core-login-default-icon" alt="" role="presentation">
         </ion-thumbnail>
         <ion-label>
-            <h2 *ngIf="site.title" class="ion-text-wrap">{{site.title}}</h2>
+            <p *ngIf="site.title" class="item-heading ion-text-wrap">{{site.title}}</p>
             <p *ngIf="site.noProtocolUrl">{{site.noProtocolUrl}}</p>
             <p *ngIf="site.location">{{site.location}}</p>
         </ion-label>
diff --git a/src/core/features/login/pages/sites/sites.html b/src/core/features/login/pages/sites/sites.html
index c7a7bdaf2..83c1bfb20 100644
--- a/src/core/features/login/pages/sites/sites.html
+++ b/src/core/features/login/pages/sites/sites.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.settings.sites' | translate }}</ion-title>
+        <h1>{{ 'core.settings.sites' | translate }}</h1>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" *ngIf="sites && sites.length > 0" (click)="toggleDelete()"
@@ -25,7 +25,7 @@
                     alt="{{ 'core.pictureof' | translate:{$a: site.fullName} }}" onError="this.src='assets/img/user-avatar.png'">
             </ion-avatar>
             <ion-label>
-                <h2>{{site.fullName}}</h2>
+                <p class="item-heading">{{site.fullName}}</p>
                 <p><core-format-text [text]="site.siteName" clean="true" [siteId]="site.id"></core-format-text></p>
                 <p>{{site.siteUrl}}</p>
             </ion-label>
diff --git a/src/core/features/mainmenu/pages/home/home.html b/src/core/features/mainmenu/pages/home/home.html
index bc15bcf82..4ef1d95a9 100644
--- a/src/core/features/mainmenu/pages/home/home.html
+++ b/src/core/features/mainmenu/pages/home/home.html
@@ -3,11 +3,10 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-
-        <ion-title>
+        <h1>
             <core-format-text [text]="siteName" contextLevel="system" [contextInstanceId]="0"></core-format-text>
             <img src="assets/img/toolbar_logo.png" class="core-header-logo" [alt]="siteName">
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
         </ion-buttons>
     </ion-toolbar>
diff --git a/src/core/features/mainmenu/pages/home/home.scss b/src/core/features/mainmenu/pages/home/home.scss
index 628c2536f..7c7901130 100644
--- a/src/core/features/mainmenu/pages/home/home.scss
+++ b/src/core/features/mainmenu/pages/home/home.scss
@@ -1,19 +1,19 @@
 @import "~theme/globals";
 
 @if ($core-dashboard-logo) {
-    .toolbar-title-default.md .title-default .core-header-logo {
+    .in-toolbar.md h1 .core-header-logo {
         max-height: $toolbar-md-height - 24;
     }
 
-    .toolbar-title-default.ios .title-default .core-header-logo {
+    .in-toolbar.ios h1 .core-header-logo {
         max-height: $toolbar-ios-height - 24;
     }
 
-    .toolbar-title-default .title-default core-format-text {
+    .in-toolbar h1 core-format-text {
         display: none;
     }
 } @else {
-    .toolbar-title-default .core-header-logo {
+    .in-toolbar h1 .core-header-logo {
         display: none;
     }
 }
diff --git a/src/core/features/mainmenu/pages/more/more.html b/src/core/features/mainmenu/pages/more/more.html
index 7811f7d7a..1ff87ac11 100644
--- a/src/core/features/mainmenu/pages/more/more.html
+++ b/src/core/features/mainmenu/pages/more/more.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title><core-format-text [text]="siteName" contextLevel="system" [contextInstanceId]="0"></core-format-text></ion-title>
+        <h1><core-format-text [text]="siteName" contextLevel="system" [contextInstanceId]="0"></core-format-text></h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -28,7 +28,7 @@
             (click)="openHandler(handler)" [attr.aria-label]="handler.title | translate" detail="true" detail="true">
             <ion-icon [name]="handler.icon" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ handler.title | translate}}</h2>
+                <p class="item-heading">{{ handler.title | translate}}</p>
             </ion-label>
             <ion-badge slot="end" *ngIf="handler.showBadge" [hidden]="handler.loading || !handler.badge" aria-hidden="true">
                 {{handler.badge}}
@@ -43,54 +43,54 @@
                 [capture]="item.type == 'app'" [inApp]="item.type == 'inappbrowser'" class="core-moremenu-customitem" detail="true">
                 <ion-icon [name]="item.icon" slot="start" aria-hidden="true"></ion-icon>
                 <ion-label>
-                    <h2>{{item.label}}</h2>
+                    <p class="item-heading">{{item.label}}</p>
                 </ion-label>
             </ion-item>
             <ion-item button *ngIf="item.type == 'embedded'" (click)="openItem(item)" [attr.aria-label]="item.label"
                 class="core-moremenu-customitem" detail="true">
                 <ion-icon [name]="item.icon" slot="start" aria-hidden="true"></ion-icon>
                 <ion-label>
-                    <h2>{{item.label}}</h2>
+                    <p class="item-heading">{{item.label}}</p>
                 </ion-label>
             </ion-item>
         </ng-container>
         <ion-item button *ngIf="showScanQR" (click)="scanQR()" detail="true">
             <ion-icon name="fas-qrcode" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ 'core.scanqr' | translate }}</h2>
+                <p class="item-heading">{{ 'core.scanqr' | translate }}</p>
             </ion-label>
         </ion-item>
         <ion-item button *ngIf="showWeb && siteInfo" [href]="siteInfo.siteurl" core-link autoLogin="yes"
             [attr.aria-label]="'core.mainmenu.website' | translate" detail="true">
             <ion-icon name="fas-globe" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ 'core.mainmenu.website' | translate }}</h2>
+                <p class="item-heading">{{ 'core.mainmenu.website' | translate }}</p>
             </ion-label>
         </ion-item>
         <ion-item button *ngIf="showHelp" [href]="docsUrl" core-link autoLogin="no"
             [attr.aria-label]="'core.mainmenu.help' | translate" detail="true">
             <ion-icon name="far-life-ring" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ 'core.mainmenu.help' | translate }}</h2>
+                <p class="item-heading">{{ 'core.mainmenu.help' | translate }}</p>
             </ion-label>
         </ion-item>
         <ion-item button (click)="openPreferences()" [attr.aria-label]="'core.settings.preferences' | translate" detail="true">
             <ion-icon name="fas-wrench" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ 'core.settings.preferences' | translate }}</h2>
+                <p class="item-heading">{{ 'core.settings.preferences' | translate }}</p>
             </ion-label>
         </ion-item>
         <ion-item button (click)="logout()" [attr.aria-label]="logoutLabel | translate" detail="true">
             <ion-icon name="fas-sign-out-alt" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ logoutLabel | translate }}</h2>
+                <p class="item-heading">{{ logoutLabel | translate }}</p>
             </ion-label>
         </ion-item>
         <core-spacer></core-spacer>
         <ion-item button (click)="openSettings()" [attr.aria-label]="'core.settings.appsettings' | translate" detail="true">
             <ion-icon name="fas-cogs" slot="start" aria-hidden="true"></ion-icon>
             <ion-label>
-                <h2>{{ 'core.settings.appsettings' | translate }}</h2>
+                <p class="item-heading">{{ 'core.settings.appsettings' | translate }}</p>
             </ion-label>
         </ion-item>
     </ion-list>
diff --git a/src/core/features/rating/components/ratings/ratings-modal.html b/src/core/features/rating/components/ratings/ratings-modal.html
index a0a48dfa5..450a1435a 100644
--- a/src/core/features/rating/components/ratings/ratings-modal.html
+++ b/src/core/features/rating/components/ratings/ratings-modal.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ 'core.rating.ratings' | translate }}</ion-title>
+        <h2>{{ 'core.rating.ratings' | translate }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon slot="icon-only" name="fas-times" aria-hidden="true"></ion-icon>
diff --git a/src/core/features/settings/pages/about/about.html b/src/core/features/settings/pages/about/about.html
index bd012d54b..c0fca1aee 100644
--- a/src/core/features/settings/pages/about/about.html
+++ b/src/core/features/settings/pages/about/about.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             {{ 'core.settings.about' | translate}}
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 
diff --git a/src/core/features/settings/pages/deviceinfo/deviceinfo.html b/src/core/features/settings/pages/deviceinfo/deviceinfo.html
index a1fa11b74..b8bea0208 100644
--- a/src/core/features/settings/pages/deviceinfo/deviceinfo.html
+++ b/src/core/features/settings/pages/deviceinfo/deviceinfo.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             {{ 'core.settings.deviceinfo' | translate }}
-        </ion-title>
+        </h1>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="copyInfo()" [attr.aria-label]="'core.settings.copyinfo' | translate">
                 <ion-icon slot="icon-only" name="fas-clipboard" color="light" aria-hidden="true"></ion-icon>
diff --git a/src/core/features/settings/pages/general/general.html b/src/core/features/settings/pages/general/general.html
index c16a1e80c..faaded554 100644
--- a/src/core/features/settings/pages/general/general.html
+++ b/src/core/features/settings/pages/general/general.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.settings.general' | translate }}</ion-title>
+        <h1>{{ 'core.settings.general' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/settings/pages/index/index.html b/src/core/features/settings/pages/index/index.html
index d66b2cf89..d56fe5e76 100644
--- a/src/core/features/settings/pages/index/index.html
+++ b/src/core/features/settings/pages/index/index.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.settings.appsettings' | translate }}</ion-title>
+        <h1>{{ 'core.settings.appsettings' | translate }}</h1>
         <ion-buttons slot="end"></ion-buttons>
     </ion-toolbar>
 </ion-header>
diff --git a/src/core/features/settings/pages/licenses/licenses.html b/src/core/features/settings/pages/licenses/licenses.html
index 6bbd42b32..c6d1949a8 100644
--- a/src/core/features/settings/pages/licenses/licenses.html
+++ b/src/core/features/settings/pages/licenses/licenses.html
@@ -4,7 +4,7 @@
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
 
-        <ion-title>{{ 'core.settings.opensourcelicenses' | translate }}</ion-title>
+        <h1>{{ 'core.settings.opensourcelicenses' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -20,14 +20,14 @@
         <ng-container *ngIf="!error">
             <ion-item *ngFor="let license of licenses" class="ion-text-wrap">
                 <ion-label>
-                    <h2>
+                    <p class="item-heading">
                         <a *ngIf="license.repository" [href]="license.repository" core-link
                             auto-login="no">{{ license.name }}</a>
                         <ng-container *ngIf="!license.repository">{{ license.name }}</ng-container> - {{ license.version }}
-                    </h2>
-                    <h3 *ngIf="license.publisher">
+                    </p>
+                    <p class="item-heading" *ngIf="license.publisher">
                         {{ 'core.settings.publisher' | translate }}{{ 'core.labelsep' | translate }} {{ license.publisher }}
-                    </h3>
+                    </p>
                     <p>{{ 'core.settings.license' | translate }}{{ 'core.labelsep' | translate }} {{ license.licenses }}</p>
                     <p><a *ngIf="license.url" [href]="license.url" core-link auto-login="no">{{ license.url }}</a></p>
                     <p><a *ngIf="license.email" [href]="'mailto:' + license.email" core-link
diff --git a/src/core/features/settings/pages/site/site.html b/src/core/features/settings/pages/site/site.html
index a422e7c92..1bd209ba2 100644
--- a/src/core/features/settings/pages/site/site.html
+++ b/src/core/features/settings/pages/site/site.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.settings.preferences' | translate}}</ion-title>
+        <h1>{{ 'core.settings.preferences' | translate}}</h1>
         <ion-buttons slot="end">
         </ion-buttons>
     </ion-toolbar>
diff --git a/src/core/features/settings/pages/space-usage/space-usage.html b/src/core/features/settings/pages/space-usage/space-usage.html
index 5a8cec5b0..54e988183 100644
--- a/src/core/features/settings/pages/space-usage/space-usage.html
+++ b/src/core/features/settings/pages/space-usage/space-usage.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.settings.spaceusage' | translate }}</ion-title>
+        <h1>{{ 'core.settings.spaceusage' | translate }}</h1>
         <ion-buttons slot="end">
             <core-navbar-buttons>
                 <ion-button (click)="showInfo()" [attr.aria-label]="'core.info' | translate">
@@ -20,9 +20,9 @@
     <core-loading [hideUntil]="loaded">
         <ion-item *ngFor="let site of sites" [attr.aria-current]="site.id == currentSiteId ? 'page' : 'false'">
             <ion-label class="ion-text-wrap">
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="site.siteName" clean="true" [siteId]="site.id"></core-format-text>
-                </h2>
+                </p>
                 <p class="ion-text-wrap">{{ site.fullName }}</p>
                 <p>{{ site.siteUrl }}</p>
             </ion-label>
diff --git a/src/core/features/settings/pages/synchronization/synchronization.html b/src/core/features/settings/pages/synchronization/synchronization.html
index e05cbf635..7b59bee6e 100644
--- a/src/core/features/settings/pages/synchronization/synchronization.html
+++ b/src/core/features/settings/pages/synchronization/synchronization.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.settings.synchronization' | translate }}</ion-title>
+        <h1>{{ 'core.settings.synchronization' | translate }}</h1>
         <ion-buttons slot="end">
             <core-navbar-buttons>
                 <ion-button (click)="showInfo()" [attr.aria-label]="'core.info' | translate">
@@ -32,9 +32,9 @@
         </ion-item-divider>
         <ion-item *ngFor="let site of sites" [attr.aria-current]="site.id == currentSiteId ? 'page' : 'false'" class="ion-text-wrap">
             <ion-label>
-                <h2>
+                <p class="item-heading">
                     <core-format-text [text]="site.siteName" clean="true" [siteId]="site.id"></core-format-text>
-                </h2>
+                </p>
                 <p>{{ site.fullName }}</p>
                 <p>{{ site.siteUrl }}</p>
             </ion-label>
diff --git a/src/core/features/sharedfiles/components/list-modal/list-modal.html b/src/core/features/sharedfiles/components/list-modal/list-modal.html
index 7b0fbb7b7..f022309dd 100644
--- a/src/core/features/sharedfiles/components/list-modal/list-modal.html
+++ b/src/core/features/sharedfiles/components/list-modal/list-modal.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h2>{{ title }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/core/features/sharedfiles/pages/choose-site/choose-site.html b/src/core/features/sharedfiles/pages/choose-site/choose-site.html
index 22ca776ab..23a7b4e54 100644
--- a/src/core/features/sharedfiles/pages/choose-site/choose-site.html
+++ b/src/core/features/sharedfiles/pages/choose-site/choose-site.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.sharedfiles.sharedfiles' | translate }}</ion-title>
+        <h1>{{ 'core.sharedfiles.sharedfiles' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -22,7 +22,7 @@
                         onError="this.src='assets/img/user-avatar.png'">
                 </ion-avatar>
                 <ion-label>
-                    <h2>{{site.fullName}}</h2>
+                    <p class="item-heading">{{site.fullName}}</p>
                     <p><core-format-text clean="true" [text]="site.siteName" [siteId]="site.id"></core-format-text></p>
                     <p>{{site.siteUrl}}</p>
                 </ion-label>
diff --git a/src/core/features/sharedfiles/pages/list/list.html b/src/core/features/sharedfiles/pages/list/list.html
index 1302829d8..02ed894b9 100644
--- a/src/core/features/sharedfiles/pages/list/list.html
+++ b/src/core/features/sharedfiles/pages/list/list.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/siteplugins/pages/module-index/module-index.html b/src/core/features/siteplugins/pages/module-index/module-index.html
index 42db91816..b8136da60 100644
--- a/src/core/features/siteplugins/pages/module-index/module-index.html
+++ b/src/core/features/siteplugins/pages/module-index/module-index.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
 
         <ion-buttons slot="end">
             <!-- If the site plugin defines some buttons using core-nav-buttons, they will be added here. -->
diff --git a/src/core/features/siteplugins/pages/plugin-page/plugin-page.html b/src/core/features/siteplugins/pages/plugin-page/plugin-page.html
index 7283cb478..ebc4634fb 100644
--- a/src/core/features/siteplugins/pages/plugin-page/plugin-page.html
+++ b/src/core/features/siteplugins/pages/plugin-page/plugin-page.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="title">{{ title | translate }}</ion-title>
+        <h1 *ngIf="title">{{ title | translate }}</h1>
 
         <ion-buttons slot="end">
             <!-- If the site plugin defines some buttons using core-nav-buttons, they will be added here. -->
diff --git a/src/core/features/tag/pages/index-area/index-area.html b/src/core/features/tag/pages/index-area/index-area.html
index 109284260..2d1727416 100644
--- a/src/core/features/tag/pages/index-area/index-area.html
+++ b/src/core/features/tag/pages/index-area/index-area.html
@@ -3,9 +3,9 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>
+        <h1>
             {{ 'core.tag.itemstaggedwith' | translate: { $a: {tagarea: areaNameKey | translate, tag: tagName} } }}
-        </ion-title>
+        </h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/tag/pages/index/index.html b/src/core/features/tag/pages/index/index.html
index da105551b..542b064af 100644
--- a/src/core/features/tag/pages/index/index.html
+++ b/src/core/features/tag/pages/index/index.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.tag.tag' | translate }}: {{ tagName }}</ion-title>
+        <h1>{{ 'core.tag.tag' | translate }}: {{ tagName }}</h1>
     </ion-toolbar>
 </ion-header>
 
diff --git a/src/core/features/tag/pages/search/search.html b/src/core/features/tag/pages/search/search.html
index ce1af02b7..e4b26e7bd 100644
--- a/src/core/features/tag/pages/search/search.html
+++ b/src/core/features/tag/pages/search/search.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ 'core.tag.searchtags' | translate }}</ion-title>
+        <h1>{{ 'core.tag.searchtags' | translate }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/user/pages/about/about.html b/src/core/features/user/pages/about/about.html
index 276186cdc..463fc451d 100644
--- a/src/core/features/user/pages/about/about.html
+++ b/src/core/features/user/pages/about/about.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="title">{{ title }}</ion-title>
+        <h1 *ngIf="title">{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/core/features/user/pages/participants/participants.html b/src/core/features/user/pages/participants/participants.html
index 895e55e7c..64e449fa5 100644
--- a/src/core/features/user/pages/participants/participants.html
+++ b/src/core/features/user/pages/participants/participants.html
@@ -36,7 +36,7 @@
 
                     <ion-label>
                         <ng-container *ngIf="!searchQuery">
-                            <h2>{{ participant.fullname }}</h2>
+                            <p class="item-heading">{{ participant.fullname }}</p>
                             <p *ngIf="participant.lastcourseaccess">
                                 <strong>{{ 'core.lastaccess' | translate }}: </strong>
                                 {{ participant.lastcourseaccess | coreTimeAgo }}
@@ -48,10 +48,10 @@
                         </ng-container>
 
                         <ng-container *ngIf="searchQuery">
-                            <h2>
+                            <p class="item-heading">
                                 <core-format-text [text]="participant.fullname" [highlight]="searchQuery" [filter]="false">
                                 </core-format-text>
-                            </h2>
+                            </p>
                         </ng-container>
                     </ion-label>
 
diff --git a/src/core/features/user/pages/profile/profile.html b/src/core/features/user/pages/profile/profile.html
index ca5949996..b575e6e3d 100644
--- a/src/core/features/user/pages/profile/profile.html
+++ b/src/core/features/user/pages/profile/profile.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title *ngIf="title">{{ title }}</ion-title>
+        <h1 *ngIf="title">{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
@@ -57,7 +57,7 @@
                 [attr.aria-label]="'core.user.details' | translate" detail="true">
                 <ion-icon name="fa-user" slot="start" aria-hidden="true"></ion-icon>
                 <ion-label>
-                    <h2>{{ 'core.user.details' | translate }}</h2>
+                    <p class="item-heading">{{ 'core.user.details' | translate }}</p>
                 </ion-label>
             </ion-item>
             <ion-item class="ion-text-center core-loading-handlers" *ngIf="isLoadingHandlers">
@@ -69,7 +69,7 @@
                 [attr.aria-label]="handler.title | translate" detail="true">
                 <ion-icon *ngIf="handler.icon" [name]="handler.icon" slot="start" aria-hidden="true"></ion-icon>
                 <ion-label>
-                    <h2>{{ handler.title | translate }}</h2>
+                    <p class="item-heading">{{ handler.title | translate }}</p>
                 </ion-label>
             </ion-item>
 
diff --git a/src/core/features/viewer/components/image/image.html b/src/core/features/viewer/components/image/image.html
index 04da60dc1..371f95368 100644
--- a/src/core/features/viewer/components/image/image.html
+++ b/src/core/features/viewer/components/image/image.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ title }}</ion-title>
+        <h2>{{ title }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/core/features/viewer/components/qr-scanner/qr-scanner.html b/src/core/features/viewer/components/qr-scanner/qr-scanner.html
index c42c63baf..bb77c94b5 100644
--- a/src/core/features/viewer/components/qr-scanner/qr-scanner.html
+++ b/src/core/features/viewer/components/qr-scanner/qr-scanner.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ title }}</ion-title>
+        <h2>{{ title }}</h2>
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                 <ion-icon name="fas-times" slot="icon-only" aria-hidden=true></ion-icon>
diff --git a/src/core/features/viewer/components/text/text.html b/src/core/features/viewer/components/text/text.html
index 6bff2f20c..cda8ec03e 100644
--- a/src/core/features/viewer/components/text/text.html
+++ b/src/core/features/viewer/components/text/text.html
@@ -1,6 +1,6 @@
 <ion-header>
     <ion-toolbar>
-        <ion-title>{{ title }}</ion-title>
+        <h2>{{ title }}</h2>
 
         <ion-buttons slot="end">
             <ion-button fill="clear" (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
diff --git a/src/core/features/viewer/pages/iframe/iframe.html b/src/core/features/viewer/pages/iframe/iframe.html
index 67f23d2e9..64a5161d3 100644
--- a/src/core/features/viewer/pages/iframe/iframe.html
+++ b/src/core/features/viewer/pages/iframe/iframe.html
@@ -3,7 +3,7 @@
         <ion-buttons slot="start">
             <ion-back-button [text]="'core.back' | translate"></ion-back-button>
         </ion-buttons>
-        <ion-title>{{ title }}</ion-title>
+        <h1>{{ title }}</h1>
     </ion-toolbar>
 </ion-header>
 <ion-content>
diff --git a/src/theme/globals.mixins.scss b/src/theme/globals.mixins.scss
index 28049c24b..3cddfea7e 100644
--- a/src/theme/globals.mixins.scss
+++ b/src/theme/globals.mixins.scss
@@ -150,7 +150,7 @@
     h1 {
         font-size: 3rem;
     }
-    h2 {
+    h2, .item-heading {
         font-size: 2.8rem;
     }
     h3 {
@@ -226,7 +226,7 @@
     }
 
     .ion-text-wrap ion-label {
-        h2, p {
+        .item-heading, h2, p {
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
diff --git a/src/theme/globals.variables.scss b/src/theme/globals.variables.scss
index ead1d7b21..f21119486 100644
--- a/src/theme/globals.variables.scss
+++ b/src/theme/globals.variables.scss
@@ -269,6 +269,8 @@ $z-index-overlay-wrapper: 10;
 $toolbar-background: $brand-color !default;
 $toolbar-color: get_contrast_color($toolbar-background) !default;
 $toolbar-button-image-size: 44px !default;
+$toolbar-height-md: 56px !default;
+$toolbar-height-ios: 54px !default;
 
 // Bottom tab bar.
 $bottom-tabs-background: $white !default;
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index 967e2b05e..4daacb2f2 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -49,6 +49,50 @@
 .font-lg { font-size: 1.7rem; }
 .font-sm { font-size: 1.2rem; }
 
+// Headings.
+.item-heading {
+    font-size: 16px !important;
+    color: initial !important;
+}
+
+ion-header h1,
+ion-header h2 {
+    display: block;
+    transform: translateZ(0);
+    color: initial;
+    margin: 0;
+    width: 100%;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    pointer-events: auto;
+}
+
+ion-app.md ion-header h1,
+ion-app.md ion-header h2 {
+    padding-inline: 20px;
+    font-size: 20px;
+    font-weight: 500;
+    letter-spacing: .0125em;
+}
+
+ion-app.ios ion-header h1,
+ion-app.ios ion-header h2 {
+    top: 0;
+    left: 0;
+    padding-inline: 90px;
+    position: absolute;
+    display: block;
+    text-align: center;
+    width: 100%;
+    transform: translateZ(0);
+    font-size: 17px;
+    font-weight: 600;
+    line-height: #{$toolbar-height-ios};
+    box-sizing: border-box;
+    pointer-events: none;
+}
+
 // Correctly inherit ion-text-wrap onto labels.
 ion-item.ion-text-wrap ion-label {
     white-space: normal !important;
@@ -75,6 +119,14 @@ ion-item.ion-text-wrap ion-label {
 }
 
 // Ionic toolbar.
+ion-app.md ion-toolbar {
+    --min-height: #{$toolbar-height-md};
+}
+
+ion-app.ios ion-toolbar {
+    --min-height: #{$toolbar-height-ios};
+}
+
 ion-toolbar ion-back-button,
 ion-toolbar .in-toolbar.button-clear {
     --color: var(--core-header-toolbar-color);
@@ -382,8 +434,8 @@ ion-item img.core-module-icon[slot="start"] {
     margin-left: 32px;
 }
 
-ion-toolbar ion-title img.core-bar-button-image,
-ion-toolbar ion-title .core-bar-button-image img {
+ion-toolbar h1 img.core-bar-button-image,
+ion-toolbar h1 .core-bar-button-image img {
     padding: 0;
     width: var(--core-header-toolbar-button-image-size);
     height: var(--core-header-toolbar-button-image-size);