Skip to content

E
etersoft.com
Commit b81fc15c authored by Давид Добряков's avatar Давид Добряков
Browse files
Options

Lighthouse improvements

parent ca32348a
Pipeline #6495 passed with stage
    in 1 minute 24 seconds
    Hide whitespace changes
    Inline Side-by-side
    Showing with 55 additions and 15 deletions
    index.html
    View file @ b81fc15c
    ...@@ -3,10 +3,11 @@ ...@@ -3,10 +3,11 @@
    <head> <head>
    <meta charset="UTF-8"> <meta charset="UTF-8">
    <meta name="description" content="Etersoft — Решения для перехода на Linux и свободное ПО">
    <title>Etersoft — Решения для перехода на Linux и свободное ПО</title> <title>Etersoft — Решения для перехода на Linux и свободное ПО</title>
    <link rel="stylesheet" href="dist/app.css"> <link rel="stylesheet" href="dist/app.css">
    <meta name="viewport" <meta name="viewport"
    content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
    </head> </head>
    <body> <body>
    ...@@ -14,7 +15,10 @@ ...@@ -14,7 +15,10 @@
    <nav class="transparent"> <nav class="transparent">
    <div class="logo"> <div class="logo">
    <a href="./"> <a href="./">
    <img src="src/images/logo.png" alt=""> <picture>
    <source type="image/webp" srcset="src/images/logo-sm.webp">
    <img src="src/images/logo-sm.png" alt="Logo">
    </picture>
    </a> </a>
    </div> </div>
    <div class="menu-right"> <div class="menu-right">
    ...@@ -45,7 +49,18 @@ ...@@ -45,7 +49,18 @@
    </menu> </menu>
    <div class="hello-banner"> <div class="hello-banner">
    <div class="hello-banner__gradient"></div> <div class="hello-banner__gradient"></div>
    <div class="hello-banner__img"></div> <div class="hello-banner__img">
    <picture>
    <source type="image/webp" srcset="src/images/banner.webp" media="(min-width: 1281px)">
    <source type="image/webp" srcset="src/images/banner-desktop.webp" media="(max-width: 1280px) and (min-width: 1025px)">
    <source type="image/webp" srcset="src/images/banner-desktop-sm.webp" media="(max-width: 1024px) and (min-width: 769px)">
    <source type="image/webp" srcset="src/images/banner-tablet.webp" media="(max-width: 768px) and (min-width: 641px)">
    <source type="image/webp" srcset="src/images/banner-tablet-sm.webp" media="(max-width: 640px) and (min-width: 481px)">
    <source type="image/webp" srcset="src/images/banner-phone.webp" media="(max-width: 480px) and (min-width: 321px)">
    <source type="image/webp" srcset="src/images/banner-phone-sm.webp" media="(max-width: 320px)">
    <img class="banner__img" src="src/images/banner.jpg" alt="">
    </picture>
    </div>
    <div class="hello-banner__text"> <div class="hello-banner__text">
    <h1> <h1>
    Разработка программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных Разработка программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных
    ...@@ -174,8 +189,8 @@ ...@@ -174,8 +189,8 @@
    </div> </div>
    </div> </div>
    </div> </div>
    <a class="slider__control slider__control_left" href="#" role="button"></a> <a class="slider__control slider__control_left" href="#" role="button" aria-label="Правая кнопка слайдера"></a>
    <a class="slider__control slider__control_right slider__control_show" href="#" role="button"></a> <a class="slider__control slider__control_right slider__control_show" href="#" role="button" aria-label="Левая кнопка слайдера"></a>
    </div> </div>
    </section> </section>
    <section id="services" class="flex-column"> <section id="services" class="flex-column">
    ...@@ -184,7 +199,10 @@ ...@@ -184,7 +199,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services1.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services1.webp">
    <img src="src/images/services1.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Внедрение</h2> <h2 class="card__heading--animated">Внедрение</h2>
    ...@@ -195,7 +213,10 @@ ...@@ -195,7 +213,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services2.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services2.webp">
    <img src="src/images/services2.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Доработка ПО</h2> <h2 class="card__heading--animated">Доработка ПО</h2>
    ...@@ -207,7 +228,10 @@ ...@@ -207,7 +228,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services3.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services3.webp">
    <img src="src/images/services3.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Разработка ПО под заказ</h2> <h2 class="card__heading--animated">Разработка ПО под заказ</h2>
    ...@@ -217,7 +241,10 @@ ...@@ -217,7 +241,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services4.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services4.webp">
    <img src="src/images/services4.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Разработка сайтов</h2> <h2 class="card__heading--animated">Разработка сайтов</h2>
    ...@@ -227,7 +254,10 @@ ...@@ -227,7 +254,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services5.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services5.webp">
    <img src="src/images/services5.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Разработка АСУ</h2> <h2 class="card__heading--animated">Разработка АСУ</h2>
    ...@@ -237,7 +267,10 @@ ...@@ -237,7 +267,10 @@
    <div class="card"> <div class="card">
    <div class="card__body"> <div class="card__body">
    <div class="card__image"> <div class="card__image">
    <img src="src/images/services6.jpg" alt=""> <picture>
    <source type="image/webp" srcset="src/images/services6.webp">
    <img src="src/images/services6.jpg" alt="">
    </picture>
    </div> </div>
    <div class="card__overlay"></div> <div class="card__overlay"></div>
    <h2 class="card__heading--animated">Техническая поддержка</h2> <h2 class="card__heading--animated">Техническая поддержка</h2>
    ...@@ -259,7 +292,7 @@ ...@@ -259,7 +292,7 @@
    </div> </div>
    <div class="right-column"> <div class="right-column">
    <div class="banner"> <div class="banner">
    <iframe <iframe title="Компания на карте"
    src="https://yandex.ru/map-widget/v1/?um=constructor%3Ad11a342758b8d992a3f15cf82b5e8bd941d94f6e91afd760c6b07a9eee2e67de&amp;source=constructor" src="https://yandex.ru/map-widget/v1/?um=constructor%3Ad11a342758b8d992a3f15cf82b5e8bd941d94f6e91afd760c6b07a9eee2e67de&amp;source=constructor"
    class="map-iframe" frameborder="0"></iframe> class="map-iframe" frameborder="0"></iframe>
    </div> </div>
    ......
    src/scss/utils/hello-banner.scss
    View file @ b81fc15c
    ...@@ -34,13 +34,20 @@ ...@@ -34,13 +34,20 @@
    } }
    .hello-banner__img { .hello-banner__img {
    background-image: url('../images/banner.jpg');
    background-size: cover; background-size: cover;
    filter: blur(2px);
    height: 100%; height: 100%;
    min-height: 500px;
    position: absolute; position: absolute;
    width: 100%; width: 100%;
    z-index: 1; z-index: -1;
    }
    .hello-banner__img .banner__img {
    filter: blur(2px);
    height: 100%;
    max-height: 500px;
    max-width: 1920px;
    width: 100%;
    } }
    @media (min-width: $desktopWidth) and (max-width: $lgDesktopWidth) { @media (min-width: $desktopWidth) and (max-width: $lgDesktopWidth) {
    ......
    Markdown is supported
    0% or
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment