Internationalization Done Right

In this presentation I introduce the concept of internationalization, localization, and their benefits. By highlighting how culture influences the user’s behaviour, I explain why we need to do more than just “making things translatable”.

I18N has a massive impact on user acceptance and usability. I show existing tools, interfaces, and best practices to get internationalization and localization right in the UIs we create and the code we write.

Transcript

1. Internationalization
   Done Right
   

   View Slide

2. Pascal Birchler

   @swissspidy
   

   View Slide

3. Why Internationalization?
   

   View Slide

4. View Slide

5. Why Internationalization?
   

   View Slide

6. The process of creating a product in such
   a way that it can be easily adapted
   to specific local languages and cultures
   Internationalization
   

   View Slide

7. The process of adapting a product or
   service to a particular language,
   culture, and desired local “look-and-feel.”
   Localization
   

   View Slide

8. “Localization is like translation
   but with a cultural twist”
   Localization
   

   View Slide

9. I18N L10N
   

   View Slide

10. Locales
    

    View Slide

11. Locale ≠ Language
    

    View Slide

12. Flag ≠ Language
    

    View Slide

13. View Slide

14. flagsarenotlanguages.com
    

    View Slide

15. Dates
    

    View Slide

16. DD/MM/YYYY
    MM/DD/YYYY
    YYYY-MM-DD
    

    View Slide

17. View Slide

18. 12/05/2017
    

    View Slide

19. View Slide

20. View Slide

21. Numbers
    

    View Slide

22. 123 456.99
    123,456.99
    123’456.99
    123.456,99
    

    View Slide

23. Right to Left Icons
    Symbols
    Puns
    Jokes
    Legal
    Currencies
    Numbers
    Formal/Informal
    Support
    Units
    

    View Slide

24. Dealing with Locales
    

    View Slide

25. Locale Detection
    

    View Slide

26. Accept-Language: es, en-gb;q=0.8, en;q=0.7
    

    View Slide

27. Internationalization
    in User Interfaces
    

    View Slide

28. Symbols
    ✅ ⭕
    

    View Slide

29. Personal Names
    

    View Slide

30. David Lloyd George
    

    View Slide

31. Agüero
    Alcázar
    Almarez
    Ancheta
    del
    

    View Slide

32. Implications for
    Field Design
    

    View Slide

33. View Slide

34. View Slide

35. View Slide

36. View Slide

37. Fonts
    

    View Slide

38. View Slide

39. Left-to-Right
    Right-to-Left
    

    View Slide

40. View Slide

41. View Slide

42. View Slide

43. Internationalization
    in Development
    

    View Slide

44. View Slide

45. String Extraction
    

    View Slide

46. function translateIt( $str ) {
    // Do something.
    }
    __( 'Foo' ); // ✓
    translateIt( 'Bar' ); // ☓
    __( 'Baz' ); // ✓
    

    View Slide

47. $foo = 'Hello World';
    __( $foo ); // ☓
    

    View Slide

48. String Concatenation
    

    View Slide

49. echo $num . ' ' . __( 'items' )
    

    View Slide

50. Plural Forms
    

    View Slide

51. printf( __( '%d items' ), $num )
    

    View Slide

52. if ( $num == 1 )
    printf( __( '%d item' ), $num )
    else
    printf( __( '%d items' ), $num )
    

    View Slide

53. printf(
    _n(
    '%d item',
    '%d items',
    $num
    ),
    $num
    )
    

    View Slide

54. printf(_n('%d item', '%d items', 1), 1)
    printf(_n('%d item', '%d items', 2), 2)
    printf(_n('%d item', '%d items', 5), 5)
    

    View Slide

55. Context
    

    View Slide

56. _x('Update', 'verb' )
    _x('Update', 'noun' )
    

    View Slide

57. Dates & Units
    

    View Slide

58. Resources
    

    View Slide

59. Documentation
    

    View Slide

60. Localization Management
    

    View Slide

61. w3.org/internationalization
    

    View Slide

62. cldr.unicode.org
    

    View Slide

63. developer.wordpress.org
    

    View Slide

64. To Sum Things Up
    

    View Slide

65. 1. Don’t make assumptions
    2. Understand cultural values
    3. i18n from the beginning
    4. Don’t reinvent the wheel
    

    View Slide

66. One Last Thing…
    

    View Slide

67. WordCamp Bern, Switzerland
    September 9, 2017
    

    View Slide

68. ¡Gracias!
    Eskerrik asko!
    

    View Slide