Chiunque si sia mai avventurato nella giungla della realizzazione di siti web avrà certamente capito che, nonstante tutti gli standard che sono stati definiti negli ultimi anni, ogni browser interpreta il codice html/css a modo suo. Il risultato è che il 60% del tempo di sviluppo di un sito web non si perde nella fase di testing (come diversi teorici dell’ingengeria del software sostengono), ma nel cercare di trovare degli “hack” per Internet Explorer !
Fino a l’altro ieri pensavo che le incompatibilità tra browsers riguardassero solo la presentazione del sito, ma ci è voluto poco a trovarmi di fronte a un problema legato al submit delle form, in particolare, al tag input con immagine incorporata. Che differenza c’è tra i seguenti due campi di input ?
<input type="image" name="pulsante" value="Click" src="img/img.png" /> <input type="submit" name="pulsante" value="Click" />
Il campo di tipo “image” è equivalente ad uno di tipo “submit” ma, attenzione, quando ci si fa click il browser è tenuto ad inviare al server le coordinate relative del punto in cui si è fatto click. Mentre nel caso di pulsante “submit” il browser invia al server un parametro con nome=”pulsante” e valore=”Click” (solo quando viene cliccato), nel caso dell’immagine ogni browser si comporta a modo suo.
Non è un problema da poco, perché il parametro “name” che viene passato dal browser al server nel momento in cui l’utente fa click su un pulsante è l’unico modo per distinguere il tasto su cui ha fatto click l’utente nel caso in cui javascript sia disattivato o non presente nel browser (vedi accessibilità, WCAG 2.0).
Un click sul pulsante immagine potrebbe produrre l’invio dei seguenti parametri al server:
- ?pulsante.x=10&pulsante.y=11 (Firefox)
- ?pulsante.x=10&pulsante.y=11&pulsante=Click (Chrome)
- ?pulsante.x=&pulsante.y= (Browser senza supporto immagini)
- ?pulsante.x=0&pulsante.y=0 (Altro browser senza supporto immagini)
Al contrario, un click sul pulsante senza immagine produce sempre il seguente risultato sul server:
- ?pulsante=Click (Tutti i browser ?)
E così, ulteriore tempo di sviluppo va speso per trovare degli “hack” lato server per questo ed altri problemi…