参考サイト通りにしたがPWAできない

PWAの練習用にミニアプリを作り、GitHubPagesで公開してサイトに書いてあったやり方通りにPWAしようとしたのですが、いくらページを開いても「インストールする」の表示が出てきません

index.html

HTML
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4  <meta charset="UTF-8">
5  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7  <title>CountApp PWA</title>
8  <link rel="shortcut icon" href="icon-192.png" type="image/png">
9  <link rel="manifest" href="manifest.json">
10  <!-- <script src="js/main.js"></script> -->
11  <script>
12    
13    let counta=0;
14
15    function count() {
16      counta++;
17      document.getElementById("val").innerHTML=counta;
18    }
19
20    window.onload=function(){
21      document.getElementById("count").onclick=function () {
22        count();
23      }
24
25    }
26  </script>
27</head>
28<body>
29
30  <div id="val">0</div>
31  <input type="button" id="count" value="count">
32
33  <script>
34    if ('serviceWorker' in navigator) {
35      navigator.serviceWorker.register('sw.js').then(function(registration) {
36        // 登録成功
37        console.log('ServiceWorker の登録に成功しました。スコープ: ', registration.scope);
38      }).catch(function(err) {
39        // 登録失敗
40        console.log('ServiceWorker の登録に失敗しました。', err);
41      });
42    }
43  </script>
44</body>
45</html>

manifest.json

json
1{
2  "name": "CountApp PWA",
3  "short_name": "CApp",
4  "description": "PWA練習用",
5  "icons": [
6      {
7          "src": "icon-192.png",
8          "sizes": "192x192",
9          "type": "image/png"
10      }
11  ],
12  "start_url": "/path/to/index.html",
13  "display": "fullscreen",
14  "theme_color": "#dff0d8",
15  "background_color": "#dff0d8"
16}