Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JF02PR4 - Performance Techniques & Tricks for Responsive Web Design in Joomla! & K2 (Fotis Evangelou)
Search
JoomlaFrappe
April 12, 2013
Technology
1
180
JF02PR4 - Performance Techniques & Tricks for Responsive Web Design in Joomla! & K2 (Fotis Evangelou)
Related video:
http://www.youtube.com/watch?v=9KKZ-dtFC0c
JoomlaFrappe
April 12, 2013
Tweet
Share
More Decks by JoomlaFrappe
See All by JoomlaFrappe
JF02PR1 - JoomlaFrappe News (Fotis Evangelou)
joomlafrappe
0
110
JF02PR3 - PHP & MongoDB: Shaken, not stirred (Spyros Passas)
joomlafrappe
2
120
JF02PR2 - Joomla! στο Azure – τσάμπα & σε λίγα λεπτά (Δημήτρης Κουτσαναστάσης)
joomlafrappe
0
100
JF02PR5 - Zimbra Collaboration Suite μία δωρεάν εναλλακτική λύση στη σουίτα Google Apps (Κωνσταντίνος Παππάς)
joomlafrappe
0
94
JF01PR1 - JoomlaFrappe News (Fotis Evangelou)
joomlafrappe
0
240
JF01PR2 - Pragmatic Responsive Web Design (John Tsevdos)
joomlafrappe
2
160
JF01PR3 - 10 μικρά-μεγάλα μυστικά του Joomla! (Manolis Markatselas)
joomlafrappe
0
350
JF01PR4 - CSS Authoring με SASS & LESS (Panos Spiliotis)
joomlafrappe
4
140
JF01PR5 - Δημιουργία εφαρμογών στο Joomla! χωρίς να τρελαθείτε (Nicholas Dionysopoulos)
joomlafrappe
0
220
Other Decks in Technology
See All in Technology
API Gatewayと少し仲良くなってみた!
masuchoku
0
100
ユーザーストーリーのレビューを自動化したみたの
bun913
1
410
非同期推論システムによるコスト削減と信頼性向上
koki_nishihara
0
150
Janus
bkuhlmann
1
490
アクセス制御にまつわる改善 / Improving access control
itkq
0
510
Cloud Native Java with Spring Boot (CNCF Aarhus, April 2024)
thomasvitale
1
160
KubeConにproposalを送りたい人へのアドバイス
sat
PRO
3
230
自己改善からチームを動かす! 「セルフエンジニアリングマネージャー」のすゝめ
shoota
6
250
ChatworkのSRE部って実は 半分くらいPlatform Engineering部かもしれない
saramune
0
150
Oracle Cloud Infrastructure:2024年4月度サービス・アップデート
oracle4engineer
PRO
1
190
Postman v10リリース後を振り返る
nagix
0
170
KubeCon EU 2024 Recap “Kubernetes Policy Time Machine: Where to Next?”
ryysud
0
200
Featured
See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
14
1.5k
BBQ
matthewcrist
80
8.8k
The World Runs on Bad Software
bkeepers
PRO
61
6.7k
The Art of Programming - Codeland 2020
erikaheidi
42
12k
Design by the Numbers
sachag
274
18k
4 Signs Your Business is Dying
shpigford
175
21k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
9
8.3k
Thoughts on Productivity
jonyablonski
58
3.8k
Designing with Data
zakiwarfel
96
4.8k
A Tale of Four Properties
chriscoyier
151
22k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
18
6.9k
KATA
mclloyd
15
12k
Transcript
Performance Techniques & Tricks for Responsive Web Design in Joomla!
& K2 Fotis Evangelou (Nuevvo)
Performance Techniques
http://laurakalbag.com/ display-none/
IE CSS class on HTML tag
Conditional module position loading via special module chrome...
..and some JavaScript
Περισσότερα για conditional loading http://filamentgroup.com/lab/ajax_includes_modular_content/
Conditional JS/CSS loading using enquire.js, Respond.js or use this CSS/JS
trick http://www.springload.co.nz/love-the-web/responsive-javascript
Social Widget Lazy/Async Loading http://www.phpied.com/c3po-common-3rd-party-objects/
SocialCount http://filamentgroup.com/lab/socialcount/
Images
Responsive Images (use K2!)
Lazy Loading
Use a service http://docs.sencha.io/current/index.html#!/guide/src
Other services... http://ir0.mobify.com/WIDTH/URL http://cdn.filter.to/WIDTHxHEIGHT/URL http://boxresizer.com http://cloudinary.com/ http://www.resrc.it/
#RWD Tips & Tricks
Navigation http://mobile.smashingmagazine.com/2012/10/08/the-semantic-responsive-design-navicon/ http://css-tricks.com/responsive-menu-concepts/ https://speakerdeck.com/dbushell/responsive-navigation Never duplicate the HTML markup (and
show/hide per browser type) Use JS to add a toggler or Use flaunt.js to automated mobile menus!
Use Responsive Lightbox Scripts http://brutaldesign.github.io/swipebox/ http://www.frescojs.com/
Responsive media (video & audio) via AllVideos or fitvids.js (or
other)
Use “icon” fonts from fontello.com entypo.com
Responsive Tables http://www.zurb.com/playground/responsive-tables & Foundation 4
Ευχαριστώ @fevangelou