Tal como formulas la pregunta no queda claro si quieres:
- Que el header y el footer se compartan entre varias páginas, pero siendo las páginas independientes, cada una en un archivo HTML que se carga aparte.
- Que el header y el footer se compartan entre varias "pantallas" de una misma página. Siendo que esas "pantallas" se carguen sin que se recargue completamente toda la página, simplemente intercambiando el contenido a medida que el usuario pulsa los enlaces.
Ambas cosas son posibles. Y además existen una infinidad de posibles soluciones para conseguirlas.
La primera opción es más común y básicamente se resuelve, generalmente, mediante el uso de un CMS. (Sistema gestor de contenido) como podría ser WordPress. En tu CMS defines el template o tema (que incluye el header y footer entre otras cosas) y cada página muestra un contenido distinto según se requiera. Si quieres empezar con WordPress tienes el Curso gratuito de WordPress.
Esta misma aproximación también la consigues de manera super simple sin necesidad de usar un CMS. Simplemente usando un lenguaje del lado del servidor como PHP. Para ello tienes que usar la sentencia de "include" en PHP. Ella te permite tener el header y el footer en archivos separados y desde cada página simplemente los incluyes con un include. Por ejemlo en este artículo te muestran una manera muy simplificada para conseguir crear una plantilla con includes en PHP. Recuerda que puedes aprender PHP de manera sencilla en el Manual de PHP.
La segunda opción también es sencilla, si sabes cómo hacerla. Pero requiere en el fondo más conocimientos técnicos de Javascript. Ese es el esquema de funcionamiento de las SPA (Single Page Application). Para construirla generalmente usamos Javascript, pero además algún framework del estilo de Angular, VueJS, React, o simplemente Web Components con LitElement. Para ello requiere usar generalmente un sistema de routing en Javascript.uí la cosa se complica algo, así que si estás empezando creo que no te debe interesar mucho ir por este camino.