<div class="ynh-wrapper login">
<form class="login-form" name="input" action="" method="post">
  <div class="form-group">
    <label class="icon icon-user" for="user"><span class="element-invisible">{{t_username}}</span></label>
    <input id="user" type="text" name="user" placeholder="{{t_username}}" class="form-text" required>
  </div>
  <div class="form-group">
    <label class="icon icon-lock" for="password"><span class="element-invisible">{{t_password}}</span></label>
    <input id="password" type="password" name="password" placeholder="{{t_password}}" class="form-text" required>
  </div>
  <input type="submit" value="{{t_login}}" class="btn classic-btn large-btn">
</form>
</div>

<div class="ynh-wrapper login">
<form class="login-form" name="input" action="" method="post">
  <div class="form-group">
    <label class="icon icon-user" for="user"><span class="element-invisible">{{t_username}}</span></label>
    <input id="user" type="text" name="user" placeholder="{{t_username}}" class="form-text" autofocus required>
  </div>
  <div class="form-group">
    <label class="icon icon-lock" for="password"><span class="element-invisible">{{t_password}}</span></label>
    <input id="password" type="password" name="password" placeholder="{{t_password}}" class="form-text" required>
  </div>
  <input type="submit" value="{{t_login}}" class="btn classic-btn large-btn">
</form>
</div>

Add the autofocus attribute to the username field
Add the autofocus attribute to the username field

With the `autofocus` attribute, the field has the focus when the page is loaded. This mean that you don't need to click in the field to start writing your username.