Index: lams_central/web/css/components.css
===================================================================
diff -u -ref5bed2f62785ca5cdb668d9f1e8fbf4f0256dff -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_central/web/css/components.css	(.../components.css)	(revision ef5bed2f62785ca5cdb668d9f1e8fbf4f0256dff)
+++ lams_central/web/css/components.css	(.../components.css)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -429,16 +429,18 @@
 	overflow: hidden;
 }
 
-.component-page-wrapper #lesson-name {
-	font-size: 2rem;
-	margin-left: 1.8rem;
+.component-page-wrapper button.no-decoration {
+	background-color: inherit;
+	border: none;
 }
 
+.component-page-wrapper button.no-decoration:focus {
+	border: thin solid var(--bs-secondary);
+}
+
 .component-page-wrapper .component-page-content > header .sidebar-toggle-button {
 	font-size: 2rem;
-	margin-top: .3rem;
 	color: var(--bs-blue);
-	cursor: pointer;
 }
 
 .component-page-wrapper .component-page-content {
Index: lams_learning/web/css/components-learner.css
===================================================================
diff -u -ref5bed2f62785ca5cdb668d9f1e8fbf4f0256dff -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_learning/web/css/components-learner.css	(.../components-learner.css)	(revision ef5bed2f62785ca5cdb668d9f1e8fbf4f0256dff)
+++ lams_learning/web/css/components-learner.css	(.../components-learner.css)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -1,3 +1,7 @@
+.component-page-wrapper #lesson-name {
+    margin-left: 1rem;
+}
+
 .component-page-wrapper .component-sidebar {
     top: 6rem;
     left: -72rem;
@@ -15,7 +19,6 @@
     font-size: 1.5rem;
     align-self: end;
     color: var(--bs-primary);
-    cursor: pointer;
 }
 
 .component-page-wrapper .component-sidebar #progress-bar-items {
Index: lams_learning/web/includes/javascript/learnerPage.js
===================================================================
diff -u -r966fe6dea3c644eaf336f305c960861b7e62fd73 -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_learning/web/includes/javascript/learnerPage.js	(.../learnerPage.js)	(revision 966fe6dea3c644eaf336f305c960861b7e62fd73)
+++ lams_learning/web/includes/javascript/learnerPage.js	(.../learnerPage.js)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -1,6 +1,14 @@
 
 // refresh progress bar on first/next activity load
 function initLearnerPage(toolSessionId, userId) {
+    $('.component-page-wrapper .sidebar-toggle-button').click(function () {
+        let topToggleButton = $('.component-page-wrapper .component-page-content > header .sidebar-toggle-button'),
+            isExpanded = topToggleButton.attr('aria-expanded') == 'true';
+        topToggleButton.attr('aria-expanded', !isExpanded)
+            .children('i').toggleClass(topToggleButton.data('closed-class')).toggleClass(topToggleButton.data('opened-class'));
+        $('.component-page-wrapper .component-sidebar').toggleClass('active').attr('aria-expanded', !isExpanded);
+    });
+
     $.ajax({
         url : LAMS_URL + 'learning/learner/getLearnerProgress.do',
         data : {
@@ -15,20 +23,24 @@
 
             for (var activityIndex = 0; activityIndex < result.activities.length; activityIndex++) {
                 let activityData = result.activities[activityIndex],
-                    activityItem = $('<li>').text(activityData.name).appendTo(progressBarItems);
+                    activityItem = $('<li>').attr('role', 'navigation menubaritem').appendTo(progressBarItems);
                 if (activityData.status === 0) {
-                    activityItem.addClass('progress-bar-item-current')
+                    activityItem.addClass('progress-bar-item-current').text(activityData.name)
                         .prepend('<i class="fa-solid fa-fw fa-circle progress-bar-icon">');
                 } else if (activityData.status === 1) {
                     activityItem.addClass('progress-bar-item-complete')
-                        .prepend('<i class="fa-solid fa-fw fa-check progress-bar-icon">');
+                        .prepend('<i class="fa-solid fa-fw fa-check progress-bar-icon">')
                     if (activityData.url) {
-                        activityItem.addClass('progress-bar-item-openable').click(function () {
-                            window.open(activityData.url, "_blank");
+                        let activityLink = $('<a>').text(activityData.name).attr({
+                            'target' : '_blank',
+                            'href' : activityData.url,
+                            'role' : 'navigation',
+                            'title' : 'Open completed activty "' + activityData.url + '"'
                         });
+                        activityItem.addClass('progress-bar-item-openable').append(activityLink);
                     }
                 } else {
-                    activityItem.addClass('progress-bar-item-incomplete')
+                    activityItem.addClass('progress-bar-item-incomplete').text(activityData.name)
                         .prepend('<i class="fa-regular fa-fw fa-circle progress-bar-icon">');
                 }
             }
Index: lams_monitoring/web/css/components-monitoring.css
===================================================================
diff -u -ref5bed2f62785ca5cdb668d9f1e8fbf4f0256dff -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_monitoring/web/css/components-monitoring.css	(.../components-monitoring.css)	(revision ef5bed2f62785ca5cdb668d9f1e8fbf4f0256dff)
+++ lams_monitoring/web/css/components-monitoring.css	(.../components-monitoring.css)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -48,6 +48,10 @@
 	width: calc(100% - 12px);
 }
 
+.component-page-wrapper #lesson-name {
+	margin-left: 1.8rem;
+}
+
 body.component #sequenceInfoDialog {
 	cursor: pointer;
 }
Index: lams_monitoring/web/monitor.jsp
===================================================================
diff -u -r72bf0041a18e7e902404c65e55e167bf6ff84269 -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_monitoring/web/monitor.jsp	(.../monitor.jsp)	(revision 72bf0041a18e7e902404c65e55e167bf6ff84269)
+++ lams_monitoring/web/monitor.jsp	(.../monitor.jsp)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -594,7 +594,7 @@
 
 		<div class="component-page-content monitoring-page-content active">
 			<header class="d-flex justify-content-between">
-				<p id="lesson-name"><c:out value="${lesson.lessonName}"/></p>
+				<h1 id="lesson-name"><c:out value="${lesson.lessonName}"/></h1>
 				<div class="top-menu">
 					<div id="sequenceSearchPhraseContainer" class="input-group">
 						<input id="sequenceSearchPhrase" type="search" class="form-control" placeholder="<fmt:message key='label.monitoring.search.learners' />...">
Index: lams_tool_nb/web/WEB-INF/tags/PageLearner.tag
===================================================================
diff -u -ref5bed2f62785ca5cdb668d9f1e8fbf4f0256dff -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_tool_nb/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision ef5bed2f62785ca5cdb668d9f1e8fbf4f0256dff)
+++ lams_tool_nb/web/WEB-INF/tags/PageLearner.tag	(.../PageLearner.tag)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -12,7 +12,16 @@
 
 <lams:html>
     <lams:head>
-        <title><fmt:message key="activity.title"/></title>
+        <title>LAMS ::
+            <c:choose>
+                <c:when test="${empty title}">
+                    <fmt:message key="activity.title"/>
+                </c:when>
+                <c:otherwise>
+                    <c:out value="${title}" />
+                </c:otherwise>
+            </c:choose>
+        </title>
 
         <link rel="icon" type="image/x-icon" href="<lams:LAMSURL/>images/svg/lamsv5_logo.svg">
         <link rel="stylesheet" href="<lams:LAMSURL/>css/bootstrap5.custom.css">
@@ -30,12 +39,6 @@
             var LAMS_URL = '<lams:LAMSURL/>';
             $(document).ready(function (){
                 initLearnerPage(${toolSessionID});
-
-                $('.component-page-wrapper .sidebar-toggle-button').click(function () {
-                    let topToggleButton = $('.component-page-wrapper .component-page-content > header .sidebar-toggle-button');
-                    topToggleButton.toggleClass(topToggleButton.data('closed-class')).toggleClass(topToggleButton.data('opened-class'));
-                    $('.component-page-wrapper .component-sidebar').toggleClass('active');
-                });
             });
         </script>
     </lams:head>
@@ -45,41 +48,39 @@
         <div class="component-page-content">
             <header class="d-flex justify-content-between">
                 <div class="d-flex">
-                    <i class="sidebar-toggle-button fa-solid fa-fw fa-bars pt-1"
-                       data-closed-class="fa-bars" data-opened-class="fa-bars-staggered"></i>
-                    <p id="lesson-name"></p>
+                    <button class="sidebar-toggle-button no-decoration"
+                            data-closed-class="fa-bars" data-opened-class="fa-bars-staggered"
+                            aria-labelledby="progress-bar-title" aria-expanded="false">
+                        <i class="fa-solid fa-fw fa-bars" aria-hidden="true"></i>
+                    </button>
+                    <h1 id="lesson-name"></h1>
                 </div>
                 <div class="top-menu">
                 </div>
             </header>
 
-            <div class="card">
+            <main class="m-3">
                 <c:if test="${not empty title}">
-                    <div class="card-header">
-                        <h5><c:out value="${title}" escapeXml="true" /></h5>
-                    </div>
+                    <h3 class="mb-3" role="banner"><c:out value="${title}" escapeXml="true" /></h3>
                 </c:if>
 
-                <div class="card-body">
-                    <main>
-                        <jsp:doBody/>
-                    </main>
-                </div>
-            </div>
+                <jsp:doBody/>
+            </main>
 
 
         </div>
 
-        <!-- Progress Bar Modal Start -->
-        <div class="component-sidebar">
-            <i class="fa-solid fa-xmark sidebar-toggle-button"></i>
-            <a href="/" title="Return to index page" class="lams-logo">
-                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo"/>
+        <nav class="component-sidebar" aria-label="Side menu" aria-expanded="false">
+            <button class="sidebar-toggle-button no-decoration" aria-labelledby="progress-bar-title">
+                <i class="fa-solid fa-xmark"></i>
+            </button>
+            <a href="/" title="Return to index page" class="lams-logo" role="navigation">
+                <img src="<lams:LAMSURL/>images/svg/lamsv5_logo.svg" alt="LAMS logo" aria-hidden="true"/>
             </a>
-            <h6 class="sidebar-title"><i class="fa-solid fa-bars-progress"></i>&nbsp;Progress bar</h6>
+            <h6 class="sidebar-title"><i class="fa-solid fa-bars-progress"></i>&nbsp;<span id="progress-bar-title">Progress bar</span></h6>
             <ul id="progress-bar-items">
             </ul>
-        </div>
+        </nav>
 
 
     </div>
Index: lams_tool_nb/web/learnerContent.jsp
===================================================================
diff -u -ref5bed2f62785ca5cdb668d9f1e8fbf4f0256dff -re820169ce662888b003dbe47ef24a48cf19d124c
--- lams_tool_nb/web/learnerContent.jsp	(.../learnerContent.jsp)	(revision ef5bed2f62785ca5cdb668d9f1e8fbf4f0256dff)
+++ lams_tool_nb/web/learnerContent.jsp	(.../learnerContent.jsp)	(revision e820169ce662888b003dbe47ef24a48cf19d124c)
@@ -3,86 +3,87 @@
 <%@ include file="/includes/taglibs.jsp"%>
 
 <lams:PageLearner toolSessionID="${nbLearnerForm.toolSessionID}" title="${nbLearnerForm.title}">
-	<script>
-		checkNextGateActivity('finishButton', '${nbLearnerForm.toolSessionID}', '', function(){
-			submitForm('finish');
-		});
+    <script>
+        checkNextGateActivity('finishButton', '${nbLearnerForm.toolSessionID}', '', function(){
+            submitForm('finish');
+        });
 
-		function disableFinishButton() {
-			var finishButton = document.getElementById("finishButton");
-			if (finishButton != null) {
-				finishButton.disabled = true;
-			}
-		}
+        function disableFinishButton() {
+            var finishButton = document.getElementById("finishButton");
+            if (finishButton != null) {
+                finishButton.disabled = true;
+            }
+        }
 
-		function submitForm(methodName) {
-			var f = document.getElementById('nbLearnerForm');
-			f.action = methodName + ".do";
-			f.submit();
-		}
-	</script>
+        function submitForm(methodName) {
+            var f = document.getElementById('nbLearnerForm');
+            f.action = methodName + ".do";
+            f.submit();
+        }
+    </script>
 
 
-	<c:out value="${nbLearnerForm.basicContent}" escapeXml="false" />
+    <p role="region">
+        <c:out value="${nbLearnerForm.basicContent}" escapeXml="false" />
+    </p>
 
+    <form:form modelAttribute="nbLearnerForm" target="_self" onsubmit="disableFinishButton();" id="nbLearnerForm">
+        <form:hidden path="mode" />
+        <form:hidden path="toolSessionID" />
 
-	<form:form modelAttribute="nbLearnerForm" target="_self" onsubmit="disableFinishButton();" id="nbLearnerForm">
-		<form:hidden path="mode" />
-		<form:hidden path="toolSessionID" />
+        <c:if test="${userFinished and reflectOnActivity}">
+            <div class="card">
+                <div class="card-body">
+                    <p class="fst-italic">
+                        <lams:out value="${reflectInstructions}" escapeHtml="true" />
+                    </p>
+                    <p class="mt-5">
+                        <c:choose>
+                            <c:when test="${empty reflectEntry}">
+                                <fmt:message key="message.no.reflection.available" />
+                            </c:when>
+                            <c:otherwise>
+                                <lams:out escapeHtml="true" value="${reflectEntry}" />
+                            </c:otherwise>
+                        </c:choose>
+                    </p>
+                </div>
+            </div>
 
-		<c:if test="${userFinished and reflectOnActivity}">
-			<div class="card">
-				<div class="card-body">
-					<p class="fst-italic">
-						<lams:out value="${reflectInstructions}" escapeHtml="true" />
-					</p>
-					<p class="mt-5">
-						<c:choose>
-							<c:when test="${empty reflectEntry}">
-								<fmt:message key="message.no.reflection.available" />
-							</c:when>
-							<c:otherwise>
-								<lams:out escapeHtml="true" value="${reflectEntry}" />
-							</c:otherwise>
-						</c:choose>
-					</p>
-				</div>
-			</div>
 
+        </c:if>
 
-		</c:if>
+        <c:if test="${allowComments}">
+            <hr/>
+            <lams:Comments toolSessionId="${nbLearnerForm.toolSessionID}"
+                           toolSignature="<%=NoticeboardConstants.TOOL_SIGNATURE%>" likeAndDislike="${likeAndDislike}"
+                           anonymous="${anonymous}" />
+        </c:if>
 
-		<c:if test="${allowComments}">
-			<hr/>
-			<lams:Comments toolSessionId="${nbLearnerForm.toolSessionID}"
-						   toolSignature="<%=NoticeboardConstants.TOOL_SIGNATURE%>" likeAndDislike="${likeAndDislike}"
-						   anonymous="${anonymous}" />
-		</c:if>
+        <c:if test="${not nbLearnerForm.readOnly}">
+            <div class="activity-bottom-buttons">
+                <c:choose>
+                    <c:when test="${reflectOnActivity}">
+                        <button class="btn btn-primary" onclick="submitForm('reflect')">
+                            <fmt:message key="button.continue" />
+                        </button>
+                    </c:when>
+                    <c:otherwise>
+                        <button id="finishButton" class="btn btn-primary">
+                            <c:choose>
+                                <c:when test="${isLastActivity}">
+                                    <fmt:message key="button.submit" />
+                                </c:when>
+                                <c:otherwise>
+                                    <fmt:message key="button.finish" />
+                                </c:otherwise>
+                            </c:choose>
+                        </button>
+                    </c:otherwise>
+                </c:choose>
+            </div>
 
-		<c:if test="${not nbLearnerForm.readOnly}">
-			<div class="activity-bottom-buttons">
-				<c:choose>
-					<c:when test="${reflectOnActivity}">
-						<button class="btn btn-primary" onclick="submitForm('reflect')">
-							<fmt:message key="button.continue" />
-						</button>
-					</c:when>
-					<c:otherwise>
-						<button id="finishButton" class="btn btn-primary">
-							<c:choose>
-								<c:when test="${isLastActivity}">
-									<fmt:message key="button.submit" />
-								</c:when>
-								<c:otherwise>
-									<fmt:message key="button.finish" />
-								</c:otherwise>
-							</c:choose>
-						</button>
-					</c:otherwise>
-				</c:choose>
-			</div>
+        </c:if>
 
-		</c:if>
-
-	</form:form>
+    </form:form>
 </lams:PageLearner>
\ No newline at end of file