Einführung in Scalable Vector Graphics (SVG): Klar, leicht, grenzenlos skalierbar

Gewähltes Thema: Einführung in Scalable Vector Graphics (SVG). Willkommen! Hier zeigen wir dir, wie SVG deine Grafiken schärfer, schneller und flexibler macht – vom ersten Kreis bis zur interaktiven Illustration. Abonniere unseren Blog, stelle Fragen und teile deine Projekte, damit wir gemeinsam lernen und wachsen.

Was ist SVG und warum es heute unverzichtbar ist

SVG basiert auf mathematischen Formen statt Pixelrastern, daher bleiben Linien sauber und Texte gestochen scharf – selbst auf hochauflösenden Bildschirmen. Teile deine Lieblingsbeispiele in den Kommentaren und inspiriere andere mit deinem Blick für Details.

Was ist SVG und warum es heute unverzichtbar ist

Ein SVG ist letztlich XML: Elemente wie , oder sind semantisch, durchsuchbar und versionierbar. Das erleichtert Zusammenarbeit im Team, Code-Reviews und automatisierte Optimierungen. Abonniere, um praxisnahe Snippets zu erhalten.

Erste Schritte: Dein erstes SVG zeichnen

Mit , und entsteht schnell eine kleine Komposition. Schon wenige Attribute wie cx, r, x oder y bringen Bewegung in dein Layout. Poste dein erstes Mini-SVG und frage nach Feedback.

Erste Schritte: Dein erstes SVG zeichnen

Die viewBox definiert Koordinatensystem und Zoom-Verhalten. Wer sie beherrscht, kontrolliert Größen, Ausschnitt und Responsiveness. Teile deine Aha-Momente, damit andere von deinen Erkenntnissen profitieren.

Formen, Pfade und Attribute meistern

Das -Element ist mächtig: M startet, L verbindet, C kurvt, Z schließt. Mit wenigen Befehlen entstehen Logos, Wellen und Icons. Teile ein kurzes Pfadbeispiel und frage nach Verbesserungen.

Formen, Pfade und Attribute meistern

fill, stroke, stroke-width, stroke-linecap und stroke-dasharray bestimmen Charakter und Rhythmus deiner Formen. Experimentiere mit Transparenzen. Poste Vorher-Nachher-Bilder, um andere zu inspirieren.

This is the heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

This is the heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Interaktivität und Animation in SVG

Schon mit :hover oder :focus erhalten Icons Feedback und Barrierefreiheit. Farben, Strichstärken und Schatten signalisieren Interaktion. Teile dein liebstes Micro-Interaction-Beispiel mit SVG.

Performance und Optimierung für schnelle Seiten

SVGO entfernt Ballast, rundet Koordinaten und vereinfacht Pfade. Dadurch sinkt die Dateigröße spürbar. Teile deine Kompressionswerte, damit wir gemeinsam sinnvolle Zielgrößen diskutieren.

Performance und Optimierung für schnelle Seiten

Nutze , Muster und Gradients, um Ressourcen zu teilen und das DOM sauber zu halten. Erzähl uns, welche Wiederverwendungsstrategie in deinem Build-Prozess am besten funktioniert.

Barrierefreiheit und SEO mit SVG

