[MUSICA]
Sono finiti i giorni in cui i siti web venivano utilizzati esclusivamente per
fornire informazioni agli utenti. In
questi giorni, sulla maggior parte dei siti web, gli utenti saranno in grado di interagire con il sito web
per fornire informazioni, ad esempio facendo clic sui pulsanti o
compilando moduli e digitando qualcosa nelle caselle di ricerca, e così via.
Quindi, come supportiamo questo tipo di interazioni con gli utenti?
Quindi questo è quello che ci accingiamo a trattare in questa particolare lezione e
l'esercizio che segue.
Ad esempio, se visiti il sito Coursera, vedrai che hai
dei pulsanti in alto qui che puoi cliccare per raggiungere luoghi diversi.
Potresti avere una casella di ricerca, in cui puoi digitare informazioni,
per cercare, ad esempio, lo sviluppo web stack completo e, così via.
Quindi, quello che notiamo è che l'interazione dell'utente deve essere supportata
sui siti Web utilizzando molti approcci diversi tra cui pulsanti,
moduli, caselle di testo, caselle di controllo, e molti altri. Le
prime interazioni con i siti web sono state fornite principalmente tramite collegamenti ipertestuali.
Così si potrebbe fare clic su un collegamento ipertestuale e andare ad altri luoghi e così via, ma
questo è ovviamente, il
collegamento ipertestuale è solo uno dei molti metodi di interazione con il tuo sito web.
Potresti avere pulsanti inclusi sul sito web che, quando cliccato,
comporterà alcune azioni intraprese sul sito web.
Potresti avere moduli compilati per fornire informazioni al sito web.
Così, quando si guarda a come si dovrebbe includere tali
funzionalità di interazione utente nel vostro sito web, si vedrà che si potrebbe utilizzare qualcosa
come i tag a che sono utili per fornire collegamenti ipertestuali,
poi si hanno i tag pulsante che consentono di includere pulsanti nel vostro sito web.
Ora quello che stiamo andando a guardare è come facciamo a formattare con un tag sui
tag pulsante utilizzando classi bootstrap in modo da poterli stile
per falsificare il tema generale del bootstrap.
HTML include già gli elementi del modulo e gli elementi di input in esso.
Ora, possiamo vedere come bootstrap migliora questi elementi fornendo
caratteristiche di stile per i moduli e vari elementi che vanno nei moduli.
I pulsanti forniscono ovviamente un modo semplice di interagire con il tuo sito web.
Quindi, quando hai un pulsante sul tuo sito web, potresti passare il mouse sul pulsante,
potresti fare clic sul pulsante e aspettarti che qualcosa accada nel processo.
Il comportamento del pulsante dipende da dove è posizionato nel bootstrap.
Se il pulsante si trova all'interno di un modulo, ad esempio,
in genere il clic del pulsante comporterà l'invio
del modulo a un server o l'annullamento delle informazioni del modulo.
Un pulsante esterno a un modulo potrebbe avere altri modi per fornire interazione.
Allo stesso modo, il < a > tag che abbiamo tradizionalmente associato ai
collegamenti ipertestuali potrebbe anche essere dirottato per essere stilato e
presentato sotto forma di un pulsante.
Quindi qui vedremo come bootstrap fornisce classi che possono essere
utilizzate per formattare il tag in un pulsante da presentare sul tuo sito web.
Vedremo anche vari elementi del modulo, come gli elementi di input,
selezionare, il pulsante e anche gli elementi di testo AD, e
come li usiamo all'interno dei nostri moduli per progettare e
costruire un modulo che può essere incluso nel nostro sito web.
Quindi l'esercizio che segue questa particolare lezione ti introdurrà al
supporto bootstrap per i pulsanti di stile e
vedrà anche come i vari elementi del modulo possono essere migliorati usando
le classi bootstrap per presentare i classici moduli Bootstrap.