Upgrading to Joomla 2.5 with responsive design #JoomlaGov
Jul 21, 2015
Upgrading to Joomla 2.5 with responsive design
#JoomlaGov
Time for change?Growth over the past 2 years
● Visits: 36,346● Pageviews: 101,514● New Visitor: 86.08%● Returning Visitor: 13.92%● Language: 55.29%
Phase 1 - Upgrade Joomla
1.5.26 > 2.5.4
Not as complicated as expected!!● download install and run jUpgrade (http://redcomponent.com/jupgrade)
● install missing components● rebuild menus● fix bugs
Issues● large files - not easy to move to local dev area (cache, media, db)
Phase 2 - Upgrade TemplateIntroduce HTML5 / CSS3
● rebuild existing design using new code● add fallback for browser support● test test test
Issues● backward compatibility (IE6, 7, 8)
● respond.js● html5shiv.js● selectivizr-min.js● PIE.htc
Phase 3 - Going ResponsiveChicken or the Egg?
● mobile first or desktop first?● strategy● design● coding● testing● deployment
Issues● backward compatibility (IE6, 7, 8)
● Navigation● Images● Tables● Converting old fixed-width site
Viewport SizesPopular viewports
● 240px - small phone● 320px - iPhone portrait ● 480px - iPhone landscape● 768px - iPad portrait● 1024 + - desktop
Responsive Testing ToolsOnline tools
● http://mattkersley.com/responsive/● http://quirktools.com/screenfly/● http://www.responsinator.com/● http://labs.adobe.com/technologies/shadow/
Tips and tricks● use breakpoint.js to make changes to content● ordering of responsive CSS files● only load CSS for specific viewport size adapt.js
What Next?Performance enhancements
● combine CSS/js● compress HTML/CSS/js● aggressive caching
Adaptive design ● new template for every view
Mobile app● submit content using mobile devices
Thanks to Joomla! Community & others● @Marcos Peebles & Cédric Doppagne from piezoworks together with● Dwight Barnard, Jarred de Beer, Ian Gibbins and @Matthew Philogene from raramuridesign, for
building and maintaining the site.● @Brian Teeman for inspiring and posting the original Blog post and the follow-up, which ended
being this site, and the Video, see the home page.● @Ryan Ozimek for leading the effort on building the mega list on the Joomla! wiki page and
those who helped maintaining the list● aka JSYEWC* - the Joomla's Silent Yet Efficient Working Community -● @hamanaka, @joomlaworks, @vistamedia, @BrianTeeman, @Alledia, @Isidrobaq, @carcam,
@ot2sen, @jcardenasvejar, @gnumax, @JWillin, @neo_sigsiu_net, @jen4web, @javi_gomez, @chessman2212, @ivanramosnet, @rdeutz, @hagengraf, @JustinHerrin, @jonnsl, @lookielou, @pe7er, @krijksen, @joomlacorner, @nikosdion @AlexRed...
● @Hilary Cheyne and @Torettox84 and @219jondn for offering their support and help on editing.
Inspiration and awesome supportHils Cheyne | Marcos Peebles | Language additions from OpenTranslators.org | Daniel Tapia Lehmann