Files
Portfolio/index.html
T
damjan_savicandClaude Opus 4.5 090d640e9a Performance: Inter-Font auf 60KB Subset reduziert (vorher 344KB)
- Font Subsetting mit fonttools für Latin + German Zeichen
- 83% Reduktion der Font-Datei
- PageSpeed API Script hinzugefügt

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-05 23:05:09 +01:00

138 lines
6.3 KiB
HTML

<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Google Tag Manager wird nach Cookie-Zustimmung geladen -->
<!-- Favicons -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" type="image/png" sizes="32x32" href="/logo.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/logo.png" />
<link rel="apple-touch-icon" href="/logo.png" />
<link rel="mask-icon" href="/favicon.svg" color="#18181B" />
<meta name="description" content="Als Fullstack-Entwickler aus Köln spezialisiert sich Damjan Savić auf die Entwicklung skalierbarer Softwarelösungen mit IoT- und KI-Integration." />
<meta name="keywords" content="Damjan Savić, Damjan Savic, Senior Fullstack Entwickler Köln, Digital Solutions Consultant, Python Experte Köln, React Spezialist, TypeScript Developer, Software Architekt Köln, KI Integration OLLAMA, Machine Learning Entwickler, ERP System Integration, SAP Schnittstellen, E-Commerce Entwicklung, Shopify Integration, WooCommerce Entwickler, Prozessautomatisierung, Workflow Automation, Cloud Native Entwicklung, AWS Developer, Docker Kubernetes, Microservices Architektur, API Development, FastAPI Python, Next.js Entwicklung, Electron Desktop Apps, Progressive Web Apps, Agile Software Development, DevOps Engineer Köln, CI/CD Pipeline, Software Consulting, IT Beratung Köln, Digitale Transformation, B2B Enterprise Solutions, SaaS Entwicklung, Full Stack Engineer Germany" />
<meta name="author" content="Damjan Savić" />
<meta name="theme-color" content="#18181B" />
<meta name="robots" content="index, follow" />
<meta name="googlebot" content="index, follow" />
<!-- Google Search Console Verification -->
<meta name="google-site-verification" content="YOUR_VERIFICATION_CODE" />
<!-- PWA Manifest -->
<link rel="manifest" href="/manifest.json" />
<!-- Additional SEO Meta Tags -->
<meta name="image" content="https://damjan-savic.com/logo.png" />
<meta itemprop="name" content="Damjan Savić - Senior Fullstack Entwickler & Digital Solutions Consultant Köln" />
<meta itemprop="description" content="Damjan Savić entwickelt Enterprise Software, Cloud-native Lösungen und KI-gestützte Systeme. Python, React, TypeScript Experte in Köln." />
<meta itemprop="image" content="https://damjan-savic.com/logo.png" />
<title>Damjan Savić | Fullstack-, IoT- & KI-Entwickler</title>
<!-- Performance Optimizations -->
<link rel="dns-prefetch" href="https://fonts.googleapis.com">
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://www.googletagmanager.com">
<!-- Open Graph Meta Tags -->
<meta property="og:type" content="website" />
<meta property="og:title" content="Damjan Savić | Fullstack-, IoT- & KI-Entwickler" />
<meta property="og:description" content="Als Fullstack-Entwickler aus Köln spezialisiert sich Damjan Savić auf die Entwicklung skalierbarer Softwarelösungen mit IoT- und KI-Integration." />
<meta property="og:url" content="https://damjan-savic.com" />
<meta property="og:image" content="https://damjan-savic.com/logo.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="1000" />
<meta property="og:image:height" content="1000" />
<meta property="og:image:alt" content="Damjan Savić Logo - Senior Fullstack Entwickler & Digital Solutions Consultant" />
<meta property="og:site_name" content="Damjan Savić Developer Portfolio" />
<meta property="og:locale" content="de_DE" />
<meta property="og:locale:alternate" content="en_US" />
<meta property="og:locale:alternate" content="sr_RS" />
<meta property="og:updated_time" content="2025-01-15T12:00:00+01:00" />
<meta property="article:author" content="Damjan Savić" />
<!-- Twitter Card Meta Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Damjan Savić | Fullstack-, IoT- & KI-Entwickler" />
<meta name="twitter:description" content="Als Fullstack-Entwickler aus Köln spezialisiert sich Damjan Savić auf die Entwicklung skalierbarer Softwarelösungen mit IoT- und KI-Integration." />
<meta name="twitter:image" content="https://damjan-savic.com/logo.png" />
<!-- Critical Styles -->
<style>
/* Sofortiges Setzen der dunklen Farben */
:root {
color-scheme: dark;
}
html,
body {
background-color: transparent;
}
html {
overflow-y: scroll;
scrollbar-width: none;
-ms-overflow-style: none;
}
html::-webkit-scrollbar {
display: none;
}
body {
margin-right: 0 !important;
overflow-x: hidden;
position: relative;
}
#root {
min-height: 100vh;
display: flex;
flex-direction: column;
background-color: #18181B;
}
/* Verhindert weißes Aufblitzen */
@media (prefers-color-scheme: dark) {
html, body, #root {
background-color: #18181B;
}
}
/* Font-Loading Optimierung - Subset für Latin + German */
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url('/fonts/inter-subset.woff2') format('woff2-variations');
unicode-range: U+0020-007E, U+00A0-00FF, U+0100-017F, U+2013-2014, U+2018-201A, U+201C-201E, U+2026, U+20AC;
}
body {
font-family: Inter, system-ui, sans-serif;
}
</style>
<!-- Preload Font (60KB subset statt 344KB vollständig) -->
<link rel="preload" href="/fonts/inter-subset.woff2" as="font" type="font/woff2" crossorigin>
<!-- Preload wichtiger Assets -->
<link rel="preload" href="/portrait-224.webp" as="image" type="image/webp" fetchpriority="high" media="(max-width: 640px)" />
<link rel="preload" href="/portrait-288.webp" as="image" type="image/webp" fetchpriority="high" media="(min-width: 641px)" />
<link rel="preload" href="/header-logo.svg" as="image" />
</head>
<body>
<!-- Google Tag Manager (noscript) wird nach Cookie-Zustimmung eingefügt -->
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>