Translation and Lazy Loading in HTML Content

Webayt In the CMS, HTML content can be entered in some areas. When preparing content in these areas, the use of translation tags and lazy loading should be considered to ensure the automatic translation process works correctly and page performance is maintained.

This information applies to areas where HTML content can be entered, such as Information and Section Pages , Category Pages , Content Pages , and the Custom Content Module .

What is the purpose of a translation tag?

Webayt When performing automatic translation in a CMS, content is processed according to specific character limits. For long content, the content can be divided into sections at specific intervals in the source code area to ensure the translation process proceeds smoothly.

To avoid exceeding the character limit in automatic translation, the following tag should be added to the source code field approximately every 3500 characters , including codes and text:

 <!--lang-->

This tag helps to break down long content into more coherent parts during the translation process. It is especially recommended for use with long articles, detailed description pages, or content that is heavily reliant on HTML code.

What is Lazy Load?

Lazy Load is an optional performance method that allows non-critical images and videos to load later while the page is loading.

This method allows relevant content to load as the visitor progresses through the page, rather than all images and videos loading simultaneously upon initial page opening. This can improve performance, especially on pages with a high density of images or videos.

How to use Lazy Load?

To use Lazy Load, instead of using the standard src in image or video tags data-original should be used, and the lazy class should be added to the relevant tag.

Example image usage:

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

In this usage, the image loads not as soon as the page opens, but as the visitor approaches the relevant area on the page.

When Should Attention Be Paid?

It is recommended to pay attention to this information when preparing long texts, content containing HTML code, pages with many images, or sections containing videos.

For short and simple content, using translation tags or lazy loading may not always be necessary. However, for longer content, using translation tags, and for pages with many images and videos, using lazy loading helps you create a more robust structure.

Summary

In areas where HTML content can be entered, it's important to pay attention to automatic translation and performance settings. For long content, the <!--lang--> tag can be used approximately every 3500 characters. For images and videos, lazy loading can be applied optionally using data-original and lazy classes.