Downloaded 53 times
![HTML5 e Css3 [1]
Matteo Magni](https://image.slidesharecdn.com/01html5css3-130516122116-phpapp02/85/HTML5-e-Css3-1-WebMaster-WebDesigner-1-320.jpg)
![HTML5 e Css3 [1]
Matteo Magni](https://image.slidesharecdn.com/01html5css3-130516122116-phpapp02/75/HTML5-e-Css3-1-WebMaster-WebDesigner-1-2048.jpg)
![Components [2]
● Attivatore HTML5: una delle feature più
interessanti del progetto. Cosa succede se un
vecchio browser che non conosce HTML5? Ci
pensano Modernizr o html5shiv
● Google Analytics: per avere il codice ottimizzato
per il potente mezzo messo a disposizione da
BigG](https://image.slidesharecdn.com/01html5css3-130516122116-phpapp02/85/HTML5-e-Css3-1-WebMaster-WebDesigner-37-320.jpg)
Uploaded byMatteo Magni
HTML5 e Css3 - 1 | WebMaster & WebDesigner
Il documento discute le evoluzioni da HTML4 a HTML5, evidenziando nuove funzionalità e l'importanza del web semantico per una migliore comprensione da parte dei browser. Vengono presentate nuove strutture e tag come header, nav, footer, section, article e aside, necessari per organizzare il contenuto in modo significativo. Infine, si accenna all'HTML5 Boilerplate, un template progettato per supportare la compatibilità con i vecchi browser pur sfruttando le funzionalità avanzate di HTML5.
More Related Content
Similar to HTML5 e Css3 - 1 | WebMaster & WebDesigner
HTML5 e Css3 - 1 | WebMaster & WebDesigner
- 1. HTML5 e Css3[1] Matteo Magni
- 2. HTML 4 La specificadell'HTML 4 risale al 1999 HTML 4.01 Specification W3C Recommendation 24 December 1999 http://www.w3.org/TR/html4/
- 3.
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 11.
- 12. New Doctype <!DOCTYPE html> Lomanteniamo per compatibilità ma lo semplifichiamo.
- 13.
- 14. Web Semantico “Con iltermine web semantico, termine coniato dal suo ideatore, Tim Berners-Lee, si intende la trasformazione del World Wide Web in un ambiente dove i documenti pubblicati (pagine HTML, file, immagini, e così via) siano associati ad informazioni e dati (metadati) che ne specifichino il contesto semantico in un formato adatto all'interrogazione e l'interpretazione (es. tramite motori di ricerca) e, più in generale, all'elaborazione automatica.” (wikipedia)
- 15. L’intento del W3Cè quello di standardizzare nuovi comandi e funzionalità che permettano la visualizzazione dei contenuti in una determinata modalità, senza il ricorso a plugin o ad estensioni di natura proprietaria dei browser. Si punta ad arrivare a visualizzare lo stesso contenuto, indipendentemente dalla versione del browser. Si cerca di avere un tag specifico per ciascun tipo di informazione così che sia possibile per il browser comprendere il “contenuto” del documento, leggendone soltanto la struttura
- 16.
- 17. L'id header dainformazioni? O serve solo per applicare degli stili?
- 18.
- 19.
- 20. Header Header contrassegna l'intestazionedi una sezione. Visto che un documento può avere più sezioni potrà avere anche più intestazioni.
- 21.
- 22. nav ● Contiene elementidi supporto alla navigazione ● Possono essere sia link interni che esterni alla pagina ● Non tutti i gruppi di link devono per forza essere dentro elementi nav
- 23.
- 24. Piè di pagina ●Un piè di pagina contiene tipicamente informazioni sulla sua sezione come chi l'ha scritto, collegamenti a documenti correlati, dati, diritti d'autore e simili. ● Non è detto che sia in basso, il nome trae in inganno. ● Possono esserci più sezioni footer come per gli header
- 25.
- 26. Section ● L'elemento sezioneracchiude contenuti logicamente correlati ● Il capitolo di un libro ● Le sezioni di cui si compone una ricerca ● ...
- 27.
- 28. article ● Article serveper marcare un contenuto che ha senso di esistere e di essere distribuito in modo indipendente, autonomo. ● Gli elementi article possono essere annidati ● Article che contiene il post di un blog annidato con altri article che contengono i commenti.
- 29.
- 30. aside ● Aside serveper dichiarare che la sezione aside è collegata con la sezione che lo contiene ma che il suo collegamento è debole. ● Se contenuto in un article esempio può aggiungere le note a margine.
- 33. http://html5boilerplate.com/ HTML5 Boilerplate èun template che racchiude HTML5, CSS e JavaScript per tutti gli sviluppatori che vogliono un prodotto compatibile anche con i vecchi browser - qualcuno ha nominato Internet Explorer 6? - senza però rinunciare alle feature di HTML5.
- 34. La paternità delcodice è di Paul Irish, membro nella comunità di sviluppo di Google Chrome e di jQuery, che mette a disposizione una struttura di file e directory comprensiva di jQuery, Modernizr (di cui vi abbiamo parlato in un articolo) e DD_belatedPNG una "medicina" che consente di implementare la trasparenza dei files immagini PNG anche sul vecchio IE6. http://www.html5today.it/link/boilerplate-template-html5-secondo-paul-irish--prima-parte
- 36. components ● Classi Condizionali:che permettono di avere dei fogli di stile ad hoc per vecchie versioni dei browser ● Mobile: che permette una visualizzazione migliorata del template nei nuovi device mobili come smartphone e tablet ● Javascript: potete scegliere se implementare o no le librerie JQuery o JQuery.min
- 37. Components [2] ● AttivatoreHTML5: una delle feature più interessanti del progetto. Cosa succede se un vecchio browser che non conosce HTML5? Ci pensano Modernizr o html5shiv ● Google Analytics: per avere il codice ottimizzato per il potente mezzo messo a disposizione da BigG
- 38.
- 39.