Graceful Degradation

Qualche giorno fa, a causa di problemi sul server di hosting, lo sfortunato avventore s’è beccato qualche schermata di errore del tipo:

YSODconosciuta anche con il nome di ASP.Net YSOD (Yellow Screen of Death). In un paio di occasioni questo è capitato per una mancata risposta del backend SQL, magari beccato durante un riavvio di manutenzione, altre volte per problemi un po’ più seri come la carenza di spazio libero quando in realtà avevo teoricamente a disposizione più di 99GB rimanenti.

La YSOD è praticamente una schermata di debug utile per lo sviluppatore: nel caso in questione però saranno ormai diversi mesi che non vedo uno YSOD causato da problemi di codice, quindi ho deciso di disabilitarne l’uso in favore di una schermata più simpatica. Per imparare qualcosa ho cercato di fare le cose per bene, perché quando mi prende va a finire che anche per le puttanate son capace di spendere ore ed ore. Il risultato lo si può ammirare in questa pagina:

Gracefully degradeLa cosa più antipatica da realizzare è stato il centraggio della box in primo piano, cosa rivelatasi impossibile tramite CSS e basta. Un po’ di JavaScript + JQuery e la paura e passata; col senno di poi però arrivare a scrivere codice JS per una pagina statica di errore mi sembra pura follia…

-quack

Potrebbero interessarti anche:
Commenti (39): [ Pagina 1 di 2  - più vecchi ]
10. vik
giovedì 24 settembre 2009 alle 10:42 AM - firefox 3.5.3 OS X 10
   

Io ho visto una pagina ancora diversa: paperino che si dispera (poverino!) nel mezzo del bianco, non c'era il "sito sotto".

Per quando riguarda centrare il div in verticale, perché non usare uno dei 42mila plugin di jQuery che lo fanno al posto tuo aggiornando il CSS in tempo reale?

   
11. il nonno
giovedì 24 settembre 2009 alle 11:20 AM - chrome 3.0.195.21 Windows 7
   

Io ho visto una marmotta che raccoglieva bit sparsi per terra...

   
12. floo
giovedì 24 settembre 2009 alle 12:32 PM - firefox 3.5.3 Windows 7
   

Io ho visto i criceti esausti del datacenter di GoDaddy

   
13. Snake
giovedì 24 settembre 2009 alle 12:54 PM - firefox 3.5.3 Windows 7
   

Io ho visto i criceti esausti del datacenter di GoDaddy

io ho visto le roditrici di GoDaddy

Go Daddy Gooooo

   
14. floo
giovedì 24 settembre 2009 alle 12:54 PM - firefox 3.5.3 Windows 7
   

Zozzone

   
15. evacchi
giovedì 24 settembre 2009 alle 1:05 PM - chrome 4.0.211.7 Windows Vista
   

io ho visto le roditrici di GoDaddy 

pics or it didn't happen
   
16. il nonno
giovedì 24 settembre 2009 alle 1:27 PM - chrome 3.0.195.21 Windows 7
   

Beh GoDaddy e' famosa per le sue roditrici!

   
17. Snake
giovedì 24 settembre 2009 alle 3:03 PM - firefox 3.5.3 Windows 7
   

pics or it didn't happen

Non dal vivo (purtroppo ).

   
18. MicioDue
giovedì 24 settembre 2009 alle 4:10 PM - IE 8.0 Windows Vista
   

Abbandono momentaneamente il mio stato di lurker per illustrare il modo in cui ho risolto la questione dell'allineamento verticale nei CSS (strumento potentissimo, ma a volte viene da pensare che gli ideatori non fossero completamente lucidi...) 

La tecnica deriva da qualche veloce ricerca in rete. L'importante è conoscere le dimensioni esatte dell'oggetto da centrare, in questo caso un controllo Silverlight di 640x600:

     <div style="position: absolute; left: 50%; top: 50%;">
        <div id="silverlightControlHost" style="position: absolute; left: -320px; top: -300px;">
            <script type="text/javascript">
                createSilverlight();
            </script>
        </div>
    </div>

