Skip to content

Instantly share code, notes, and snippets.

@gpicado

gpicado/the-10-commandments-of-modern-web-application.md

Forked from JosefJezek/the-10-commandments-of-modern-web-application.md
Created May 19, 2016 02:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gpicado/46c1c66b27770021f0375b5496e6ddc6 to your computer and use it in GitHub Desktop.
Save gpicado/46c1c66b27770021f0375b5496e6ddc6 to your computer and use it in GitHub Desktop.
Download ZIP
The 10 Commandments of Modern Web Application
Raw
the-10-commandments-of-modern-web-application.md

The 10 Commandments of Modern Web Application

1. Open Web Platform

2. Responsive Design

Resources

3. Offline First Design

4. Availability, Performance, Reliability and Scalability

The RAIL Performance Model - Modern User Experience (UX)

  1. Response: 100ms - Tap to paint in less than 100 milliseconds.
  2. Animation: 16ms - Each frame completes in less than 16 milliseconds.
  3. Idle: 50ms - Complete that work in 50-millisecond chunks.
  4. Load: 1000ms - Get first meaningful paint in 1,000 milliseconds.

Resources

Web Platform Coordinate System

  1. Performance - Slimming Paint, Scheduler, ...
  2. Capabilities - Service Worker, Push Notifications, ...
  3. Productivity - Web Components, DevTools, ES6, ...

Resources

Technologies

Tools

Resources

5. Reusability

Reusable CSS Styles

Reusable Elements with Web Components

6. User Experience (UX) - Usability - Accessibility

  • Useful: Your content should be original and fulfill a need
  • Usable: Site must be easy to use
  • Desirable: Image, identity, brand, and other design elements are used to evoke emotion and appreciation
  • Findable: Content needs to be navigable and locatable onsite and offsite
  • Accessible: Content needs to be accessible to people with disabilities
  • Credible: Users must trust and believe what you tell them

Progressive Web Apps

Accessibility

Resources

7. Readability

8. Maintainability

CSS

JavaScript

9. Security

10. Search Engine Optimization

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment