Safari 27 e iOS 27: cosa cambia per il suo sito web

Una parte dei suoi visitatori arriva sul sito con Safari, e la loro quota si vede nella sua analitica. Per questo ogni versione di Safari conta per capire se una nuova funzione CSS o HTML funzionerà con i visitatori reali. Il post beta del blog di WebKit ha dato per Safari 27 un lungo elenco: select personalizzabile, posizionamento di ancoraggio consapevole delle trasformazioni, ancoraggio dello scorrimento, la pseudo-classe :heading, revert-rule, la parola chiave stretch e altro.

Per quanto l'elenco sembri lungo, non deve conoscerlo tutto. La maggior parte delle funzioni semplifica la vita a chi scrive il codice del sito; il visitatore non le vede direttamente e nota solo che le pagine si rompono meno. Come titolare, si chieda quale parte del suo sito abbia bisogno di una di queste. La risposta di solito sono i moduli e le aree delle immagini.

Il blog di WebKit scrive che con appearance: base-select i menu a tendina si possono stilizzare completamente. Un elenco in cui si sceglie una città, un servizio o un orario di appuntamento può quindi essere disegnato con i colori e il carattere del suo marchio. Il blog afferma anche che il comportamento con tastiera e screen reader viene mantenuto, il che è una strada più tranquilla per l'accessibilità rispetto a sostituire l'elenco con un componente scritto da zero.

Non è un obbligo. Se il suo elenco attuale funziona, lo lasci com'è. La nuova funzione ha più senso per gli elenchi con un aspetto personalizzato che finora venivano imitati con il codice. Le nostre fonti non dicono se gli altri browser supportino questa funzione allo stesso modo, quindi faccia realizzare il design in modo che, dove la funzione manca, ripieghi su un semplice elenco.

Per le immagini, la voce più notevole è il valore auto per l'attributo sizes dell'elemento img. Il blog di WebKit lo descrive come il browser che calcola da solo la dimensione dell'immagine per quelle caricate in modo differito, il che alleggerisce l'onere di scrivere a mano un valore sizes per ogni immagine. L'ancoraggio dello scorrimento, anch'esso dal blog, impedisce che il punto in cui sta leggendo si sposti quando più tardi si carica contenuto sopra di esso.

L'elenco qui sotto raccoglie le voci utili per testare il sito o per fare domande al suo sviluppatore. Può misurare prima e dopo l'effetto delle modifiche alle immagini sulla velocità con lo strumento di velocità del sito di rabbitclip.

• Menu a tendina personalizzabile: campi dei moduli in linea con il marchio
• Il valore auto per sizes su img: il browser calcola la dimensione delle immagini caricate in modo differito
• Ancoraggio dello scorrimento: la pagina non salta quando si carica contenuto in alto
• L'elemento model: contenuti 3D su iOS, iPadOS e macOS
• Aggiunte a livello di sviluppatore come l'API di routing statico dei Service Worker, ReadableStream.from() e maxAge nella Cookie Store API

Citando il blog di WebKit, 9to5Mac riferisce che Safari 27 include un server MCP locale. Quando l'automazione remota è attiva nelle impostazioni per sviluppatori, gli agenti di programmazione possono usare la finestra del browser. MCP è un protocollo di comunicazione che permette agli agenti di IA di collegarsi agli strumenti; qui lo strumento è Safari stesso.

Per il titolare di un sito il significato diretto è questo: un agente può navigare anche nel suo sito e, se uno sviluppatore l'ha attivato per fare prove sul proprio computer, lo fa con un browser vero. Il suo sviluppatore potrebbe usarlo per provare automaticamente i suoi moduli; è una possibilità, non una conclusione tratta dalle fonti. La stessa fonte cita anche un programma di impacchettamento per le estensioni web di Safari che non richiede né un Mac né Xcode.

Il primo errore è mettere una funzione nuova sul sito online appena si legge la notizia. Che una funzione giri in Safari 27 non significa che giri per ogni visitatore; alcuni dispositivi restano su versioni più vecchie. Il secondo è sostituire un menu a tendina che funziona solo perché ne esiste uno nuovo, rompendo il modulo su mobile.

Il terzo è testare solo da computer. L'aspetto su iPhone, il comportamento con tastiera e screen reader e le aree da toccare vanno provati separatamente.

• Mettere online una funzione nuova senza testarla
• Sostituire un componente funzionante solo perché è nuovo
• Testare soltanto in un browser per computer
• Non pensare a cosa succede dove la funzione non è supportata

Se il suo sito non ha campi di modulo con stile personalizzato, contenuti 3D o un'impaginazione complicata, per Safari 27 non c'è nulla da fare. Per un piccolo sito vetrina il passo giusto è aprirlo una volta su un iPhone e controllare a occhio il modulo e le immagini.

Anche provare l'elemento model per i contenuti 3D non fa per tutti. Se una vista 3D del suo prodotto non aiuta le vendite, la funzione porta solo un onere di manutenzione. Guardi prima che cosa vuole fare il visitatore, poi scelga la funzione.