Convert images to webp

Author: graycreate

public/image/android-screenshot.png

@@ -51,15 +51,15 @@ import '../styles/hero.css';
         <div class="relative w-full max-w-[320px] mx-auto md:max-w-none">
           <!-- iOS 设备 -->
           <img 
-            src="/image/ios-screenshot.png" 
+            src="/image/ios-screenshot.webp" 
             alt="iOS App Screenshot" 
             class="w-[280px] md:w-[320px] rounded-[32px] shadow-2xl
                    relative z-20 mx-auto md:ml-auto"
           >
 
           <!-- Android 设备 -->
           <img 
-            src="/image/android-screenshot.png" 
+            src="/image/android-screenshot.webp" 
             alt="Android App Screenshot" 
             class="w-[280px] md:w-[320px] rounded-[32px] shadow-2xl
                    absolute top-1/2 left-1/2 md:left-0 

public/image/android-screenshot.webp

@@ -8,7 +8,7 @@
       <a href="https://ulpb.app" class="product-card" target="_blank" rel="noopener">
         <div class="product-content">
           <div class="product-header">
-            <img src="/image/shuangpin-logo.png" alt="试试双拼 Logo" class="product-logo" />
+            <img src="/image/shuangpin-logo.webp" alt="试试双拼 Logo" class="product-logo" />
             <h3>试试双拼</h3>
           </div>
           <p>投入一周时间，收获终身效率。这项简单实用的技能，值得你现在就开始学习。</p>