Sin dalle primissime specifiche, l'html ha fornito agli sviluppatori un sistema per caricare un link in una finestra diversa da quella di navigazione. Lo strumento è l'attributo target. Consente di specificare in quale finestra si aprirà il documento collegato attraverso un link. L'uso di target ha però una limitazione. La nuova finestra generata eredita tutti gli attributi di quella originaria, dalle dimensioni agli elementi del menu.

È con Javascript che questa limitazione può essere superata. Il metodo open() dell'oggetto window consente l'apertura di una nuova finestra con pochissime righe di codice. La finestra, poi, può assumere l'aspetto e le funzionalità che desideriamo: è possibile gestire le dimensioni, la presenza di elementi di navigazione o di barre di scorrimento, così come il target per l'apertura del link.

window.open(url, name, features, replace)

e questa la forma tipica che assume il codice di un link:

<a href="#" onclick="window.open('popup_esempio.html', 'nuovaFinestra', 'width=200,height=200')">Apri pop-up</a>

Come si vede, l'attributo href, che di norma contiene la URL del documento da caricare, presenta solo il simbolo del cancelletto, in genere usato per produrre un link 'vuoto'. L'apertura del pop-up è attivata tramite l'evento onclick. Segue la tripletta di dati sulla finestra. Una cosa interessante da osservare è la gestione delle caratteristiche del pop-up. Se non ne viene specificata nessuna, il comportamento dello script sarà identico a quello visto per l'attributo target di html. Se però ne definiamo anche una soltanto, allora gli elementi con cui impostiamo le caratteristiche della finestra assumono come valore predefinito 'no'.

Nell'implementazione dello script è opportuno, poi, definire una funzione globale nell'intestazione della pagina o in uno script esterno. All'interno della sezione head inseriamo la funzione:

impostando il seguente link:

<a href="#" onclick="MM_openBrWindow('popup_esempio.html', 'nuovaFinestra', 'width=400,height=400')">Apri il pop-up</a>

Quali sono, dunque, i problemi di accessibilità che ci tocca affrontare? Il principale deriva da quel simbolo di cancelletto all'interno di href. Chi utilizza un browser alternativo, uno screen reader o semplicemente naviga con i javascript disabilitati, non potrà fruire del contenuto del documento collegato. È evidentemente una forma di discriminazione intollerabile. La soluzione è banalissima. È sufficiente aggiungere la stessa URL definita per il pop-up anche ad href, in questo modo:

Così facendo consentiamo a chi non può sfruttare javascript di poter consultare il contenuto. Volendo usare ugualmente l'apertura in una nuova finestra, basterà aggiungere al codice un tradizonale target="_blank".

Ora, però, se avete provato ad aprire il pop-up dell'ultimo esempio, avrete notato una piccola incongruenza. Il documento viene caricato sia nella nuova finestra, sia in quella principale, perché il browser esegue entrambe le direttive che trova nel codice. La soluzione è ancora una volta semplicissima. Basta aggiungere alla fine dell'istruzione return false; (attenzione a parentesi e apici!):

Per migliorare ulteriormente il livello di accessibilità, dobbiamo valutare ancora un caso. Quello in cui gli eventi che attivano uno script siano indipendenti dal dispositivo di input (mouse e tastiera). Tra i gestori di eventi previsti nelle specifiche, troviamo anche onkeypress, evento che viene attivato con la pressione di un tasto nel momento in cui un determinato elemento riceve il focus. Nel caso dello script del pop-up basterà aggiungere al codice una nuova istruzione:

Rimangono, ovviamente, i problemi di usabilità generale di questo strumento. L'apertura di una nuova finestra, seppure non invasiva, è sempre qualcosa che può generare confusione, specie nei non esperti. Il limite si raggiunge con i cosiddetti pop-up di navigazione, quelli che consentono l'interazione o il passaggio di dati con la finestra principale del browser. In quel caso la perdita di controllo è in agguato per chiunque.