• MPA - um site multipage(tudo gerado via servidor)
• SPA - um site com front separado do back(servidor)

Essas definições estão equivocadas. Um "MPA" não necessariamente roda do lado do servidor. Vc pode ter uma "MPA" no lado do cliente também. O mais correto seria:

• SSR (Server Side Rendering): código rodando no servidor

• CSR (Client Side Rendering): código rodando no cliente (browser)

• SPA (Single Page Application): aplicação inteira como uma única página, onde a navegação se dá pela renderização ou não de diferentes componentes na tela. Ou seja, toda a aplicação é carregada no primeiro load (porém há estratégias para lazy-loading)

• MPA (Multiple Page Application): aplicação composta por múltiplas páginas onde o load de cada uma acontece a partir do momento que navega para ela

Obs: Apesar do seu equívoco, há sim uma relação "contrária" entre SPA e SSR, pois não faz sentido uma aplicação SSR entregar uma SPA.

Como iniciante te recomendo começar com MPA. Pois as páginas serão criadas no back e terão links para arquivos CSS, js e HTML

Como dito acima, não tem relação entre MPA e backend. Também recomendo começar com MPA antes de ir para as SPAs. Porém é desnecessário optar por SSR (rodar no servidor) para quem está começando. Pois criaria uma dependência a mais de infrastrutura. Enquanto uma MPA em CSR só precisa do diretório com os arquivos na máquina local dela e carregar os arquivos html no Browser.