mobile

From IndieWeb
(Redirected from mobile design)


mobile, in the context of the indieweb could refer to use of a mobile device (phone or iPod touch), mobile apps, mobile use-cases, or a site being mobile friendly.

  • mobile friendly indie website - a personal website that's easy to read and interact with on a mobile device
  • mobile use-cases - things you want to do with your mobile device that involve collecting or publishing data, or communication, and thus make sense to consider solving with the use of an indieweb site.
  • mobile apps to access and use your indieweb site. Both mobile web apps and mobile native apps.
  • mobile create for concerns & challenges for designing interfaces to create content on mobile devices.
  • mobile posting for the act of posting content from a mobile device to a personal site
  • mobile data for mobile methods of getting on the web without wifi, wires, or cellphone voice/SMS plans

mobile friendly

To make your indie website mobile friendly:

  • icon - make sure you've setup an icon for readers to easily add your indieweb site to their mobile device home screen
  • design - implement good responsive design so your website is readable on mobile devices, and focuses on showing content first or very close to the top (rather than sidebars and other widgets).
  • communication - setup your personal website so that when users access it on a mobile communication device, it presents them with mobile communication options for getting in touch with you.
  • posting - implement a good mobile posting interface for your indie website so you can create posts, perhaps even take and post photos from your mobile device(s).
  • offline - implement some amount of offline support in your website so people can browse and read your posts even if their network connection is unreliable or unavailable

As we figure out and implement such mobile friendliness on our own websites, they may make sense as additional IndieMark features to measure.

challenges

Some challenges we’ve encountered, and solutions:

long URLs causing horizontal scroll

If you display long URLs in your site or reader content, they may overflow your design and cause horizontal scrolling.

Use the following CSS to get long URLs to break at the edge of your designed content box rather than overflowing it:

body {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

mobile use-cases

There are numerous mobile use-cases that drive the development of mobile friendly indieweb sites and mobile apps for indieweb sites. These could all be expanded:

mobile apps

  • mentions-app
  • pushups app
  • ...

mobile sharing

22308998652_7f8a6606b2_z.jpg
Main article: mobile posting

On mobile devices in particular, it's good to have a way to post from any app to your site. Many mobile OS's have a cross-app or cross-document API for doing this kind of "sharing" and thus presenting a UI or at least an option to share to your own site, e.g. Aaron Parecki is working on "Share via Micropub":

In the lack of native apps that make use of native API:s there are apps that can work as bridges to web tools, like eg. https://workflow.is/ on iOS. Pelle Wessman has recorded a screencast of replying through Workflow.app.

mobile web apps

Mobile web apps, beyond web apps, are expected to make use of mobile devices' capabilities.

There was (until ~2014-09) a site that tracked the progress of WebAPIs to access various features on mobile devices:

articles

Mobile Companies

This is the start of a list of companies that make hardware & software that such things could be possible with:

  • http://www.geeksphone.com - appears offline

FAQ

  • Where are the IndieWeb mobile apps?
    • ...

Related Sessions

(this section is a stub)

mobile-related sessions from IndieWebCamps:

See Also