@jjlmoya/utils-converters 1.6.0 → 1.8.0

package/src/tool/gifAWebp/i18n/tr.ts

@@ -0,0 +1,178 @@
+import type { ImageConverterUI } from '../../../shared/ImageConverter.astro';
+import { generateSchemas } from '../../../shared/logic/schemas';
+import type { GifAWebpLocaleContent } from '../index';
+
+const slug = 'gif-den-webp-ye-donusturucu';
+const title = 'GIF\'i Statik WebP\'ye Online Dönüştür';
+const description =
+  'Hareketli GIF\'leri statik WebP\'ye dönüştürün. Şeffaflığı korur. Sunucu yok. Tarayıcınızda yerel olarak işlenir. Ücretsiz.';
+
+const ui: ImageConverterUI = {
+  dragText: 'GIF dosyalarını sürükleyin...',
+  convertText: 'Anında WebP\'ye dönüştürmek için',
+  selectFiles: 'Dosyaları seçin',
+  processedFiles: 'İşlenen dosyalar',
+  downloadAll: 'Tümünü indir (.zip)',
+  pending: 'Bekliyor',
+  bibliographyTitle: 'Bibliyografik Referanslar',
+  faqTitle: 'Sıkça Sorulan Sorular',
+};
+
+const faq: GifAWebpLocaleContent['faq'] = [
+  {
+    question: 'Neden hareketli bir dosyayı modern statik WebP formatına dondurmalıyım?',
+    answer:
+      'WebP, Google\'ın sıkıştırma standardıdır; oldukça hafiftir ve şeffaflığı temiz bir şekilde korur. GIF\'ten WebP\'ye geçmek, ağır animasyonu ortadan kaldırır ve web hızında muazzam bir kazanç sağlar.',
+  },
+  {
+    question: 'Orijinal avatar şeffaf kalacak mı?',
+    answer:
+      'Evet, JPEG\'in aksine WebP kapsayıcısı karmaşık Alpha kanalına saygı duyar. Tüm silüetleri orijinalindeki gibi mükemmel kalacaktır.',
+  },
+  {
+    question: 'Dosyalar nereye yüklenecek?',
+    answer:
+      'Yükleme yok. İşleme, bilgisayarınızdaki tarayıcının Javascript\'i tarafından tamamen yerel olarak gerçekleştirilir, uzaktan gönderim sıfırdır.',
+  },
+];
+
+const howTo: GifAWebpLocaleContent['howTo'] = [
+  {
+    name: 'Hareketli bir çığ başlatın',
+    text: 'Düzinelerce memeyi uzaktan bağlantı olmadan sınırlı bölgeye taşıyın ve bırakın.',
+  },
+  {
+    name: 'Büyük görünmez değişime tanık olun',
+    text: 'Yerel canvas kod çözücü çıktıyı oluştururken milisaniye başına değişen ilerleme göstergesini izleyin.',
+  },
+  {
+    name: 'Temiz sonuç arsenalini kaydedin',
+    text: 'Çıkarılan dosyaları tek tek alın veya her şeyi paketlemek için Zip İndir düğmesine basın.',
+  },
+];
+
+const bibliography: GifAWebpLocaleContent['bibliography'] = [
+  {
+    name: 'GIF89a Spesifikasyonu',
+    url: 'https://www.w3.org/Graphics/GIF/spec-gif89a.txt',
+  },
+  {
+    name: 'Google WebP Dokümantasyonu',
+    url: 'https://developers.google.com/speed/webp',
+  },
+];
+
+const seo: GifAWebpLocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'GIF to WebP Dönüştürücü: Ağır Animasyonlar İçin Modern Alternatif',
+    level: 2,
+  },
+  {
+    type: 'paragraph',
+    html: 'Hareketli GIF\'ler modern web içeriğinin dinozorlarıdır: Orantısız bant genişliği tüketirler, her sayfanın PageSpeed değerini düşürürler ve binlerce web sitesindeki toplam ağırlığın önemli bir yüzdesinden sorumludurlar. Tipik bir 5 MB hareketli GIF, aynı görsel kalite ile 1 MB\'ın altında bir WebP animasyonuna dönüşebilir. WebP, Google tarafından web\'de GIF\'in yerini alması için özel olarak tasarlanmış modern bir pillettir.',
+  },
+  {
+    type: 'title',
+    text: 'GIF vs WebP: Web\'in geçmişi ve bugünü arasındaki uçurum',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'GIF, aslen animasyonlar için tasarlanmamış 1987 yapımı bir formattır; bu özellik daha sonra bir "hack" olarak eklenmiştir. 256 renk paleti, verimsiz sıkıştırması ve sesi işleyememesi onu eski bir format haline getirir. Google tarafından 2010 yılında geliştirilen WebP, hem kayıplı hem de kayıpsız üstün sıkıştırma, yerel animasyon desteği ve tam alfa kanalı sunar.',
+  },
+  {
+    type: 'paragraph',
+    html: 'Bir web geliştiricisi için, sayfalardaki GIF\'leri WebP ile değiştirmek, Google PageSpeed puanında 10 ila 30 puanlık bir iyileşme anlamına gelebilir. Daha az sayfa ağırlığı, daha iyi Core Web Vitals, daha iyi SEO sıralamaları ve sunucularda daha düşük bant genişliği maliyetleri demektir. Bu sadece estetik bir iyileştirme değil, teknik bir mimari karardır.',
+  },
+  {
+    type: 'title',
+    text: 'Mimari Karşılaştırması: Yerel vs Bulut',
+    level: 3,
+  },
+  {
+    type: 'comparative',
+    items: [
+      {
+        title: 'Bulut Dönüştürücüler',
+        description: 'GIF\'lerinizi uzak sunucularda işleyen platformlar.',
+        icon: 'mdi:cloud-upload',
+        pointIcon: 'mdi:close-circle-outline',
+        points: [
+          'Animasyonlarınız internet üzerinden üçüncü taraf sunuculara seyahat eder',
+          'Yükleme ve indirme sırasında ağ gecikmesi nedeniyle bekleme süresi',
+          'Boyut sınırları (büyük GIF\'ler genellikle reddedilir)',
+          'Dosya saklama ve analiz riski',
+        ],
+      },
+      {
+        title: 'Bizim Yerel Mimarimiz',
+        description: 'Vanilla JS teknolojisini kullanarak doğrudan donanımınızda işleme.',
+        icon: 'mdi:laptop-mac',
+        highlight: true,
+        points: [
+          'GIF asla cihazınızdan ayrılmaz',
+          'Ağ bekleyişi olmadan anında dönüşüm',
+          'Boyut sınırı yok: Her ağırlıktaki GIF\'leri işleyin',
+          'Tam gizlilik: Harici olarak 0 bayt gönderilir',
+        ],
+      },
+    ],
+  },
+  {
+    type: 'title',
+    text: 'Yerel GIF to WebP dönüşümü nasıl çalışır?',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Yerel dönüşüm HTML5 Canvas API\'sini kullanır. GIF, yerel bir tarayıcı Image öğesi olarak yüklenir. Bir tuvale çizilerek, grafik motoru tüm şeffaflık bilgileriyle birlikte ilk animasyon karesini yakalar. <code>toDataURL(\'image/webp\')</code> yöntemi, kareyi doğrudan RAM\'de WebP olarak dışa aktarır.',
+  },
+  {
+    type: 'paragraph',
+    html: 'WebP tam alfa kanalını destekler, bu nedenle GIF şeffaflıkları, bir arka plan eklemeye gerek kalmadan sonuçtaki WebP\'de korunur. WebP sıkıştırma algoritmaları GIF veya PNG\'den önemli ölçüde daha verimlidir, bu da nihai çıktının dosya boyutundaki radikal azalmayı açıklar.',
+  },
+  {
+    type: 'tip',
+    title: 'Garantili PageSpeed iyileştirmesi',
+    html: '5 MB\'lık hareketli bir GIF, 1 MB\'ın altında bir WebP olabilir. Web sitenizin sayfalarında GIF\'ler varsa, bunları WebP ile değiştirmek Largest Contentful Paint (LCP) ve Total Blocking Time (TBT) değerlerinizi anında iyileştirerek SEO sıralamalarını doğrudan etkileyebilir.',
+  },
+  {
+    type: 'title',
+    text: 'Sonuç WebP\'nin kullanım durumları ve uyumluluğu',
+    level: 3,
+  },
+  {
+    type: 'list',
+    icon: 'mdi:check-circle',
+    items: [
+      'PageSpeed puanlarını artırmak için web sayfalarındaki GIF\'lerin değiştirilmesi.',
+      'Discord, Slack ve modern platformlar için optimize edilmiş avatarlar ve çıkartmalar.',
+      'Dijital pazarlama kampanyaları için bannerlar ve görseller.',
+      'Progresif web uygulamalarındaki (PWA) animasyonlar.',
+      'Chrome, Edge, Firefox, Safari 14+ ve tüm modern tarayıcılarla uyumludur.',
+    ],
+  },
+  {
+    type: 'title',
+    text: 'Sonuç: GIF\'lerinizi 21. yüzyıla taşıyın',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Web sitenizdeki her GIF, kaçırılmış bir optimizasyon fırsatıdır. Aracımız GIF\'leri anında, özel olarak ve sınırsız bir şekilde doğrudan tarayıcınızda WebP\'ye dönüştürür. Sonuç: 5 kata kadar daha küçük dosyalar, mükemmel şeffaflık ve tüm modern tarayıcılarla uyumluluk.',
+  },
+];
+
+
+export const content: GifAWebpLocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: generateSchemas({ title, description, inLanguage: 'tr', faq, howTo }),
+};

