doctype html
html
  head
    meta(http-equiv="Content-Type", content="text/html; charset=utf-8")
    meta(name="viewport", content="width=device-width, initial-scale=1")
    title #{__('TITLE', community)}
    link(href="css/style.css", rel="stylesheet", type="text/css")
    link(href="//fonts.googleapis.com/css?family=Lato:300,400,700,900,700italic|Open+Sans:700italic,400,600,300,700,800", rel="stylesheet", type="text/css")
  body
    #wrapper
      .main
        .header
          h1
            strong #{community}
          h2 #{__('HEADER', community)}
        .content
          .information
            form(method="POST", action="/invite")#join-form.form
              input(type="text", name="email", placeholder="#{__('ENTER_EMAIL')}")#slack-email.field
              if tokenRequired
                input(type="text", name="token", placeholder="#{__('ENTER_TOKEN')}")#slack-token.field
              input(type="submit", value="Join").submit
    script.
      var tokenRequired = #{tokenRequired};
      var form = document.getElementById('join-form');
      var email = document.getElementById('slack-email');
      var token = document.getElementById('slack-token');
      form.addEventListener('submit', function(evt) {
        if (!email.value) {
          evt.preventDefault();
        }
        if (tokenRequired && !token.value) {
          evt.preventDefault();
        }
      });

doctype html
html
  head
    meta(http-equiv="Content-Type", content="text/html; charset=utf-8")
    meta(name="viewport", content="width=device-width, initial-scale=1")
    title #{__('TITLE', community)}
    link(href="css/style.css", rel="stylesheet", type="text/css")
    link(href="//fonts.googleapis.com/css?family=Lato:300,400,700,900,700italic|Open+Sans:700italic,400,600,300,700,800", rel="stylesheet", type="text/css")
  body
    #wrapper
      .main
        .header
          h1
            strong #{community}
          h2 #{__('HEADER', community)}
        .content
          .information
            form(method="POST", action="/invite")#join-form.form
              input(type="email", name="email", placeholder="#{__('ENTER_EMAIL')}")#slack-email.field
              if tokenRequired
                input(type="text", name="token", placeholder="#{__('ENTER_TOKEN')}")#slack-token.field
              input(type="submit", value="Join").submit
    script.
      var tokenRequired = #{tokenRequired};
      var form = document.getElementById('join-form');
      var email = document.getElementById('slack-email');
      var token = document.getElementById('slack-token');
      form.addEventListener('submit', function(evt) {
        if (!email.value) {
          evt.preventDefault();
        }
        if (tokenRequired && !token.value) {
          evt.preventDefault();
        }
      });

Use type=email on input field
Use type=email on input field

Browsers will fallback automatically to text if the type is unrecognized. Mobile browsers (iPhone or Android for instance) will display a keyboard which is easier to write emails than the regular one (all lowercase by default, `@` character present on the keyboard).