Documentazione: Pagina "Recensioni"
1. Panoramica Generale
Scopo: Mostrare feedback degli utenti e raccogliere nuove recensioni attraverso un form interattivo.
Target: Turisti che cercano testimonianze autentiche e vogliono lasciare un feedback.
Tecnologie:
- HTML5/CSS3 (senza framework esterni)
- JavaScript vanilla per il carosello
- Font Google (Poppins)
- Design moderno con effetti glassmorphism
2. Elementi Chiave
- Pulsante "Torna alla Home"
- Posizione: Fisso in alto a sinistra (position: fixed)
- Effetto glassmorphism (backdrop-filter: blur(10px))
- Gradiente verde al hover
- Ombra dinamica e sollevamento 3D
- Responsive: Ridimensionamento su mobile
- Carosello Recensioni
- 10 recensioni con foto, nome, valutazione (stelle) e testo
- Navigazione con frecce laterali (SVG personalizzati)
- Transizione semplice tra le card (JavaScript vanilla)
- Avatar circolari (100px) con bordo luminoso
- Stelle dorate (#FFD700)
- Testo con ombre per leggibilità
- Accessibilità: Tag alt per immagini, contrasto elevato
- Form di Feedback
- Layout: Due colonne (responsive su singola colonna su mobile)
- Left: Nome, email, selezione stelle
- Right: Textarea per messaggio + pulsante invio
- Sfondo semi-trasparente con blur
- Bordi sottili luminosi
- Pulsante giallo (#FFD700) con hover scuro
- Validazione: Campi obbligatori (required)
4. Punti di Forza
- Micro-animazioni su tutti gli elementi cliccabili
- Transizioni fluide (hover, focus)
- Tema scuro con accenti dorati
- Allineamento con lo stile del resto del sito
- Pulsanti grandi e riconoscibili
- Form intuitivo