Xhtml o Html: quale scegliere?

Che siate un designer, un htmlista o un editor vi trovate nella condizione di scegliere tra due standard per scrivere i vostri articoli o creare i vostri template.

Da un lato il “collaudato” Html, che pur con tutti i limiti vi consente di creare pagine più o meno visibili in tutte le piattaforme.

Dall’altro Xhml, uno standard abbastanza recente e che promette di sostituire Html nel prossimo futuro.

Perché usare Xhtml
  • È compatibile con tutti i browser, non solo con i più recenti
  • Comincia ad essere supportato dagli ambienti per la creazione di codice Html (es. Macromedia Homesite 5.0)
  • È lo standard del futuro che sostituirà Html
  • Trova il suo massimo impiego insieme ai CSS (Cascading Style Sheet), standard ormai collaudato
Vantaggi nell’uso di Xhtml
  • Usato insieme ai CSS, separa lo strato di presentazione della pagina dal contenuto, rendendo il codice facilmente manutenibile e i dati riutilizzabili
  • Potreste in futuro essere costretti a convertire il vostro codice Html in Xhtml se usate XML e XSL per pubblicare i vostri articoli
  • È possibile estendere il linguaggio con moduli da usare con particolari dispositivi o, viceversa, limitare il numero di tag da usare (Xhtml Modularization)
Tipi di documento Xhtml

Esistono 3 tipi di documento Xhtml:

  • Strict: la versione con meno libertà. Va usata in combinazione ad un uso avanzato dei CSS, im modo da posizionare gli elementi all’interno della pagina. Per questo è sfronda l’Html degli attributi di posizionamento
  • Transitional: all’oggi il preferibile. Vi consente di trasformare il vostro documento Html in Xhtml con semplici correzioni (tipicamente la chiusura del tag per quei tag che non la prevedono)
  • Frameset: usato nel caso la vostra pagina sia costruita a frame
Come si scrive un documento Xhtml

Per scrivere un documento Xhtml valido è necessario che:

  • Tutti i tag Html siano chiusi
  • I tag siano scritti in minuscolo
  • Sia presente una direttiva in testa al documento che ne indichi il tipo

Convertiamo allora un semplice esempio Html nel corrispettivo Xhtml di tipo Transitional. Si tratta di una pagina contenente un’immagine ed una form:

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 2 
 3 <html>
 4 <head>
 5   <title>Da Html a Xhtml</title>
 6 </head>
 7 
 8 <body>
 9 
10 <img src="logo.gif" width="50" height="50" alt="FucinaWeb.com">
11 
12 <form action="risultato.asp">
13   Nome: <input type="text" name="Nome" checked><br>
14   Cognome: <input type="text" name="Cognome"><br>
15   Sesso:
16   Maschio <input type="radio" name="Sesso" value="M">
17   Femmina <input type="radio" name="Sesso" value="F">
18 </form>
19 
20 </body>
21 </html>

I cambiamenti interessano i seguenti tag:

  • <img> Va terminato, essendo un tag non chiuso. Per farlo, è possibile inserire esplicitamente un tag di chiusura, come </img>.
    Esiste una seconda possibilità, che abbiamo adottato in questo caso: chiudere il tag di apertura completandolo con ” />”. È necessario
    ricordarsi di inserire uno spazio prima della barra “/” per evitare problemi di visualizzazione in browser di vecchia generazione.
  • <br> Vale lo stesso discorso del tag precedente.
  • <input> Vale lo stesso discorso del tag precedente. In più, va notato che ad un attributo deve sempre essere associato un valore. Nel caso di input box di tipo radio è possibile specificare il valore di default con l’attributo checked, senza associare un valore esplicito.
    In Xhtml, ad ogni attributo deve essere associato un valore, in questo caso checked=”checked”

In più, va cambiata la dichiarazione del documento, che diventa quella di un documento Xhtml.

Ecco l’esempio trasformato in Xhtml:

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 
 3 <html>
 4 <head>
 5   <title>Da Html a Xhtml</title>
 6 </head>
 7 
 8 <body>
 9 