package/src/tool/gifAWebp/i18n/zh.ts

@@ -0,0 +1,178 @@
+import type { ImageConverterUI } from '../../../shared/ImageConverter.astro';
+import { generateSchemas } from '../../../shared/logic/schemas';
+import type { GifAWebpLocaleContent } from '../index';
+
+const slug = 'convert-gif-to-webp';
+const title = '在线将 GIF 转换为静态 WebP';
+const description =
+  '将动态 GIF 转换为静态 WebP。保留透明度。无需服务器。在浏览器中本地处理。免费。';
+
+const ui: ImageConverterUI = {
+  dragText: '拖入 GIF 文件...',
+  convertText: '立即将其转换为 WebP',
+  selectFiles: '选择文件',
+  processedFiles: '已处理文件',
+  downloadAll: '下载全部 (.zip)',
+  pending: '等待中',
+  bibliographyTitle: '参考文献',
+  faqTitle: '常见问题',
+};
+
+const faq: GifAWebpLocaleContent['faq'] = [
+  {
+    question: '为什么要将动态文件切换为现代静态 WebP 格式？',
+    answer:
+      'WebP 是 Google 的压缩标准；它非常轻量且能干净地保留透明度。从 GIF 切换到 WebP 可以消除沉重的动画，并获得巨大的网页速度提升。',
+  },
+  {
+    question: '原始头像会保持透明吗？',
+    answer:
+      '是的，与 JPEG 不同，WebP 容器遵循复杂的 Alpha 通道。所有的轮廓都将像原生一样保持完美。',
+  },
+  {
+    question: '文件会上传到哪里？',
+    answer:
+      '没有上传。处理完全由您 PC 上的浏览器 Javascript 执行，零远程发送。',
+  },
+];
+
+const howTo: GifAWebpLocaleContent['howTo'] = [
+  {
+    name: '启动动态文件处理',
+    text: '在没有远程连接的情况下，将数十个表情包移动并放入划定区域。',
+  },
+  {
+    name: '见证伟大的隐形变化',
+    text: '当本地 Canvas 解码器生成输出时，观察每毫秒变化的进度指示器。',
+  },
+  {
+    name: '保存您干净的结果集',
+    text: '单独获取提取的文件，或按“下载 Zip”打包所有内容。',
+  },
+];
+
+const bibliography: GifAWebpLocaleContent['bibliography'] = [
+  {
+    name: 'GIF89a 规范',
+    url: 'https://www.w3.org/Graphics/GIF/spec-gif89a.txt',
+  },
+  {
+    name: 'Google WebP 文档',
+    url: 'https://developers.google.com/speed/webp',
+  },
+];
+
+const seo: GifAWebpLocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'GIF 转 WebP 转换器：沉重动画的现代替代方案',
+    level: 2,
+  },
+  {
+    type: 'paragraph',
+    html: '动态 GIF 是现代网络内容的恐龙：它们消耗不成比例的带宽，降低任何页面的 PageSpeed，并且在成千上万个网站的总重量中占有相当大的比例。一个典型的 5 MB 动态 GIF 在保持相同视觉质量的情况下可以变成 1 MB 以下的 WebP 动画。WebP 是 Google 专门为在网络上取代 GIF 而设计的现代继任者。',
+  },
+  {
+    type: 'title',
+    text: 'GIF vs WebP：网络过去与现状之间的鸿沟',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'GIF 是一种 1987 年的格式，最初并非为动画设计——该功能是后来作为一种“黑客”手段加入的。它的 256 色调色板、低效率的压缩以及无法处理音频，使其成为一种过时的格式。WebP 由 Google 在 2010 年开发，提供卓越的有损和无损压缩、原生动画支持以及完整的 Alpha 通道。',
+  },
+  {
+    type: 'paragraph',
+    html: '对于 Web 开发人员来说，在页面上用 WebP 取代 GIF 可能意味着 Google PageSpeed 分数提高 10 到 30 分。更轻的页面重量意味着更好的 Core Web Vitals、更好的 SEO 排名以及更低的服务器带宽成本。这不仅仅是美学上的提升——它是一项技术架构决策。',
+  },
+  {
+    type: 'title',
+    text: '架构比较：本地 vs 云端',
+    level: 3,
+  },
+  {
+    type: 'comparative',
+    items: [
+      {
+        title: '云端转换器',
+        description: '在远程服务器上处理您的 GIF 的平台。',
+        icon: 'mdi:cloud-upload',
+        pointIcon: 'mdi:close-circle-outline',
+        points: [
+          '您的动画通过互联网传输到第三方服务器',
+          '由于上传和下载时的网络延迟造成的等待时间',
+          '大小限制（大的 GIF 经常被拒绝）',
+          '文件保留和分析的风险',
+        ],
+      },
+      {
+        title: '我们的本地架构',
+        description: '使用 Vanilla JS 技术直接在您的硬件上进行处理。',
+        icon: 'mdi:laptop-mac',
+        highlight: true,
+        points: [
+          'GIF 永远不会离开您的设备',
+          '即时转换，无需网络等待',
+          '无大小限制：处理任何重量的 GIF',
+          '绝对隐私：0 字节向外发送',
+        ],
+      },
+    ],
+  },
+  {
+    type: 'title',
+    text: '本地 GIF 转 WebP 转换的工作原理',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: '本地转换使用 HTML5 Canvas API。GIF 被加载为原生的浏览器 Image 元素。通过将其绘制到画布上，图形引擎会捕捉包含所有透明度信息的第一帧动画。<code>toDataURL(\'image/webp\')</code> 方法直接在 RAM 中将该帧导出为 WebP。',
+  },
+  {
+    type: 'paragraph',
+    html: 'WebP 支持完整的 Alpha 通道，因此 GIF 的透明度保留在生成的 WebP 中，无需添加背景。WebP 压缩算法的效率明显高于 GIF 或 PNG，这解释了最终输出文件大小的大幅降低。',
+  },
+  {
+    type: 'tip',
+    title: '保证网页速度提升',
+    html: '一个 5 MB 的动态 GIF 可以变成 1 MB 以下的 WebP。如果您的网站页面上有 GIF，用 WebP 替换它们可以立即改善您的 Largest Contentful Paint (LCP) 和 Total Blocking Time (TBT)，直接影响 SEO 排名。',
+  },
+  {
+    type: 'title',
+    text: '生成的 WebP 的使用案例和兼容性',
+    level: 3,
+  },
+  {
+    type: 'list',
+    icon: 'mdi:check-circle',
+    items: [
+      '替换网页上的 GIF 以提高 PageSpeed 分数。',
+      '为 Discord、Slack 和现代平台优化的头像和贴纸。',
+      '用于数字营销活动的横幅和视觉效果。',
+      '渐进式 Web 应用程序 (PWA) 中的动画。',
+      '兼容 Chrome、Edge、Firefox、Safari 14+ 以及所有现代浏览器。',
+    ],
+  },
+  {
+    type: 'title',
+    text: '结论：将您的 GIF 迁移到 21 世纪',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: '您网站上的每一个 GIF 都是一次错失的优化机会。我们的工具直接在您的浏览器中即时、私密且无限制地将 GIF 转换为 WebP。结果：文件缩小高达 5 倍、完美的透明度，并与所有现代浏览器兼容。',
+  },
+];
+
+
+export const content: GifAWebpLocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: generateSchemas({ title, description, inLanguage: 'zh', faq, howTo }),
+};