In parole povere, l'angolo alto/sinistro dell'oggetto è stato collocato al centro dello schermo usando coordinate percentuali, poi è stato arretrato in orizzontale della sua semilarghezza e in verticale della sua semialtezza.

Se volete vi do anche il link della mia pagina da cui ho estratto questo codice, non è niente di sconveniente!

 

 

   
19. Paperino
giovedì 24 settembre 2009 alle 6:17 PM - firefox 3.5.3 Windows 7
   

@vik: sì il primo draft era piuttosto "acquaqquagghiato" (*)

@MicioDue: suggerimento accolto e implementato, benvenuto fra i commenda.

 

(*) messo insieme alla meno peggio.

   
20. 0verture
giovedì 24 settembre 2009 alle 6:23 PM - firefox 3.5.3 Windows 7
   

Possibile che sia tanto complicato spiegare al browser che una figura deve stare centrata sullo schermo e che deve essere lui a gestire di volta in volta la risoluzione perchè non sta scritto che gli schermi sono tutti uguali ?

   
21. Gabriele
giovedì 24 settembre 2009 alle 11:03 PM - firefox 3.5.3 Ubuntu 9.04
   

Possibile che sia tanto complicato spiegare al browser che una figura deve stare centrata sullo schermo e che deve essere lui a gestire di volta in volta la risoluzione perchè non sta scritto che gli schermi sono tutti uguali ?

Non lo è se si usano browser decenti. Lo è se si vuole che funzioni con tutte le versioni di quelli indecenti.

   
22. floo
giovedì 24 settembre 2009 alle 11:08 PM - firefox 3.5.3 Windows 7
   

Tipo IE 6

Carina la tazza

   
23. wisher
venerdì 25 settembre 2009 alle 12:25 AM - safari 531.9 OS X 10.6.1
   

Paperino consolati, neanche alla Apple sono in grado di posizionare correttamente tutti gli elementi delle finestre

utvv.blogspot.com/.../mac-os-x-glitch-renaming-...

   
24. 0verture
venerdì 25 settembre 2009 alle 12:50 AM - firefox 3.5.3 Windows 7
   

Paperino consolati, neanche alla Apple sono in grado di posizionare correttamente tutti gli elementi delle finestre

E quella sì che è una tragedia... Se esplodono gli iphone pazienza, se buttano giù osx in un nanosecondo evvabbè, se hanno una politica sulla sicurezza degna di zelig si canta in coro "finchè la barca va"... ma se scappa il glitch nel pixel nascosto apriti cielo.

Scommetto che quel bug è già rientrato nella lista rossa delle priorità assolute, il resto quando, se, forse, magari... chissà... tanto la migliore patch è piazzare uno spot truffa sul sito dove si fanno sparate sulla sicurezza che non si sogna neppure la nsa per i suoi sistemi.

   
25. wisher
venerdì 25 settembre 2009 alle 1:46 AM - safari 528.16 iPhone 3.1.1
   

@overture: cosa c'entra? Non mi pare di averred detto che quello e' l'unico problema dei prodotti Apple.

   
26. 0verture
venerdì 25 settembre 2009 alle 1:49 AM - firefox 3.5.3 Windows 7
   

Il modo di lavorare che hanno da quelle parti ecco cosa centra.

Per loro la questione dell'immagine arriva prima di ogni altra cosa perchè sanno che il loro cliente tipo giudica a seconda del colore del fiocco che mettono sulla scatola, invece che gli aspetti tecnici.

   
27. wisher
venerdì 25 settembre 2009 alle 2:08 AM - safari 528.16 iPhone 3.1.1
   

Continuo a non capire i tuoi commenti. Ho mai detto che solo l'aspetto estetico conta? Non mi pare.

Evitiamo di fare delle polemiche inutili.

   
28. Paperino
venerdì 25 settembre 2009 alle 2:50 AM - firefox 3.5.3 Windows 7
   

@Gabriele:

