Jak stworzyć szybką i responsywną stronę-wizytówkę? – Case study strony firmy B-Vent
W obecnych czasach wizytówki nadal pełnią ważną funkcję biznesową – są wygodne, łatwo dostępne i zapadają w pamięć. Umożliwiają także przekazanie ważnych informacji w szybki i prosty sposób. Te atuty można wykorzystać także przy tworzeniu stron internetowych, gdzie – chcąc się pokazać klientowi z dobrej strony i zachęcić do kontaktu – warto stawiać na to, by strona była wysoce wydajna i przejrzysta. Dowiedz się, jak współpraca z firmą B-Vent zaowocowała nowoczesną, zoptymalizowaną i responsywną odsłoną ich strony-wizytówki, która z powodzeniem może zastąpić jej fizyczne odpowiedniki.
O firmie
Do grona naszych klientów dołączyła firma B-Vent, która już od kilkunastu lat dostarcza rozwiązania w zakresie klimatyzacji, wentylacji, rekuperacji i oczyszczania powietrza. Firma świadczy usługi na terenie całego kraju, obsługując zarówno osoby prywatne, jak i przedsiębiorstwa, dostarczając kompleksowe rozwiązania klimatyzacyjne dla mieszkań i obiektów komercyjnych. B-vent specjalizuje się w projektowaniu, doradztwie, sprzedaży oraz montażu systemów wentylacyjnych i klimatyzacyjnych, a dodatkowo posiada stacjonarny sklep, w którym można zasięgnąć fachowych porad i otrzymać ofertę dostosowaną do potrzeb klientów.
O ile uprzednio w zakresie swojej prezencji internetowej firma B-Vent posiadała już własną stronę, ta nie była dostosowana do obecnych wymagań. Problemy z responsywnością i brak przystosowania do wyświetlania na urządzeniach mobilnych znacząco utrudniało przeglądanie treści. Ponadto, podczas testowania odkryliśmy, że stronie firmy brakowało optymalizacji pod niektóre współczesne przeglądarki, co skutkowało błędami w wyświetlaniu i zaburzeniu treści strony. Innymi słowy – nasz klient potrzebował strony nowej, nowoczesnej i nadążającej za współczesnymi, ciągle zmieniającymi się wymaganiami Internetu i technologii.
Cele klienta
Firma B-Vent potrzebowała nowej odsłony swojej strony internetowej. Oprócz wymienionych wyżej wymagań dyktowanych przez zmieniający się świat Internetu – stworzenia strony responsywnej, kompatybilnej i dostosowanej pod urządzenia mobilne – wedle zamysłu klienta strona ta byłaby swoistą wizytówką. Zadaniem strony jest nawiązanie komunikacji firmy z klientem, przedstawienie najważniejszych informacji oraz zachęceniu do kontaktu lub wizyty w sklepie stacjonarnym.
Po przeanalizowaniu naszego zadania uznaliśmy, że technologia WordPress jest doskonałym wyborem, odpowiadającym na wszystkie potrzeby klienta. Jako że strona-wizytówka nie potrzebuje rozwiązań e-commerce, wdrożenie z pomocą WordPress jest szybsze, mniej zasobożerne oraz bardziej opłacalne – a przy tym oferuje zachwycający rezultat.
Dodatkową korzyścią zastosowania tego podejścia jest pominięcie obciążeń, które powodują dodatkowe moduły wykonane w JavaScript. Jesteśmy zatem w stanie stworzyć dla B-Vent lekką i bardzo szybką stronę, która osiąga wysokie wyniki PageSpeed – w końcu strona-wizytówka, która długo się ładuje i jest powolna w użytkowaniu może zniechęcić potencjalnego klienta do zapoznania się z firmą i jej ofertą.
Realizacja – krok po kroku
Stworzenie projektu strony
Projektując stronę, skorzystaliśmy z inspiracji długą historią i profesjonalizmem firmy, jej logiem, oraz poprzednią stroną, jaką posiadała. Pod względem projektu, układu elementów oraz treści klient zaoferował nam wysoką swobodę i wolność kreatywną. Zaprojektowaliśmy układ korzystający z estetyki blokowej, z dużym naciskiem na grafiki nawiązujące do oferty firmy. Wybierając grafiki, nawiązaliśmy do profesjonalizmu, wachlarza usług i kompleksowego podejścia do klientów, jakie od lat dostarcza B-Vent; są one odzwierciedlane poprzez postacie w środowiskach roboczych i domowych, w połączeniu z urządzeniami klimatyzacyjnymi i wentylacyjnymi na pierwszym planie.
Strona one-page została wzbogacona o kompozycję kolorów zaczerpniętą z rozpoznawalnego, wielokolorowego, przypominającego wiatrak loga firmy.
Umieszczając kolory loga – kombinację czerwieni, zieleni, niebieskiego oraz żółtego – w elementy strony została wpisana esencja identyfikacji wizualnej B-Vent. Tym sposobem tworzymy powiązanie między DNA firmy a wizytówkowym aspektem strony, a także dodajemy stylu i kontrastu dla minimalistycznego, blokowego układu elementów na stronie.
Przedstawiając koncept naszemu klientowi, natychmiast wiedzieliśmy, że był to strzał w dziesiątkę!
Tworzenie strony
Po ciepłym przyjęciu projektu przez klienta mogliśmy przejść do realizacji strony. Mając w zamyśle szybkość i responsywność, wykorzystaliśmy Gutenberg jako narzędzie do jej zbudowania. Gutenberg to nowy edytor (page builder) dla WordPress, który opiera się na systemie traktowania każdego elementu strony jako oddzielnego bloku. W porównaniu do innego popularnego edytora – Elementor – który oferuje podobne działanie, Gutenberg jest zintegrowany z WordPressem i wysoce zoptymalizowany pod względem wydajności. Będąc również lżejszym od Elementora, dla stron-wizytówek zastosowanie Gutenberga potrafi przyspieszyć ładowanie i przeglądanie strony.
Wedle projektu uwzględniliśmy również formularz kontaktowy na stronie B-Vent, tak aby zainteresowani klienci mogli w łatwy sposób nawiązać kontakt i dowiedzieć się więcej o firmy, jej ofercie, oraz nawiązać współpracę. Uruchomienie formularza wymagało implementacji protokołu e-mailowego SMTP, powiązanie go ze stroną oraz testowanie tego rozwiązania pod kątem stabilności i działania.
W wyniku naszej pracy i optymalizacji udało się stworzyć prostą, ale responsywną i bardzo szybką w obsłudze stronę-wizytówkę. Klient wyraził zadowolenie rezultatem prac – strona spełnia swoje zadanie w sposób satysfakcjonujący zarówno dla niego, jak i klientów ją odwiedzających, robiąc to wydajnie i wygodnie. Z taką stroną-wizytówką dobrze się wygląda!
Rezultaty naszej pracy możesz obejrzeć w naszym portfolio oraz na stronie klienta – bvent.pl.
Podobają Ci się nasze rozwiązania? Skontaktuj się z nami wypełniając formularz poniżej, by dowiedzieć się więcej!