L'anno scorso ho visto un'azienda di e-commerce perdere circa 15.000 euro di fatturato in un solo weekend a causa di un banale errore di interfaccia. Avevano deciso di ridisegnare la pagina di checkout e, per motivi puramente estetici, il designer aveva insistito affinché il tasto "Procedi al pagamento" fosse tecnicamente un Button As Link In HTML. Volevano che sembrasse un pulsante massiccio e colorato, ma che si comportasse come un semplice collegamento ipertestuale verso la pagina successiva. Il risultato? Gli utenti che navigavano con tastiera o screen reader non riuscivano a completare l'acquisto perché il browser non capiva se dovesse inviare dei dati o semplicemente cambiare pagina. Molti utenti cliccavano compulsivamente senza che succedesse nulla, mentre altri venivano reindirizzati troppo presto, perdendo i dati del carrello. È lo scenario classico: si privilegia la forma sulla funzione e si finisce per rompere l'esperienza utente proprio nel punto più delicato del funnel di vendita.
L'ossessione per l'estetica a scapito della semantica in Button As Link In HTML
Il primo grande sbaglio che vedo commettere costantemente è confondere l'aspetto visivo con il ruolo funzionale di un elemento. Molti sviluppatori pensano che se un elemento sembra un bottone, allora debba essere marcato come tale nel codice, anche se serve solo a spostarsi da una pagina A a una pagina B. Questa è una trappola mentale pericolosa. Ho lavorato su progetti dove intere librerie di componenti erano costruite su questo equivoco.
Quando usi un tag di pressione per fare il lavoro di un'ancora, stai mentendo al browser e, cosa ancora più grave, alle tecnologie assistive. Uno screen reader annuncerà "pulsante" all'utente non vedente. Quell'utente si aspetterà che accada qualcosa sulla pagina corrente — come l'apertura di un menu a tendina o l'invio di un modulo — e non di essere teletrasportato su un nuovo URL. Se l'utente preme la barra spaziatrice (che è il comando standard per attivare un bottone) e non succede nulla perché il tuo finto collegamento risponde solo al tasto Invio, hai appena creato una barriera insormontabile. Non è solo pigrizia, è un debito tecnico che pagherai con interessi altissimi quando dovrai rimediare a una causa per violazione dell'accessibilità secondo le normative europee come l'European Accessibility Act.
Il mito della flessibilità del CSS e il fallimento dei framework
C'è questa idea diffusa che i framework moderni rendano superfluo scegliere il tag corretto. Ho visto team di sviluppo passare settimane a cercare di far comportare un elemento `
