On Internationalization and Localization

Reaching out to the local PHP community in Istanbul, I talked about the importance of internationalization (I18N) and localization (L10N) at PHPKonf.

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

In this presentation I show why English ≠ English, why you should not use flags for language switchers, and how you can implement I18N best practices in your development and design workflow.

Transcript

1. Internationalization
   and
   Localization
   PHPKonf 2018
   

   View Slide

2. Pascal Birchler

   @swissspidy
   

   View Slide

3. Why Internationalization?
   

   View Slide

4. Internationalization
   is not an afterthought
   

   View Slide

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

   View Slide

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

   View Slide

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

   View Slide

8. Locales
   

   View Slide

9. Locale ≠ Language
   

   View Slide

10. American English
    ≠
    British English
    

    View Slide

11. Flag ≠ Language
    

    View Slide

12. View Slide

13. View Slide

14. flagsarenotlanguages.com
    

    View Slide

15. Dates
    

    View Slide

16. View Slide

17. 12/05/2018
    

    View Slide

18. View Slide

19. View Slide

20. Numbers
    

    View Slide

21. 123 456.99
    123,456.99
    123’456.99
    123.456,99
    

    View Slide

22. Right to Left
    Icons
    Symbols
    Puns
    Timezones
    Legal Currencies
    Numbers
    Formal/Informal
    Support
    Units
    Idioms
    Temperature
    

    View Slide

23. Dealing with Locales
    

    View Slide

24. Locale Detection
    

    View Slide

25. example.com/tr/blog
    

    View Slide

26. View Slide

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

    View Slide

28. View Slide

29. Internationalization
    in User Interfaces
    

    View Slide

30. “Our target audience does not
    mind an English-only user
    interface.”
    

    View Slide

31. Symbols
    ✅ ⭕
    

    View Slide

32. View Slide

33. View Slide

34. Personal Names
    

    View Slide

35. Unicode
    

    View Slide

36. David Lloyd George
    

    View Slide

37. Lang
    Leyen
    Little
    Lovett
    von der
    

    View Slide

38. Implications for
    Field Design
    

    View Slide

39. View Slide

40. View Slide

41. View Slide

42. View Slide

43. Left-to-Right
    Right-to-Left
    

    View Slide

44. View Slide

45. View Slide

46. View Slide

47. Internationalization
    in Development
    

    View Slide

48. View Slide

49. Pick a Technology
    

    View Slide

50. View Slide

51. 
    
    
    
    title.hello_world
    Hello World
    
    
    
    
    

    View Slide

52. string gettext ( string $message )
    

    View Slide

53. string gettext ( string $message )
    translations.pot
    tr_TR.po
    tr_TR.mo
    

    View Slide

54. String Extraction
    

    View Slide

55. function translateIt( $str ) {
    // Do something.
    gettext( $str );
    }
    gettext( 'Foo' ); ✅
    translateIt( 'Bar' ); ❌
    gettext( 'Baz' ); ✅
    

    View Slide

56. $foo = 'Hello World';
    gettext( $foo ); ❌
    

    View Slide

57. echo $num . gettext( ' items' ) ❌
    

    View Slide

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

    View Slide

59. printf(
    ngettext(
    '%d item',
    '%d items',
    $num
    ),
    $num
    )
    

    View Slide

60. 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

61. Beyond Numbers
    

    View Slide

62. gettext( 'They play football' )
    

    View Slide

63. MessageFormatter::formatMessage(
    "en_US",
    "{gender, select, ".
    "female {She plays football}".
    "male {He plays football}".
    "other {They play football}".
    "}",
    ['gender' => 'female' ]
    )
    

    View Slide

64. Gettext
    vs.
    MessageFormat
    vs.
    ?
    

    View Slide

65. Resources
    

    View Slide

66. cldr.unicode.org
    

    View Slide

67. w3.org/internationalization
    

    View Slide

68. Localization Management
    POEditor
    LingoHub
    Poedit
    Transifex
    GlotPress
    PhraseApp
    

    View Slide

69. icu-project.org
    

    View Slide

70. Conclusion
    

    View Slide

71. 1. Don’t make assumptions
    

    View Slide

72. 2. Understand cultural values
    

    View Slide

73. 3. i18n from the beginning
    

    View Slide

74. 4. Don’t reinvent the wheel
    

    View Slide

75. Thank You.
    

    View Slide