diff --git a/apps/dnet-is-application/src/main/java/eu/dnetlib/is/main/MainController.java b/apps/dnet-is-application/src/main/java/eu/dnetlib/is/main/MainController.java
new file mode 100644
index 00000000..87448aef
--- /dev/null
+++ b/apps/dnet-is-application/src/main/java/eu/dnetlib/is/main/MainController.java
@@ -0,0 +1,14 @@
+package eu.dnetlib.is.main;
+
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.ModelMap;
+import org.springframework.web.bind.annotation.GetMapping;
+
+@Controller
+public class MainController {
+
+	@GetMapping("/main")
+	public void vocabularies(final ModelMap map) {
+
+	}
+}
diff --git a/apps/dnet-is-application/src/main/resources/static/index.html b/apps/dnet-is-application/src/main/resources/static/index.html
index 69d666fe..3a6c20c5 100644
--- a/apps/dnet-is-application/src/main/resources/static/index.html
+++ b/apps/dnet-is-application/src/main/resources/static/index.html
@@ -2,37 +2,8 @@
 <html>
 
 	<head>
-		<title>Information Service</title>
-		<link rel="stylesheet" href="common/css/bootstrap.cerulean.min.css" />
-		<link rel="stylesheet" href="common/css/fontawesome-all.min.css" />
+		<title>OpenAIRE IS Tools</title>
+		<meta http-equiv="refresh" content="0; URL='./main'" />
 	</head>
-	
-	<style>
-		td {
-			vertical-align: middle !important;
-		}
-	</style>
-	
-	<body>
-		<div class="container-fluid">
-			<div class="row">	
-				<div class="col">
-					<h1>Information Service</h1>
-					<hr />
-					<ul>
-						<li>
-							<a href="./vocabularies">Vocabulary Editor</a>
-						</li>
-					</ul>
-
-				</div>
-			</div>
-		</div>
-		
-	</body>
-	
-	<script src="common/js/jquery.min.js"></script>
-	<script src="common/js/popper.min.js"></script>
-	<script src="common/js/bootstrap.min.js"></script>
 
 </html>
\ No newline at end of file
diff --git a/apps/dnet-is-application/src/main/resources/templates/fragments/mainParts.html b/apps/dnet-is-application/src/main/resources/templates/fragments/mainParts.html
new file mode 100644
index 00000000..b2d81062
--- /dev/null
+++ b/apps/dnet-is-application/src/main/resources/templates/fragments/mainParts.html
@@ -0,0 +1,56 @@
+<!DOCTYPE HTML>
+
+<html>
+	<head th:fragment="htmlHeader(pageTitle)">
+		<title th:text="|OpenAIRE Tools - ${pageTitle}|"></title>
+		<link rel="stylesheet" href="common/css/bootstrap.cerulean.min.css" />
+		<link rel="stylesheet" href="common/css/fontawesome-all.min.css" />
+	
+		<style>
+			td {
+				vertical-align: middle !important;
+			}
+			label {
+				font-weight: bold;
+			}
+		</style>
+	</head>
+
+	<body>
+		<th:block th:fragment="mainMenu(pageTitle)">
+			<nav class="navbar navbar-expand-lg navbar-light bg-light">
+				<a class="navbar-brand" href="/main">OpenAIRE Tools</a>
+				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown">
+					<span class="navbar-toggler-icon"></span>
+				</button>
+				<div class="collapse navbar-collapse" id="navbarNavDropdown">
+					<ul class="navbar-nav">
+						<li class="nav-item active">
+							<a class="nav-link" href="./main">Home <span class="sr-only">(current)</span></a>
+						</li>
+						<li class="nav-item dropdown">
+							<a class="nav-link dropdown-toggle" href="javascript:void(0)" data-toggle="dropdown">Resources</a>
+							<div class="dropdown-menu">
+								<a class="dropdown-item" href="./vocabularies">Vocabularies</a>
+								<a class="dropdown-item" href="./contexts">Contexts</a>
+								<a class="dropdown-item" href="./transformationRules">Transformation rules</a>
+							</div>
+						</li>
+					</ul>
+				</div>
+			</nav>
+			
+			<h1 class="ml-3 mb-4 mt-3" th:text="${pageTitle}"></h1>
+		
+		</th:block>
+	
+	</body>
+
+	<th:block th:fragment="scripts">
+		<script src="common/js/jquery.min.js"></script>
+		<script src="common/js/popper.min.js"></script>
+		<script src="common/js/bootstrap.min.js"></script>
+		<script src="common/js/angular.min.js"></script>
+	</th:block>
+	
+</html>
\ No newline at end of file
diff --git a/apps/dnet-is-application/src/main/resources/templates/main.html b/apps/dnet-is-application/src/main/resources/templates/main.html
new file mode 100644
index 00000000..7ab95f32
--- /dev/null
+++ b/apps/dnet-is-application/src/main/resources/templates/main.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+
+	<head th:replace="fragments/mainParts.html :: htmlHeader('Homepage')"></head>
+	
+	<body>
+	
+		<nav th:replace="fragments/mainParts.html :: mainMenu('Homepage')"></nav>
+
+	</body>
+	
+	<th:block th:replace="fragments/mainParts.html :: scripts"></th:block>
+	
+</html>
\ No newline at end of file
diff --git a/apps/dnet-is-application/src/main/resources/templates/vocabularies.html b/apps/dnet-is-application/src/main/resources/templates/vocabularies.html
index f727cbc1..4bf5b99d 100644
--- a/apps/dnet-is-application/src/main/resources/templates/vocabularies.html
+++ b/apps/dnet-is-application/src/main/resources/templates/vocabularies.html
@@ -1,30 +1,18 @@
 <!DOCTYPE html>
 <html>
 