package/src/tool/gifAWebp/index.ts

@@ -16,6 +16,18 @@ export const gifAWebp: ConvertersToolEntry<ImageConverterUI> = {
     es: () => import('./i18n/es').then((m) => m.content),
     en: () => import('./i18n/en').then((m) => m.content),
     fr: () => import('./i18n/fr').then((m) => m.content),
+    de: () => import('./i18n/de').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
   },
 };
 

package/src/tool/imagenBase64/i18n/de.ts

@@ -0,0 +1,168 @@
+import type { ImagenBase64LocaleContent } from '../index';
+import { generateSchemas } from '../../../shared/logic/schemas';
+import type { ImageToBase64UI } from '../index';
+
+const slug = 'bild-zu-base64-konverter';
+const title = 'Bild zu Base64 Konverter Online';
+const description =
+  'Konvertieren Sie jedes Bild direkt in Ihrem Browser in Base64-Code und Data URI. Keine Dateiuploads. Kostenlos, privat und sofort.';
+
+const ui: ImageToBase64UI = {
+  dragTitle: 'Ziehen Sie Ihr Bild hierher',
+  dragSubtext: 'oder klicken Sie, um Ihre Dateien zu durchsuchen',
+  formatBadge: 'Unterstützt JPG, PNG, WEBP, SVG, GIF',
+  dataUriLabel: 'Data URI (Bereit für CSS / HTML src="")',
+  base64Label: 'Nur Base64 (Reiner kodierter Text)',
+  copyBtn: 'Kopieren',
+  dataUriPlaceholder: 'Laden Sie ein Bild hoch, um den Data-URI-Code zu sehen...',
+  base64Placeholder: 'Laden Sie ein Bild hoch, um den reinen Base64-Code zu sehen...',
+  toastMessage: 'Code in die Zwischenablage kopiert!',
+  invalidImageAlert: 'Bitte laden Sie eine gültige Bilddatei hoch.',
+  bibliographyTitle: 'Literaturhinweise',
+  faqTitle: 'Häufig gestellte Fragen',
+};
+
+const faq: ImagenBase64LocaleContent['faq'] = [
+  {
+    question: 'Was ist Base64 und wofür wird es in der Webentwicklung verwendet?',
+    answer:
+      'Base64 ist ein Kodierungssystem, das Binärdaten in eine ASCII-Textzeichenfolge umwandelt. In der Webentwicklung wird es verwendet, um Bilder über Data URIs direkt in HTML- oder CSS-Dateien einzubetten, wodurch die Anzahl der HTTP-Anfragen an den Server reduziert wird.',
+  },
+  {
+    question: 'Ist es sicher, meine Bilder hier in Base64 zu konvertieren?',
+    answer:
+      'Absolut sicher und privat. Unser Tool arbeitet zu 100 % lokal in Ihrem Browser. Ihre Bilder werden niemals auf einen externen Server hochgeladen oder dort verarbeitet.',
+  },
+  {
+    question: 'Welche Bildformate unterstützt der Base64-Konverter?',
+    answer:
+      'Das Tool ist kompatibel mit JPG, PNG, GIF, WebP und sogar SVG-Vektordateien. Beim Laden des Bildes wird automatisch der MIME-Typ erkannt, um den exakten Data-URI-Code zu generieren.',
+  },
+  {
+    question: 'Wann sollte ich Base64-Bilder NICHT verwenden?',
+    answer:
+      'Sie sollten Base64-Bilder nicht für große Fotos oder hochauflösende Bilder verwenden. Base64-Code beansprucht etwa 33 % mehr Speicherplatz als die ursprüngliche Binärdatei, was Ihre CSS-Stylesheets oder HTML-Dokumente übermäßig aufblähen kann.',
+  },
+];
+
+const howTo: ImagenBase64LocaleContent['howTo'] = [
+  {
+    name: 'Bild ziehen oder auswählen',
+    text: 'Verschieben Sie ein beliebiges Bild (JPG, PNG, WebP, SVG, GIF) in den Upload-Bereich, um die Konvertierung zu starten.',
+  },
+  {
+    name: 'Generierten Code kopieren',
+    text: 'Sie sehen zwei Textfelder: die vollständige Data URI (bereit zur Verwendung in src="" oder CSS) und das reine Base64 für andere Zwecke.',
+  },
+  {
+    name: 'Code in Ihrem Projekt verwenden',
+    text: 'Fügen Sie die Data URI direkt in den src-Attribut eines img-Tags oder in Ihr CSS als background-image ein, ohne externe Dateien zu benötigen.',
+  },
+];
+
+const bibliography: ImagenBase64LocaleContent['bibliography'] = [
+  {
+    name: 'MDN Web Docs: Data URIs',
+    url: 'https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URLs',
+  },
+  {
+    name: 'Base64 Kodierung RFC 4648',
+    url: 'https://datatracker.ietf.org/doc/html/rfc4648',
+  },
+];
+
+const seo: ImagenBase64LocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Bild-zu-Base64-Konverter: Bilder ohne HTTP-Anfragen einbetten',
+    level: 2,
+  },
+  {
+    type: 'paragraph',
+    html: 'Base64 ist eine Kodierungstechnik, die Binärdaten – wie ein Bild – in eine reine ASCII-Textzeichenfolge transformiert. Das Ergebnis ist eine Data URI: eine in sich geschlossene URL, die mit <code>data:image/png;base64,...</code> beginnt und das gesamte kodierte Bild enthält. Durch das direkte Einbetten dieses Codes in Ihr HTML, CSS oder JSON wird das Bild ohne zusätzliche HTTP-Anfrage an den Server geladen – null Netzwerklatenz, sofortiges Laden.',
+  },
+  {
+    type: 'title',
+    text: 'Wann man Base64-Bilder verwendet',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Das Hauptargument für Base64 ist die Eliminierung von Netzwerkanfragen. Jedes Bild auf einer Webseite bedeutet eine HTTP-Anfrage mit dem entsprechenden Overhead für Verbindung, DNS, TLS-Handshake und Latenz. Bei sehr kleinen, kritischen Bildern – dem Hauptlogo der Anwendung, dem Favicon oder einem UI-Icon – eliminiert das Einbetten in Base64 in CSS oder HTML diese Kosten und garantiert eine sofortige Anzeige, noch bevor der Browser etwas zwischengespeichert hat.',
+  },
+  {
+    type: 'paragraph',
+    html: 'Diese Technik ist besonders leistungsfähig in SPA-Anwendungen (Single Page Application), bei denen das JavaScript- und CSS-Bundle zur Build-Zeit generiert wird: Das Einbetten kleiner Bilder im Bundle garantiert, dass sie zusammen mit dem Code ohne zusätzliche Anfragen geladen werden. Es ist auch unverzichtbar für HTML-E-Mails, bei denen E-Mail-Clients externe Bilder blockieren, aber eingebettete Data URIs fast immer anzeigen.',
+  },
+  {
+    type: 'title',
+    text: 'Anwendungsfälle für Base64-Bilder',
+    level: 3,
+  },
+  {
+    type: 'list',
+    icon: 'mdi:check-circle',
+    items: [
+      'HTML-Inline: <code>&lt;img src="data:image/png;base64,..."&gt;</code> für kritische Icons.',
+      'CSS-Hintergrund: <code>background-image: url("data:image/svg+xml;base64,...")</code> für UI-SVGs.',
+      'JSON und REST-APIs: Senden von Bildern als Textdaten in JSON-Payloads.',
+      'HTML-E-Mails: Eingebettete Bilder, die auch dann angezeigt werden, wenn der Client externe URLs blockiert.',
+      'SVG-Einbettung: Einbetten von Rasterbildern in SVG-Dateien als Inline-Daten.',
+    ],
+  },
+  {
+    type: 'title',
+    text: 'Wie die Konvertierung im Browser funktioniert',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Wenn Sie ein Bild auswählen oder ziehen, liest die <code>FileReader</code>-API des Browsers es direkt von der Festplatte als Binärdaten in den RAM. Die Methode <code>readAsDataURL()</code> konvertiert diese Binärbytes mithilfe des RFC 4648-Algorithmus in ihre Base64-Darstellung – alle 3 Bytes der Originaldaten werden als 4 ASCII-Zeichen aus dem Base64-Alphabet dargestellt. Das Ergebnis enthält den automatisch erkannten korrekten MIME-Typ.',
+  },
+  {
+    type: 'tip',
+    title: 'Nur für kleine Bilder verwenden (unter 10 KB)',
+    html: 'Base64 erhöht die Dateigröße um etwa 33 %: Ein 10 KB großes Bild wird zu ca. 13,3 KB Text. Bei kleinen Icons und Logos ist dieser Aufwand minimal, und die Eliminierung der HTTP-Anfrage gleicht dies aus. Bei Fotos oder großen Bildern ist der Größen-Overhead signifikant – verwenden Sie für große Bilder immer ein CDN.',
+  },
+  {
+    type: 'title',
+    text: 'Wann Base64 NICHT verwendet werden sollte',
+    level: 3,
+  },
+  {
+    type: 'tip',
+    title: 'Vermeiden Sie Base64 für große Bilder – nutzen Sie ein CDN',
+    html: 'Wenn Sie Bilder haben, die größer als 10-20 KB sind, schadet Base64 der Performance: Es bläht die HTML/CSS-Größe auf, verhindert, dass der Browser das Bild unabhängig zwischenspeichert, und blockiert das Rendering, während der Parser den riesigen String verarbeitet. Für große Bilder sollten Sie immer ein CDN mit entsprechenden Cache-Headern verwenden.',
+  },
+  {
+    type: 'title',
+    text: 'Kompatibilität und Datenschutz',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Data URIs sind mit 100 % der modernen Browser und den meisten E-Mail-Clients kompatibel. Unser Tool verarbeitet alles lokal über die FileReader-API – Ihre Bilder verlassen niemals Ihr Gerät. Damit eignet es sich für Unternehmensbilder, private Screenshots oder alle vertraulichen visuellen Inhalte, die Sie in Base64 konvertieren müssen.',
+  },
+  {
+    type: 'title',
+    text: 'Fazit: Das schnellste und privateste Einbettungs-Tool',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Das Konvertieren von Bildern in Base64 ist eine gezielte, aber sehr leistungsfähige Technik, wenn sie richtig angewendet wird. Verwenden Sie sie für kleine, kritische Bilder, bei denen null HTTP-Anfragen einen Unterschied machen, und vermeiden Sie sie für große Bilder, bei denen ein CDN immer gewinnt. Mit unserem Tool erhalten Sie die Data URI im Handumdrehen, ohne etwas auf einen Server hochzuladen.',
+  },
+];
+
+
+export const content: ImagenBase64LocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: generateSchemas({ title, description, inLanguage: 'de', faq, howTo }),
+};