Mit , <desc> und aria-labelledby erklärst du Bedeutung und Kontext. Screenreader danken es dir. Frage nach einer schnellen Checkliste, wenn du jetzt auditieren willst. </div> </div> <div class="elementor-element elementor-element-55d0897d elementor-align-center elementor-widget elementor-widget-button" data-id="55d0897d" data-element_type="widget" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://beritakristen.com"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-text">Klicken Sie hier</span> </span> </a> </div> </div> </div> </div> </div> <div class="elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-281c1eee" data-id="281c1eee" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-37fb16b1 elementor-widget elementor-widget-heading" data-id="37fb16b1" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Barrierefreiheit und SEO mit SVG</h2> </div> </div> <div class="elementor-element elementor-element-8dcd3ed6 elementor-widget elementor-widget-text-editor" data-id="8dcd3ed6" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> Achte auf Farbwahrnehmung, klare Fokuszustände und klickbare Flächen. Teste mit Tastatur und Screenreader. Teile deine Testmethoden, damit andere daraus lernen. </div> </div> </div> </div> </div> </section> <div class="elementor-element elementor-element-41aa7845 e-con-full e-flex e-con e-parent" data-id="41aa7845" data-element_type="container"> <div class="elementor-element elementor-element-6257a0ab elementor-widget elementor-widget-google_maps" data-id="6257a0ab" data-element_type="widget" data-widget_type="google_maps.default"> <div class="elementor-widget-container"> <div class="elementor-custom-embed"> <iframe loading="lazy" src="https://maps.google.com/maps?q=Am%20Strom%201%2C%2027568%20Bremerhaven%2C%20Germany&t=m&z=10&output=embed&iwloc=near" title="Am Strom 1, 27568 Bremerhaven, Germany" aria-label="Am Strom 1, 27568 Bremerhaven, Germany" ></iframe> </div> </div> </div> </div> <div class="elementor-element elementor-element-ea47e9f8 e-flex e-con-boxed e-con e-parent" data-id="ea47e9f8" data-element_type="container"> <div class="e-con-inner"> <div class="elementor-element elementor-element-83ea2358 elementor-nav-menu__align-center elementor-nav-menu--dropdown-none elementor-widget elementor-widget-nav-menu" data-id="83ea2358" data-element_type="widget" data-settings="{"layout":"horizontal","submenu_icon":{"value":"<svg class=\"e-font-icon-svg e-fas-caret-down\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z\"><\/path><\/svg>","library":"fa-solid"}}" data-widget_type="nav-menu.default"> <div class="elementor-widget-container"> <nav aria-label="Menu" class="elementor-nav-menu--main elementor-nav-menu__container elementor-nav-menu--layout-horizontal e--pointer-underline e--animation-fade"> <ul id="menu-1-83ea2358" class="elementor-nav-menu"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-562"><a href="https://beritakristen.com/geschaftsbedingungen/" class="elementor-item">Geschäftsbedingungen</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-563"><a href="https://beritakristen.com/datenschutzrichtlinie/" class="elementor-item">Datenschutzrichtlinie</a></li> </ul> </nav> <nav class="elementor-nav-menu--dropdown elementor-nav-menu__container" aria-hidden="true"> <ul id="menu-2-83ea2358" class="elementor-nav-menu"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-562"><a href="https://beritakristen.com/geschaftsbedingungen/" class="elementor-item" tabindex="-1">Geschäftsbedingungen</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-563"><a href="https://beritakristen.com/datenschutzrichtlinie/" class="elementor-item" tabindex="-1">Datenschutzrichtlinie</a></li> </ul> </nav> </div> </div> </div> </div> </div> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/theme\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <!--copyscapeskip--> <aside id="moove_gdpr_cookie_info_bar" class="moove-gdpr-info-bar-hidden moove-gdpr-align-center moove-gdpr-dark-scheme gdpr_infobar_postion_bottom" aria-label="GDPR Cookie Banner" style="display: none;"> <div class="moove-gdpr-info-bar-container"> <div class="moove-gdpr-info-bar-content"> <div class="moove-gdpr-cookie-notice"> <p>We are using cookies to give you the best experience on our website.</p> <p>You can find out more about which cookies we are using or switch them off in <button tabindex="0" aria-haspopup="true" data-href="#moove_gdpr_cookie_modal" class="change-settings-button">settings</button>.</p> <button class="moove-gdpr-infobar-close-btn gdpr-content-close-btn" aria-label="Close GDPR Cookie Banner"> <span class="gdpr-sr-only">Close GDPR Cookie Banner</span> <i class="moovegdpr-arrow-close"></i> </button> </div> <!-- .moove-gdpr-cookie-notice --> <div class="moove-gdpr-button-holder"> <button class="mgbutton moove-gdpr-infobar-allow-all gdpr-fbo-0" aria-label="Accept" tabindex="1" >Accept</button> <button class="mgbutton moove-gdpr-infobar-reject-btn gdpr-fbo-1 " tabindex="1" aria-label="Reject">Reject</button> <button class="mgbutton moove-gdpr-infobar-settings-btn change-settings-button gdpr-fbo-2" aria-haspopup="true" data-href="#moove_gdpr_cookie_modal" tabindex="2" aria-label="Settings">Settings</button> <button class="moove-gdpr-infobar-close-btn gdpr-fbo-3" aria-label="Close GDPR Cookie Banner" tabindex="3" > <span class="gdpr-sr-only">Close GDPR Cookie Banner</span> <i class="moovegdpr-arrow-close"></i> </button> </div> <!-- .button-container --> </div> <!-- moove-gdpr-info-bar-content --> </div> <!-- moove-gdpr-info-bar-container --> </aside> <!-- #moove_gdpr_cookie_info_bar --> <!--/copyscapeskip--> <script> const lazyloadRunObserver = () => { const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` ); const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => { entries.forEach( ( entry ) => { if ( entry.isIntersecting ) { let lazyloadBackground = entry.target; if( lazyloadBackground ) { lazyloadBackground.classList.add( 'e-lazyloaded' ); } lazyloadBackgroundObserver.unobserve( entry.target ); } }); }, { rootMargin: '200px 0px 200px 0px' } ); lazyloadBackgrounds.forEach( ( lazyloadBackground ) => { lazyloadBackgroundObserver.observe( lazyloadBackground ); } ); }; const events = [ 'DOMContentLoaded', 'elementor/lazyload/observe', ]; events.forEach( ( event ) => { document.addEventListener( event, lazyloadRunObserver ); } ); </script> <link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-heading.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-heading.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-image.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-image.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-image-box.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-image-box.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-divider.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-divider.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/lib/swiper/v8/css/swiper.min.css?ver=8.4.5" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/lib/swiper/v8/css/swiper.min.css?ver=8.4.5" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/conditionals/e-swiper.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/conditionals/e-swiper.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-media-carousel.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-media-carousel.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-carousel-module-base.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-carousel-module-base.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-google_maps.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor/assets/css/widget-google_maps.min.css?ver=3.31.2" media="all"></noscript><link rel="preload" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-nav-menu.min.css?ver=3.31.2" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/css/widget-nav-menu.min.css?ver=3.31.2" media="all"></noscript><script id="moove_gdpr_frontend-js-extra"> var moove_frontend_gdpr_scripts = {"ajaxurl":"https:\/\/beritakristen.com\/wp-admin\/admin-ajax.php","post_id":"552","plugin_dir":"https:\/\/beritakristen.com\/wp-content\/plugins\/gdpr-cookie-compliance","show_icons":"all","is_page":"1","ajax_cookie_removal":"false","strict_init":"2","enabled_default":{"strict":2,"third_party":0,"advanced":0,"performance":0,"preference":0},"geo_location":"false","force_reload":"true","is_single":"","hide_save_btn":"false","current_user":"0","cookie_expiration":"365","script_delay":"2000","close_btn_action":"1","close_btn_rdr":"","scripts_defined":"{\"cache\":true,\"header\":\"\",\"body\":\"\",\"footer\":\"\",\"thirdparty\":{\"header\":\"\",\"body\":\"\",\"footer\":\"\"},\"strict\":{\"header\":\"\",\"body\":\"\",\"footer\":\"\"},\"advanced\":{\"header\":\"\",\"body\":\"\",\"footer\":\"\"}}","gdpr_scor":"true","wp_lang":"","wp_consent_api":"false","gdpr_nonce":"d20d97cf99"}; </script> <script defer src="https://beritakristen.com/wp-content/plugins/gdpr-cookie-compliance/dist/scripts/main.js?ver=5.0.6" id="moove_gdpr_frontend-js"></script> <script id="moove_gdpr_frontend-js-after"> var gdpr_consent__strict = "true" var gdpr_consent__thirdparty = "false" var gdpr_consent__advanced = "false" var gdpr_consent__performance = "false" var gdpr_consent__preference = "false" var gdpr_consent__cookies = "strict" </script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor/assets/js/webpack.runtime.min.js?ver=3.31.2" id="elementor-webpack-runtime-js"></script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor/assets/js/frontend-modules.min.js?ver=3.31.2" id="elementor-frontend-modules-js"></script> <script defer src="https://beritakristen.com/wp-includes/js/jquery/ui/core.min.js?ver=1.13.3" id="jquery-ui-core-js"></script> <script id="elementor-frontend-js-before"> var elementorFrontendConfig = {"environmentMode":{"edit":false,"wpPreview":false,"isScriptDebug":false},"i18n":{"shareOnFacebook":"Share on Facebook","shareOnTwitter":"Share on Twitter","pinIt":"Pin it","download":"Download","downloadImage":"Download image","fullscreen":"Fullscreen","zoom":"Zoom","share":"Share","playVideo":"Play Video","previous":"Previous","next":"Next","close":"Close","a11yCarouselPrevSlideMessage":"Previous slide","a11yCarouselNextSlideMessage":"Next slide","a11yCarouselFirstSlideMessage":"This is the first slide","a11yCarouselLastSlideMessage":"This is the last slide","a11yCarouselPaginationBulletMessage":"Go to slide"},"is_rtl":false,"breakpoints":{"xs":0,"sm":480,"md":768,"lg":1025,"xl":1440,"xxl":1600},"responsive":{"breakpoints":{"mobile":{"label":"Mobile Portrait","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Landscape","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet Portrait","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Landscape","value":1200,"default_value":1200,"direction":"max","is_enabled":false},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}},"hasCustomBreakpoints":false},"version":"3.31.2","is_static":false,"experimentalFeatures":{"e_font_icon_svg":true,"additional_custom_breakpoints":true,"container":true,"theme_builder_v2":true,"nested-elements":true,"e_element_cache":true,"home_screen":true,"e_atomic_elements":true,"atomic_widgets_should_enforce_capabilities":true,"e_classes":true,"global_classes_should_enforce_capabilities":true,"e_variables":true,"cloud-library":true,"e_opt_in_v4_page":true,"e_opt_in_v4":true,"mega-menu":true},"urls":{"assets":"https:\/\/beritakristen.com\/wp-content\/plugins\/elementor\/assets\/","ajaxurl":"https:\/\/beritakristen.com\/wp-admin\/admin-ajax.php","uploadUrl":"https:\/\/beritakristen.com\/wp-content\/uploads"},"nonces":{"floatingButtonsClickTracking":"d63ef90263"},"swiperClass":"swiper","settings":{"page":[],"editorPreferences":[]},"kit":{"active_breakpoints":["viewport_mobile","viewport_tablet"],"global_image_lightbox":"yes","lightbox_enable_counter":"yes","lightbox_enable_fullscreen":"yes","lightbox_enable_zoom":"yes","lightbox_enable_share":"yes","lightbox_title_src":"title","lightbox_description_src":"description"},"post":{"id":552,"title":"SVG%20Einfhrung%20%E2%80%93%20Beritakristen","excerpt":"","featuredImage":false}}; </script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor/assets/js/frontend.min.js?ver=3.31.2" id="elementor-frontend-js"></script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor/assets/lib/swiper/v8/swiper.min.js?ver=8.4.5" id="swiper-js"></script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/lib/smartmenus/jquery.smartmenus.min.js?ver=1.2.1" id="smartmenus-js"></script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/js/webpack-pro.runtime.min.js?ver=3.31.2" id="elementor-pro-webpack-runtime-js"></script> <script defer src="https://beritakristen.com/wp-includes/js/dist/hooks.min.js?ver=4d63a3d491d11ffd8ac6" id="wp-hooks-js"></script> <script defer src="https://beritakristen.com/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script> <script id="wp-i18n-js-after"> wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); </script> <script id="elementor-pro-frontend-js-before"> var ElementorProFrontendConfig = {"ajaxurl":"https:\/\/beritakristen.com\/wp-admin\/admin-ajax.php","nonce":"1b02d5653e","urls":{"assets":"https:\/\/beritakristen.com\/wp-content\/plugins\/elementor-pro\/assets\/","rest":"https:\/\/beritakristen.com\/wp-json\/"},"settings":{"lazy_load_background_images":true},"popup":{"hasPopUps":false},"shareButtonsNetworks":{"facebook":{"title":"Facebook","has_counter":true},"twitter":{"title":"Twitter"},"linkedin":{"title":"LinkedIn","has_counter":true},"pinterest":{"title":"Pinterest","has_counter":true},"reddit":{"title":"Reddit","has_counter":true},"vk":{"title":"VK","has_counter":true},"odnoklassniki":{"title":"OK","has_counter":true},"tumblr":{"title":"Tumblr"},"digg":{"title":"Digg"},"skype":{"title":"Skype"},"stumbleupon":{"title":"StumbleUpon","has_counter":true},"mix":{"title":"Mix"},"telegram":{"title":"Telegram"},"pocket":{"title":"Pocket","has_counter":true},"xing":{"title":"XING","has_counter":true},"whatsapp":{"title":"WhatsApp"},"email":{"title":"Email"},"print":{"title":"Print"},"x-twitter":{"title":"X"},"threads":{"title":"Threads"}},"facebook_sdk":{"lang":"en_US","app_id":""},"lottie":{"defaultAnimationUrl":"https:\/\/beritakristen.com\/wp-content\/plugins\/elementor-pro\/modules\/lottie\/assets\/animations\/default.json"}}; </script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/js/frontend.min.js?ver=3.31.2" id="elementor-pro-frontend-js"></script> <script defer src="https://beritakristen.com/wp-content/plugins/elementor-pro/assets/js/elements-handlers.min.js?ver=3.31.2" id="pro-elements-handlers-js"></script> <!--copyscapeskip--> <!-- V1 --> <dialog id="moove_gdpr_cookie_modal" class="gdpr_lightbox-hide" aria-modal="true" aria-label="GDPR Settings Screen"> <div class="moove-gdpr-modal-content moove-clearfix logo-position-left moove_gdpr_modal_theme_v1"> <button class="moove-gdpr-modal-close" autofocus aria-label="Close GDPR Cookie Settings"> <span class="gdpr-sr-only">Close GDPR Cookie Settings</span> <span class="gdpr-icon moovegdpr-arrow-close"></span> </button> <div class="moove-gdpr-modal-left-content"> <div class="moove-gdpr-company-logo-holder"> <img src="https://beritakristen.com/wp-content/plugins/gdpr-cookie-compliance/dist/images/gdpr-logo.png" alt="Beritakristen" width="350" height="233" class="img-responsive" /> </div> <!-- .moove-gdpr-company-logo-holder --> <ul id="moove-gdpr-menu"> <li class="menu-item-on menu-item-privacy_overview menu-item-selected"> <button data-href="#privacy_overview" class="moove-gdpr-tab-nav" aria-label="Privacy Overview"> <span class="gdpr-nav-tab-title">Privacy Overview</span> </button> </li> <li class="menu-item-strict-necessary-cookies menu-item-off"> <button data-href="#strict-necessary-cookies" class="moove-gdpr-tab-nav" aria-label="Necessary"> <span class="gdpr-nav-tab-title">Necessary</span> </button> </li> <li class="menu-item-moreinfo menu-item-off"> <button data-href="#cookie_policy_modal" class="moove-gdpr-tab-nav" aria-label="Cookie Policy"> <span class="gdpr-nav-tab-title">Cookie Policy</span> </button> </li> </ul> <div class="moove-gdpr-branding-cnt"> <a href="https://wordpress.org/plugins/gdpr-cookie-compliance/" rel="noopener noreferrer" target="_blank" class='moove-gdpr-branding'>Powered by  <span>GDPR Cookie Compliance</span></a> </div> <!-- .moove-gdpr-branding --> </div> <!-- .moove-gdpr-modal-left-content --> <div class="moove-gdpr-modal-right-content"> <div class="moove-gdpr-modal-title"> </div> <!-- .moove-gdpr-modal-ritle --> <div class="main-modal-content"> <div class="moove-gdpr-tab-content"> <div id="privacy_overview" class="moove-gdpr-tab-main"> <span class="tab-title">Privacy Overview</span> <div class="moove-gdpr-tab-main-content"> <p>This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.</p> </div> <!-- .moove-gdpr-tab-main-content --> </div> <!-- #privacy_overview --> <div id="strict-necessary-cookies" class="moove-gdpr-tab-main" style="display:none"> <span class="tab-title">Necessary</span> <div class="moove-gdpr-tab-main-content"> <p>Strictly Necessary Cookie should be enabled at all times so that we can save your preferences for cookie settings.</p> <div class="moove-gdpr-status-bar gdpr-checkbox-disabled checkbox-selected"> <div class="gdpr-cc-form-wrap"> <div class="gdpr-cc-form-fieldset"> <label class="cookie-switch" for="moove_gdpr_strict_cookies"> <span class="gdpr-sr-only">Enable or Disable Cookies</span> <input type="checkbox" aria-label="Necessary" disabled checked="checked" value="check" name="moove_gdpr_strict_cookies" id="moove_gdpr_strict_cookies"> <span class="cookie-slider cookie-round gdpr-sr" data-text-enable="Enabled" data-text-disabled="Disabled"> <span class="gdpr-sr-label"> <span class="gdpr-sr-enable">Enabled</span> <span class="gdpr-sr-disable">Disabled</span> </span> </span> </label> </div> <!-- .gdpr-cc-form-fieldset --> </div> <!-- .gdpr-cc-form-wrap --> </div> <!-- .moove-gdpr-status-bar --> </div> <!-- .moove-gdpr-tab-main-content --> </div> <!-- #strict-necesarry-cookies --> <div id="cookie_policy_modal" class="moove-gdpr-tab-main" style="display:none"> <span class="tab-title">Cookie Policy</span> <div class="moove-gdpr-tab-main-content"> <p>More information about our <a href="#" target="_blank" rel="noopener">Cookie Policy</a></p> </div> <!-- .moove-gdpr-tab-main-content --> </div> </div> <!-- .moove-gdpr-tab-content --> </div> <!-- .main-modal-content --> <div class="moove-gdpr-modal-footer-content"> <div class="moove-gdpr-button-holder"> <button class="mgbutton moove-gdpr-modal-allow-all button-visible" aria-label="Enable All">Enable All</button> <button class="mgbutton moove-gdpr-modal-save-settings button-visible" aria-label="Save Settings">Save Settings</button> </div> <!-- .moove-gdpr-button-holder --> </div> <!-- .moove-gdpr-modal-footer-content --> </div> <!-- .moove-gdpr-modal-right-content --> <div class="moove-clearfix"></div> </div> <!-- .moove-gdpr-modal-content --> </dialog> <!-- #moove_gdpr_cookie_modal --> <!--/copyscapeskip--> </body> </html>