TK03-2 Estructura general del sitio web

marioG130 / ISPC-FullStack-2022

Trabajo colaborativo del Módulo Full Stack ISPC (Cohorte 2022)

2 stars 1 forks source link

TK03-2 Estructura general del sitio web #56

Closed marioG130 closed 2 years ago

marioG130 commented 2 years ago

Dentro del marco de la US #1, se debe definir la estructura de directorios del "frontend", asi como los cirterios generales en cuanto a nombres de archivos, forma de incluir JavaScript y CSS, estructura interna de las páginas.

marioG130 commented 2 years ago

El sitio web se podrá acceder tanto desde el directorio local (del repositorio) de cada de los integrantes, como desde "GitHub Pages" en la URL https://mariog130.github.io/ISPC-FullStack-2022/frontend/ .

marioG130 commented 2 years ago

En cuanto a los nombres de archivos se realizarán todos en minúsculas, sin usar espacios, y cuando se quieran separar dos palabras se usará el guión del medio. Se evitará el uso de acentos o eñes. Por ejemplo: "formulario-registro.html".
En cuanto a los directorios se usará "img" para imagenes del sitio, "css" para los archivos de hojas de estilo, y "js" para los archivos de JavaScript.
En cuanto a los enlaces entre páginas se usará la forma relativa, y de la forma mas corta posible, de modo que el sitio sea completamente navegable en un directorio local. Por ejemplo: src="img/marcaoptica.jpg" .

marioG130 commented 2 years ago

Para BOOTSTRAP:

Se usará con inclusion de archivos locales, de modo de asegurar que la versión sea exactamente la misma en todos los integrantes del grupo, y que el sitio sea navegable en local aun sin conexión a Internet. En los head se usará:
link rel="stylesheet" href="css/bootstrap-5.2.1.min.css"
script src="js/bootstrap-5.2.1.bundle.min.js"

marioG130 commented 2 years ago

Un solo header y footer:

Se estuvo tratando de tener un solo header y footer que se puedan insertar en todas las paginas a nivel de HTML. Pero esto no es posible si se desean mantener las mismas hojas de estilo y un único DOM. A nivel de HTML se puede insertar un object o un iframe, pero en esos casos crea un nuevo "document" insertado con su propio html, body, etc.
Se puede lograr esto usando JavaScript (fetch) o JQuery (load). Pero el problema es que el sitio no quedaría navegable en local, solo se podría probar en remoto.

marioG130 commented 2 years ago

Reapertura para agregar una plantilla de ejemplo general para las páginas y mejoras en las verificaciones de forms