SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    16,448
    Mentioned
    160 Post(s)
    Tagged
    1 Thread(s)

    Mobile Devices Resources

    TABLE OF CONTENTS
    GETTING STARTED - ANDROID DEVELOPMENT
    DEVELOPMENT FRAMEWORKS
    DESIGN - CSS - DETECTION
    EMULATORS
    GEO LOCATION
    CONVERTING
    EMBEDDING
    SitePoint
    MISCELLANEOUS
    Contributors

    GETTING STARTED - ANDROID DEVELOPMENT

    How about starting here
    Smartphone Browser Landscape - A List Apart

    Then work your way down the list of topics on the left. It is very in depth and easy to follow. Just one thing to note when doing it, if you add acitivities to your package, you must manually insert them into the manifest.xml file.
    Application Fundamentals - Android Developers

    Here are a few other links you can also look at when done reading that:
    android 10 - www.android10.org
    Android Development Community | Android Tutorials - www.anddev.org

    DEVELOPMENT FRAMEWORKS

    The Only Open Source Mobile Framework That Supports 6 Platforms - PhoneGap
    Titanium is Native - appcelerator
    Best tools for mobile application development - JavaWorld
    Windows Mobile Developer Center

    DESIGN - CSS - DETECTION

    My current feeling is that it's better—in general—to work with one site that all devices can use in some way, but that may not suit all sites.

    Have a look at this challenging slideshow before you decide how to go about designing for mobile. It's a bit controversial, and maybe a bit experimental, but it's great food for thought:
    Rethinking the Mobile Web by Yiibu - slideshare

    UI Guidelines for mobile and tablet web app design - Mobile Web Programming

    Mobile Web - W3C

    This seems to be a well respected book by one of the rock stars:
    Mobile Web Design - (by Cameron Moll)

    EMULATORS

    I use online tools to validate my sites and it has built in emulators:
    mobiReady

    See the links at the bottom of this page...
    Firefox Mobile System Requirements - Mozilla
    Unfortunately, Firefox Mobile is available on so few devices, it's hardly worth testing. Hopefully, that'll change.

    behold my ultimate list of various mobile devices you can test on:
    Download the Android SDK - Android Developers
    Android Emulator - Android Developers
    BlackBerry Simulators - BlackBerry
    Emulator - dotMobi
    iBBDemo2 - Cross Platform iPad and iPhone Simulator - Blackbaud labs
    NetFront™ Browser SDK - ACCESS
    Nokia Mobile Browser Simulator 4.0 - Forum.Nokia
    No More Openwave SDKs? - Wap Review
    Opera Mini Simulator - Opera Software
    Core Downloads for Windows Mobile - Windows Mobile Developer Center
    What more could you want? That list covers every major mobile browsing platform
    I wrote an article on mobile best practices and the list at the base of the article is even bigger than this one with plenty more devices to test on
    Links at the base:
    Mobile Web Design: Best Practices - Six Revisions

    MobiOne is awesome -
    MobiOne - genuitec

    (1) Emulators are rubbish, don't use them. Buy or borrow a real device. I bought a Windows Mobile 6.1 from eBay for 20, an Andorid for 100 and a Blackberry 4.6 for 100 (and all are excellent quality devices in good condition - I even use the Android as my own phone now).

    Key point: you must buy all devices with Wi-Fi, don't bother connecting with 3G for testing as too much hassle / swopping sim cards etc.

    (2) iPad testing: buy an iPod Touch series 1 (Wi-Fi) off eBay, can't be very expensive. I find if it works on this then it'll work on all the other Apple devices after it (iPhone 1-4 / iPad etc). That said, I actually do test on a real iPad though.

    Maybe you can borrow an iPod Touch or iPhone from somebody? Most people I know have one.

    (3) here are emulators for Bolt and Opera Mobile to add to your list:
    Demo - Bolt Browser
    Opera Mobile emulator - Opera Developer Network

    Microsoft have a Windows Phone 7 emulator available for developers - I think this might be the one:
    Windows Phone Developer Tools RTW - Microsoft Download Center
    The emulator should have everything Windows Phone 7 has by default, including Internet Explorer.

    You probably want to use the real blackberry emulators from RIMM
    Smartphone Simulators - BlackBerry
    the linked demo is just an app that fakes mobile browsers. They come with a manual that should let help you using it.

    The following site has a nice table containing emulators for various platforms:
    Mobile Emulators & Simulators: The Ultimate Guide - Mobile Web Programming

    GEO LOCATION

    Google Latitude API for developers - Google

    Check out
    Prox1m1ty Made S1mple - En1gmaEngine

    CONVERTING

    10 Ways to Create a Mobile Friendly WordPress Site - iphone-more-fun

    EMBEDDING

    This video explains the best way to go about it (h.264 with a Flash fall-back):
    Quick Tip: HTML5 Video with a Fallback to Flash - Nettuts

    "If you're using a plug-in to embed audio or video in a webpage, you can use the HTML5 <audio> and <video> tags to deliver audio and video content in Safari on iPad and iPhone. These tags work seamlessly with HTTP Live Streaming, and it is easy to structure your HTML to fall back to plug-in content in browsers that don't support these elements. For more information on using HTML5 <audio> and <video> tags, see the Safari Guide to HTML5 Audio and Video, and the HTMLMediaElement, HTMLVideoElement, and HTMLAudioElement class references in the Safari DOM Extensions Reference."
    Preparing Your Web Content for iPad - Safari Reference Library
    HTML Video Example - Safari Reference Library

    SitePoint

    CSS > Media Queries - iPhone Vs iPhone 4
    CSS > device specific stylesheet
    Adapting an Interface for Touch Devices.
    Designing for the Mobile Web

    MISCELLANEOUS

    a meeting I went to where a speaker spoke about mobile apps with HTML5.
    Bijeenkomst bij E-sites op - (Meeting at E-sites) fronteers
    he linked to
    App Stores - Distimo

    ideally we'd be able to create cross platform apps that are essentially web apps, but from what I've seen so far with regards to client demand for mobile development, the vast majority of them are looking for presence within an app store and an icon on the phone desktop (and 'add favourite->add to home' isn't sufficient for them) even when the app spec is just a glorified web view.

    I've been loath to expend substantial effort on learning obj-c for what is essentially only one output, particularly in light of Apple's fairly obtuse and unpredictable shifting of goalposts. Because cross platform mobile frameworks or IDE's generally reuse existing web skills or at least make the effort more worthwhile in other areas, these make a lot more sense to me. Recent sales growth for android phones is extremely high, so to be able to output for it using the same codebase is definitely worthwhile in my view.

    Some other frameworks/IDEs other than phonegap that are worth checking out (mostly commercial) are appcelerator titanium, rhomobile, openplug elips, unity3d and ansca corona.
    App Inventor - Google Labs

    I do not really think fragmentation is much of an issue
    The only thing to really contend with is screen size. As iPhone also has some degree of fragmentation, as appz are not backwards compatiable or even forwards compatable in some cases. But yes, iOS is easier to manage, as android devices also might have some extra hardware in, which is not in all devices
    Android fragmentation: something to fear? - ars technica

    Contributors
    AlexDawson ceeb CygnetInfo Daniel15 EastCoast IamAdam Jay.P johnsmith153 kohoutek mcthedog NightStalker-DNS Paul O'B paul_wilkins puttyapp ralph.m Stomme poes wwb_99

    Have a good resource that you think should be added?
    Please contact a member of the Programming Team and it will be seriously considered.
    Last edited by Mittineague; Feb 6, 2012 at 14:58.

  2. #2
    SitePoint Enthusiast m19.5*11's Avatar
    Join Date
    Apr 2010
    Location
    East coast, USA
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    mobile design summary, what I've found out

    Hi all,
    I'm wading through adding mobile friendliness for the first time. As I've done a tone of research I've found conflicting information, and sometimes helpful tips. So I'm putting some observations here in case it might help someone else. Please comment/correct...

    The sites I'm working on are all WordPress sites.

    WordPress requires XHTML.

    1. doctype fun The mobiReady emulator gets rave reviews, however it tells me to use xhtml-mp and evidently does not read WP's lang declaration correctly (says it isn't UTF-8 when it is )

    but on these forums (which I assume is more correct) it's stated the xhtml-mp is not helpful:

    (June 26, 2010) - "The initial intent of the mobile profile was to produce a reduced version of a website for those devices (as the upgrade from WML) however it's totally obsolete now (and few mobile devices support it) as all mobile browsers support HTML completely. "

    http://www.sitepoint.com/forums/html...-a-685075.html

    more:

    Choosing a DOCTYPE for your mobile site | Manufactured Environments

    "Some sites use just a standard XHTML DOCTYPE. That works fine for most browsers, but in the case of mobile browsers such as the iPhone’s Mobile Safari, the browser will display the site as a standard web page. That is, if you’re use a regular XHTML DOCTYPE on a mobile site, the iPhone looks at the page not as a targeted mobile page but simply as just a regular web page."


    2. mobiReady apparently does not pick up on the mobile style sheet, and then complains about display declarations which are actually display:none. It also says I have big images which aren't there in the mobile version.

    3. This is a very helpful guide:
    Mobile Web Developer

    This was helpful, also:

    The 5-Minute CSS Mobile Makeover


    4. mimetype
    From this forum: #8 post
    http://www.sitepoint.com/forums/deve...rs-688399.html

    "Question:

    All Windows Mobiles and iPhones accept this:
    <meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=UTF-8" />
    Answer: It's not about the extension you use, it's about the code and the MIME type which describes the file format type. You can use whatever you like, just be sure that the content-type meta tag accurately describes the format you are using. Just beware that if you're using proper XHTML rather than HTML (such as application/xhtml+xml) then you will encounter some serious issues of browser compatibility with Internet Explorer Mobile as like Trident (desktop), it isn't compatible. "

    5. Make phone numbers clickable (click to dial) for easy use by mobile visitors:
    How To Build A Mobile Website - Smashing Magazine

  3. #3
    SitePoint Wizard
    Join Date
    Feb 2007
    Location
    Southern California
    Posts
    1,316
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    iPhone Dev Log PhoneGap/Cordova Crib Sheet (Usually updated Fridays)
    Last edited by Mittineague; Apr 11, 2012 at 11:28.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •