Lo del punto "." y los dos puntos ".." en las rutas es algo simple, los subdirectorio tiene dos directorios especiales, punto "." que representa el directorio actual y dos puntos ".." representa al directorio inmediatamente superior en la estructura de directorios. Para que te hagas una idea te pongo un ejemplo. Si tengo estas carpetas
+raíz
+templates
-carpeta 1.1
-carpeta 1.2
-carpeta 1.3
Si me encuentro en la
carpeta templates "
raíz/templates":
-Punto "." significa que la ruta comienza en la carpeta actual, osea la
misma carpeta templates, si queremos ir al
archivo stylesheet.css, el cual se encuentra dentro de la
carpeta css, escribiríamos
"./css/stylesheet.css".
-Dos puntos ".." significa que la ruta comienza en el directorio inmediatamente superior, si nos encontramos en la
carpeta templates, la carpeta inmediatamente superior sería la
carpeta raíz, si queremos ir desde la
carpeta templates a la
carpeta 1.2, escribiríamos
"../carpeta 1.2 ", los dos puntos indican que nos desplazamos hacia atrás en la estructura de carpetas, vamos a la
carpeta raíz y desde esta carpeta ya podemos ir a la
carpeta 1.2.
No se si te ha quedado claro, pero puedes conseguir mas información buscando
"ruta relativa y ruta absoluta".
En lo referente a la estructura de tu sitio web, puedes poner la dirección del sitio web para ver hacia donde están apuntando tus links.
La etiqueta
<base> nunca la he utilizado, pero podrías probar, si la carpeta includes y la página que enlaza con esta se encuentran en el directorio raíz de tu sitio web, escribir:
<link rel="stylesheet" type="text/css" href="includes/templates/site/css/stylesheet.css"/>
ó
<link rel="stylesheet" type="text/css" href="./includes/templates/site/css/stylesheet.css"/>
