L’umiliazione degli incompetenti: la home page del portale dalle tabelle ai CSS in mezza giornata

45 milioni di euro di stanziamento, il consorzio di imprese IBM/ITS/Tiscover, Ministri dell’Innovazione, leggi, decreti, tre anni di lavoro: ne esce fuori un sito sfigato fatto in tabelle. Poi arriva Marco Pugliese aka Pugia, uno dei tanti italiani in gamba e che sa il fatto suo, e rifà il layout della home page di italia.it in XHTML/CSS in mezza giornata. Ce lo racconta con splendida flemma nel post che segue. Meraviglioso.

Dopo tanto tempo è nato finalmente Italia.it, il portale del turismo nato da un’idea dell’ex Ministro dell’Innovazione Lucio Stanca e presentato in pompa magna pochi giorni or sono dal ministro Francesco Rutelli, e che è stato pagato con i soldi dei contribuenti, con uno sforzo economico pari a 45 milioni di euro!!!

La cifra è nota da tempo e ha alimentato un’immensa aspettativa nei confronti del sito, tanto che il giorno dell’inaugurazione e il giorno successivo il sito ha subito grandissimi rallentamenti, risultando persino inaccessibile in alcuni momenti della giornata.


Il logo di italia.it

Non riuscendo ad accedervi per molto tempo mi sono accontentato di leggere le recensioni di alcuni siti e blog che seguo, a partire naturalmente dalle webnews di HTML.it, e dallo stesso blog di HTML.it, dove si è scatenata una vera e propria discussione tra i lettori, a suon di commenti.

Sono poi passato a leggere i messaggi di due dei miei blog preferiti, DesMM e ICTblog entrambi con connotazioni diverse, soprattutto quella di ICTblog, più orientata verso lo scandalo dei 45 milioni spesi.

In tutto ciò però ancora non avevo avuto modo di vedere il codice del sito, perché sempre irraggiungibile, ma da quanto ero riuscito a leggere avevo capito che si trattava di una vera e propria schifezza! E infatti è stato proprio così: nonostante una grafica che ritengo veramente molto ben congegnata, il sito si ritrova con una quantità di errori inimmaginabile, a partire dai menù in tedesco per tutte le lingue in cui è stato tradotto il sito, fino ad arrivare a pagine mancanti o non funzionanti.

Un sito che è gestito dal governo poi che non rispetta le minime regole per l’accessibilità e si limita a consigliare di scaricare software per aiutare la navigazione…sembra quasi uno scherzo. Tra i commenti al blog di HTML.it si legge di persone che hanno inviato note alle Iene per cercare di far arrivare la questione in televisione e avere quindi più visibilità e magari risolvere questa situazione.

Io di solito penso in modo più diretto e materiale, e allora ho realizzato una versione del layout del sito Italia.it, completamente in XHTML e CSS, per dimostrare al mondo, e soprattutto agli sviluppatori e gestori del sito che era possibile realizzarlo in mezza giornata, senza spendere 45 milioni di euro, e senza affidarsi a IBM Italia S.P.A, ITS S.p.A e Tiscover AG. per ottenere un buon risultato.

La mia versione del portale è l’inizio di un progetto che nascerà e che si chiamerà proprio “Replay” in cui proverò a rendere alcuni famosi e utilizzati siti tabellari in codice XHTML corretto e sviluppato graficamente utilizzando i CSS. A breve sarà presente una vera e propria sezione sul sito.

Per il momento il replay della pagina funziona correttamente solo con Mozilla Firefox e Opera, appena avrò un po’ di tempo cercherò di ottimizzarla anche per Internet Explorer. Inoltre la pagina è scaricabile interamente da qui in un file zip da 176 Kb. Così se coi sviluppatori del portale vorrete “prendere spunto” farete anche meno fatica, in fondo mi sembra che ve li siate proprio sudati quei 45 milioni…

Aggiornamenti:

Ora la mia versione si vede correttamente anche con Internet Explorer a partire dalla versione 6, e con Safari per Mac OSX.

