1. Images

• Load optimized sizes, example here
• No text on images
• Only HTML splashes allowed (overlay on images)

2. Typography

• VELUX fonts 
• Minimum 16px
• Normal weight for texts

3. Icons & logos

• SVG or Fontawsome or Base64
• Min size for icon 16 x 16 px 
• No sprite

4. Development 

• Universal CSS/HTML (use W3C validators)
• Vanilla JS (or approved by us frameworks, plugins)
• Mobile first
• Smallest screen width: 320px
• Images should be responsive 
• Reuse breakpoints from base site
• CSS/JS files delivered in separate files 
• CSS/JS should be delivered two version: plain and minified 
• CSS/JS compatible with current site CSS/JS (develop on top of base site) 
• Use BEM like CSS

5. Testing

• Actual device testing environment
• Live testing when developing
• Set up pre-project 
• Mid-tier device testing 
• 25% CPU + 3G testing 
  
  

6. Devices & browsers 

• Compatibility > 95% of our user base (live GA data)
• Basic support for old browsers

7. Performance

• Load time < 2.4 sec
• Set performance budget xxx Kb
• Request count < 10 (Excluding main images)
• Lighthouse test score >= 80

8. Design principles 

• Resolution: 320 x 480 px
• Grid: 1 or 2 columns
• Table horizontal scrolling
• Collapse at > x lines
• Prioritise elements loading
• Prioritise visible