in questo caso sono io che non ho afferreto bene.... mi fa piacere notare il nuovo Gravatar, desumo che è arrivata anche a te...

   
29. Daniele
venerdì 25 settembre 2009 alle 10:21 AM - firefox 3.5.3 Windows XP
   

@MicioDue: conoscevo anche quella, resta comunque un hack... sta di fatto che vertical-align non funziona ancora da nessuna parte.

E, al solito, dovrebbe essere il computer (e quindi i programmi) a fare i calcoli per me, non io per lui...

   
30. MicioDue
venerdì 25 settembre 2009 alle 12:17 PM - IE 8.0 Windows Vista
   

@Daniele: concordo pienamente, vedi la mia perplessità sugli ideatori dei CSS. Non capisco se la cosa rientri fra le scelte progettuali dettate da motivi tecnici o fra le semplici dimenticanze ma è altrettanto vero che lo stesso vertical-align è altamente inaffidabile. Chiedimi perché mi tengo ancora ben strette le care, vecchie tabelle...

   
31. Gabriele
domenica 27 settembre 2009 alle 10:13 PM - firefox 3.5.3 Ubuntu 9.04
   

mi fa piacere notare il nuovo Gravatar, desumo che è arrivata anche a te

Esatto! Nonostante tutto le poste italiane funzionano ogni tanto

   
32. floo
domenica 27 settembre 2009 alle 10:45 PM - firefox 3.5.3 Windows 7
   

Secondo me è l'unica cosa di Microsoft che hai in casa

   
33. 0verture
domenica 27 settembre 2009 alle 10:53 PM - firefox 3.5.3 Windows 7
   

Chiedimi perché mi tengo ancora ben strette le care, vecchie tabelle...

Concordo, tabelle rulez ancora per un po'

Piuttosto viene da chiedersi, alla luce di questi risultati, con quale coraggio ci si scaglia contro certe implementazioni proprietarie. Invece di scassare l'anima alla gente generando flame inutili perchè non si mettono d'impegno risolvendo una volta per sempre queste fastidiosissime falle che sono poi all'origine di certi papocchi fatti ad hoc per garantire i risultati cercati ?

Possono dire quello che voglio: le tabelle per loro potranno anche essere deprecate ma quando la tecnologia che dovrebbe sostituirle combina questi casini, chi lo fa fare al webmaster di adattarsi al nuovo ?

Già vale la regola aurea che si conosce quello che si lascia e non quello che si trova ma qui si conosce pure quello

   
34. Gabriele
domenica 27 settembre 2009 alle 11:29 PM - firefox 3.5.3 Ubuntu 9.04
   

Secondo me è l'unica cosa di Microsoft che hai in casa

Scherzi? Ho tante licenze regolari di sistemi operativi che non volevo acquistare ma venivano in bundle. E ho un mouse marchiato MS.

Possono dire quello che voglio: le tabelle per loro potranno anche essere deprecate ma quando la tecnologia che dovrebbe sostituirle combina questi casini, chi lo fa fare al webmaster di adattarsi al nuovo ?

Intanto la legge Stanca, poi l'accessibilità delle pagine.
Per chi ama l'eleganza del codice la migliore separazione fra contenuto e presentazione e un comportamento migliore al variare della risoluzione dello schermo
Per chi deve manutenere il sito, la possibilità di cambiare impaginazione facilmente (per esempio per creare un layout particolare per schermi ultra-piccoli).

Non capisco dove stia il problema in questa proprietà CSS. Dice che l'oggetto deve essere allineato verticalmente in un certo modo.

Che non è difficile da capire, ma probabilmente non è facilissimo da implementare, visto che esistono browser (tristemente) assai diffusi in cui il supporto è ballerino.
Ma non vedo come si possa migliorare lo standard su questo punto...

   
35. floo
domenica 27 settembre 2009 alle 11:36 PM - firefox 3.5.3 Windows 7
   

Scherzi? Ho tante licenze regolari di sistemi operativi che non volevo acquistare ma venivano in bundle. E ho un mouse marchiato MS.

