-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtransition-numerique.html
361 lines (348 loc) · 19.9 KB
/
transition-numerique.html
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
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
<!DOCTYPE html>
<html lang="fr" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="Numeratech - Votre partenaire expert en ingénierie logicielle, intégration & automatisation, transition numérique et marketing digital. Solutions sur mesure : développement web, automatisation des processus, transformation digitale et stratégies marketing innovantes.">
<meta name="mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#172554">
<!-- Meta Keywords (SEO) -->
<meta name="keywords"
content="transformation digitale, ingénierie logicielle, automatisation, intégration API, création site web, application mobile, marketing digital, stratégie numérique, intelligence artificielle, optimisation processus, développement logiciel, DevOps, UX/UI, cloud computing">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://www.numeratech.fr/">
<meta property="og:title" content="Numeratech | Connectez votre entreprise à l'avenir">
<meta property="og:description"
content="Solutions technologiques innovantes pour optimiser votre entreprise : automatisation, développement logiciel, marketing digital et transformation numérique.">
<meta property="og:image" content="https://www.numeratech.fr/img/og-numeratech-solutions.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.numeratech.fr/">
<meta property="twitter:title" content="Numeratech | Connectez votre entreprise à l'avenir">
<meta property="twitter:description"
content="Solutions technologiques innovantes pour optimiser votre entreprise : automatisation, développement logiciel, marketing digital et transformation numérique.">
<meta property="twitter:image" content="https://www.numeratech.fr/img/twitter-numeratech-innovation.png">
<!-- Prefetch for faster loading -->
<link rel="dns-prefetch" href="//fonts.googleapis.com">
<link rel="preconnect" href="https://cdn.tailwindcss.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preload"
href="https://fonts.googleapis.com/css2?family=Lexend:[email protected]&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
as="style">
<!-- Favicon & Manifest -->
<link rel="icon" type="image/svg+xml" href="svg/logo.svg">
<link rel="icon" type="image/png" href="img/icon-192x192.png">
<link rel="icon" type="image/x-icon" href="img/icon-16x16.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<!-- Styles & scripts -->
<script src="https://cdn.tailwindcss.com"></script>
<link
href="https://fonts.googleapis.com/css2?family=Lexend:[email protected]&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="style.css">
<!-- schema.org -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "ProfessionalService",
"name": "Numeratech",
"image": "https://www.numeratech.fr/svg/logo.svg",
"@id": "https://www.numeratech.fr",
"url": "https://www.numeratech.fr",
"telephone": "+33-6-36-22-44-68",
"priceRange": "$$",
"address": {
"@type": "PostalAddress",
"streetAddress": "123 Avenue de la République",
"addressLocality": "Tours",
"postalCode": "37100",
"addressCountry": "FR"
},
"geo": {
"@type": "GeoCoordinates",
"latitude": 48.856614,
"longitude": 2.3522219
},
"service": [
{
"@type": "Service",
"name": "Développement logiciel & Ingénierie",
"description": "Solutions sur mesure en développement logiciel, DevOps et intégration API."
},
{
"@type": "Service",
"name": "Automatisation & Intégration",
"description": "Automatisation des workflows, intégration de solutions cloud et optimisation des processus métier."
},
{
"@type": "Service",
"name": "Transition numérique",
"description": "Conseil et accompagnement pour la transformation digitale des entreprises."
},
{
"@type": "Service",
"name": "Marketing digital & Stratégie",
"description": "Stratégies digitales performantes : SEO, publicité en ligne et marketing automation."
}
],
"sameAs": [
"https://www.linkedin.com/company/numeratech"
]
}
</script>
<title>Numeratech | Transition numérique</title>
</head>
<body class="text-blue-900">
<header class="bg-blue-950 text-white text-center font-bold fixed w-full top-0 z-50 px-8 md:px-20 py-4">
<nav class="flex justify-between items-center">
<div class="flex items-center">
<a class="text-2xl font-bold text-white hidden sm:block" href="index.html">
Numeratech
</a>
</div>
<div class="absolute left-1/2 transform -translate-x-1/2">
<a href="index.html">
<img src="svg/logo.svg" alt="logo" width="60" height="60">
</a>
</div>
<div class="hidden lg:flex">
<ul class="flex justify-end items-center gap-6 uppercase text-md text-white">
<li>
<a href="a-propos.html"
class="relative group py-1 transition duration-300 inline-block whitespace-nowrap">À
propos
<span
class="absolute left-0 bottom-0 w-0 h-1 bg-white transition-all duration-300 group-hover:w-full"></span>
</a>
</li>
<li>
<div id="expertise-dropdown" class="relative inline-block text-left">
<button
class="relative group py-1 transition duration-300 inline-block uppercase whitespace-nowrap">
Notre expertise
<svg class="inline-block w-4 h-4 ml-1" fill="none" stroke="currentColor"
viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="4"
d="M19 9l-7 7-7-7"></path>
</svg>
</button>
<div id="expertise-dropdown-content"
class="absolute hidden overflow-hidden bg-white shadow-lg rounded-md w-48 mt-2 right-0 z-10">
<a href="ingenierie-logicielle.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Ingénierie logicielle</a>
<a href="integration-automatisation.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Intégration et
automatisation</a>
<a href="transition-numerique.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Transition
numérique</a>
<a href="marketing-digital.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Marketing
digital</a>
</div>
</div>
</li>
<li>
<a href="contact.html"
class="relative group py-1 transition duration-300 inline-block whitespace-nowrap">Contact
<span
class="absolute left-0 bottom-0 w-0 h-1 bg-white transition-all duration-300 group-hover:w-full"></span>
</a>
</li>
</ul>
</div>
<div class="lg:hidden">
<button id="burger-button" class="text-white focus:outline-none">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 6h16M4 12h16m-7 6h7"></path>
</svg>
</button>
</div>
</nav>
<div id="mobile-menu" class="hidden lg:hidden pt-5">
<ul class="flex flex-col items-center gap-6 uppercase text-md text-white">
<li>
<a href="a-propos.html"
class="relative group py-1 transition duration-300 inline-block whitespace-nowrap">A
propos
<span
class="absolute left-0 bottom-0 w-0 h-1 bg-white transition-all duration-300 group-hover:w-full"></span>
</a>
</li>
<li>
<div id="expertise-dropdown-mobile" class="relative inline-block text-left">
<button
class="relative group py-1 transition duration-300 inline-block uppercase whitespace-nowrap">
Notre expertise
<svg class="inline-block w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="4"
d="M19 9l-7 7-7-7"></path>
</svg>
</button>
<div id="expertise-dropdown-content-mobile"
class="absolute hidden overflow-hidden bg-white shadow-lg rounded-md w-48 mt-2 right-0 z-10">
<a href="ingenierie-logicielle.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Ingénierie logicielle</a>
<a href="integration-automatisation.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Intégration et
automatisation</a>
<a href="transition-numerique.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Transition
numérique</a>
<a href="marketing-digital.html"
class="block px-4 py-2 text-blue-900 hover:bg-gray-100">Marketing
digital</a>
</div>
</div>
</li>
<li>
<a href="contact.html"
class="relative group py-1 transition duration-300 inline-block whitespace-nowrap">Contact
<span
class="absolute left-0 bottom-0 w-0 h-1 bg-white transition-all duration-300 group-hover:w-full"></span>
</a>
</li>
</ul>
</div>
</header>
<section class="relative flex flex-col justify-center items-center min-h-screen select-none px-8 lg:px-20 py-16">
<video class="absolute inset-0 w-full h-full object-cover" autoplay muted loop playsinline
id="video-background">
<source src="videos/keyboard-4.mp4" type="video/mp4">
</video>
<div class="absolute inset-0 bg-black opacity-50"></div>
<div class="relative z-10 text-center space-y-3">
<p class="text-2xl lg:text-4xl font-bold text-white drop-shadow-sm">Transition numérique</p>
<h1 class="text-4xl lg:text-7xl font-bold text-white drop-shadow-sm">Tirez profit des meilleurs outils du
marché
</h1>
</div>
<div class="absolute bottom-2 z-10 text-center animate-bounce w-full">
<a class="cursor-default w-full" href="#services">
<p class="text-white text-2xl drop-shadow-sm">▼</p>
<p class="text-white text-sm drop-shadow-sm">▼</p>
</a>
</div>
</section>
<section id="services"
class="parallax parallax-service-four relative flex flex-col justify-center items-center min-h-screen select-none lg:px-20 px-8 py-10">
<div class="text-center space-y-2 py-4">
<h1 class="text-xl lg:text-4xl font-bold">Transition Numérique</h1>
<p class="text-lg lg:text-xl">Nous vous accompagnons dans la transition numérique de votre entreprise</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 py-6">
<!-- Diagnostic et stratégie numérique -->
<div class="bg-white p-6 rounded-lg shadow-lg">
<div class="text-green-600 mb-4">
<svg class="w-12 h-12" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z">
</path>
</svg>
</div>
<h3 class="text-xl font-semibold mb-2">Diagnostic et stratégie numérique</h3>
<p class="text-gray-600 mb-4">Définition et mise en œuvre de votre stratégie numérique.</p>
<ul class="text-gray-600 space-y-2 list-disc list-inside">
<li>Audit de maturité numérique</li>
<li>Élaboration d'une feuille de route digitale</li>
<li>Analyse des opportunités de digitalisation</li>
<li>Étude comparative et choix de solutions</li>
<li>Conseil en cybersécurité et gestion des données</li>
</ul>
</div>
<!-- Accompagnement au changement -->
<div class="bg-white p-6 rounded-lg shadow-lg">
<div class="text-green-600 mb-4">
<svg class="w-12 h-12" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4">
</path>
</svg>
</div>
<h3 class="text-xl font-semibold mb-2">Accompagnement au changement</h3>
<p class="text-gray-600 mb-4">Connexion de l'humain à la culture numérique.</p>
<ul class="text-gray-600 space-y-2 list-disc list-inside">
<li>Formation et montée en compétences</li>
<li>Sensibilisation à la culture numérique</li>
<li>Gestion du changement organisationnel</li>
<li>Amélioration de l'expérience collaborateur</li>
<li>Plan de communication interne</li>
</ul>
</div>
<!-- Mise en œuvre de la transformation numérique -->
<div class="bg-white p-6 rounded-lg shadow-lg">
<div class="text-green-600 mb-4">
<svg class="w-12 h-12" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253">
</path>
</svg>
</div>
<h3 class="text-xl font-semibold mb-2">Mise en œuvre de la transformation numérique</h3>
<p class="text-gray-600 mb-4">Déploiement des outils et technologies.</p>
<ul class="text-gray-600 space-y-2 list-disc list-inside">
<li>Digitalisation des processus métiers</li>
<li>Intégration d'outils numériques collaboratifs</li>
<li>Déploiement de plateformes cloud</li>
<li>Mise en œuvre de solutions métiers spécialisées (ERP, CRM...)</li>
<li>Suivi et optimisation post-déploiement</li>
</ul>
</div>
</div>
</section>
<footer class="bg-gray-900 text-white">
<div class="max-w-7xl mx-auto px-8 lg:px-20 py-16">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<div>
<h3 class="text-xl font-bold mb-4">Numeratech</h3>
<p class="text-gray-400">
Connectez votre entreprise à l'avenir.
</p>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">Notre expertise</h4>
<ul class="space-y-2 text-gray-400">
<li><a class="hover:text-gray-200" href="ingenierie-logicielle.html">Ingénierie logicielle</a>
</li>
<li><a class="hover:text-gray-200" href="integration-automatisation.html">Intégration et
automatisation</a></li>
<li><a class="hover:text-gray-200" href="transition-numerique.html">Transition numérique</a>
</li>
<li><a class="hover:text-gray-200" href="marketing-digital.html">Marketing digital</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">Liens rapides</h4>
<ul class="space-y-2 text-gray-400">
<li><a class="hover:text-gray-200" href="index.html">Accueil</a></li>
<li><a class="hover:text-gray-200" href="a-propos.html">À propos</a></li>
<li><a class="hover:text-gray-200" href="contact.html">Contact</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">Suivez-nous</h4>
<div class="flex space-x-4 text-gray-400">
<a class="hover:text-gray-200" href="https://www.linkedin.com/company/numeratech/">
LinkedIn
</a>
</div>
</div>
</div>
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-gray-400">
<p>© <span id="year">2024</span> Numeratech. Tous droits réservés.</p>
</div>
</div>
</footer>
<script src="js/main.js"></script>
<script src="js/tailwind.js"></script>
</body>
</html>