Pedanteria – serwis sprzątający z Sosnowca.
Firma z kilkunastoletnim stażem i stroną, która została w tyle za marką. Zbudowałem nowy serwis od zera – szybki, mobilny i łatwy w utrzymaniu, z galerią kilku tysięcy zdjęć z realizacji i opiniami klientów prosto z Google.
PUNKT WYJŚCIA
Strona sprzed ponad dekady
Poprzedni serwis powstał kilkanaście lat temu i wymagał odświeżenia. Najważniejsze było podniesienie oprogramowania serwera do aktualnej, wspieranej wersji – realna kwestia bezpieczeństwa. Do tego wolne ładowanie i słabe działanie na telefonach.
Cel: nowocześnie, szybko i bezpiecznie
Strona miała być lekka, w pełni mobilna (mobile-first – tak dziś przegląda większość odwiedzających) i osiągać wysokie wyniki w Google PageSpeed. Do tego solidne SEO oraz darmowy certyfikat SSL na nowym serwerze – zamiast płatnego na starym hostingu.
CO ZOSTAŁO ZROBIONE
Projekt graficzny
Świeży layout osadzony na kolorach z logo – zielono-szara paleta, dużo powietrza i czytelna typografia. Marka wygląda spójnie od nagłówka po stopkę.
Kod bez zbędnego bagażu
Postawiłem na autorski, lekki system – bez bazy danych i wtyczek, które trzeba w kółko aktualizować. To mniej awarii, szybsze ładowanie i spokój na lata.
Mobile-first i pełne RWD
Dziś większość odwiedzających wchodzi z telefonu, dlatego projekt powstał w duchu mobile-first. Menu, galeria i formularz działają tak samo wygodnie na telefonie, tablecie i dużym monitorze – bez kompromisów.
Galeria dopracowana, nie przeładowana
Stara strona miała kilka tysięcy zdjęć – wybraliśmy z nich te najlepsze. System i tak z każdego generuje w locie dodatkowe, mniejsze wersje w formacie WebP, więc strona zostaje lekka mimo ogromu materiału.
Opinie Google na stronie
Ocena 5,0 ze 137 opinii trafiła prosto na stronę – badge i karuzela cytatów. Wszystko serwerowo, bez zewnętrznych skryptów i bez dodatkowych zgód na cookies.
SEO i migracja adresów
Przeniesienie treści bez utraty pozycji: przekierowania ze starych adresów, mapa strony, uporządkowane meta dane. Firmę łatwiej znaleźć w Google.
DETALE, KTÓRE ROBIĄ RÓŻNICĘ
Dobra strona to nie tylko treść – to też sposób, w jaki się ją ogląda. Kilka rzeczy, które łatwo przeoczyć, a bardzo zmieniają wrażenie:
Subtelne animacje wejścia
Sekcje i zdjęcia pojawiają się płynnie w miarę przewijania – delikatnie, bez cyrku. Strona ożywa, ale nie rozprasza. Wszystko wyłącza się automatycznie, gdy użytkownik ma włączone ograniczenie ruchu w systemie.
Interaktywne kafle i stany hover
Kafle usług i zdjęcia reagują na kursor – subtelne podniesienie, powiększenie, zmiana akcentu. Klikalny obszar jest oczywisty, a interfejs sprawia wrażenie „żywego".
Karuzela opinii i lightbox galerii
Opinie klientów przewijają się w lekkiej karuzeli (działa też gestem na telefonie), a zdjęcia z galerii otwierają się w pełnoekranowym podglądzie z nawigacją strzałkami.
UŻYTE TECHNOLOGIE
- PHP
- JavaScript
- HTML5
- CSS3
- WebP
- SSL
SZYBKOŚĆ WEDŁUG GOOGLE
Wyniki strony głównej w Google PageSpeed Insights mówią same za siebie:
Wynik dla wersji mobilnej – Google ocenia strony przede wszystkim po telefonie. Na komputerze wydajność sięga 99/100.