Quanto mi dispiace

   
36. 0verture
lunedì 28 settembre 2009 alle 12:27 AM - firefox 3.5.3 Windows 7
   

Non capisco dove stia il problema in questa proprietà CSS. Dice che l'oggetto deve essere allineato verticalmente in un certo modo.

Che non è difficile da capire, ma probabilmente non è facilissimo da implementare, visto che esistono browser (tristemente) assai diffusi in cui il supporto è ballerino.
Ma non vedo come si possa migliorare lo standard su questo punto...

Evidentemente se lo standard "dice" ma è tanto difficile da tradurre in 1 e 0 vuol dire che ci troviamo davanti ad un caso analogo di quando si fa una legge assurda senza verificare la sua effettiva applicabilità.

Capisco quando certe genialate escono dalle "menti" dei politici, ma non lo accetto da gente che dovrebbe capirci giusto un acca di informatica e logica annessa.

Confermo quanto affermato tempo fa. Qui c'è gente che crede di essere Dio in terra perchè "gestisce" uno standard, quindi pensa di poter decidere come, quando e se integrare qualcosa anche quando il mercato ha già deciso, favorendo così l'introduzione di sistemi proprietari con tutti i problemi che  comportano. D'altro canto, più cinicamente, mi viene da supporre che queste confusioni sono create ad arte perchè è molto meglio poter organizzare convegni ed assistenze per creare sistemi di transizione che non puntare direttamente al sodo ed al veramente utile (utile non inteso come $$).

Un po' quello che è successo fino adesso con la storia del digitale terrestre. E' dal 2002 che ce la menano con sta storia dello switch off ma invece di cacciare fuori subito le tv con il decoder incorporato (possibilmente con cam e supporto hd se erano plasma/lcd HD) hanno messo fuori le cose con il contagocce così erano tanti più soldi che entravano tra zapper, @mhp, zapper hd, @mhp hd, cam di riffo, cam di raffo, tv senza, tv senza ma hd ecc.ecc, logicamente (e ci mancherebbe) tutte senza una eventuale porta di connessione per permettere una semplice ed economica espansione.

   
37. Paperino
lunedì 28 settembre 2009 alle 7:27 AM - firefox 3.5.3 Windows 7
   

@Gabriele:

In realtà nel caso la questione dei browser centra poco perché tutti i browser si comportano allo stesso modo. Forse sono io che di CSS non ho ancora capito un fico secco ma mi sembrava ovvio che se creassi un DIV su un layer con z-index più alto e lo centrassi nel solito modo (margin auto) sarebbe dovuto apparire al centro. Non capisco perché per fare questa operazione così semplice bisogna adoperare un hack così poco intuibile. Bah

   
38. Daniele
lunedì 28 settembre 2009 alle 11:44 AM - firefox 3.5.3 Windows XP
   

Non capisco dove stia il problema in questa proprietà CSS. Dice che l'oggetto deve essere allineato verticalmente in un certo modo.

Il problema sta nel fatto che in nessun browser funziona

   
39. 0verture
lunedì 28 settembre 2009 alle 2:09 PM - firefox 3.5.3 Windows 7
   

Parlando più tecnicamente non sarà che la colpa della cosa risiede nella mancanza di un bordo superiore ed inferiore della pagina anzi dello schermo del browser stesso ?

Se immaginiamo una pagina web come una bitmap vediamo che in larghezza può avere fondamentalmente due dimensioni (finestra piccola, o tutto schermo) mentre in lunghezza dipende tutto dalla quantità di materiale disponibile.

Se pensiamo che le pagine web devono essere adattate per poter essere stampabili (altrimenti si finisce per avere la roba mal disposta sui fogli reali) forse il problema della centratura ha le stesse origini.

   
[ Pagina 1 di 2  - più vecchi ]
Lascia un commento:
Commento: (clicca su questo link per gli smiley supportati; regole di ingaggio per i commenti)
(opzionale, per il Gravatar)