Cesvob Costruire e Gestire Siti Web Modulo tecnico-pratico: impostazione tecnologica e funzionale.

Presentazione sul tema: "Cesvob Costruire e Gestire Siti Web Modulo tecnico-pratico: impostazione tecnologica e funzionale."— Transcript della presentazione:

1 cesvob Costruire e Gestire Siti Web Modulo tecnico-pratico: impostazione tecnologica e funzionale

2 http://lnx.cesvob.it/cesvob/formazione/corso-web/index.php

3 Nunzio Castaldi nunziocastaldi@hotmail.com http://www.weben.it

4 creare la nostra identità sul web

5 email: www.hotmail.comwww.hotmail.com rete di contatti - skydrive

6 Lingua, linguaggio, metalinguaggio progettazione target know-how mission Creazione terze parti hosting server dedicato gestione

7 target

8 RAPPORTO ISTAT Cittadini e nuove tecnologie Anno 2008 27 febbraio 2009 Il campione comprende 19 mila 573 famiglie per un totale di 48 mila 861 persone.

9 Le attività di comunicazione hanno un ruolo importante nell’utilizzo di Internet: o ltre il 70% degli utilizzatori di Internet utilizza la posta elettronica Emerge l’uso del web per condividere contenuti Quasi il 40% degli utenti di Internet usa il web per ottenere informazioni sulla P.A. Internet modifica l’uso di strumenti tradizionali come il telefono fisso e i quotidiani in formato cartaceo

10 accessibilità

11 Decreto del Presidente della Repubblica 1 marzo 2005, n. 75 Regolamento di attuazione della legge 9 gennaio 2004, n. 4 per favorire l'accesso dei soggetti disabili agli strumenti informatici Pubblicato in G.U. n. 101 del 3 maggio 2005 la legge Stanca riguarda solo le pubbliche amministrazioni obbligandole ad avere siti accessibili, ma non è un male pensare di portarsi avanti col lavoro in previsione di norme future. In Inghilterra ad esempio ci sono già.

12 ACCESSIBILITA’ la capacità dei sistemi informatici, nelle forme e nei limiti consentiti dalle conoscenze tecnologiche, di erogare servizi e fornire informazioni fruibili, senza discriminazioni, anche da parte di coloro che a causa di disabilità necessitano di tecnologie assistive o configurazioni particolari

13 TECNOLOGIE ASSISTIVE gli strumenti e le soluzioni tecniche, hardware e software, che permettono alla persona disabile, superando o riducendo le condizioni di svantaggio, di accedere ai servizi erogati dai sistemi informatici

14 Art. 2 Criteri e principi generali per l’accessibilità 1. Sono accessibili i servizi realizzati tramite sistemi informatici che presentano i seguenti requisiti: a) accessibilità al contenuto del servizio da parte dell’utente; b) fruibilità delle informazioni offerte, caratterizzata anche da: 1) facilità e semplicità d’uso [usabilità], assicurando, fra l’altro, che le azioni da compiere per ottenere servizi e informazioni siano sempre uniformi tra loro; 2) efficienza nell’uso, assicurando, fra l’altro, la separazione tra contenuto, presentazione e modalità di funzionamento delle interfacce, nonché la possibilità di rendere disponibile l’informazione attraverso differenti canali sensoriali; 3) efficacia nell’uso e rispondenza alle esigenze dell’utente, assicurando, fra l’altro, che le azioni da compiere per ottenere in modo corretto servizi e informazioni siano indipendenti dal dispositivo utilizzato per l’accesso; 4) soddisfazione nell’uso, assicurando, fra l’altro, l’accesso al servizio e all’informazione senza ingiustificati disagi o vincoli per l’utente; c) compatibilità con le linee guida indicate nelle comunicazioni, nelle raccomandazioni e nelle direttive sull’accessibilità dell’Unione europea, nonché nelle normative internazionalmente riconosciute e tenendo conto degli indirizzi forniti dagli organismi pubblici e privati, anche internazionali, operanti nel settore, quali l’International Organization for Standardization (ISO) e il World Wide Web Consortium (W3C).