10 <img src="logo.gif" width="50" height="50" alt="FucinaWeb.com" />
11 
12 <form action="risultato.asp">
13   Nome: <input type="text" name="Nome" /><br />
14   Cognome: <input type="text" name="Cognome" /><br />
15   Sesso:
16   Maschio <input type="radio" name="Sesso" value="M" checked="checked" />
17   Femmina <input type="radio" name="Sesso" value="F" />
18 </form>
19 
20 </body>
21 </html>

Il documento è ora compatibile con lo standard Xhtml.

Conclusione

La conversione di un documento Html in Xhtml (soprattutto di tipo Transitional) è semplice e richiede poche attenzioni e nessuna nuova tecnica da imparare.
Questo, unito ai vantaggi in termini di aderenza agli standard e di separazione tra struttura e contenuto fa si che lo standard Xhtml sia la scelta
ideale per qualsiasi nuovo progetto da portare sul Web.

Java 2SE v1.4 prossima al rilascio

Si avvicina la data di uscita della versione 1.4 di Java 2 Platform, Standard Edition (J2SE).

Secondo Sun, molte sono le novità e le migliorie rispetto alla versione precedente:

  • Inclusione di una classe per la gestione delle “regular expression” [nuova finestra]: basta StringTokenizer e charAt per controllare i campi di una form
  • è facilitata e unificata la gestione delle preferenze [nuova finestra] utente tramite API
  • Supporto per grafica ad alta performance inviata direttamente allo schermo
  • Inclusione di standard precedentemente disponibili con download separati, come il pieno supporto ad XML (con DOM, API e XSLT) e JDBC 3.0

Dal sito Sun è possibile scaricare la versione Release Candidate [nuova finestra].

ASP.NET: differenze con ASP – Un esempio per confrontarle

Corso ASP.NET: prima puntata

Esempio funzionante | Sorgente | Scarica il sorgente (zip)

ASP.NET si scosta sotto molti aspetti dall’approccio ASP:

  • Dispone di un vero modello ad oggetti: classi ereditabili con metodi, proprietà e una complessa gestione di eventi
  • Non utilizza linguaggi di scripting, come VB Script, ma veri linguaggi di programmazione, come VB.NET e C#
  • Le pagine sono compilate al primo accesso: gli utenti successivi accedono alla copia compilata, fino a nuove modifiche del sorgente (avete presente le Java Server Pages?)
  • Consente di separare efficacemente il codice del programma dal codice Html, utilizzando le tecniche di Code Behind
  • Limita la quantità di codice scritto, sia perché facilmente riutilizzabile, sia perché svolge autonomamente compiti ripetitivi, come la gestione dei campi all’interno delle form
  • È facilitata la gestione dei file di configurazione a la messa in produzione dei progetti

Tutto questo contribuisce a far ci che per lavorare con ASP.NET sia meglio dimenticare quanto si era abituati a fare con ASP, come utilizzare inclusioni di codice all’interno del sorgente Html (con <%, %> e la direttiva include), la complessa gestione dei dati utenti nelle form e il mantenimento dello stato con campi nascosti e parametri nell’URL.

Requisiti, installazione e compatibilità

Per realizzare applicazioni Web con ASP.NET è necessario scaricare il .NET Framework di Microsoft, che può essere installato in Windows 2000 Professional, Server e XP.

Rispetto alla beta 2, sono state unificate in una sola installazione le due versioni ASP.NET Standard e ASP.NET Premium.

Sullo stesso server possono coesistere sia le pagine ASP sia quelle ASP.NET: per accedere alle seconde si utilizza normalmente l’estensione .aspx.

Le pagine ASP.NET non sono compatibili al 100% con ASP, per questo la migrazione del codice deve essere accuratamente pianificata, ma non solo.
Una vecchia applicazione ASP deve essere riprogettata e riscritta per poter sfruttare appieno le potenzialità offerte da ASP.NET.

La mia prima pagina ASP.NET

Si tratta di una semplice pagina contenente una form e due campi per inserire il nome e il cognome. La pagina:

  • Saluta l’utente che ha inserito il proprio nome e cognome
  • Mantiene lo stato dei campi (cioè il nome e cognome) dopo aver inviato i dati della form
Pagina con form e due input box
Richiede nome e cognome all’utente

Con la tradizionale programmazione ASP, avremmo dovuto

  • Controllare quando la form è stata compilata e visualizzare i dati dell’utente
  • Riempire i due input box con i valori inseriti
