Notes for the codex Free Basics app

notes.md

Free Basics

• General info (previously known as Internet.org)
• Developer info on dev.fb

Codex Application form

• planning for pages
• a sketch of guidelines for the CSS

Steve's Fufu: doing Front-end for feature phones

• Dos and Don'ts of Feature phone Design
• Fufu README explaining some of the ideas and challenges.
• A simple head that's feature phone friendly: head-idotorg.html of fufu. style.css loads for everyone, and contains some simple styles: colours, typography (fonts, font-size, line-height), borders, some margins and padding. enhanced.css loads for all browsers that understand media="(min-width: 20em)". (Although that is actually a lie: see CSS Downloads by Media Query.
• A complicated head that uses JS to asychronously load the CSS: head.html of fufu (don't worry about lines 18 and 24: they handle loading the JS files).

Testing

• PageSpeed Insights. Good for running and getting a checklist of things to fix.
• WebPageTest. Good for getting stats and looking for things to optimise. Use these settings:
  • Test location: Dulles, VA USA (Android, iOS 9)
  • Browser: Motorola G, Chrome
  • Advanced Settings:
    • Connection: Mobile 3G
    • Number of Tests to Run: 5

Optional extras / nice to haves

• Add SSL using Let's Encrypt. Here's a nice tutorial: Taking Let's Encrypt for a Spin.