-	<head>
-		<title>Information Service - Vocabularies</title>
-		<link rel="stylesheet" href="common/css/bootstrap.cerulean.min.css" />
-		<link rel="stylesheet" href="common/css/fontawesome-all.min.css" />
-	</head>
-	
-	<style>
-		td {
-			vertical-align: middle !important;
-		}
-		label {
-			font-weight: bold;
-		}
-		
-	</style>
+	<head th:replace="fragments/mainParts.html :: htmlHeader('Vocabularies')"></head>
 	
 	<body ng-app="vocabulariesApp" ng-controller="vocabulariesController">
+	
+		<nav th:replace="fragments/mainParts.html :: mainMenu('Vocabularies')"></nav>
+	
 		<div class="container-fluid">
 			<div class="row">	
 				<div class="col">
-					<h1>Information Service - Vocabularies</h1>
-					<hr />
+					
 					<p>
-						<a href="javascript:void(0)" data-toggle="modal" data-target="#editVocabularyModal" ng-click="prepareNewVoc()">create a new vocabulary</a>
+						<button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#editVocabularyModal" ng-click="prepareNewVoc()">create a new vocabulary</button>
 					</p>
 					<p ng-show="vocabularies.length > 0">
 						<input type="text" class="form-control form-control-sm" ng-model="vocFilter" placeholder="Filter..."/>
@@ -97,10 +85,7 @@
 			
 	</body>
 	
-	<script src="common/js/jquery.min.js"></script>
-	<script src="common/js/popper.min.js"></script>
-	<script src="common/js/bootstrap.min.js"></script>
-	<script src="common/js/angular.min.js"></script>
+	<th:block th:replace="fragments/mainParts.html :: scripts"></th:block>
 
 	<script src="js/vocabularies.js"></script>
 </html>
\ No newline at end of file
diff --git a/apps/dnet-is-application/src/main/resources/templates/vocabularyEditor.html b/apps/dnet-is-application/src/main/resources/templates/vocabularyEditor.html
index 1487e66c..7baa71ce 100644
--- a/apps/dnet-is-application/src/main/resources/templates/vocabularyEditor.html
+++ b/apps/dnet-is-application/src/main/resources/templates/vocabularyEditor.html
@@ -1,21 +1,8 @@
 <!DOCTYPE html>
 <html>
 
-	<head>
-		<title>Information Service - Vocabulary</title>
-		<link rel="stylesheet" href="common/css/bootstrap.cerulean.min.css" />
-		<link rel="stylesheet" href="common/css/fontawesome-all.min.css" />
-	</head>
-	
-	<style>
-		td {
-			vertical-align: middle !important;
-		}
-		label {
-			font-weight: bold;
-		}
-	</style>	
-	
+	<head th:replace="fragments/mainParts.html :: htmlHeader('Vocabulary Editor')"></head>
+
 	<script th:inline="javascript">
 		/*<![CDATA[*/
 		function vocId() { return /*[[${vocId}]]*/ ''; }
@@ -24,19 +11,22 @@
 	
 	
 	<body ng-app="vocabularyApp" ng-controller="vocabularyController">
+	
+		<nav th:replace="fragments/mainParts.html :: mainMenu('Vocabulary Editor')"></nav>
+	
 		<div class="container-fluid">
 			<div class="row">	
 				<div class="col">
-					<h1>Information Service - Vocabulary Editor</h1>
-					
 					<p>
-						<b>ID: </b><span th:text="${vocId}"></span><br />
-						<b>Name: </b><span th:text="${vocName}"></span><br />
+						<b>Vocabulary ID: </b><span th:text="${vocId}"></span><br />
+						<b>Vocabulary Name: </b><span th:text="${vocName}"></span><br />
 						<b>Description: </b><span th:text="${vocDesc}"></span>
 					</p>
-					<hr />
 					<p>
-						<a href="javascript:void(0)" data-toggle="modal" data-target="#editVocabularyTermModal" ng-click="prepareNewTerm()">create a new term</a>
+						<a class="btn btn-sm btn-primary" href="/vocabularies">Return to vocabulary list</a>					
+					</p>
+					<p>
+						<button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#editVocabularyTermModal" ng-click="prepareNewTerm()">create a new term</button>
 					</p>
 				
 					<p ng-show="terms.length > 0">
@@ -151,10 +141,7 @@
 	
 	</body>
 	
-	<script src="common/js/jquery.min.js"></script>
-	<script src="common/js/popper.min.js"></script>
-	<script src="common/js/bootstrap.min.js"></script>
-	<script src="common/js/angular.min.js"></script>
+	<th:block th:replace="fragments/mainParts.html :: scripts"></th:block>
 
 	<script src="js/vocabularyEditor.js"></script>
 </html>
\ No newline at end of file
