HTML內容的翻譯和延遲加載

Webayt 在內容管理系統 (CMS) 中，某些區域可以輸入 HTML 內容。在這些區域準備內容時，應考慮使用翻譯標籤和延遲加載，以確保自動翻譯過程正常運作並保持頁面效能。

此資訊適用於可輸入 HTML 內容的區域，例如資訊和章節頁面、類別頁面、內容頁面和自訂內容模組。

翻譯標籤的用途是什麼？

Webayt 在內容管理系統 (CMS) 中進行自動翻譯時，內容會根據特定的字元限制進行處理。對於較長的內容，可以在原始碼區域中按特定間隔將其分割成多個部分，以確保翻譯過程順利進行。

為避免自動翻譯超出字元限制，應在原始碼欄位中每隔約3500 個字元（包括程式碼和文字）添加以下標籤：

 <!--lang-->

此標籤有助於在翻譯過程中將長篇內容拆分成更連貫的部分。尤其建議用於長篇文章、詳細描述頁面或大量依賴 HTML 程式碼的內容。

什麼是延遲載入？

延遲加載是一種可選的性能優化方法，它允許非關鍵圖像和視訊在頁面加載時稍後加載。

這種方法允許相關內容隨著訪客瀏覽頁面而逐步加載，而不是在頁面首次打開時所有圖片和影片同時加載。這可以提高效能，尤其是在圖片或影片密度較高的頁面上。

如何使用延遲載入？

要使用延遲加載，應該在圖像或視訊標籤中使用data-original而不是標準的src ，並將lazy類別添加到相關的標籤中。

圖片使用範例：

 <img data-original="ornek-gorsel.jpg" class="lazy" alt="Örnek görsel">

在這種用法中，圖像不是在頁面打開時立即加載，而是在訪客接近頁面上的相關區域時加載。

何時該引起重視？

建議在準備長篇文字、包含 HTML 程式碼的內容、包含大量圖片的頁面或包含影片的部分時，請注意這些資訊。

對於簡短的內容，翻譯標籤或延遲載入可能並非總是必要的。但是，對於較長的內容，翻譯標籤很有幫助；而對於包含大量圖片和影片的頁面，使用延遲載入有助於建立更穩健的結構。

概括

在 HTML 內容輸入欄位中，請務必注意自動翻譯和效能設定。對於較長的內容，大約每 3500 個字元可以使用<!--lang-->標籤。對於圖像和視頻，可以使用data-original和lazy類選擇性地應用延遲載入。