15 E’ la cosa giusta da fare, perché la rete è condivisione e non esclusione. Capire i vantaggi del considerare tutti i possibili visitatori. Avere un sito accessibile è un ottimo spunto pubblicitario, ed un argomento che può sempre essere citato per farsi notare da stampa ed affini. I numeri sono dalla parte dell’accessibilità: alcuni tipi di dislessia arrivano al 15%, altri tipi di problemi alla vista al 7%, sono cifre decisamente significative. Un sito accessibile, se ben realizzato, non dipende dal mezzo con cui viene visitato. Con sempre nuovi browser, palmari e smartphone che arrivano sul mercato, scegliere un sito accessibile è un’ottima mossa. Miglior posizionamento sui motori di ricerca, grazie anche ad una miglior semantica del codice La popolazione di internet comprenderà fasce di età sempre più avanzate: è importante muoversi anche in questo senso.

16

17 web writing scrivere per il web

18 Utente E’ un impaziente e legge non parola per parola, partendo dalla prima in alto a sinistra, ma "sorvolando" la pagina come un paesaggio visto dall'alto per cogliere, il più rapidamente possibile, se c'è qualcosa che gli interessa davvero.

19 Gli utenti Internet presentano due tipi di strategie di ricerca: di tipo esplorativo (che si esprime nell’osservazione di tutta la pagina) di tipo selettivo (ricerca dell’informazione corretta). Quest’ultima modalità si può, a sua volta, suddividere in due strategie di selezione: auto conclusiva, che termina al reperimento dell’informazione ricercata, esaustiva, che continua nell’esame della pagina nonostante il recupero dell’informazione cercata. Nella ricerca, la posizione delle key words ha un effetto rilevante. Altri studi mettono in evidenza che nelle prime tre fissazioni sulla pagina il testo attrae maggiormente l’attenzione rispetto alla grafica (percentuali del 78% e 22% rispettivamente). Spesso gli utenti non si soffermano sulle immagini se non alla seconda o terza visita alla pagina.

20 Gli utenti, infatti, grazie all’esperienza ripetuta di navigazione, si attende di trovare in particolari posizioni della pagina particolari pulsanti, link o altri elementi. Tanto maggiore sarà la qualità dell’interfaccia tanto più rapidamente potremmo assistere al passaggio dal concetto di “Usabilità” a quello di “Efficienza”.

21 Analisi del percorso oculare Grazie alla tecnologia Eye Tracking è possibile registrare il percorso esatto dello sguardo degli addetti al collaudo documentando in questo modo la sequenza dei punti fissati (fissità).

22 Le linee mostrano il percorso seguito dagli occhi sul mezzo impiegato per il test. I punti fissati sono rappresentati sottoforma di cerchi. Quanto più sono grandi i punti, tanto più a lungo sono stati fissati e tanto più interesse per queste aree è stato dimostrato dall'addetto al test.

23 Ipertesto Il passaggio dalla scrittura lineare del libro alla scrittura "espansa" e "profonda" dell'ipertesto cambia completamente il modo di pensare, progettare e costruire un testo. Sul web il testo acquista un nuovo senso spaziale rispetto alla carta. E' per questo che un ipertesto lo si progetta e lo si costruisce, ancor prima di scriverlo. ORIENTAMENTO MENU’ LINK STORYBOARD

24 Home page La home page è la porta di ingresso, la vetrina del sito. E' lì che l'autore gioca le sue carte per convincere il navigatore a restare o a proseguire il suo giro altrove. Navigatore che non vuole essere impressionato con una grafica pirotecnica e con effetti speciali, ma sapere subito cosa troverà all'interno attraverso un titolo e un sottotitolo, un indice preciso e chiaro. Jakob Nielsen ha definito la home page "la proprietà immobiliare più preziosa del mondo", perché è in quel piccolo spazio che tutto il contenuto del sito deve essere promesso e rappresentato.

25 Brevità Il lettore va catturato subito, con testi sintetici e concentrati. Ma scrivere breve non significa necessariamente sacrificare i contenuti o la forza dell'impatto della comunicazione: significa piuttosto concentrare e affinare il testo. Quando ha bisogno di scrivere di più, il web writer ha comunque a sua disposizione la grande risorsa dell'ipertesto.

26 Abstract Genere di scrittura breve, sintetica e modulare per eccellenza. L'abstract che segue il titolo di un articolo e ne sintetizza i contenuti è il miglior modo per convincere il lettore a cliccare e ad andare alla pagina successiva. Secondo una metafora culinaria molto popolare tra i web writer statunitensi, un testo online dovrebbe prevedere "il morso, lo spuntino e il pasto", ovvero il titolo, l'abstract e il testo intero, a seconda della fame e del desiderio di saperne di più da parte del frettoloso lettore della rete.

27 Microcontent Jakob Nielsen chiama i piccoli testi "microcontent" e con questo termine indica i titoli, i sottotitoli, i link, le voci di indice di una pagina web, i metatag, gli alt text delle immagini. Cioè tutte quelle "perle di chiarezza" di 50 caratteri al massimo che devono contenere e spiegare al lettore il "macrocontent" di intere pagine e quindi attrarlo e guidarlo all'interno di un sito. Scrivere microcontent che siano veri concentrati di contenuto è una delle sfide più difficili per il talento editoriale dello scrittore online. Sintassi breve (soggetto predicato verbo)

28 Titolo Microcontent per eccellenza, titoli e sottotitoli delle pagine e dei paragrafi devono essere progettati e scritti come un vero paratesto ("ciò che sta accanto, intorno al testo"), con la funzione di segnalare e far risaltare i contenuti più importanti. All'interno della mappa visiva della pagina web, devono costituire un primo, ma completo livello di lettura, da cogliere con un solo sguardo.

29 PULIZIA DEL CONTENUTO Colore Grassetto Punteggiatura Font (Verdana - grandezza)

30 Revisione Testi corretti, precisi e privi di refusi depongono a favore della serietà, della credibilità e dell'affidabilità dell'autore e dell'azienda cui appartiene.

31 CREAZIONE

32

33 Registrare un proprio dominio e/o avere uno spazio web gratuito ed eventuali caselle di posta elettronica (costi e modalità operative) Tecnologie per i siti web: contenuti statici contenuti dinamici Software per lo sviluppo/modifica pagine web statiche (HTML) esempio di utilizzo di un software gratuito per la realizzazione di alcune di pagine di un ipotetico sito web Pubblicazione pagine web esempio di utilizzo di un software gratuito per la pubblicazione delle pagine realizzate Gestione di un sito con contenuti dinamici attraverso un Gestionale Cenni alle problematiche legate alla grafica per il web – esempio di utilizzo di un software gratuito per la grafica Come promuovere il proprio sito web presso i motori di ricerca STEP BY STEP

34 Tecnologie Pagine statiche: Realizzazione delle singole pagine in HTML Vantaggi: alto grado di personalizzazione delle singole pagine Svantaggi: richiede competenze specifiche per ogni modifica di contenuti Pagine dinamiche: Utilizzare database e gestionali per organizzare contenuti Vantaggi: semplice da gestire per modificare contenuti Svantaggi: struttura grafica vincolata, utilizzo di linguaggi e competenze specifiche per realizzare il sito (es. ASP, PHP)

35 ASP [Active Server Pages] -> ASP.NET ----- pro -> e' diffuso e trovi un sacco di hosting gratuiti (se il sito è personale) contro -> linguaggio proprietario, supporta solo windowshosting

36 PHP [PHP: Hypertext Preprocessor] ---- pro -> open source, gira su linux e windows. Un sacco di hosting gratuiti. ottima integrazione con la maggior parte dei DB. ottima community. contro -> sono poche le aziende grosse che lo utilizzanoopen sourceaziende

37 JSP [JavaServer Pages] ----- pro -> flessibile, si integra con parecchie tecnologie adottate dal mercato enterprise ed è particolarmente adatta a scenari n-tier. enorme community e prodotti di contorno open source. contro -> curva di apprendimento piu' ripida, generalmente piu' difficile da amministrare. JSP è un linguaggio adatto a prodotti di livello alto, tipo strutture di home-banking o e- commerce a livello internazionale. Non ha senso per i livelli medio-bassi: ci vuole diverso tempo per impararlo ed usarlo, oltre ai costi quasi improponibili per gli hosting.

38 WAMP (piattaforma) WAMP è un acronimo con cui si indica una piattaforma di sviluppo web/database che prende il nome dalle iniziali dei componenti software con cui è realizzata (WINDOWS, Apache, Mysql, Php).acronimowebdatabasesoftware WAMP è gratuito e libero ed è rilasciato sotto la GNU General Public License. È disponibile nelle due versioni installer (auto-installante) e zip (che non richiede l'installazione), quest'ultima utile per poter avviare WAMP da una chiavetta USB. Appserver http://www.appservnetwork.com/ WampServer http://www.wampserver.com/en/ EasyPhP http://www.easyphp.org/index.php

39 Promuovere il proprio sito Presso i motori di Ricerca: Autosegnalarsi Attendere Cercarsi Pagare Sul sito Inserire Keywords Descrivere e dare un titolo Commentare immagini