<!DOCTYPE html>
<html lang="it">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="Storiediweb, l'originale.">
    <meta name="author" content="@storiediweb">
    <link rel="icon" href="https://www.storiediweb.it/appunti/wp-content/uploads/2018/12/cropped-sdw-1-32x32.jpg" sizes="32x32" />
<link rel="icon" href="https://www.storiediweb.it/appunti/wp-content/uploads/2018/12/cropped-sdw-1-192x192.jpg" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="https://www.storiediweb.it/appunti/wp-content/uploads/2018/12/cropped-sdw-1-180x180.jpg" />
<meta name="msapplication-TileImage" content="https://www.storiediweb.it/appunti/wp-content/uploads/2018/12/cropped-sdw-1-270x270.jpg" />
	<meta name="google-site-verification" content="AAqF7zDbtGy1LM2ZG1ZzhIesfwLz4T6nzIR8SOgz2qY" />
    <title>StoriediWeb Firenze</title>
    <!-- Bootstrap css -->
    <link href="/js/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font -->
    <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
    <!-- Stile -->
    <link href="/css/storiediweb.min.css" rel="stylesheet">
  </head>
  <body id="page-top">
    <!-- Navigation -->
    <nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
      <div class="container">
        <a class="navbar-brand js-scroll-trigger" href="#page-top">StoriediWeb</a>
        <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
          Menu
          <i class="fas fa-bars"></i>
        </button>
        <div class="collapse navbar-collapse" id="navbarResponsive">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item">
              <a class="nav-link js-scroll-trigger" href="#about">Chi</a>
            </li>
            <li class="nav-item">
              <a class="nav-link js-scroll-trigger" href="#projects">Cosa</a>
            </li>
            <li class="nav-item">
              <a class="nav-link js-scroll-trigger" href="#signup">Contatta</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>

    <!-- Header -->
    <header class="masthead">
      <div class="container d-flex h-100 align-items-center">
        <div class="mx-auto text-center">
          <h1 class="mx-auto my-0 text-uppercase">Storiediweb</h1>
          <h2 class="text-white-50 mx-auto mt-2 mb-5">Web fatto con &#9829; e &#9874; dal 1995.</h2>
          <a href="#about" class="btn btn-primary js-scroll-trigger">Iniziamo</a>
        </div>
      </div>
    </header>

    <!-- About Section -->
    <section id="about" class="about-section text-center">
      <div class="container">
        <div class="row">
          <div class="col-lg-8 mx-auto">
            <h2 class="text-white mb-4">Di che si tratta?</h2>
            <p class="text-white-50">Storiediweb &egrave; un'<em>antica web agency</em> di Firenze, da me fondata, che non esiste più dal lontano 2002 anche se tuttora può vantare svariati tentativi di imitazione.<br>
                Mi occupo ancora di web, ma quasi esclusivamente per grandi realt&agrave;. Posso fornire cv, referenze e portfolio su richiesta diretta e motivata. Tuttavia sono disponibile per consulenze e analisi preliminari su (quasi) ogni tipo di progetto.</p>
				<p class="text-white-50">Nel tempo libero mi dedico &quot;anima e corpo&quot; alla promozione della cultura e alla passione per la birra artigianale e di qualità; <em><a href="http://www.pintamedicea.com" title="Blog sulla birra artigianale" target="_blank">Pintamedicea.com</a></em> &egrave; il mio blog sulla birra.</p>
          </div>
        </div>
        
      </div>
    </section>

    <!-- Projects Section -->
    <section id="projects" class="projects-section bg-light">
      <div class="container">

        <!-- Featured Project Row -->
        <div class="row align-items-center no-gutters mb-4 mb-lg-5">
          <div class="col-xl-8 col-lg-7">
            <img class="img-fluid mb-3 mb-lg-0" src="/img/bg-masthead.jpg" alt="">
          </div>
          <div class="col-xl-4 col-lg-5">
            <div class="featured-text text-center text-lg-left">
              <h4>Appunti</h4>
              <p class="text-black-50 mb-0">Il blog di Storie, pi&ugrave; che altro un copia-incolla di roba che mi fa comodo tenere a portata di mano. <a href="https://www.storiediweb.it/appunti/" target="_blank">Visita >></a></p>
            </div>
          </div>
        </div>

        <!-- Project One Row -->
        <div class="row justify-content-center no-gutters mb-5 mb-lg-0">
          <div class="col-lg-6">
            <img class="img-fluid" src="/img/demo-image-01.jpg" alt="">
          </div>
          <div class="col-lg-6">
            <div class="bg-black text-center h-100 project">
              <div class="d-flex h-100">
                <div class="project-text w-100 my-auto text-center text-lg-left">
                  <h4 class="text-white">Museo del Web</h4>
                  <p class="mb-0 text-white-50">Il mio vecchio portfolio pubblico, riciclato in "sitoteca" per esplorare un po' di archeologia del web design. <a href="https://www.storiediweb.it/sitoteca/" target="_blank">Visita >></a></p>
                  <hr class="d-none d-lg-block mb-0 ml-0">
                </div>
              </div>
            </div>
          </div>
        </div>

        <!-- Project Two Row -->
        <div class="row justify-content-center no-gutters">
          <div class="col-lg-6">
            <img class="img-fluid" src="/img/demo-image-02.jpg" alt="">
          </div>
          <div class="col-lg-6 order-lg-first">
            <div class="bg-black text-center h-100 project">
              <div class="d-flex h-100">
                <div class="project-text w-100 my-auto text-center text-lg-right">
                  <h4 class="text-white">Assets</h4>
                  <p class="mb-0 text-white-50">Raccolta di risorse, per il momento non visibile.</p>
                  <hr class="d-none d-lg-block mb-0 mr-0">
                </div>
              </div>
            </div>
          </div>
        </div>

      </div>
    </section>

    <!-- Signup Section -->
    <section id="signup" class="signup-section">
      <div class="container">
        <div class="row">
          <div class="col-md-10 col-lg-8 mx-auto text-center">

            <i class="far fa-paper-plane fa-2x mb-2 text-white"></i>
            <h2 class="text-white mb-5">Rimani in contatto con "Storie"</h2>
			<p class="mb-2 text-white-50">Invio link e informazioni che mi hanno incuriosita o che mi sono piaciute. L'invio è sporadico, informale e non contiene pubblicità né spam.<br>Se non ti interessa va benissimo, per&ograve; fermati un attimo per goderti questo splendido panorama della Valdinievole vista da San Baronto (Lamporecchio, PT).</p>
            <p class="mt-2">&nbsp;</p>

            <form class="form-inline d-flex" action="https://tinyletter.com/storie" method="post" target="popupwindow" onSubmit="window.open('https://tinyletter.com/storie', 'popupwindow', 'scrollbars=yes,width=800,height=600');return true">
              <input type="text" class="form-control flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" name="email" id="tlemail" placeholder="Inserisci l'indirizzo email...">
			  <input type="hidden" value="1" name="embed"/>
              <button type="submit" class="btn btn-primary mx-auto">Invia</button>
            </form>
			
			<p class="mt-5 text-white-50">Per info, domande o semplicemente per dirmi "ciao": storiediweb@gmail.com</p>
          </div>
        </div>
      </div>
    </section>
    
    <!-- Contact Section -->
    <section class="contact-section bg-black">
      <div class="container">

        <div class="social d-flex justify-content-center">
          <a href="https://www.twitter.com/storiediweb" class="mx-2" target="_blank">
            <i class="fab fa-twitter"></i>
          </a>
          <a href="https://www.storiediweb.it/appunti/" class="mx-2" target="_blank">
            <i class="fab fa-wordpress"></i>
          </a>
        </div>

      </div>
    </section>
    <!-- Footer -->
    <footer class="bg-black small text-center text-white-50">
      <div class="container">
        Copyright &copy; morb:de//: - Storiediweb 1999-2019
      </div>
    </footer>
    <!-- Bootstrap JavaScript -->
    <script src="/js/vendor/jquery/jquery.min.js"></script>
    <script src="/js/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
    <!-- Plugin JavaScript -->
    <script src="/js/vendor/font-awesome/js/all.js"></script>
    <script src="/js/vendor/jquery-easing/jquery.easing.min.js"></script>
    <!-- Roba mia -->
    <script src="/js/storiediweb.min.js"></script>
  </body>
</html>