package/src/tool/imagenBase64/i18n/en.ts

@@ -1,5 +1,5 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
 import type { ImagenBase64LocaleContent } from '../index';
+import { generateSchemas } from '../../../shared/logic/schemas';
 import type { ImageToBase64UI } from '../index';
 
 const slug = 'image-to-base64-converter';
@@ -154,16 +154,6 @@ const seo: ImagenBase64LocaleContent['seo'] = [
   },
 ];
 
-const appSchema: WithContext<SoftwareApplication> = {
-  '@context': 'https://schema.org',
-  '@type': 'SoftwareApplication',
-  name: title,
-  description,
-  applicationCategory: 'UtilitiesApplication',
-  operatingSystem: 'Web',
-  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
-  inLanguage: 'en',
-};
 
 export const content: ImagenBase64LocaleContent = {
   slug,
@@ -174,5 +164,5 @@ export const content: ImagenBase64LocaleContent = {
   faq,
   bibliography,
   howTo,
-  schemas: [appSchema as any],
+  schemas: generateSchemas({ title, description, inLanguage: 'en', faq, howTo }),
 };

package/src/tool/imagenBase64/i18n/es.ts

@@ -1,5 +1,5 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
 import type { ImagenBase64LocaleContent } from '../index';
+import { generateSchemas } from '../../../shared/logic/schemas';
 import type { ImageToBase64UI } from '../index';
 
 const slug = 'convertidor-imagen-base64';
@@ -154,16 +154,6 @@ const seo: ImagenBase64LocaleContent['seo'] = [
   },
 ];
 
