iPhonify You Web - Understanding iPhone/Android WebDev
•Télécharger en tant que PPTX, PDF•
3 j'aime•669 vues
Recommandé
Recommandé
Contenu connexe
En vedette
En vedette (16)
Plus de Chris Bannon
Plus de Chris Bannon (10)
Dernier
Dernier (20)
iPhonify You Web - Understanding iPhone/Android WebDev
- 1. iPhonify Your Web Apps Chris Bannon http://twitter.com/b4nn0n chrisb@componentone.com
- 2. “A lot of your users have one of these!”
- 3. iPhone touch gestures Tap Pinch Click Zoom Drag/Scroll/Flick Typing Scroll Input http://help.apple.com/ipodtouch/guide/
- 4. Our Website on the iPhone
- 6. Facebook on the iPhone
- 8. Optimize your web content for the iPhone Design a UX that follows Apple’s guidelines Building Great iPhone Sites
- 9. Navigation Model iPhone applications can contain as many different screens as necessary, but users access and see them sequentially, never simultaneously.
- 10. Add a home screen icon Add a startup screen Specify the viewport settings Quick & Easy
- 11. <link rel="apple-touch-icon” href="/icon.png"/> Add a home screen icon <link rel="apple-touch-icon-precomposed” href="/icon_pre.png"/>
- 12. <link rel="apple-touch-startup-image" href="/startup.png"> Add a startup screen
- 13. <meta name = "viewport" content = "width = 590px"> Configure the Viewport
- 14. Email<a href="mailto:frank@example.com">John Frank</a> Phone<a href="tel:1-408-555-5555">1-408-555-5555</a> Text Message<a href="sms:1-408-555-1212">New SMS Message</a> Google Maps<a href="http://maps.google.com/maps?q=cupertino">Cupertino</a> YouTube<a href="http://www.youtube.com/v/VIDEO_IDENTIFIER">Play Video</a> Use hyperlinks
- 15. <link media="only screen and (max-device-width: 480px)" href=“iphone.css" type= "text/css" rel="stylesheet"> Add an iPhonestylesheet
- 16. Metrics – Portrait Orientation
- 17. Metrics – Landscape Orientation
- 18. Metrics - Lists
- 19. Tools for iPhone Web Development iPhone SDK (Dashcode) Apple dev only http://developer.apple.com/iphone/ jQTouch Client-side (jQuery) http://www.jqtouch.com/ Studio for iPhone Server & Client (ASP.NET + jQuery) http://www.componentone.com/
- 20. ASP.NET Controls LaunchPad ViewPort NavigationList Buttons Slider TabBarController MultiView PickerView Calendar CoverFlow ComponentOne Studio for iPhone http://www.componentone.com/
- 21. Tools for iPhone Testing iPhone / iPod Touch Best method for testing http://www.apple.com Mac w/ Windows using Fusion Great for developing & testing together (Being used for this presentation) http://www.vmware.com/products/fusion/ Safari for Windows Similar browser rendering for basic tests http://www.apple.com/safari/
- 22. Time to see some code! What time is it?
- 23. jQTouch http://www.jqtouch.com/ ComponentOne Studio for iPhone http://bit.ly/studio4iphone iPhone Dev Center https://developer.apple.com/iphone VMWare Fusion http://www.vmware.com/products/fusion/ Safari for Windows https://www.apple.com/safari My Blog http://bit.ly/webdevblog Resources
- 24. Rate This Session! http://speakerrate.com/banzor
- 25. Spam Twitter for a Free License! #studio4iphone Tweet for a chance to win! Example: Wow, #studio4iphone from @ComponentOne is the shizz! - http://bit.ly/studio4iphone
- 26. Thanks! Chris Bannon http://twitter.com/b4nn0n chrisb@componentone.com
Notes de l'éditeur
- Since everyone and their Mom has an iPhone, we need to start building web apps that work (well) on them. We will be taking a look at a few techniques for developing iPhone-ready websites. Then we will dive into using ASP.NET to build a working iPhone-optimized web app. The entire app will be an ASP.NET website built in Visual Studio 2008. By the end of this session you will be ready to build an iPhone version of your ASP.NET project without ever leaving Visual Studio.The iPhone has become a common device in the hands of your end users. You’ll learn everything you need to know in order to build Web applications targeted for the iPhone. This session will give you an overview of the iPhone in general including the specs, UI, and behavior. Plus, it takes a look at some popular iPhone sites as well as the tools you may use to build them. After a walk through storyboarding an iPhone Web app as a concept and developing it in ASP.NET, you will be ready to extend your site to the iPhone without ever leaving Visual Studio.
- http://help.apple.com/ipodtouch/guide/
- http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/iPhoneWebAppHIG/MetricsLayout/MetricsLayout.html#//apple_ref/doc/uid/TP40007900-CH6-SW1