Teachify 圖片尺寸與格式建議指南｜網頁編輯器（Page Builder）
Teachify 團隊開發的內建網頁編輯器（Page Builder），讓你能自由設計頁面，打造符合品牌形象的專業線上課程網站。
✅ 註 1：網頁編輯器（Page Builder）為 Teachify + 商業版 內建功能，僅提供 專業版方案 用戶加購使用。
✅ 註 2：Teachify + 商業版為 客製化企業方案，依需求提供專屬功能，價格需另行洽談。
以下是 Page Builder 各種元件所需的圖片資源尺寸建議指南：
Heading
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Heading 1 | 1440 x 1920 像素 | PNG, JPG | 3:4 比例 |
Heading 2 | 1440 x 900 像素 | JPG, PNG | 16:9 比例；圖片可能會經過調整位置及大小，以適應不同螢幕，若圖片含有標誌或文字，確保重要內容在中央區域，以避免被裁切。 |
Heading 3 | 800 x 600 像素 | PNG, JPG | 4:3 比例 |
Brands (合作品牌 Logo)
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Brand 1 (合作品牌 Logo) | 300 x 100 像素 | PNG, SVG | 帶透明度 |
Carousel (輪播圖)
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Desktop | 1440 x 900 像素 | JPG, PNG | 16:9 比例；圖片可能會經過調整位置及大小，以適應不同螢幕，若圖片含有標誌或文字，確保重要內容在中央區域，以避免被裁切。 |
Mobile | 1440 x 1440 像素 | JPG, PNG | 1:1 比例；圖片可能會經過調整位置及大小，以適應不同螢幕，若圖片含有標誌或文字，確保重要內容在中央區域，以避免被裁切。 |
Mobile | 1440 x 1800 像素 | JPG, PNG | 4:5 比例；圖片可能會經過調整位置及大小，以適應不同螢幕，若圖片含有標誌或文字，確保重要內容在中央區域，以避免被裁切。 |
Features (特色圖片)
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Feature 1 | 1440 x 1920 像素 | PNG, JPG | 3:4 比例 |
Testimonials (使用者見證)
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Testimonial 1 頭像 | 300 x 300 像素 | PNG, JPG | 1:1 比例;會裁切成圓形 |
Teams (團隊成員)
用途 | 建議尺寸 | 格式 | 備註 |
|---|---|---|---|
Team 1 | 1200 x 630 像素 | JPG, PNG | 16:9 比例；圖片可能會經過調整位置及大小，以適應不同螢幕，若圖片含有標誌或文字，確保重要內容在中央區域，以避免被裁切。 |
Team 2 | 1440 x 1920 像素 | JPG, PNG | 3:4 比例 |
圖片優化建議
為了獲得最佳的網站性能和用戶體驗，請遵循以下建議：
- 遵循推薦尺寸: 按照上述推薦尺寸準備圖片，以確保最佳顯示效果。
- 壓縮圖片: 在上傳前使用圖片壓縮工具減小檔案大小。
- 選擇適當的格式:
- 照片和複雜圖像使用 JPG/JPEG
- 需要透明背景的圖像使用 PNG
- 動畫使用 GIF
- 考慮使用 WebP 格式以獲得更好的壓縮率和質量
- 簡單圖形和圖標使用 SVG
- 為不同設備準備圖片:
- 為桌面、平板和手機準備不同尺寸的圖片
- 確保圖片在各種螢幕尺寸下都能良好顯示
更新時間： 18/03/2025
感謝！