diff --git a/index.html b/index.html
index 5a5ee1e..a3055b9 100644
--- a/index.html
+++ b/index.html
@@ -53,10 +53,15 @@ $ openssl req -nodes -newkey rsa:2048 -keyout relay.pem -x509 -days 365 -out rel
               <strong>Oh no!</strong> We cannot connect!
             </div>
         <div class="form-group">
-          <label class="control-label" for="hostport">Hostname and port</label>
-          <input type="text" class="form-control" id="hostport" ng-model="hostport" placeholder="Hostport">
-          <p class="help-block">Enter the hostname and the port to the WeeChat relay, separated by a :</p>
-              </div>
+          <label class="control-label" for="host">WeeChat hostname</label>
+          <input type="text" class="form-control" id="host" ng-model="host" placeholder="Address">
+          <p class="help-block">Enter the hostname to the WeeChat relay</p>
+        </div>
+        <div class="form-group">
+          <label class="control-label" for="port">WeeChat port number</label>
+          <input type="text" class="form-control" id="port" ng-model="port" placeholder="9001">
+          <p class="help-block">Enter the the port to the WeeChat relay</p>
+        </div>
         <div class="form-group">
           <label class="control-label" for="password">WeeChat relay password</label>
           <input type="password" class="form-control" id="password" ng-model="password" placeholder="Password">
diff --git a/js/websockets.js b/js/websockets.js
index 30d2b98..4101762 100644
--- a/js/websockets.js
+++ b/js/websockets.js
@@ -320,9 +320,9 @@ weechat.factory('connection', ['$rootScope', '$log', 'handlers', 'colors', 'mode
     }
 
     // Takes care of the connection and websocket hooks
-    var connect = function (hostport, passwd, ssl) {
+    var connect = function (host, port, passwd, ssl) {
         var proto = ssl ? 'wss':'ws';
-        websocket = new WebSocket(proto+"://" + hostport + "/weechat");
+        websocket = new WebSocket(proto+"://" + host + ':' + port + "/weechat");
         websocket.binaryType = "arraybuffer"
 
         websocket.onopen = function (evt) {
@@ -424,7 +424,8 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
 
     $rootScope.buffer = []
 
-    $store.bind($scope, "hostport", "localhost:9001");
+    $store.bind($scope, "host", "localhost");
+    $store.bind($scope, "port", "9001");
     $store.bind($scope, "proto", "weechat");
     $store.bind($scope, "password", "");
     $store.bind($scope, "ssl", false);
@@ -462,7 +463,7 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
     };
 
     $scope.connect = function() {
-        connection.connect($scope.hostport, $scope.password, $scope.ssl);
+        connection.connect($scope.host, $scope.port, $scope.password, $scope.ssl);
     }
     $rootScope.getLines = function() {
       var count = 20;