1. Mapa web

+ INFO

2. Estilo web

+ INFO

3. Contenidos

+ INFO

4. Optimización

+ INFO

1. Mapa web

  1. INICIO
  2. AGENDA
  3. ESPAI SEQUER
    1. MERCAT GASTRONÒMIC (faltan contenidos, textos e imágenes)
    2. AGENDA
    3. ARROCERÍA
    4. EL SEQUER
  4. BLOG
  5. GALERÍA (HECHO)
  6. CONTACTO
  7. PIDE ONLINE (José falta este enlace)

2. Estilo web

2.1. Tipografía corporativa

Proxima Nova
· No es un tipografía de Google fonts.
· Se puede utilizar la Proxima Nova webfont pero hay que comprarla: ver precios proxima nova webfont

¿Qué propongo?
· Utilizar Proxima nova para identidad y redes y en web la Montserrat o la que me digáis pero preferiblemente que sea una Google font, cuanto más estándar sea nuestro sitio mejor lectura tendremos por parte de Google (subir una fuente personalizada aumenta en 1 segundo como mínimo el tiempo de carga de una web).

<h1> Heading 1

Montserrat Semibold 600
Fontsize: 40px

Interlineado: 1.15em
Tracking: -1px
Top Margin: 0.45em
Bottom Margin: 0.45em
Color: #494949

<h2> Heading 2

Montserrat Semibold 600
Fontsize: 40px

Interlineado: 1.15em
Tracking: -1px
Top Margin: 0.45em
Bottom Margin: 0.45em
Color: #494949
*H1 y H2 deben tener las mismas características.

<h3> Heading 3

Montserrat Medium 500
Fontsize: 35px

Interlineado: 1.15em
Tracking: 0px
Top Margin: 20px
Bottom Margin: 20px
Color: #494949

Body font

Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta) desconocido usó una galería de textos y los mezcló de tal manera que logró hacer un libro de textos especimen.

Montserrat Normal 400
Fontsize: 17px

Interlineado: 32px
Tracking: 0
Color: #494949

Estilo enlaces

Normal color: #494949
Hover color: #d7a08f

2.2. Color

#D7A08F

#F7D3C0

#E9D3C1

#E8E4E2

#A9B8AB

#E5CAB4

2.3. Otros elementos

Separador

Border: 2
Width: 170px
Color: #e9d3c1

Botón

BOTÓN EJEMPLO

Border color: #494949
Hover: #e5cab4

Favicon

*Definir un favicon

2.4. Estilo páginas

Página principal

Header info
Font color: #ffffff
Background-color: #a9b8ab

Menu background
Background-color: Transparent cambia a #c1b19e cuando hacemos scroll. (Este color lo he cogido de la guía de estilo, en el ejemplo de la página, es diferente a la paleta de estilos, tiene mejor contraste).
*Elegir fotos para que contraste la tipografía con la foto de fondo.

4 col category
*Elegir un color corporativo para que contraste con la foto de arriba del banner, puesto ejemplo temporal.

Full container
Background-color: #f9f9f9
(He puesto un estilo neutro hasta que se decida que matiz de color corporativo va ahí).

Event Calendar:
Background-color: #ffffff

2 col
Los background varían entre #ffffff y #f9f9f9 en función de los contenedores que hay antes y después para separar la información.

Blog container
*Estilo neutro hasta que se decidan colores.

Footer widgets
*Se añade en la parte de optimización

Footer copyright
*Estilo neutro.

Página secundaria

Header info
Font color: #ffffff
Background-color: #a9b8ab

Menu background
Background-color: #c1b19e

Page titlebar
*Común en todas las páginas.
Background-color: #e8e4e2
Font color: #494949 (el verde corporativo podría funcionar bien)

2 col
Los background varían entre #ffffff y #f9f9f9 en función de los contenedores que hay antes y después para separar la información.

Footer widgets
*Se añade en la parte de optimización

Footer copyright
*Estilo neutro.

3. Contenidos

1. Página inicio

  • Banner, necesito las fotos finales (recomiendo máximo 3 fotos, fijaros en el contraste de las fotos con el texto el menú)

  • 4 col category, necesito las 4 fotos que van ahí, luego le damos atmósfera corporativa para separarlo visualmente de la foto del banner.

  • 2 col, aparece el texto de la filosofía, lo he dejado de forma temporal, para la parte de optimización el texto que va ahí debería ser un poco más extenso (necesitaré texto y foto).

2. Página Mercat Gastronòmic

  • Necesito textos

  • Necesito fotos

3. Resto de páginas

  • Todas las páginas a excepción de «Agenda, Blog y Galería» que es de contenido dinámico irán maquetadas en «2 col» como la página de «ESPAI SEQUER»

  • «Galería» Necesito user y pass de insta para configurar Instagram Feed en la página. (HECHO)

  • «Pasarela de pago Woocommerce» > Benja

  • «PIDE ONLINE» > Necesito enlace José

4. Espai sequer

  • Necesito textos (si los queréis modificar).

  • Necesito fotos.