459 lines
No EOL
20 KiB
HTML
459 lines
No EOL
20 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="it">
|
||
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<meta name="theme-color" content="#4D45FF" />
|
||
|
||
<!-- SEO -->
|
||
<title>ESysLab - Innovazione Embedded, Automazione e Formazione</title>
|
||
<meta name="description"
|
||
content="ESysLab - Soluzioni embedded innovative: libri multimediali interattivi, robotica didattica e corsi di formazione per aziende e scuole." />
|
||
<link rel="canonical" href="https://esyslab.it/" />
|
||
|
||
<!-- Open Graph (Facebook, LinkedIn, WhatsApp, Telegram) -->
|
||
<meta property="og:site_name" content="ESysLab" />
|
||
<meta property="og:title" content="ESysLab - Innovazione Embedded, Automazione e Formazione" />
|
||
<meta property="og:description"
|
||
content="Libri multimediali interattivi, robotica didattica e corsi per scuole e aziende. Scopri ESysLab." />
|
||
<meta property="og:url" content="https://esyslab.it/" />
|
||
<meta property="og:image" content="https://esys.pansi21.xyz/card.png" />
|
||
<meta property="og:type" content="website" />
|
||
|
||
<!-- Twitter -->
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="ESysLab - Innovazione Embedded, Automazione e Formazione" />
|
||
<meta name="twitter:description"
|
||
content="Libri multimediali interattivi, robotica didattica e corsi per scuole e aziende. Scopri ESysLab." />
|
||
<meta name="twitter:image" content="https://esys.pansi21.xyz/card.png" />
|
||
<!-- Se hai un account Twitter ufficiale, aggiungilo -->
|
||
<!-- <meta name="twitter:site" content="@tuoaccount" /> -->
|
||
|
||
<!-- favicon https://favicon.pub/ -->
|
||
<link rel="icon" href="../ico/favicon.ico" sizes="any">
|
||
<link rel="icon" type="image/png" href="../ico/favicon-16x16.png" sizes="16x16">
|
||
<link rel="icon" type="image/png" href="../ico/favicon-32x32.png" sizes="32x32">
|
||
<link rel="icon" type="image/png" href="../ico/favicon-48x48.png" sizes="48x48">
|
||
<link rel="manifest" href="../ico/site.webmanifest">
|
||
<link rel="icon" type="image/png" href="../ico/android-chrome-192x192.png" sizes="192x192">
|
||
<link rel="icon" type="image/png" href="../ico/android-chrome-512x512.png" sizes="512x512">
|
||
<link rel="apple-touch-icon" href="../ico/apple-touch-icon.png">
|
||
<link rel="mask-icon" href="../ico/safari-pinned-tab.svg" color="#5bbad5">
|
||
<link rel="icon" href="../ico/favicon.svg" type="image/svg+xml">
|
||
|
||
<!-- Structured Data (SEO avanzato per Google) -->
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@type": "Organization",
|
||
"name": "ESysLab",
|
||
"url": "https://esyslab.it",
|
||
"logo": "https://esys.pansi21.xyz/card.png",
|
||
"contactPoint": {
|
||
"@type": "ContactPoint",
|
||
"email": "info@esyslab.it",
|
||
"contactType": "customer support",
|
||
"areaServed": "IT",
|
||
"availableLanguage": ["Italian", "English"]
|
||
},
|
||
"address": {
|
||
"@type": "PostalAddress",
|
||
"streetAddress": "Via Don Giovanni Bosco 2",
|
||
"addressLocality": "Agrigento",
|
||
"postalCode": "92025",
|
||
"addressCountry": "IT"
|
||
},
|
||
"sameAs": [
|
||
"https://www.linkedin.com/company/esyslab",
|
||
"https://twitter.com/esyslab"
|
||
]
|
||
}
|
||
</script>
|
||
|
||
<link href="style.css" rel="stylesheet">
|
||
|
||
</head>
|
||
|
||
|
||
|
||
|
||
<body>
|
||
<!-- Navigation -->
|
||
<nav id="navbar">
|
||
<div class="nav-container">
|
||
<!-- original logo
|
||
<a href="#home" class="logo">MINIMAL</a>
|
||
-->
|
||
<a href="index.html" class="logo">
|
||
<img src="logo.png" alt="Logo" class="_img-logo">
|
||
</a>
|
||
|
||
|
||
<div class="menu-toggle" id="menuToggle">
|
||
<span></span>
|
||
<span></span>
|
||
<span></span>
|
||
</div>
|
||
<ul class="nav-links" id="navLinks">
|
||
<li><a href="#home" class="nav-link">HOME</a></li>
|
||
<li><a href="#services" class="nav-link">SERVIZI</a></li>
|
||
<li><a href="about.html" class="nav-link">ABOUT</a></li>
|
||
<li><a href="contact.html" class="nav-link">CONTATTI</a></li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- Section 1: Hero -->
|
||
<section id="home" class="hero">
|
||
<!-- Animated Objects (Reduced) -->
|
||
<div class="floating-objects">
|
||
<div class="floating-circle"></div>
|
||
<div class="floating-circle"></div>
|
||
<div class="floating-square"></div>
|
||
<div class="floating-line"></div>
|
||
</div>
|
||
|
||
<div class="hero-decoration"></div>
|
||
<div class="hero-content">
|
||
<h1>Embedded System Laboratory</h1>
|
||
<!-- original subtitle
|
||
<p class="subtitle">Embedded System Laboratory</p>
|
||
-->
|
||
<a href="#services" class="cta-button">ESPLORA</a>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Section 2: Services - Asymmetric Grid -->
|
||
<section id="services" class="services">
|
||
<div class="container">
|
||
<div class="services-header fade-in">
|
||
<h2>COSA FACCIAMO</h2>
|
||
</div>
|
||
|
||
<div class="asymmetric-grid fade-in">
|
||
<div class="service-large">
|
||
<h3>Brand Identity</h3>
|
||
<p>Creating distinctive visual languages that communicate your essence through simplicity. We
|
||
develop comprehensive brand systems that stand the test of time.</p>
|
||
<a href="#contact" class="service-tag">View Work</a>
|
||
</div>
|
||
<div class="service-small">
|
||
<div class="service-number">01</div>
|
||
<h4>Strategy First</h4>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="asymmetric-grid reverse fade-in">
|
||
<div class="service-small">
|
||
<div class="service-number">02</div>
|
||
<h4>Digital Native</h4>
|
||
</div>
|
||
<div class="service-large">
|
||
<h3>Web Design</h3>
|
||
<p>Crafting digital experiences that prioritize clarity and usability. Every pixel serves a purpose
|
||
in our pursuit of functional beauty.</p>
|
||
<a href="#contact" class="service-tag">Explore</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="asymmetric-grid fade-in">
|
||
<div class="service-large">
|
||
<h3>Art Direction</h3>
|
||
<p>Guiding visual narratives with restraint and intention. We believe the most powerful statements
|
||
are often the quietest ones.</p>
|
||
<a href="#contact" class="service-tag">Discover</a>
|
||
</div>
|
||
<div class="service-small">
|
||
<div class="service-number">03</div>
|
||
<h4>Vision Focused</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Section 2.5: Services - Prodotti -->
|
||
<section id="services" class="services">
|
||
<div class="container">
|
||
<div class="services-header fade-in">
|
||
<h2>COSA FACCIAMO</h2>
|
||
</div>
|
||
|
||
<!-- Prodotto 1 -->
|
||
<div class="asymmetric-grid fade-in">
|
||
<div class="service-large">
|
||
<h3>Libro Multimediale Interattivo</h3>
|
||
<p>Il nostro progetto di punta: un libro innovativo che unisce tecnologia ed esperienza sensoriale.
|
||
Pensato per musei, scuole e spazi educativi, rende la conoscenza accessibile e coinvolgente.</p>
|
||
<a href="prodotti/book.html" class="service-tag">Scopri di più</a>
|
||
</div>
|
||
<div class="service-small">
|
||
<div class="service-number">01</div>
|
||
<h4>Esperienza Immersiva</h4>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- Prodotto 2 -->
|
||
<div class="asymmetric-grid reverse fade-in">
|
||
<div class="service-small">
|
||
<div class="service-number">02</div>
|
||
<h4>Apprendimento Attivo</h4>
|
||
</div>
|
||
<div class="service-large">
|
||
<h3>Robot Didattici</h3>
|
||
<p>Progettiamo e realizziamo piccoli robot educativi personalizzati, ideali per attività
|
||
laboratoriali
|
||
nelle scuole e per la divulgazione scientifica interattiva.</p>
|
||
<a href="contact.html" class="service-tag">Esplora</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Prodotto 3 -->
|
||
<div class="asymmetric-grid fade-in">
|
||
<div class="service-large">
|
||
<h3>Corsi di Formazione</h3>
|
||
<p>Organizziamo corsi pratici di formazione.
|
||
Offriamo soluzioni formative su misura in ambito embedded systems, elettronica e programmazione.
|
||
</p>
|
||
<a href="contact.html" class="service-tag">Richiedi info</a>
|
||
</div>
|
||
<div class="service-small">
|
||
<div class="service-number">03</div>
|
||
<h4>Conoscenza Condivisa</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</section>
|
||
|
||
<!-- Section 3: About - Mixed Layouts -->
|
||
<section id="about" class="about">
|
||
<div class="container">
|
||
<!-- Introduction with large quote -->
|
||
<div class="about-intro fade-in">
|
||
<div class="quote-block">
|
||
<span class="quote-mark">"</span>
|
||
<h3>Ma mandali tutti a fanculo, tanto moriranno tutti.</h3>
|
||
<div class="quote-author">
|
||
<span class="author-line"></span>
|
||
<p>Benedetto (non Sedicesimo)</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="black-line"></div>
|
||
|
||
<!-- Stats Section -->
|
||
<div class="stats-grid fade-in">
|
||
<div class="stat-item">
|
||
<div class="stat-number">95%</div>
|
||
<div class="stat-label">Clienti Soddisfatti</div>
|
||
<div class="stat-decoration"></div>
|
||
</div>
|
||
<div class="stat-item">
|
||
<div class="stat-number">90+</div>
|
||
<div class="stat-label">Progetti Completati</div>
|
||
<div class="stat-decoration"></div>
|
||
</div>
|
||
<div class="stat-item">
|
||
<div class="stat-number">30</div>
|
||
<div class="stat-label">Anni di Esperienza</div>
|
||
<div class="stat-decoration"></div>
|
||
</div>
|
||
<div class="stat-item">
|
||
<div class="stat-number">∞</div>
|
||
<div class="stat-label">Possibilità</div>
|
||
<div class="stat-decoration"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Philosophy Section with offset layout -->
|
||
<div class="philosophy-section fade-in">
|
||
<div class="philosophy-header">
|
||
<h2>Filosofia</h2>
|
||
<div class="header-decoration"></div>
|
||
</div>
|
||
<div class="philosophy-content">
|
||
<div class="philosophy-main">
|
||
<p class="lead-text">Crediamo nella forza della semplicità. Ogni progetto, ogni sistema, ogni
|
||
dettaglio ha un ruolo preciso nel rendere la tecnologia utile, accessibile e duratura.</p>
|
||
</div>
|
||
<div class="philosophy-points">
|
||
<div class="point-item">
|
||
<span class="point-number">01</span>
|
||
<h4>Chiarezza e Affidabilità</h4>
|
||
<p>Creiamo soluzioni embedded chiare e robuste, eliminando la complessità inutile per
|
||
offrire solo ciò che serve davvero.</p>
|
||
</div>
|
||
<div class="point-item">
|
||
<span class="point-number">02</span>
|
||
<h4>Innovazione Accessibile</h4>
|
||
<p>Progettiamo sistemi che rendono la tecnologia intuitiva e vicina alle persone, che si
|
||
tratti di musei, scuole o aziende.</p>
|
||
</div>
|
||
<div class="point-item">
|
||
<span class="point-number">03</span>
|
||
<h4>Personalizzazione e Valore</h4>
|
||
<p>Ogni scelta è pensata per rispondere alle esigenze specifiche dei nostri clienti,
|
||
trasformando l’idea in uno strumento concreto e significativo.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Process Timeline -->
|
||
<div class="process-timeline fade-in">
|
||
<h2 class="section-subtitle">Il nostro processo</h2>
|
||
<div class="timeline-container">
|
||
<div class="timeline-line"></div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-dot"></div>
|
||
<div class="timeline-content">
|
||
<h4>Scoprire</h4>
|
||
<p>Analizziamo le esigenze del cliente per comprendere obiettivi, contesto e sfide
|
||
specifiche.</p>
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-dot"></div>
|
||
<div class="timeline-content">
|
||
<h4>Progettare</h4>
|
||
<p>Semplifichiamo la complessità, definendo l’architettura embedded più adatta e
|
||
sostenibile.</p>
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-dot"></div>
|
||
<div class="timeline-content">
|
||
<h4>Sviluppare</h4>
|
||
<p>Curando ogni dettaglio, realizziamo soluzioni affidabili, innovative e su misura.</p>
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-dot"></div>
|
||
<div class="timeline-content">
|
||
<h4>Consegnare</h4>
|
||
<p>Trasformiamo l’idea in un sistema concreto, pronto per essere utilizzato e valorizzato.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Values Grid -->
|
||
<div class="values-section fade-in">
|
||
<div class="values-header">
|
||
<div class="black-square"></div>
|
||
<h2>Valori Fondamentali</h2>
|
||
<div class="black-square"></div>
|
||
</div>
|
||
<div class="values-grid">
|
||
<div class="value-card">
|
||
<div class="value-icon">—</div>
|
||
<h4>Semplicità</h4>
|
||
</div>
|
||
<div class="value-card black">
|
||
<div class="value-icon">+</div>
|
||
<h4>Innovazione</h4>
|
||
</div>
|
||
<div class="value-card black">
|
||
<div class="value-icon">○</div>
|
||
<h4>Affidabilità</h4>
|
||
</div>
|
||
<div class="value-card">
|
||
<div class="value-icon">□</div>
|
||
<h4>Equilibrio</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- Section 4: Contact -->
|
||
<section id="contact" class="contact">
|
||
<div class="container">
|
||
<div class="contact-grid fade-in">
|
||
<div class="contact-info">
|
||
<h2>CONTATTI</h2>
|
||
<div class="info-item">
|
||
<h4>Email</h4>
|
||
<p><a
|
||
href="mailto:info@esyslab.it?subject=Richiesta%20informazioni&body=Buongiorno,%0D%0Ascrivo%20per%20avere%20maggiori%20dettagli%20sui%20vostri%20prodotti.">INFO@ESYSLAB.IT</a>
|
||
</p>
|
||
</div>
|
||
<div class="info-item">
|
||
<h4>Telefono</h4>
|
||
<p> <a href="tel:+39 333 666 9999">+39 333 666 9999</a></p>
|
||
</div>
|
||
<div class="info-item">
|
||
<h4>POSIZIONE</h4>
|
||
<p>Agrigento, IT</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="contact-divider"></div>
|
||
|
||
<div class="contact-form">
|
||
<form>
|
||
<div class="form-group">
|
||
<input type="text" placeholder=" " required>
|
||
<label>NOME</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<input type="email" placeholder=" " required>
|
||
<label>Email</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<textarea rows="4" placeholder=" " required></textarea>
|
||
<label>MESSAGGIO</label>
|
||
</div>
|
||
<button type="submit" class="submit-btn">Send</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Footer -->
|
||
<footer>
|
||
|
||
|
||
<section id="_infoFooter" class="_infoContact">
|
||
<h2>ESysLab</h2>
|
||
|
||
<div class="footer-container">
|
||
<!-- Logo a sinistra -->
|
||
<div class="footer-logo">
|
||
<img src="logo-min.png" alt="Embedded System Laboratory Logo">
|
||
</div>
|
||
|
||
<!-- Info a destra -->
|
||
<div class="footer-info">
|
||
<p>© 2025 Embedded System Laboratory</p>
|
||
<p>Via Don Giovanni Bosco 2, 92025, Agrigento</p>
|
||
<p>Mail: <a
|
||
href="mailto:info@esyslab.it?subject=Richiesta%20informazioni&body=Buongiorno,%0D%0Ascrivo%20per%20avere%20maggiori%20dettagli%20sui%20vostri%20prodotti.">info@esyslab.it</a>
|
||
</p>
|
||
<p>Casella PEC: <a href="mailto:pec-bebbo@pec.esyslab.it">pec-bebbo@pec.esyslab.it</a></p>
|
||
<p>Partita IVA. 12621321332131 | <a href="contact.html">Contattaci</a></p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<br>
|
||
|
||
<p id="_designedBy">
|
||
© 2025 ESysLab — Designed by <a href="https://pansi21.xyz" target="_blank" rel="nofollow noopener"
|
||
style="color: #000; font-weight: 400;">PanSi21</a>
|
||
</p>
|
||
</footer>
|
||
<script src="tooplate-minimal-script.js"></script>
|
||
</body>
|
||
|
||
</html> |