22 comments so far

  1. bisontebiscottato on

    mitico! questa è musica per le mie orecchie!

  2. disinteressato on

    Riprodurre la home page di un sito in mezza giornata non equivale a costruire tutto il portale. Per muovere le critiche è necessario fare delle osservazioni più taglienti di così ;D

    Saludos

    p.s. Le tue versioni del portale bloccano i tab di Firefox

  3. elle on

    Che fa adesso una povera crista che d’estate affitta la propria casa al mare (ben 100mq!) ed è finita.. negli agriturismi con case (al plurale), piscina, cavalli e ristorazione?
    Si fa cambiare il numero di telefono di casa? Ma chi ha dato le informazioni a questi?
    ohmiodddio…:'(

  4. Roberto Dadda on

    E allora?
    Disinteressato credo che tu non abbia capito molto dello spirito della iniziativa di Pugia: ha cercato molto efficacemente di fare vedere che una pagina identica può essere realizzata molto velocemente utilizzando tecniche moderne e sopratutto standard.
    E ci è riuscito pienamente!
    bob

  5. che poi la spocchia on

    la trovo insopportabile, che poi i linguaggi cambiano più veloci della luce e quello che oggi è figo domani è sfigato, che poi per quanto concordi sul fatto che 45 milioni di euro (argh!) dovrebbero garantire il massimo della tecnologia web, della funzionalità e della comunicazione, detesto profondamente quei webdesigner e programatori (e sopratutto quei programmatori che si spacciano per webdesigner e sopratutto anche viceversa) che decretano ciò che deve essere fatto e ciò che no, ciò che è giusto e ciò che è sbagliato (chiaramente senza dare spiegazioni e indipendentemente dal fatto che funzioni o meno), che poi se voglio fare un sito in tabelle lo faccio quando mi pare e tu brucia pure qualche altra strega, che poi lo sfigato è chi ha bisogno di decidere cosa è figo, è un po’ come la gente che ha bisogno di leggere la critica prima di dire se un opera d’arte è un opera d’arte o che qualcuno gli dica qual’è la cosa giusta da dire alla fine odi le tabelle ma intabellato sei. ies. pura bacchettonaggine.

  6. GDL on

    Vorrei far notare che anche dal punto di vista degli adempimenti legali il sito è gravemente carente! Policy privacy e informativa vengono unificate con contenuti non conformi a quanto richiesto dalla legge. Idem per le condizioni di utilizzo. Accessibilità, riuso dei dati e chi più ne ha più ne metta…

  7. Maurizio on

    Sono più di 2 anni che tengo sotto controllo quel sito (per via della cifra spesa e dell’eterna pagina di lavori in corso). Io non entro neanche nel merito del sorgente HTML. Non parlo di tabelle. Io parlo del furto dei 45 milioni di euro. Senza mezzi termini. Un cinquantesimo di quella cifra sarebbe stato esoso. E poi leggo che la metà di quella cifra è stata spartita tra le regioni per l’introduzione dei contenuti! Qui serve un’inchiesta per scoprire a cosa siano serviti tutti quei soldi. E pensare che ci sono ospedali senza strutture adeguate per mancanza di fondi…

  8. Luigi Gelli on

    Ho visto che è stato avviato un progetto, ancora in fase embrionale, di un portale “open” di italia.it:

    http://www.openitaly.net

    Staremo a vedere…

  9. Old Jacques on

    @ che poi la spocchia:
    purtroppo il tuo Rant contro il correre dietro “l’ultima” tendenza di CSS per separare contenuti da presentazione è stato sancito qualche anno fa (inizio 2004) dallo stesso governo italiano (mah, era un’altro governo, ma lo stesso stato) con qualcosa conosciuta come la “Legge Stanca”, che scorraggia l’utilizzo di tabelle per impaginazione e consiglio vivamente (oltre ad obbligarlo per siti nuovi della PA) di separare contenuti da presentazione in maniere di rendere fruibile le informazioni di un sito pubblico al più grande “pubblico” possibile.

    Cosa che il zuppone di Tag e le numerosissime tabelle innidate del sito http://www.italia.it non fanno.

    Per cui non è tanto desiderio dei programmatori “fare scena” ma lo stesso governo italiano che lo impone per i siti pubblici.

  10. Mattia on

    Se risolvi gli ultimi errori di codice (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.pugia.com%2Freplay%2Fitalia_it%2F), che sono quasi tutti tag “param” non chiusi (manca lo slash finale), è perfetto.

  11. Michele on

    Ragazzi l’accessibilità non è solo una questione tecnica. Un layout fatto con table può essere validato ma questo non implica accessibilità tecnica. E l’xtml? e lo strict.. l’html transitional non si deve usare. Leggetevi i requisiti vi prego.

    Poi DOPO aver risolto i problemi tecnici rispettando alla lettera i requisiti vi prego di passare al problema ben più serio dell’accessibilità dei contenuti.

    E allora codice colore, ampiezza dei font, contrasti, disposizione degli spazi funzionali, visibilità in modalità solo testo, ecc..

    Se pensate che l’accessibilità si limiti a far validare la pagina dal validatore w3c (opinione ahimè diffusa) beh.. siete in alto mare.

  12. Michele on

    oops… scusate avevo letto solo l’ultimo post e avevo frainteso..

    cmq anche se xtml strict e validato e table less (che sono requisiti INDISPENSABILI e che i megatecnici del ministero non erano riusciti ad implementare) il sito presenta evidenti lacune di accessibilità..

    tu Marco hai fatto un ottimo lavoro e dimostrato che con un minimo di impegno e competenza si possono risolvere questo tipo di questioni..

    ma qui manca una progettazione accessibile.. NON SI SONO MAI POSTI IL PROBLEMA..

  13. Andrea Rufo on

    Grazie per lo splendido lavoro che state facendo: spero che serva a qualcosa.

    W L’ITALIA

  14. Andrea Rufo on

    Ma… visto che questo sito “non rispetta la legge”, non si può denunciare qualcuno?

  15. […] segnalato dai ragazzi di Scandalo Italiano e da Ramos, non posso mancare di segnalare il lavoro di Pugia, web designer (e non so che altro :P) […]

  16. Contz on

    Davvero scandaloso, appena ho un minuto linko la notizia… Tutti devono sapere…

  17. gaba on

    “ho realizzato una versione del layout del sito Italia.it, completamente in XHTML e CSS, per dimostrare al mondo, e soprattutto agli sviluppatori e gestori del sito che era possibile realizzarlo in mezza giornata”

    bel lavoro, e bella idea quella del Replay,
    tuttavia il lavoro di layout di un template non equivale a “realizzare un sito”
    e in effetti (non me ne volere :.( ) ci sono aggiustamenti da fare per visualizzare bene e senza diffetti la pagina con firefox (per esempio il meteo sfonda la colonna di destra)… non considerare il lavoro concluso così, please!

    ciao

  18. Pugia on

    Spero nelle iene di questa sera, perché Striscia non credo che ne parlerà…

    @gaba
    sicuro di quel problema? con che risoluzione stai guardando la pagina?

  19. Gio' on

    Sezione di TEST!!!! del mapviewer!!!!!!!!!
    ——————————————–
    http://www.italia.it/MapViewerWeb/

    ..sono andati on-line con mezzo sito pieno di “work-in-progress” !!!!!!!!!!!!!!

  20. Pier Luigi on

    Comunque le tabelle sono ancora il modo migliore per ottenere la retrocompatibilità con i vecchi browsers su layout grafici complessi.
    E’ del tutto inutile realizzare un sito in “codice corretto” quando poi i vari browser lo interpreteranno correttamente solo nella “prossima versione”.
    Purtroppo l’unica strada è quella lunga e laboriosa di testare sul campo con i principali browser per le principali piattaforme (Win,Mac,Linux) e correggere i problemi.

    A conferma di questo e per inciso, faccio notare che con Firefox 2.0 versione Mac OS X l’unica pagina realizzata da Pugliese (riciclando e non ricreando da zero il progetto grafico) non si visualizza correttamente:
    – il tasto arancione del cerca va a capo
    – l’immagine della modella viene renderizzata sotto il lato inferiore della cartina lasciando sopra di essa un rettangolo bianco completamente vuoto
    – il blocco meteo ha un bordo destro che va di circa 5 px al di la del bordo destro della pagina

    Con Safari 2.0.4 le cose vanno anche peggio visto che oltre a questo, anche la parte bassa a 3 colonne si scompagina completamente.

    Con Explorer 5 Mac (ormai morto ma ancora utilizzato da utenti con MacOs9) si fatica a capire che si tratti di un sito web

    Con Opera 9 e precedenti i problemi sono appena peggiori di quelli di Safari con in più il fatto che ad ogni caricamento la pagina viene per un attimo visualizzata senza il foglio di stile applicato.

    Ovviamente la situazione di Italia.it è indifendibile ma per i tempi e costi e non certo per la presenza di tabelle nell’impaginazione.

  21. Old Jacques on

    “Comunque le tabelle sono ancora il modo migliore …”

    Fino ad un certo punto, magari sì, ma non serve annidare a 7-8 livelli di tabelle per garantire la compatibilità con vecchi browser.

    Spesso basta una, massimo due livelli per garantire sia la compatibilità crossbrowser che la fruibilità linearizzata con tecnologie non PC+Schermo 1024×768, tipo screen reader o palmari.

  22. […] Per capire il perchè… si può cominciare da QUI. Per ricordare com’era l’immagine grafica di italia.it  si può fare un salto da Pugia, che con XHTML e i CSS, due giorni dopo il debutto Rutellico, replicò la pagina principale di italia.it in mezza giornata di lavoro. […]


Lascia un commento

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...

%d blogger cliccano Mi Piace per questo: