fix: security, accessibility, and og:image compatibility on social icons (#153)

* Initial plan

* fix: address review feedback - rel noopener, empty alt, PNG og:image

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/1ff8192f-0e5e-4949-8114-16179cfd68da

Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>

* Update index.html

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Author: 3 people

bio.html

@@ -14,14 +14,14 @@
   <meta property="og:url" content="https://davidkrk.com/bio.html">
   <meta property="og:title" content="David KRK · Bio · DJ Techno & Producteur">
   <meta property="og:description" content="Biographie officielle de David KRK, DJ Techno international - France, Espagne, Pays Basque.">
-  <meta property="og:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="og:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Twitter -->
   <meta property="twitter:card" content="summary_large_image">
   <meta property="twitter:url" content="https://davidkrk.com/bio.html">
   <meta property="twitter:title" content="David KRK · Bio · DJ Techno & Producteur">
   <meta property="twitter:description" content="Biographie officielle de David KRK, DJ Techno international - France, Espagne, Pays Basque.">
-  <meta property="twitter:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="twitter:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Favicon -->
   <link rel="icon" type="image/png" href="logo-30-01-25.png">
@@ -209,7 +209,7 @@ <h2 class="main-title">Bio</h2>
            class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-soundcloud"></i></a>
         <a href="https://www.tiktok.com/@davidkrk" target="_blank" aria-label="TikTok"
            class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-tiktok"></i></a>
-        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 1em; vertical-align: middle;"></a>
+        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" rel="noopener noreferrer" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="" style="height: 1em; vertical-align: middle;"></a>
       </div>
 
       <div class="flex flex-wrap justify-center items-center gap-3 sm:gap-4 mb-4 text-sm">

event.html

@@ -12,14 +12,14 @@
   <meta property="og:url" content="https://davidkrk.com/event.html">
   <meta property="og:title" content="David KRK · EVENTS · DJ TECHNO & PRODUCER">
   <meta property="og:description" content="Découvrez les prochains événements et dates de David KRK.">
-  <meta property="og:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="og:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Twitter -->
   <meta property="twitter:card" content="summary_large_image">
   <meta property="twitter:url" content="https://davidkrk.com/event.html">
   <meta property="twitter:title" content="David KRK · EVENTS · DJ TECHNO & PRODUCER">
   <meta property="twitter:description" content="Découvrez les prochains événements et dates de David KRK.">
-  <meta property="twitter:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="twitter:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Favicon -->
   <link rel="icon" type="image/png" href="logo-30-01-25.png">
@@ -98,7 +98,7 @@ <h1 class="main-title">David KRK</h1>
          class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-soundcloud"></i></a>
       <a href="https://www.tiktok.com/@davidkrk" target="_blank" aria-label="TikTok"
          class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-tiktok"></i></a>
-      <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 1em; vertical-align: middle;"></a>
+      <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" rel="noopener noreferrer" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="" style="height: 1em; vertical-align: middle;"></a>
     </div>
 
     <div class="flex flex-wrap justify-center items-center gap-3 sm:gap-4 mb-4 text-sm">

index.html

@@ -13,14 +13,14 @@
   <meta property="og:url" content="https://davidkrk.com/">
   <meta property="og:title" content="David KRK · HOME · DJ TECHNO & PRODUCER">
   <meta property="og:description" content="Site officiel de David KRK, DJ et producteur international de musique Techno. Découvrez sa musique, sa biographie et ses événements.">
-  <meta property="og:image" content="https://davidkrk.com/images/optimized/logo.webp">
+  <meta property="og:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Twitter -->
   <meta property="twitter:card" content="summary_large_image">
   <meta property="twitter:url" content="https://davidkrk.com/">
   <meta property="twitter:title" content="David KRK · HOME · DJ TECHNO & PRODUCER">
   <meta property="twitter:description" content="Site officiel de David KRK, DJ et producteur international de musique Techno. Découvrez sa musique, sa biographie et ses événements.">
-  <meta property="twitter:image" content="https://davidkrk.com/images/optimized/logo.webp">
+  <meta property="twitter:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <link rel="icon" type="image/png" href="logo-30-01-25.png">
   <!-- Fonts + Icones -->
@@ -126,7 +126,7 @@ <h1 class="main-title">David KRK</h1>
            class="social-icon text-2xl md:text-3xl"><i class="fab fa-soundcloud"></i></a>
         <a href="https://www.tiktok.com/@davidkrk" target="_blank" aria-label="TikTok"
            class="social-icon text-2xl md:text-3xl"><i class="fab fa-tiktok"></i></a>
-        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" aria-label="Buy Me A Coffee" class="social-icon"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px;"></a><br>
+        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" rel="noopener noreferrer" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="" style="height: 1em; vertical-align: middle;"></a>
       </div>
 
       <div class="flex flex-wrap justify-center items-center gap-3 sm:gap-4 mb-4 text-sm">

music.html

@@ -12,14 +12,14 @@
   <meta property="og:url" content="https://davidkrk.com/music.html">
   <meta property="og:title" content="David KRK · MUSIC · DJ TECHNO & PRODUCER">
   <meta property="og:description" content="Découvrez la musique de David KRK, DJ et producteur de musique Techno.">
-  <meta property="og:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="og:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Twitter -->
   <meta property="twitter:card" content="summary_large_image">
   <meta property="twitter:url" content="https://davidkrk.com/music.html">
   <meta property="twitter:title" content="David KRK · MUSIC · DJ TECHNO & PRODUCER">
   <meta property="twitter:description" content="Découvrez la musique de David KRK, DJ et producteur de musique Techno.">
-  <meta property="twitter:image" content="https://raw.githubusercontent.com/DavidKRK/DavidKRK.github.io/main/images/optimized/logo.webp">
+  <meta property="twitter:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Favicon -->
   <link rel="icon" type="image/png" href="logo-30-01-25.png">
@@ -89,7 +89,7 @@ <h1 class="main-title">David KRK</h1>
            class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-soundcloud"></i></a>
         <a href="https://www.tiktok.com/@davidkrk" target="_blank" aria-label="TikTok"
            class="social-icon text-2xl md:text-3xl text-white"><i class="fab fa-tiktok"></i></a>
-        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 1em; vertical-align: middle;"></a>
+        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" rel="noopener noreferrer" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="" style="height: 1em; vertical-align: middle;"></a>
       </div>
 
       <div class="flex flex-wrap justify-center items-center gap-3 sm:gap-4 mb-4 text-sm">

shop.html

@@ -13,14 +13,14 @@
   <meta property="og:url" content="https://davidkrk.com/shop.html">
   <meta property="og:title" content="David KRK · SHOP · DJ TECHNO & PRODUCER">
   <meta property="og:description" content="Boutique officielle de David KRK : T-shirt premium avec logo, disponible en plusieurs couleurs, frais de port inclus.">
-  <meta property="og:image" content="https://davidkrk.com/images/optimized/logo.webp">
+  <meta property="og:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <!-- Twitter -->
   <meta property="twitter:card" content="summary_large_image">
   <meta property="twitter:url" content="https://davidkrk.com/shop.html">
   <meta property="twitter:title" content="David KRK · SHOP · DJ TECHNO & PRODUCER">
   <meta property="twitter:description" content="Boutique officielle de David KRK : T-shirt premium avec logo, disponible en plusieurs couleurs, frais de port inclus.">
-  <meta property="twitter:image" content="https://davidkrk.com/images/optimized/logo.webp">
+  <meta property="twitter:image" content="https://davidkrk.com/logo-30-01-25.png">
 
   <link rel="icon" type="image/png" href="logo-30-01-25.png">
   <!-- Fonts + Icones -->
@@ -187,9 +187,7 @@ <h2 class="mt-4">Офіційний магазин</h2>
            class="social-icon text-2xl md:text-3xl"><i class="fab fa-soundcloud"></i></a>
         <a href="https://www.tiktok.com/@davidkrk" target="_blank" aria-label="TikTok"
            class="social-icon text-2xl md:text-3xl"><i class="fab fa-tiktok"></i></a>
-        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" aria-label="Buy Me A Coffee" class="social-icon">
-          <img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px;">
-        </a>
+        <a href="https://www.buymeacoffee.com/davidkrk" target="_blank" rel="noopener noreferrer" aria-label="Buy Me A Coffee" class="social-icon text-2xl md:text-3xl"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="" style="height: 1em; vertical-align: middle;"></a>
       </div>
 
       <div class="flex flex-wrap justify-center items-center gap-3 sm:gap-4 mb-4 text-sm">