HTL-STREFA: nowa strona producenta wyrobów medycznych na WordPressie

HTL-STREFA od 25 lat produkuje lancety bezpieczne, lancety personalne, igły do wstrzykiwaczy i urządzenia nakłuwające. Z fabryk w Łęczycy i Ozorkowie codziennie wyjeżdża prawie 10 milionów produktów do klientów na całym świecie. Od 2018 roku firma należy do międzynarodowej Grupy MTD. W trzy miesiące zaprojektowaliśmy i wdrożyliśmy dla niej nową stronę internetową na WordPressie, od UX i grafiki po kod.

Technologie użyte w tej realizacji

Figma GitLab MySQL php WordPress

Wyzwanie

Strona producenta wyrobów medycznych ma kilka grup odbiorców naraz. Klienci B2B szukają portfolio i standardów jakości. Personel medyczny potrzebuje procedur i materiałów szkoleniowych. Pacjent chce szybko pobrać instrukcję do lancetu, który trzyma w ręku. Do tego dochodzą kandydaci do pracy i informacje korporacyjne wymagane od spółki akcyjnej.

Poprzednia strona przestała nadążać za firmą, która dziś eksportuje na cały świat i działa w ramach międzynarodowej grupy. HTL-STREFA potrzebowała odświeżenia: nowego wyglądu, przejrzystej struktury treści i szybkiego działania na telefonach. Całość mieliśmy dowieźć w trzy miesiące.

Kluczowe wymagania

• Dwie wersje językowe (PL i EN) z poprawnym hreflang
• Katalog produktów pogrupowany w pięć kategorii, z kartą każdego wyrobu
• Osobne ścieżki dla pacjentów i pracowników medycznych
• Biblioteka instrukcji użycia w wielu językach, z datą ostatniej aktualizacji każdego dokumentu
• Dobre wyniki w PageSpeed Insights i Core Web Vitals
• Zgodność z RODO i zarządzanie zgodami na cookies

Rozwiązanie

Autorski motyw zamiast page buildera

Zbudowaliśmy własny motyw WordPressa, bez ciężkich page builderów. Strona ładuje tylko kod, którego naprawdę używa, a to bezpośrednio przekłada się na wyniki Core Web Vitals. Instalację oparliśmy na Bedrocku, który oddziela rdzeń WordPressa od kodu projektu. Dzięki temu aktualizacje są bezpieczniejsze, a wdrożenia powtarzalne.

Katalog produktów i strefa wiedzy

Produkty mają własny typ treści i kategorie: igły do wstrzykiwaczy, bezpieczne igły, lancety bezpieczne, lancety do urządzeń nakłuwających i urządzenia nakłuwające. Każda karta prowadzi do instrukcji dla pacjenta i dla personelu medycznego. Instrukcje, filmy i oświadczenia o kompatybilności trafiają do jednej biblioteki z oznaczeniem języków i datą aktualizacji. Zespół klienta podmienia plik w jednym miejscu, a nowa wersja pojawia się wszędzie, gdzie jest podlinkowana.

Dwujęzyczność i zgodność

Wersje PL i EN obsługuje Polylang z powiązanymi tłumaczeniami treści i znacznikami hreflang. Zgody na cookies zbiera Complianz, skonfigurowany pod wymogi RODO. Na stronie znalazły się też glosariusz symboli z opakowań, sekcja kariery oraz strony korporacyjne: strategia zrównoważonego rozwoju i strategia podatkowa.

Jak pracowaliśmy

1. Architektura

Uporządkowaliśmy treści według grup odbiorców i zaprojektowaliśmy strukturę katalogu.

2. Projekt

Zaprojektowaliśmy UX i warstwę wizualną: od makiet po projekt graficzny wszystkich szablonów.

3. Development

Zakodowaliśmy motyw, typy treści, bibliotekę dokumentów i wersje językowe.

4. Wdrożenie

Przenieśliśmy treści, przetestowaliśmy wydajność i uruchomiliśmy serwis.

Efekty

Strona przechodzi ocenę Core Web Vitals na telefonach i komputerach. To nie są wyniki testu laboratoryjnego, tylko dane od prawdziwych użytkowników Chrome z ostatnich 28 dni (raport CrUX w PageSpeed Insights).

Pierwsza treść pojawia się po 1,1 s na telefonie i po 0,6 s na komputerze. Google zalicza LCP jako dobre poniżej 2,5 s, więc strona ma spory zapas. To dowód, że WordPress z autorskim motywem może być szybki.