diff --git a/swh/web/assets/src/bundles/browse/swh-ids-utils.js b/swh/web/assets/src/bundles/browse/swh-ids-utils.js
index 94cfc1cb5..7e8b05330 100644
--- a/swh/web/assets/src/bundles/browse/swh-ids-utils.js
+++ b/swh/web/assets/src/bundles/browse/swh-ids-utils.js
@@ -1,102 +1,107 @@
 /**
  * Copyright (C) 2018  The Software Heritage developers
  * See the AUTHORS file at the top-level directory of this distribution
  * License: GNU Affero General Public License version 3, or any later version
  * See top-level LICENSE file for more information
  */
 
 import ClipboardJS from 'clipboard';
 import 'utils/jquery.tabSlideOut';
 import 'utils/jquery.tabSlideOut.css';
 
 export function swhIdObjectTypeToggled(event) {
   event.preventDefault();
   $(event.target).tab('show');
 }
 
 export function swhIdOptionOriginToggled(event) {
   event.stopPropagation();
   let swhIdElt = $(event.target).closest('.swh-id-ui').find('.swh-id');
   let originPart = ';origin=' + $(event.target).data('swh-origin');
   let currentSwhId = swhIdElt.text();
   if ($(event.target).prop('checked')) {
     currentSwhId += originPart;
   } else {
     currentSwhId = currentSwhId.replace(originPart, '');
   }
   swhIdElt.text(currentSwhId);
   swhIdElt.attr('href', '/' + currentSwhId + '/');
 }
 
 function setIdLinesPart(elt) {
   let swhIdElt = $(elt).closest('.swh-id-ui').find('.swh-id');
   let currentSwhId = swhIdElt.text();
   let lines = [];
   let linesPart = ';lines=';
   let linesRegexp = new RegExp(/L(\d+)/g);
   let line = linesRegexp.exec(window.location.hash);
   while (line) {
     lines.push(parseInt(line[1]));
     line = linesRegexp.exec(window.location.hash);
   }
   if (lines.length > 0) {
     linesPart += lines[0];
   }
   if (lines.length > 1) {
     linesPart += '-' + lines[1];
   }
   if ($(elt).prop('checked')) {
     currentSwhId = currentSwhId.replace(/;lines=\d+-*\d*/g, '');
     currentSwhId += linesPart;
   } else {
     currentSwhId = currentSwhId.replace(linesPart, '');
   }
   swhIdElt.text(currentSwhId);
   swhIdElt.attr('href', '/' + currentSwhId + '/');
 }
 
 export function swhIdOptionLinesToggled(event) {
   event.stopPropagation();
   if (!window.location.hash) {
     return;
   }
   setIdLinesPart(event.target);
 }
 
 $(document).ready(() => {
   new ClipboardJS('.btn-swh-id-copy', {
     text: trigger => {
       let swhId = $(trigger).closest('.swh-id-ui').find('.swh-id').text();
       return swhId;
     }
   });
 
   new ClipboardJS('.btn-swh-id-url-copy', {
     text: trigger => {
       let swhId = $(trigger).closest('.swh-id-ui').find('.swh-id').text();
       return window.location.origin + '/' + swhId + '/';
     }
   });
 
   if (window.innerWidth * 0.7 > 1000) {
     $('#swh-identifiers').css('width', '1000px');
   }
 
   let tabSlideOptions = {
     tabLocation: 'right'
   };
   // ensure tab scrolling on small screens
   if (window.innerHeight < 600 || window.innerWidth < 500) {
     tabSlideOptions['otherOffset'] = '20px';
   }
 
+  // initiate the sliding identifiers tab
   $('#swh-identifiers').tabSlideOut(tabSlideOptions);
 
-  $('.swh-id-option-origin').trigger('click');
-  $('.swh-id-option-lines').trigger('click');
+  // set the tab visible once the close animation is terminated
+  setTimeout(() => {
+    $('#swh-identifiers').css('visibility', 'visible');
+    $('.swh-id-option-origin').trigger('click');
+    $('.swh-id-option-lines').trigger('click');
+  });
 
   $(window).on('hashchange', () => {
     setIdLinesPart('.swh-id-option-lines');
   });
 
 });
diff --git a/swh/web/templates/includes/show-swh-ids.html b/swh/web/templates/includes/show-swh-ids.html
index 269285765..05ef45079 100644
--- a/swh/web/templates/includes/show-swh-ids.html
+++ b/swh/web/templates/includes/show-swh-ids.html
@@ -1,95 +1,95 @@
 {% comment %}
 Copyright (C) 2017-2018  The Software Heritage developers
 See the AUTHORS file at the top-level directory of this distribution
 License: GNU Affero General Public License version 3, or any later version
 See top-level LICENSE file for more information
 {% endcomment %}
 
 {% load swh_templatetags %}
 
 {% if swh_ids %}
 
