{"id":9975,"date":"2025-10-02T06:29:45","date_gmt":"2025-10-02T06:29:45","guid":{"rendered":"https:\/\/bscwebdesign.at\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/"},"modified":"2025-12-03T20:16:23","modified_gmt":"2025-12-03T20:16:23","slug":"welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert","status":"publish","type":"post","link":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/","title":{"rendered":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt)"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"9975\" class=\"elementor elementor-9975 elementor-6763\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-31eb5de e-flex e-con-boxed e-con e-parent\" data-id=\"31eb5de\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-6047b9e e-con-full e-flex e-con e-child\" data-id=\"6047b9e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-05eb86a elementor-widget__width-initial elementor-widget elementor-widget-heading\" data-id=\"05eb86a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">What favicon sizes does my website need? (PNG, ICO, SVG explained) <\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4fb3aa5 e-con-full elementor-hidden-mobile e-flex e-con e-child\" data-id=\"4fb3aa5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b475a1f elementor-widget__width-initial elementor-widget elementor-widget-image\" data-id=\"b475a1f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-300x300.webp\" class=\"attachment-medium size-medium wp-image-3952\" alt=\"Portr\u00e4t von Tobias Berger, junger Mann mit lockigen Haaren und blauem BSC-Pulli, l\u00e4chelnd in die Kamera blickend.\" srcset=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-300x300.webp 300w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1024x1024.webp 1024w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-150x150.webp 150w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-768x768.webp 768w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1536x1536.webp 1536w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-2048x2048.webp 2048w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e6ea943 elementor-hidden-mobile elementor-widget elementor-widget-text-editor\" data-id=\"e6ea943\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"font-family: 'Sora variabel', sans-serif; color: #000;\"><span style=\"color: #000;\">by<\/span> Tobias Berger \/ <span style=\"color: #000;\">updated<\/span> 02.10.2025 \/ 3 min. Reading time<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7e60285 e-con-full elementor-hidden-desktop elementor-hidden-tablet e-flex e-con e-child\" data-id=\"7e60285\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-73a86dd elementor-widget__width-initial elementor-widget elementor-widget-image\" data-id=\"73a86dd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-300x300.webp\" class=\"attachment-medium size-medium wp-image-3952\" alt=\"Portr\u00e4t von Tobias Berger, junger Mann mit lockigen Haaren und blauem BSC-Pulli, l\u00e4chelnd in die Kamera blickend.\" srcset=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-300x300.webp 300w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1024x1024.webp 1024w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-150x150.webp 150w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-768x768.webp 768w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1536x1536.webp 1536w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-2048x2048.webp 2048w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-066f7a1 elementor-hidden-desktop elementor-hidden-tablet elementor-widget elementor-widget-text-editor\" data-id=\"066f7a1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"font-family: 'Sora variabel', sans-serif; color: #000;\"><span style=\"color: #000;\">by<\/span> Tobias Berger \/ <span style=\"color: #000;\">updated<\/span> 02.10.2025 \/ <br>3 min. Reading time<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ec05feb e-flex e-con-boxed e-con e-parent\" data-id=\"ec05feb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d2a299f elementor-widget elementor-widget-text-editor\" data-id=\"d2a299f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<style>.bsc-snippet{\n    font-family:\"Sora\",system-ui,-apple-system,\"Segoe UI\",Roboto,Arial,sans-serif;\n    font-size:16px; line-height:1.8; color:#0c0c0d;\n  }\n  \/* kein h1 hier *\/\n  .bsc-snippet h2{font-size:36px; font-weight:800; line-height:1.25; margin:1.4rem 0 .7rem;}\n  .bsc-snippet h3{font-size:24px; font-weight:600; line-height:1.35; margin:1.1rem 0 .6rem;}\n  .bsc-snippet p{margin:.6rem 0 1rem;}\n  .bsc-snippet a{text-decoration:underline;}\n  .bsc-snippet code{\n    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",monospace;\n    font-size:.95em; background:#f7f7f8; padding:.14rem .4rem; border-radius:6px;\n  }\n\n  \/* Bild \/ Figure *\/\n  .bsc-snippet .bsc-figure{\n    margin:.6rem 0 1.1rem; border-radius:14px; overflow:hidden; background:#fff;\n    box-shadow:0 4px 14px rgba(0,0,0,.08);\n  }\n  .bsc-snippet .bsc-figure img{display:block; width:100%; height:auto;}\n  .bsc-snippet .bsc-figcap{\n    padding:.65rem .9rem; font-size:.95rem; color:#555; background:#fafafa; border-top:1px solid #eee;\n  }\n\n  \/* Tabelle \u2013 gleichm\u00e4\u00dfiger Rahmen via inset-shadow (kein Top-Hairline) *\/\n  .bsc-snippet .table-wrapper{\n    position:relative; margin:0 0 20px; border:0; border-radius:12px; overflow:hidden;\n    background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.08); -webkit-transform:translateZ(0);\n  }\n  .bsc-snippet .table-wrapper::before{\n    content:\"\"; position:absolute; inset:0; pointer-events:none; border-radius:12px;\n    box-shadow:0 0 0 1px #e6e8eb inset;\n  }\n\n  \/* Mobile-Scroll-Container: beh\u00e4lt runde Ecken vom Wrapper *\/\n  .bsc-snippet .table-scroll{\n    overflow-x:auto; -webkit-overflow-scrolling:touch;\n  }\n\n  .bsc-snippet .clean-table{\n    width:100%; border-collapse:separate; border-spacing:0; font-size:16px;\n    min-width: 620px; \/* sorgt auf Handy f\u00fcr horizontales Scrollen statt gequetschtem Layout *\/\n  }\n  .bsc-snippet .clean-table th{\n    background:#f7f7f7; text-align:left; padding:14px 16px; font-weight:600; border:none;\n    border-bottom:1px solid #e6e8eb;\n  }\n  .bsc-snippet .clean-table td{padding:14px 16px; vertical-align:top; border:none;}\n  .bsc-snippet .clean-table tbody tr + tr td{border-top:1px solid #eef0f3;}\n  .bsc-snippet .clean-table tr:hover td{background:#f9fbff;}\n  .bsc-snippet .clean-table small{color:#666;}\n\n  \/* Feature Cards (Codeboxen) + Hover *\/\n  .bsc-snippet .bsc-grid{\n    display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));\n    margin:.6rem 0 1.2rem;\n  }\n  .bsc-snippet .bsc-card{\n    border:1px solid #ececf0; border-radius:12px; padding:.8rem 1rem; background:#fff;\n    transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;\n    box-shadow:0 1px 4px rgba(0,0,0,.04);\n  }\n  .bsc-snippet .bsc-card:hover{\n    transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.10); background:#fbfdff;\n  }\n  .bsc-snippet .bsc-card strong{display:inline-block; margin-right:.35rem;}\n\n  \/* ======= Handy-Optimierungen ======= *\/\n  @media (max-width: 640px){\n    .bsc-snippet h2{font-size:28px;}\n    .bsc-snippet h3{font-size:20px;}\n    .bsc-snippet .clean-table th,\n    .bsc-snippet .clean-table td{padding:12px 14px;}\n    .bsc-snippet .bsc-figcap{font-size:.9rem;}\n    \/* dezenter Scroll-Hinweis (nur mobil) *\/\n    .bsc-snippet .table-scroll{\n      background:\n        linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0)) 0 0\/24px 100% no-repeat,\n        linear-gradient(to left,  rgba(255,255,255,1), rgba(255,255,255,0)) 100% 0\/24px 100% no-repeat;\n    }\n  }\n<\/style><article class=\"bsc-snippet\"><strong>Kurz erkl\u00e4rt:<\/strong> Damit Ihr Favicon \u00fcberall scharf aussieht, brauchen Sie nicht eine, sondern wenige <em>gezielte<\/em> Gr\u00f6\u00dfen und ein sauberes Markup. Hier ist die kompakte Schnell-Referenz \u2013 mit Praxis-Code und Links zum <a href=\"https:\/\/bscwebdesign.at\/blog\/favicon-erstellen-2025-kostenlose-generatoren\/\">Favicon-Leitfaden 2025<\/a> sowie zum <a href=\"https:\/\/bscwebdesign.at\/blog\/favicon-nicht-angezeigt-loesungen\/\">Troubleshooting<\/a>.\n  \n  <h2>Schnell-Referenz: Gr\u00f6\u00dfen &amp; Einsatzzwecke<\/h2><div class=\"table-wrapper\"><div class=\"table-scroll\" aria-label=\"Horizontales Scrollen bei kleineren Bildschirmen m\u00f6glich\"><table class=\"clean-table\"><thead><tr><th>Use Case<\/th><th>Empfohlene Gr\u00f6\u00dfe(n)<\/th><th>Format<\/th><\/tr><\/thead><tbody><tr><td><strong>Browser-Tab<\/strong> (Standard &amp; HiDPI)<\/td><td>16\u00d716, 32\u00d732<\/td><td>PNG <em>oder<\/em> ICO<\/td><\/tr><tr><td><strong>Apple-Touch<\/strong> (iOS\/iPadOS)<\/td><td>180\u00d7180<\/td><td>PNG<\/td><\/tr><tr><td><strong>Google\/Android &amp; SERPs<\/strong><\/td><td>48\u00d748 (Vielfache: 96, 192)<\/td><td>PNG<\/td><\/tr><tr><td><strong>Quelle\/Source<\/strong> f\u00fcr Generatoren<\/td><td>512\u00d7512<\/td><td>PNG, optional SVG <small>(mit Fallback)<\/small><\/td><\/tr><tr><td><strong>Kompatibilit\u00e4t<\/strong> (Fallback)<\/td><td>\/favicon.ico (Mehrgr\u00f6\u00dfen)<\/td><td>ICO<\/td><\/tr><\/tbody><\/table><\/div><\/div><small>*SVG ist flexibel, ben\u00f6tigt aber PNG\/ICO-Fallbacks f\u00fcr \u00e4ltere Umgebungen.<\/small><figure class=\"bsc-figure\"><img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Verschiedene_Favicon_Groessen_Website.webp\" alt=\"\u00dcbersicht verschiedener Favicon-Gr\u00f6\u00dfen f\u00fcr Browser, iOS und Android\" width=\"1600\" height=\"900\" \/><figcaption class=\"bsc-figcap\">Visual: Empfohlene Favicon-Gr\u00f6\u00dfen nach Plattform<\/figcaption><\/figure><h2>Praxis: minimaler Code f\u00fcr 99 % der F\u00e4lle<\/h2><strong>So nutzen:<\/strong> Die folgenden drei Bausteine decken Tabs (PNG), alte Browser (ICO) und iOS-Homescreen (Apple-Touch) ab.\n  \n  <div class=\"bsc-grid\"><div class=\"bsc-card\"><strong>Tab-Icon (PNG)<\/strong> \u2013 HiDPI sicher\n      <code>&lt;link rel=\"icon\" href=\"\/favicon-32.png\" sizes=\"32x32\" type=\"image\/png\"&gt;<\/code><code>&lt;link rel=\"icon\" href=\"\/favicon-16.png\" sizes=\"16x16\" type=\"image\/png\"&gt;<\/code><\/div><div class=\"bsc-card\"><strong>Root-Fallback<\/strong> \u2013 alte Browser\n      <code>&lt;link rel=\"icon\" href=\"\/favicon.ico\" type=\"image\/x-icon\"&gt;<\/code><\/div><div class=\"bsc-card\"><strong>Apple-Touch<\/strong> \u2013 Homescreen\n      <code>&lt;link rel=\"apple-touch-icon\" href=\"\/apple-touch-icon.png\" sizes=\"180x180\"&gt;<\/code><\/div><\/div><h2>Formate richtig w\u00e4hlen<\/h2><strong>Empfehlung:<\/strong> PNG f\u00fcr 16\/32\/48\/180\/192\/512, zus\u00e4tzlich ein <code>\/favicon.ico<\/code> im Root. SVG nur mit PNG\/ICO-Fallback einbinden. Achten Sie auf korrekte MIME-Types: <code>image\/png<\/code>, <code>image\/x-icon<\/code>, <code>image\/svg+xml<\/code>.\n\n<\/article>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-24c5523 elementor-widget elementor-widget-n-accordion\" data-id=\"24c5523\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;default_state&quot;:&quot;all_collapsed&quot;,&quot;max_items_expended&quot;:&quot;one&quot;,&quot;n_accordion_animation_duration&quot;:{&quot;unit&quot;:&quot;ms&quot;,&quot;size&quot;:400,&quot;sizes&quot;:[]}}\" data-widget_type=\"nested-accordion.default\">\n\t\t\t\t\t\t\t<div class=\"e-n-accordion\" aria-label=\"Accordion. Open links with Enter or Space, close with Escape, and navigate with Arrow Keys\">\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-3850\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"1\" tabindex=\"0\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-3850\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> Why is my favicon not displayed in Google? <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-up\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M177 159.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 255.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 329.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1z\"><\/path><\/svg><\/span>\n\t\t\t<span class='e-closed'><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-down\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0l96.4 96.4 96.4-96.4c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.4-24.4 9.4-33.8 0z\"><\/path><\/svg><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3850\" class=\"elementor-element elementor-element-75523b7 e-con-full e-flex e-con e-child\" data-id=\"75523b7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3850\" class=\"elementor-element elementor-element-cde0393 e-flex e-con-boxed e-con e-child\" data-id=\"cde0393\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d76894 elementor-widget elementor-widget-text-editor\" data-id=\"1d76894\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"93\" data-end=\"236\">In short: Mostly <strong data-start=\"165\" data-end=\"186\">crawl delay<\/strong>, <strong data-start=\"188\" data-end=\"207\">wrong markup<\/strong> or <strong data-start=\"213\" data-end=\"233\">blocked file<\/strong>.<\/p><ul data-start=\"237\" data-end=\"606\"><li data-start=\"237\" data-end=\"336\"><p data-start=\"239\" data-end=\"336\">Check: <code data-start=\"247\" data-end=\"259\">rel=\"icon\"<\/code> in <code data-start=\"263\" data-end=\"271\">&lt;head&gt;<\/code>, correct path, HTTP status 200, no <code data-start=\"315\" data-end=\"327\">robots.txt<\/code> block.<\/p><\/li><li data-start=\"337\" data-end=\"431\"><p data-start=\"339\" data-end=\"431\">File: Square, at least 48\u00d748 px (larger ok), clear, unobjectionable motif. <\/p><\/li><li data-start=\"432\" data-end=\"499\"><p data-start=\"434\" data-end=\"499\">Consistency: Link the same icon on all important pages.<\/p><\/li><li data-start=\"500\" data-end=\"606\"><p data-start=\"502\" data-end=\"606\">Empty cache: CDN\/server\/browser; Google usually adopts changes in hours to a few days.<\/p><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-3851\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"2\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-3851\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> Why can't I see my (new) favicon in the browser\/Chrome? <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-up\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M177 159.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 255.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 329.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1z\"><\/path><\/svg><\/span>\n\t\t\t<span class='e-closed'><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-down\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0l96.4 96.4 96.4-96.4c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.4-24.4 9.4-33.8 0z\"><\/path><\/svg><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3851\" class=\"elementor-element elementor-element-567da90 e-con-full e-flex e-con e-child\" data-id=\"567da90\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3851\" class=\"elementor-element elementor-element-d637e33 e-flex e-con-boxed e-con e-child\" data-id=\"d637e33\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-abdb685 elementor-widget elementor-widget-text-editor\" data-id=\"abdb685\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"608\" data-end=\"725\">Almost always <strong data-start=\"689\" data-end=\"698\">cache<\/strong> or <strong data-start=\"704\" data-end=\"722\">double entries<\/strong>.<\/p><ul data-start=\"726\" data-end=\"1149\"><li data-start=\"726\" data-end=\"837\"><p data-start=\"728\" data-end=\"837\">Hard reload (Ctrl\/Cmd+Shift+R), test incognito if necessary; if required, URL versioning like <code data-start=\"816\" data-end=\"834\">\/favicon.png?v=2<\/code>.<\/p><\/li><li data-start=\"838\" data-end=\"966\"><p data-start=\"840\" data-end=\"966\">DevTools \u2192 Network: Select favicon request \u2192 Status 200, correct content type (<code data-start=\"931\" data-end=\"942\">image\/png<\/code> or <code data-start=\"948\" data-end=\"962\">image\/x-icon<\/code>).<\/p><\/li><li data-start=\"967\" data-end=\"1066\"><p data-start=\"969\" data-end=\"1066\">Markup: Link belongs in the <code data-start=\"998\" data-end=\"1006\">&lt;head&gt;<\/code>, not in the body; delete old\/duplicate <code data-start=\"1043\" data-end=\"1055\">rel=\"icon\"<\/code>.<\/p><\/li><li data-start=\"1067\" data-end=\"1149\"><p data-start=\"1069\" data-end=\"1149\">Local tests: Many browsers show local pages without a favicon &#8211; check online.<\/p><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t\t<details id=\"e-n-accordion-item-3852\" class=\"e-n-accordion-item\" >\n\t\t\t\t<summary class=\"e-n-accordion-item-title\" data-accordion-index=\"3\" tabindex=\"-1\" aria-expanded=\"false\" aria-controls=\"e-n-accordion-item-3852\" >\n\t\t\t\t\t<span class='e-n-accordion-item-title-header'><div class=\"e-n-accordion-item-title-text\"> Which formats &amp; sizes should I use so that the favicon works everywhere? <\/div><\/span>\n\t\t\t\t\t\t\t<span class='e-n-accordion-item-title-icon'>\n\t\t\t<span class='e-opened' ><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-up\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M177 159.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 255.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 329.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1z\"><\/path><\/svg><\/span>\n\t\t\t<span class='e-closed'><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-angle-down\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M143 352.3L7 216.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0l96.4 96.4 96.4-96.4c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.4-24.4 9.4-33.8 0z\"><\/path><\/svg><\/span>\n\t\t<\/span>\n\n\t\t\t\t\t\t<\/summary>\n\t\t\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3852\" class=\"elementor-element elementor-element-509b705 e-con-full e-flex e-con e-child\" data-id=\"509b705\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div role=\"region\" aria-labelledby=\"e-n-accordion-item-3852\" class=\"elementor-element elementor-element-d4a5025 e-flex e-con-boxed e-con e-child\" data-id=\"d4a5025\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-524f79a elementor-widget elementor-widget-text-editor\" data-id=\"524f79a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"1151\" data-end=\"1289\">Set to <strong data-start=\"1250\" data-end=\"1263\">PNG + ICO<\/strong> (SVG only with fallback).<\/p><ul data-start=\"1290\" data-end=\"1762\"><li data-start=\"1290\" data-end=\"1409\"><p data-start=\"1292\" data-end=\"1409\">Minimum set: 16\u00d716, 32\u00d732 (browser tabs), 180\u00d7180 (Apple Touch). Optional 512\u00d7512 (Android\/Source). <\/p><\/li><li data-start=\"1410\" data-end=\"1554\"><p data-start=\"1412\" data-end=\"1554\">Practice: In addition, a <code data-start=\"1437\" data-end=\"1451\">\/favicon.ico<\/code> in the domain root for maximum compatibility and explicit <code data-start=\"1515\" data-end=\"1538\">&lt;link rel=\"icon\" ...&gt;<\/code> tags for PNG.<\/p><\/li><li data-start=\"1555\" data-end=\"1656\"><p data-start=\"1557\" data-end=\"1656\">Design: Simple, high contrast, no fine details &#8211; test in 16\u00d716, whether still recognizable.<\/p><\/li><li data-start=\"1657\" data-end=\"1762\"><p data-start=\"1659\" data-end=\"1762\">Consistency: Use the same icon\/markup across all templates so that no variants collide.<\/p><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/details>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-337c1d6 elementor-fixed elementor-widget__width-initial elementor-widget elementor-widget-table-of-contents\" data-id=\"337c1d6\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;headings_by_tags&quot;:[&quot;h2&quot;],&quot;exclude_headings_by_selector&quot;:[],&quot;no_headings_message&quot;:&quot;Es wurden keine \\u00dcberschriften auf dieser Seite gefunden.&quot;,&quot;_position&quot;:&quot;fixed&quot;,&quot;marker_view&quot;:&quot;bullets&quot;,&quot;icon&quot;:{&quot;value&quot;:&quot;&quot;,&quot;library&quot;:&quot;&quot;},&quot;hierarchical_view&quot;:&quot;yes&quot;,&quot;min_height&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;min_height_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;min_height_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"table-of-contents.default\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-toc__header\">\n\t\t\t\t\t\t<h4 class=\"elementor-toc__header-title\">\n\t\t\t\tIn this article\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div id=\"elementor-toc__337c1d6\" class=\"elementor-toc__body\">\n\t\t\t<div class=\"elementor-toc__spinner-container\">\n\t\t\t\t<svg class=\"elementor-toc__spinner eicon-animation-spin e-font-icon-svg e-eicon-loading\" aria-hidden=\"true\" viewBox=\"0 0 1000 1000\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M500 975V858C696 858 858 696 858 500S696 142 500 142 142 304 142 500H25C25 237 238 25 500 25S975 237 975 500 763 975 500 975Z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f49c2f2 elementor-widget elementor-widget-text-editor\" data-id=\"f49c2f2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<style>\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=Sora:wght@400;600;800&display=swap');\n  .bsc-snippet{font-family:\"Sora\",system-ui,-apple-system,\"Segoe UI\",Roboto,Arial,sans-serif;font-size:16px;line-height:1.8;}\n<\/style>\n\n<p class=\"bsc-snippet\"><strong>Conclusion:<\/strong> Correct paths, clean <code>rel=\"icon\"<\/code> markup and cleared caches usually solve the problem of a favicon not being displayed.<\/p>\n<p class=\"bsc-snippet\"><strong>Tip:<\/strong> Not sure how to create the sizes <code>16\u00d716<\/code>, <code>32\u00d732<\/code>, <code>48\u00d748<\/code>, <code>180\u00d7180<\/code> &amp; Co. correctly? Use a <g id=\"gid_5\">favicon generator<\/g> &#8211; it provides you with all the required sizes and formats (PNG\/ICO, optional SVG) ready to use. Details &amp; tool recommendations in the <a href=\"\/blog\/favicon-erstellen#generatoren\">Favicon Guide 2025 (Generators)<\/a>.  <\/p>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2b90878 e-con-full e-flex e-con e-child\" data-id=\"2b90878\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-4a389af e-con-full e-flex e-con e-child\" data-id=\"4a389af\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-446a8a4 elementor-widget elementor-widget-image\" data-id=\"446a8a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"800\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1024x1024.webp\" class=\"attachment-large size-large wp-image-3952\" alt=\"Portr\u00e4t von Tobias Berger, junger Mann mit lockigen Haaren und blauem BSC-Pulli, l\u00e4chelnd in die Kamera blickend.\" srcset=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1024x1024.webp 1024w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-300x300.webp 300w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-150x150.webp 150w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-768x768.webp 768w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-1536x1536.webp 1536w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/Tobias-2048x2048.webp 2048w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0a376c0 e-con-full e-flex e-con e-child\" data-id=\"0a376c0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e545ab5 elementor-widget elementor-widget-heading\" data-id=\"e545ab5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Hey, I'm Tobias!<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-37f0e3b elementor-widget elementor-widget-text-editor\" data-id=\"37f0e3b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><div data-breakout=\"normal\"><p id=\"viewer-e9b6k624\" class=\"pQuHl TfvTg z3yvg logrL\" dir=\"auto\">Thanks for taking the time to read this post &#8211; really cool that you&#8217;re interested in website &amp; web design!  <br data-start=\"486\" data-end=\"489\">You can find many more tips on design, technology and SEO on our blog. And if you have any questions or need support with your own website, we at BSC Webdesign are always happy to help. <\/p><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-91e9a88 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"91e9a88\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm elementor-animation-grow\" href=\"https:\/\/bscwebdesign.at\/en\/\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">See for yourself now<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>What favicon sizes does my website need? Practical guide with recommended sizes (PNG\/ICO\/SVG), code examples and generator tips &#8211; quickly implemented. <\/p>\n","protected":false},"author":1,"featured_media":14194,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-9975","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at\" \/>\n<meta property=\"og:description\" content=\"What favicon sizes does my website need? Practical guide with recommended sizes (PNG\/ICO\/SVG), code examples and generator tips - quickly implemented.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/\" \/>\n<meta property=\"og:site_name\" content=\"bscwebdesign.at\" \/>\n<meta property=\"article:published_time\" content=\"2025-10-02T06:29:45+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-03T20:16:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"900\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"office@bscwebdesign.com\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"office@bscwebdesign.com\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/\"},\"author\":{\"name\":\"office@bscwebdesign.com\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/person\\\/f791b2d19aa0477a1a182c09cca40514\"},\"headline\":\"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt)\",\"datePublished\":\"2025-10-02T06:29:45+00:00\",\"dateModified\":\"2025-12-03T20:16:23+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/\"},\"wordCount\":689,\"publisher\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/Favicon-Groessen-fuer-website.webp\",\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/\",\"name\":\"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/Favicon-Groessen-fuer-website.webp\",\"datePublished\":\"2025-10-02T06:29:45+00:00\",\"dateModified\":\"2025-12-03T20:16:23+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#primaryimage\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/Favicon-Groessen-fuer-website.webp\",\"contentUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/Favicon-Groessen-fuer-website.webp\",\"width\":1600,\"height\":900},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/home\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#website\",\"url\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/\",\"name\":\"bscwebdesign.at\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#organization\",\"name\":\"bscwebdesign.at\",\"url\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/bsc-logo-next.webp\",\"contentUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/bsc-logo-next.webp\",\"width\":2500,\"height\":1000,\"caption\":\"bscwebdesign.at\"},\"image\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/person\\\/f791b2d19aa0477a1a182c09cca40514\",\"name\":\"office@bscwebdesign.com\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g\",\"caption\":\"office@bscwebdesign.com\"},\"sameAs\":[\"https:\\\/\\\/bscwebdesign.at\"],\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/blog\\\/author\\\/officebscwebdesign-com\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/","og_locale":"en_US","og_type":"article","og_title":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at","og_description":"What favicon sizes does my website need? Practical guide with recommended sizes (PNG\/ICO\/SVG), code examples and generator tips - quickly implemented.","og_url":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/","og_site_name":"bscwebdesign.at","article_published_time":"2025-10-02T06:29:45+00:00","article_modified_time":"2025-12-03T20:16:23+00:00","og_image":[{"width":1600,"height":900,"url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp","type":"image\/webp"}],"author":"office@bscwebdesign.com","twitter_card":"summary_large_image","twitter_misc":{"Written by":"office@bscwebdesign.com","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#article","isPartOf":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/"},"author":{"name":"office@bscwebdesign.com","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/person\/f791b2d19aa0477a1a182c09cca40514"},"headline":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt)","datePublished":"2025-10-02T06:29:45+00:00","dateModified":"2025-12-03T20:16:23+00:00","mainEntityOfPage":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/"},"wordCount":689,"publisher":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#organization"},"image":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#primaryimage"},"thumbnailUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp","inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/","url":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/","name":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt) - bscwebdesign.at","isPartOf":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#primaryimage"},"image":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#primaryimage"},"thumbnailUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp","datePublished":"2025-10-02T06:29:45+00:00","dateModified":"2025-12-03T20:16:23+00:00","breadcrumb":{"@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#primaryimage","url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp","contentUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Favicon-Groessen-fuer-website.webp","width":1600,"height":900},{"@type":"BreadcrumbList","@id":"https:\/\/bscwebdesign.at\/en\/blog\/welche-favicon-groessen-braucht-meine-website-png-ico-svg-erklaert\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bscwebdesign.at\/en\/home\/"},{"@type":"ListItem","position":2,"name":"Welche Favicon-Gr\u00f6\u00dfen braucht meine Website? (PNG, ICO, SVG erkl\u00e4rt)"}]},{"@type":"WebSite","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#website","url":"https:\/\/plum-ibex-319890.hostingersite.com\/","name":"bscwebdesign.at","description":"","publisher":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/plum-ibex-319890.hostingersite.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#organization","name":"bscwebdesign.at","url":"https:\/\/plum-ibex-319890.hostingersite.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/logo\/image\/","url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/07\/bsc-logo-next.webp","contentUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/07\/bsc-logo-next.webp","width":2500,"height":1000,"caption":"bscwebdesign.at"},"image":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/person\/f791b2d19aa0477a1a182c09cca40514","name":"office@bscwebdesign.com","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2e20e08ef43e4350ac5d6c2778485f497dbb48e503340112c1f1fb68f4c44d89?s=96&d=mm&r=g","caption":"office@bscwebdesign.com"},"sameAs":["https:\/\/bscwebdesign.at"],"url":"https:\/\/bscwebdesign.at\/en\/blog\/author\/officebscwebdesign-com\/"}]}},"_links":{"self":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/posts\/9975","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/comments?post=9975"}],"version-history":[{"count":1,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/posts\/9975\/revisions"}],"predecessor-version":[{"id":9977,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/posts\/9975\/revisions\/9977"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/media\/14194"}],"wp:attachment":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/media?parent=9975"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/categories?post=9975"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/tags?post=9975"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}