-const appSchema: WithContext<SoftwareApplication> = {
-  '@context': 'https://schema.org',
-  '@type': 'SoftwareApplication',
-  name: title,
-  description,
-  applicationCategory: 'UtilitiesApplication',
-  operatingSystem: 'Web',
-  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
-  inLanguage: 'es',
-};
 
 export const content: ImagenBase64LocaleContent = {
   slug,
@@ -174,5 +164,5 @@ export const content: ImagenBase64LocaleContent = {
   faq,
   bibliography,
   howTo,
-  schemas: [appSchema as any],
+  schemas: generateSchemas({ title, description, inLanguage: 'es', faq, howTo }),
 };

package/src/tool/imagenBase64/i18n/fr.ts

@@ -1,5 +1,5 @@
-import type { WithContext, SoftwareApplication } from 'schema-dts';
 import type { ImagenBase64LocaleContent } from '../index';
+import { generateSchemas } from '../../../shared/logic/schemas';
 import type { ImageToBase64UI } from '../index';
 
 const slug = 'convertisseur-image-base64';
@@ -154,16 +154,6 @@ const seo: ImagenBase64LocaleContent['seo'] = [
   },
 ];
 
-const appSchema: WithContext<SoftwareApplication> = {
-  '@context': 'https://schema.org',
-  '@type': 'SoftwareApplication',
-  name: title,
-  description,
-  applicationCategory: 'UtilitiesApplication',
-  operatingSystem: 'Web',
-  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
-  inLanguage: 'fr',
-};
 
 export const content: ImagenBase64LocaleContent = {
   slug,
@@ -174,5 +164,5 @@ export const content: ImagenBase64LocaleContent = {
   faq,
   bibliography,
   howTo,
-  schemas: [appSchema as any],
+  schemas: generateSchemas({ title, description, inLanguage: 'fr', faq, howTo }),
 };