-  <div id="swh-identifiers">
+  <div id="swh-identifiers" style="visibility: hidden;">
     {% if swh_ids|length > 1 %}
-      <a id="right-handle" class="handle ui-slideouttab-handle ui-slideouttab-handle-rounded"><i class="fa fa-link fa-rotate-90"></i>Permalinks</a>
+      <a id="right-handle" class="handle ui-slideouttab-handle ui-slideouttab-handle-rounded"><i class="fa fa-link fa-rotate-90 fa-fw"></i>Permalinks</a>
     {% else %}
-      <a id="right-handle" class="handle ui-slideouttab-handle ui-slideouttab-handle-rounded"><i class="fa fa-link fa-rotate-90"></i>Permalink</a>
+      <a id="right-handle" class="handle ui-slideouttab-handle ui-slideouttab-handle-rounded"><i class="fa fa-link fa-rotate-90 fa-fw"></i>Permalink</a>
     {% endif %}
     <div id="swh-identifiers-content">
       <p>
         To reference or cite the objects present in the Software Heritage archive, permalinks based on <a href="https://docs.softwareheritage.org/devel/swh-model/persistent-identifiers.html">persistent identifiers</a>
         must be used instead of copying and pasting the url from the address bar of the browser (as there is no guarantee the current URI
         scheme will remain the same over time).
         <br/>
         <br/>
         Select below a type of object currently browsed in order to display its associated persistent identifier and permalink.
       </p>
 
       <ul class="nav nav-pills ml-auto p-2">
         {% for swh_id in swh_ids %}
           {% if forloop.first %}
             <li class="nav-item"><a class="nav-link active" href="#swh-id-tab-{{ swh_id.object_type }}" data-toggle="tab" onclick="swh.browse.swhIdObjectTypeToggled(event)">{{ swh_id.object_icon }}{{ swh_id.object_type }}</a></li>
           {% else %}
             <li class="nav-item"><a class="nav-link" href="#swh-id-tab-{{ swh_id.object_type }}" data-toggle="tab" onclick="swh.browse.swhIdObjectTypeToggled(event)">{{ swh_id.object_icon }}{{ swh_id.object_type }}</a></li>
           {% endif %}
         {% endfor %}
       </ul>
 
       <div class="tab-content">
         {% for swh_id in swh_ids %}
           {% if forloop.first %}
             <div class="tab-pane active" id="swh-id-tab-{{ swh_id.object_type }}">
           {% else %}
             <div class="tab-pane" id="swh-id-tab-{{ swh_id.object_type }}">
           {% endif %}
             <div class="card">
               <div class="card-body swh-id-ui">
                 <pre><a class="swh-id" id="{{ swh_id.swh_id }}" href="{{ swh_id.swh_id_url }}">{{ swh_id.swh_id }}</a></pre>
                 {% if swh_id.show_options %}
                   <div class="float-left">
                     <div class="card">
                       <div class="card-header">
                         Options
                       </div>
                       <div class="card-body">
                         <form id="swh-id-options">
                           {% if snapshot_context and snapshot_context.origin_info %}
                             <div class="form-check swh-id-option">
                               <input class="form-check-input swh-id-option-origin" value="option-origin" type="checkbox"
                                     id="swh-id-option-origin"
                                     data-swh-origin="{{ snapshot_context.origin_info.url }}"
                                     onclick="swh.browse.swhIdOptionOriginToggled(event)">
                               <label class="form-check-label" for="swh-id-option-origin">Add origin info</label>
                             </div>
                           {% endif %}
                           {% if swh_id.object_type == 'content' %}
                             <div class="form-check swh-id-option">
                               <input class="form-check-input swh-id-option-lines" value="option-lines" type="checkbox"
                                     id="swh-id-option-lines"
                                     onclick="swh.browse.swhIdOptionLinesToggled(event)">
                               <label class="form-check-label" for="swh-id-option-lines">Add selected lines info</label>
                             </div>
                           {% endif %}
                         </form>
                       </div>
                     </div>
                   </div>
                 {% endif %}
                 <div class="float-right">
                   <button type="button" class="btn btn-default btn-sm btn-swh-id-copy"
                           title="Copy persistent identifier to clipboard">
                     <i class="fa fa-clipboard fa-fw" aria-hidden="true"></i>Copy identifier
                   </button>
                   <button type="button" class="btn btn-default btn-sm btn-swh-id-url-copy"
                           title="Copy url resolving the persistent identifier to clipboard">
                     <i class="fa fa-clipboard fa-fw" aria-hidden="true"></i>Copy permalink
                   </button>
                 </div>
               </div>
             </div>
           </div>
         {% endfor %}
       </div>
     </div>
   </div>
 {% endif %}