HTML5 and Joomla! 2.5 Template
•Descargar como PPTX, PDF•
5 recomendaciones•8,444 vistas
OSSFest2012 Presentation (The 11th Thailand Open Source Software Festival)
Recomendados
Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (20)
Destacado
Destacado (19)
Similar a HTML5 and Joomla! 2.5 Template
Similar a HTML5 and Joomla! 2.5 Template (20)
Último
Último (20)
HTML5 and Joomla! 2.5 Template
- 1. The 11th Thailand Open Source Software Festival HTML5 and Joomla! Template Name: Supachai Teasakul Location: Bangkok, Thailand Position: Joomla Translation WG - Joomla.org, DOCMan Translation, LaiThai Developer Team, Project Manager - Marvelic Engine Co.,Ltd. Twitter: @supa_chai
- 2. About HTML5 What is HTML5? 1. HTML5 will be the new standard for HTML. HTML 2. The previous version of HTML, HTML 4.01, came in 1999. The web has changed a lot since then. 3. HTML5 is still a work in progress. However, the major browsers CSS JavaScript support many of the new HTML5 elements and APIs.
- 3. About HTML5 HTML + CSS + DOM + JavaScript The Tech-nology of HTML5 (Editor's Draft 15 May 2012) Semantics Offline & Storage Device Access Connectivity Multimedia 3D, Graphics & Effects Performance & Integration CSS3 http://www.w3.org/html/logo/ New Class: Offline, Nuts & Bolts
- 4. About HTML5 WWW ? 1 http://www.w3.org/TR/html5/ 2 http://dev.w3.org/html5/spec/Overview.html ✓ 3 http://thaicss.com/ ✓ 4 http://www.blognone.com/topics/html5 5 http://www.w3schools.com/html5/default.asp 6 http://www.html5rocks.com/ 7 http://diveintohtml5.info 8 http://www.alistapart.com/articles/previewofhtml5
- 5. Building a Templates Build Your own Joomla! Template Get Requiement and Sketch Building Template Design Cut Outline Template
- 6. Joomla! Templates Inside your own Joomla! template structure • Joomla1.7.x templates - beez5 index.php • Joomla2.5.x templates - beez5 index.php
- 7. Templates Structure Your can change with the sample code. Change from <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 1 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> to The html5.js and must be inserted in the head element (this is because IE needs to know about the element <!DOCTYPE html> before it comes to render them - so it can't sit in the footer 2 of the page, i.e. below the elements in question). http://remysharp.com/2009/01/07/html5-enabling-script/ & Add HTML5 enabling script <!--[if lt IE 9]> 3 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->
- 8. Templates Structure Your can change Elements with the sample structure. HTML 4 HTML 5
- 9. Templates CSS Your can used with the sample code CSS3 http://dev.w3.org/csswg/css3-fonts/ 1 @font-face { font-family: 'Titillium Maps'; src: url("../fonts/TitilliumMaps29L002.eot"); src: local('Titillium Maps'), local('TitilliumMaps'), url("../fonts/TitilliumMaps29L002.otf") format("opentype"), url("../fonts/TitilliumMaps29L002.woff") format("woff"); } CSS3 2 -prefix- Supported by Internet Explorer with the prefix -ms- Supported by Firefox with the prefix -moz- Supported by Google Chrome with the prefix -webkit- Supported by Safari with the prefix -webkit- Supported by Opera with the prefix -o- IE support css3 from http://css3pie.com/ http://www.css3.info/
- 10. Joomla! Templates Joomla! Template framework supported HTML5 technology ✓ Warp6 http://www.yootheme.com/themes/warp-framework
- 11. Joomla! Templates Joomla! Template framework supported HTML5 technology
- 12. Joomla! Templates Joomla! Template framework supported HTML5 technology
- 13. Joomla! Templates Joomla! Template framework supported HTML5 technology
- 14. HTML5 in mobile devices Key features for mobile devices Advanced GeoLocation forms API Video and audio streaming Canvas support drawing Offline support
- 15. Joomla! in mobile devices Showcase mobile devices
- 16. Template in mobile devices Showcase for mobile devices JA Elastica from Joomlart
- 17. Q&A
- 18. THANK YOU!