File size: 15,866 Bytes
4ead5e6
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
<!DOCTYPE html>
<html lang="nl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Gratis SEO Audit | Jitware</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script>
        tailwind.config = {
            theme: {
                extend: {
                    colors: {
                        gold: {
                            light: '#F5E6B3',
                            DEFAULT: '#D4AF37',
                            dark: '#B7950B'
                        },
                        dark: '#111111',
                        darker: '#0A0A0A'
                    }
                }
            }
        }
    </script>
    <style>
        .gold-accent {
            background: linear-gradient(135deg, rgba(212,175,55,0.05) 0%, rgba(212,175,55,0.15) 100%);
        }
        .gold-border {
            border-image: linear-gradient(90deg, transparent, rgba(212,175,55,0.3), transparent) 1;
        }
        .hover-glow:hover {
            box-shadow: 0 0 15px rgba(212,175,55,0.3);
        }
        .gold-gradient-text {
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-image: linear-gradient(to right, #F5E6B3, #D4AF37, #B7950B);
        }
    </style>
</head>
<body class="bg-dark text-gray-200 font-sans">
    <!-- Header -->
    <header class="bg-darker border-b border-gold/10 py-6">
        <div class="container mx-auto px-4 flex justify-between items-center">
            <div class="flex items-center space-x-2">
                <i class="fas fa-code text-gold text-2xl"></i>
                <span class="text-xl font-bold text-gold">JITWARE</span>
            </div>
            <nav class="hidden md:flex space-x-8">
                <a href="#" class="hover:text-gold transition duration-300">Diensten</a>
                <a href="#" class="hover:text-gold transition duration-300">Cases</a>
                <a href="#" class="hover:text-gold transition duration-300">Over ons</a>
                <a href="#" class="hover:text-gold transition duration-300">Blog</a>
                <a href="#" class="hover:text-gold transition duration-300">Contact</a>
            </nav>
            <button class="md:hidden text-gold">
                <i class="fas fa-bars text-2xl"></i>
            </button>
        </div>
    </header>

    <!-- Hero Section -->
    <section class="relative py-20 bg-darker">
        <div class="absolute inset-0 overflow-hidden">
            <div class="absolute inset-0 bg-[url('https://images.unsplash.com/photo-1639762681057-408e52197e23?q=80&w=2232&auto=format&fit=crop')] bg-cover bg-center opacity-10"></div>
            <div class="absolute inset-0 bg-gradient-to-t from-dark via-dark/80 to-dark"></div>
        </div>
        <div class="container mx-auto px-4 text-center relative">
            <h1 class="text-4xl md:text-6xl font-bold mb-6 gold-gradient-text">GRATIS SEO AUDIT</h1>
            <p class="text-xl md:text-2xl mb-10 max-w-3xl mx-auto">Ontdek hoe goed uw website scoort in zoekmachines en krijg direct bruikbare tips om hoger te ranken.</p>
            <div class="max-w-md mx-auto">
                <form class="space-y-4">
                    <input type="text" placeholder="Uw website URL" class="w-full px-4 py-3 bg-dark border border-gold/20 rounded focus:outline-none focus:ring-1 focus:ring-gold text-white placeholder-gray-400">
                    <input type="email" placeholder="Uw e-mailadres" class="w-full px-4 py-3 bg-dark border border-gold/20 rounded focus:outline-none focus:ring-1 focus:ring-gold text-white placeholder-gray-400">
                    <button type="submit" class="w-full bg-gradient-to-r from-gold.light via-gold to-gold.dark hover:from-gold.dark hover:to-gold.light text-darker font-bold py-3 px-6 rounded transition duration-300 hover-glow">
                        AUDIT AANVRAGEN <i class="fas fa-arrow-right ml-2"></i>
                    </button>
                </form>
            </div>
        </div>
    </section>

    <!-- What You Get Section -->
    <section class="py-20 bg-dark">
        <div class="container mx-auto px-4">
            <h2 class="text-3xl md:text-4xl font-bold mb-16 text-center text-gold border-b border-gold/20 pb-6">WAT KRIJG JE IN ONZE SEO AUDIT?</h2>
            
            <div class="grid md:grid-cols-3 gap-8">
                <!-- Item 1 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-chart-line"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Prestatie Analyse</h3>
                    <p class="text-gray-400">We meten de laadsnelheid en technische prestaties van uw website die cruciaal zijn voor SEO.</p>
                </div>
                
                <!-- Item 2 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-search"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Zoekwoord Optimalisatie</h3>
                    <p class="text-gray-400">Analyse van hoe goed uw website is geoptimaliseerd voor relevante zoekwoorden.</p>
                </div>
                
                <!-- Item 3 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-mobile-alt"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Mobiele Compatibiliteit</h3>
                    <p class="text-gray-400">Evaluatie van hoe goed uw website presteert op mobiele apparaten.</p>
                </div>
                
                <!-- Item 4 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-link"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Link Analyse</h3>
                    <p class="text-gray-400">Overzicht van interne en externe links die van invloed zijn op uw ranking.</p>
                </div>
                
                <!-- Item 5 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-file-alt"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Content Evaluatie</h3>
                    <p class="text-gray-400">Beoordeling van de kwaliteit en relevantie van uw website content.</p>
                </div>
                
                <!-- Item 6 -->
                <div class="bg-darker p-8 rounded-lg border border-gold/10 hover-glow transition duration-300 gold-accent">
                    <div class="text-gold text-4xl mb-4">
                        <i class="fas fa-tools"></i>
                    </div>
                    <h3 class="text-xl font-bold mb-3 text-gold">Actieplan</h3>
                    <p class="text-gray-400">Een duidelijk stappenplan met prioriteiten om uw SEO te verbeteren.</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Testimonials -->
    <section class="py-20 bg-darker">
        <div class="container mx-auto px-4">
            <h2 class="text-3xl md:text-4xl font-bold mb-16 text-center text-gold border-b border-gold/20 pb-6">WAT KLANTEN ZEGGEN</h2>
            
            <div class="grid md:grid-cols-2 gap-8 max-w-6xl mx-auto">
                <!-- Testimonial 1 -->
                <div class="bg-dark p-8 rounded-lg border-l-4 border-gold relative gold-accent">
                    <div class="absolute -top-4 -left-4 text-gold text-4xl">
                        <i class="fas fa-quote-left"></i>
                    </div>
                    <p class="mb-6 italic text-gray-300">"De SEO-audit van Jitware gaf ons precies de inzichten die we nodig hadden. Binnen een maand zagen we al een stijging van 40% in organisch verkeer."</p>
                    <div class="flex items-center">
                        <div class="w-12 h-12 rounded-full bg-gold/20 flex items-center justify-center text-gold mr-4">
                            <i class="fas fa-user"></i>
                        </div>
                        <div>
                            <h4 class="font-bold text-gold">Mark Janssens</h4>
                            <p class="text-sm text-gray-400">CEO, RetailCompany</p>
                        </div>
                    </div>
                </div>
                
                <!-- Testimonial 2 -->
                <div class="bg-dark p-8 rounded-lg border-l-4 border-gold relative gold-accent">
                    <div class="absolute -top-4 -left-4 text-gold text-4xl">
                        <i class="fas fa-quote-left"></i>
                    </div>
                    <p class="mb-6 italic text-gray-300">"Als kleine ondernemer had ik geen idee waar te beginnen met SEO. De gratis audit gaf me een duidelijk actieplan dat ik direct kon implementeren."</p>
                    <div class="flex items-center">
                        <div class="w-12 h-12 rounded-full bg-gold/20 flex items-center justify-center text-gold mr-4">
                            <i class="fas fa-user"></i>
                        </div>
                        <div>
                            <h4 class="font-bold text-gold">Lisa Verhoeven</h4>
                            <p class="text-sm text-gray-400">Eigenaar, LocalShop</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- CTA Section -->
    <section class="py-20 bg-dark">
        <div class="container mx-auto px-4 text-center">
            <div class="max-w-4xl mx-auto bg-darker p-12 rounded-xl border border-gold/10 gold-accent">
                <h2 class="text-3xl md:text-4xl font-bold mb-6 text-gold">KLAAR OM UW SEO TE OPTIMALISEREN?</h2>
                <p class="text-xl mb-10 max-w-2xl mx-auto">Vraag nu uw gratis SEO-audit aan en ontvang binnen 48 uur een gedetailleerd rapport.</p>
                <button class="bg-gradient-to-r from-gold.light via-gold to-gold.dark hover:from-gold.dark hover:to-gold.light text-darker font-bold py-3 px-8 rounded-full transition duration-300 hover-glow text-lg">
                    START NU <i class="fas fa-arrow-right ml-2"></i>
                </button>
            </div>
        </div>
    </section>

    <!-- Footer -->
    <footer class="bg-darker py-12 border-t border-gold/10">
        <div class="container mx-auto px-4">
            <div class="grid md:grid-cols-4 gap-10">
                <div>
                    <div class="flex items-center space-x-2 mb-4">
                        <i class="fas fa-code text-gold text-2xl"></i>
                        <span class="text-xl font-bold text-gold">JITWARE</span>
                    </div>
                    <p class="text-gray-400 mb-4">Specialisten in digitale transformatie en weboptimalisatie.</p>
                    <div class="flex space-x-4">
                        <a href="#" class="text-gold hover:text-gold/80"><i class="fab fa-linkedin-in"></i></a>
                        <a href="#" class="text-gold hover:text-gold/80"><i class="fab fa-facebook-f"></i></a>
                        <a href="#" class="text-gold hover:text-gold/80"><i class="fab fa-instagram"></i></a>
                        <a href="#" class="text-gold hover:text-gold/80"><i class="fab fa-twitter"></i></a>
                    </div>
                </div>
                
                <div>
                    <h4 class="text-gold font-bold mb-4 text-lg">Diensten</h4>
                    <ul class="space-y-2">
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">Webontwikkeling</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">SEO Optimalisatie</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">E-commerce</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">UX/UI Design</a></li>
                    </ul>
                </div>
                
                <div>
                    <h4 class="text-gold font-bold mb-4 text-lg">Bedrijf</h4>
                    <ul class="space-y-2">
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">Over ons</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">Team</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">Cases</a></li>
                        <li><a href="#" class="text-gray-400 hover:text-gold transition">Vacatures</a></li>
                    </ul>
                </div>
                
                <div>
                    <h4 class="text-gold font-bold mb-4 text-lg">Contact</h4>
                    <ul class="space-y-2">
                        <li class="text-gray-400"><i class="fas fa-map-marker-alt text-gold mr-2"></i> Bedrijfsstraat 123, 1000 Brussel</li>
                        <li class="text-gray-400"><i class="fas fa-phone text-gold mr-2"></i> +32 123 45 67 89</li>
                        <li class="text-gray-400"><i class="fas fa-envelope text-gold mr-2"></i> [email protected]</li>
                    </ul>
                </div>
            </div>
            
            <div class="border-t border-gold/10 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
                <p class="text-gray-500 text-sm mb-4 md:mb-0">© 2023 Jitware. Alle rechten voorbehouden.</p>
                <div class="flex space-x-6">
                    <a href="#" class="text-gray-500 hover:text-gold text-sm">Privacybeleid</a>
                    <a href="#" class="text-gray-500 hover:text-gold text-sm">Algemene voorwaarden</a>
                    <a href="#" class="text-gray-500 hover:text-gold text-sm">Cookiebeleid</a>
                </div>
            </div>
        </div>
    </footer>

    <script>
        // Simple form submission handler
        document.querySelector('form').addEventListener('submit', function(e) {
            e.preventDefault();
            alert('Bedankt voor uw aanvraag! We sturen uw SEO-audit binnen 48 uur naar uw e-mailadres.');
            this.reset();
        });
    </script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=jitware/seo-audit" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>