Il risultato della pagina
Saluta l’utente e ripropone nome e cognome

Analizziamo passo per passo il codice ASP.NET

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@Page Language="VB"%>

Qui utilizziamo lo standard Xhtml (avremmo potuto usare Html) per il documento. Dichiariamo l’uso di Visual Basic .Net come linguaggio della pagina. Come dicevamo, in ASP.NET non sono più ammessi
linguaggi di scripting. Inoltre, ogni pagina ASP.NET può essere scritta in un solo linguaggio, a differenza di ASP dove potevano convivere codice VB Script e JScript.

42 <input id="txtNome" runat="server" />
50 <input id="txtCognome" runat="server" />

Ecco i due input box che consentono all’utente di inserire i propri dati. Fondamentale è la presenza:

  • dell’attributo id. È il nome dell’oggetto ASP.NET. Ogni volta che avrete bisogno di chiamare un metodo, una proprietà o un evento dell’oggetto, userete questo attributo come nome dell’oggetto
  • dell’attributo runat=”server”. Quando il compilatore ASP.NET incontra un tag con questo attributo, sa che non si tratta di un semplice tag Html, ma di un oggetto che potete “comandare” via codice (usando proprio il valore scelto per l’attributo id)
55 <input type="button" id="btnPulsante" value="Invia"
56 onserverclick="btnPulsante_click" runat="server" />

In questo caso, oltre a quanto appena detto, è presente l’attributo onserverclick=”btnPulsante_click”. Quando l’utente clicca sul pulsante “Invia”, viene scatenato l’evento
btnPulsante_click che abbiamo dichiarato in testa alla pagina. Ecco il codice che lo compone:

14 <script runat="server">
15 
16 Sub btnPulsante_click(Sender As Object,E As EventArgs)
17 ‘ Evento scatenato dal click sul pulsante
18 lblMessaggio.Text = "Buongiorno " + txtNome.Value + _
19  + txtCognome.Value
20 End Sub
21 
22 </script>

Ecco in poche righe la potenza della programmazione ad oggetti in ASP.NET. Viene estratto il valore dei due input box .Come abbiamo detto è usato il valore dell’attributo id per riferirli (txtNome e txtCognome in questo caso).
Viene concatenata la stringa con il messaggio di benvenuto e il suo valore è associato ad un altro oggetto, lblMessaggio, che viene dichiarato in questo modo:

62 <asp:label id="lblMessaggio" CssClass="risposta" runat="server" />

Oltre a tramutare in oggetti tag Html, ASP.NET dispone di un insieme di oggetti dalle elevate funzionalità, preceduti dal prefisso asp:. Sono i Web Server Controls. In questo caso l’oggetto è semplicemente un’etichetta che visualizza del testo.

Quando l’utente inserisce il testo e preme il pulsante di invio, ASP.NET scatena l’evento del pulsante, estrae i valori dagli input box e associa il valore composto all’etichetta che si trova in fondo alla pagina.

Ci rimane però da soddisfare ancora ad una richiesta: come fa la pagina a mantenere lo stato e visualizzare il nome e il cognome dell’utente all’interno degli input box, una volta inviata ? Grazie alla form presente nella pagina:

35 <form runat="server">

Come si vede, manca l’attributo action che si saremmo aspettati. In compenso, è presente l’attributo runat=”server”.
Questo è un particolare tipo di form che mantiene lo stato tra le pagine senza bisogno di codice per la gestione. Ce ne può essere al massimo una all’interno di una pagina.

Per vedere come sia possibile per ASP.NET mantenere lo stato della pagina, date un’occhiata al sorgente della pagina che è stato spedito
al client e noterete la presenza di alcuni campi nascosti. Sono generati da ASP.NET e il loro scopo è proprio quello di collegare il risultato di una pagina con la pagina successiva.

Conclusione

ASP.NET favorisce un nuovo approccio per programmare nel Web. Ogni tag può diventare un oggetto che ha proprietà, metodi ed eventi. ASP.NET dispone inoltre di un insieme di oggetti sofisticati che
permettono di limitare la quantità di codice scritto per lo svolgimento dei compiti più comuni. Anche la gestione degli stati risulta notevolmente semplificata.