Hear valuable insights into Facebook applications and the vast number of things you can do with them, mobile applications (and how to turn your existing website into an app) as well as that term we're sure you've been hearing around the block, Responsive Web Design.

1. Digital Strategy 2014
Facebook & Mobile Apps +
Responsive Design
Nicholas Fritzkowski
October 2013

2. Facebook & Mobile Apps + Responsive
Design
Topics of
discussion
Responsive and Adaptive Web Design
Facebook Apps and Tabs
Mobile Apps

3. Mobile Devices
Mobile Devices To Eclipse PCs In
Q4 This Year
IDC (International Data
Corporation) has released its
latest devices forecast arguing
that tablets will overtake PC
shipments by year end.
Mobile phone online usage
(ACMA 2012)
9.2 million Australians went
online via their mobile phone
in the six months to May
2012, with 4.4 million accessing
the internet using a tablet.
Smartphone and tablet apps

4. Mobile Devices
Activities undertaken online via mobile phones

5. Responsive and Adaptive Web Design
1
About Responsive Web Design
2
About Adaptive Web Design
3
Google and search engines
4
Example of Responsive Web Design
5
Example of Adaptive Web Design

6. Responsive and Adaptive
Web Design
What is Responsive and Adaptive Web Design?
Responsive and Adaptive web design is terms used for mobile
friendly versions of web sites. Both Responsive and Adaptive allow
websites to be viewed on mobile devices from iPads and iPhones, to
Android tablets and phones, Surface tablets and Windows Phones.

7. Responsive vs Adaptive
Responsive
Fluidly change and respond to fit any screen or device size.
Adaptive
Change to fit a predetermined set of screen and device sizes.

8. About Responsive
Responsive Web Design
Uses CSS code to modify the website based on the size of screen it is
displayed on.
Responsive web design relies on HTML5, CSS3 and Javascript and
therefore works best in relatively modern web browsers.
Responsive web design is best suited because of the many devices
available, over 1000 different devices and changing daily.
Google loves responsive as all content gets carried over.
Slight design limitations due to grid format required.

9. About Adaptive
Adaptive Web Design
Uses the server and code to detect which device it is on and switches
the site it shows.
Adaptive requires you to develop and maintain two separate
websites in separate areas of your site.
With a separate website you can fine tune and optimize how your
site shows on targeted devices.
You can optimise images specifically for mobile and low bandwidth
devices.
SEO, content and links can be mobile centric targeted for quicker
viewing.

10. Google and search engines
Google supports smartphone optimised sites in three
configurations:
• Sites that use responsive web design, i.e. sites that serve all
devices on the same set of pages and use CSS to change how the
page is rendered on the device. This is Google's recommended
configuration.
• Sites that dynamically serve all devices on the same pages but
change depending on whether the device is a desktop or a mobile
device.
• Sites that have separate mobile and desktop URLs.
Why responsive design:
Google recommends using responsive web design because it has
many good aspects:
• Using a single page for a piece of content makes it easier for your
users to interact with, share, and link to your content.
• No redirection is needed for users to get to the device optimized

11. Example of Adaptive Web
Design
Gold Coast
Convention Centre

12. Example of Responsive
Web Design
Gold Coast
Lawyers

13. Facebook & Mobile Apps
1
Facebook Apps and Tabs
2
Examples and Resources of Facebook Apps
3
What is a Mobile App
4
Technologies and problems
5
Examples and Resources of Mobile Apps

14. Facebook Apps and Tabs
Facebook Apps
Games and other full applications.
More often than not requests
permissions which can scare
customers.
Facebook Tabs
Simple page with detailed
information, competitions, forms,
menu’s etc.
For use with Facebook Pages a value
add for companies.

15. Facebook App Example
Candy Crush Saga

16. Facebook Tab Example
Heritage Bank
Volunteer of the year
The Anchorage
Competition to win a
dinner for 2

17. Examples and Resources
of Facebook Apps
Pre-existing Apps and Tab management sites.
Facebook App Center
Instagram, Pinterest, Bigcommerce, Soundcloud, Bandpage.
https://www.facebook.com/appcenter
Involver Apps
Coupons, Twitter, RSS, Flickr, Youtube.
http://www.involver.com
PageModo
Custom tabs, maps, coupons, twitter, competitions,
Pinterest, Instagram, sell products.
http://www.pagemodo.com/

18. What is a Mobile App
Mobile Applications
For iPhones and iPads, Android phones and tablets, Windows
Phones, tablets and PC’s.
Three main app stores, Apple’s App Store, Google Play
(Android), Windows Store.

19. Technologies and
problems
Web Apps
Can work on every
device but doesn’t
appear in the app store.
Think like your
customer… when was the
last time you
downloaded an app for
a local business?
Web apps solve this issue
by showing the web app
to the client when they
visit your site via their
mobile browser.

20. Technologies and
problems
Native Apps
Requires a new app for
every device.
Possibility of wrapping
a web app with
frameworks.
Allow for functionality
higher than just your
website.
Companies who might
benefit from a mobile
app.
Pizza chain who wants to

21. Examples and Resources
of Mobile Apps
How much does it cost
http://howmuchtomakeanapp.com/
Mobile Tuxedo
http://www.mobiletuxedo.com/
iTunes App Store
https://itunes.apple.com/au
Google Play
https://play.google.com/store
Windows Store
http://www.windowsphone.com/en-au/store

22. Digital Strategy 2014:
Questions?
Questions?