use webp images instead of png for faster load times

index.html

@@ -4,7 +4,7 @@
         <meta charset="UTF-8">
         <title>PADJOKEJ.dev</title>
         <p id="debug"></p>
-        <link rel="icon" type="image/x-icon" href="images/pfp.png">
+        <link rel="icon" type="image/x-icon" href="images/pfp.webp">
         <link rel="stylesheet" id="pagestyle" href="styles.css">
         <script src="styler.js"></script>
 
@@ -13,7 +13,7 @@
         <meta property="og:title" content="Pad - Coding">
         <meta property="og:type" content="website">
         <meta property="og:url" content="https://padjokej.dev/">
-        <meta property="og:image" content="https:/padjokej.dev/images/pfp.png">
+        <meta property="og:image" content="https:/padjokej.dev/images/pfp.webp">
         <meta property="og:description" content="Pad - Christian coder and gamedev from Switzerland">
         <meta name="description" content="Personnal website of a coder from switzerland who likes making games">
 
@@ -24,7 +24,7 @@
             <h1>PADJOKEJ.dev</h1>
             <h3><i>Under construction</i></h3>
             <div class="text-img-container">
-                <a href="https://www.padjokej.dev"><img src="https://avatars.githubusercontent.com/u/145267541" width="128" id="profile"></a>
+                <a href="https://www.padjokej.dev"><img src="images/pfp.webp" width="128" height="128" id="profile"></a>
                 <p id="description">Hi, I'm PadjokeJ, or <b>Pad</b> for short. I'm a christian student in switzerland. This is a website in which I plan to host my portofolio, my games, and a bunch of other stuff.</p>
             </div>