e-point prezentuje nowe podejście do RWD

 - Często zdarza się, że przy wdrożeniach portali internetowych zagadnienie treści pojawia się na samym końcu projektu. W efekcie strony są zaaranżowane w sposób, w którym treść staje się podrzędna wobec nawigacji, bannerów, linków - opakowanie staje się ważniejsze niż zawartość.  Według nas to treść jest rzeczywistą wartością każdego portalu. Dodatkowo zależy nam na tym, by prezentacja treści była doskonale dostosowana do każdego urządzenia i dzięki temu jeszcze lepiej spełniała wymogi skutecznej komunikacji marketingowej - podkreśla Łukasz Franczuk, Kierownik Zespołu UX Design w e-point SA.

W nowym serwisie specjaliści e-point oparli projektowanie serwisu na treści. Prace obejmowały analizę założeń komunikacji marketingowej poszczególnych produktów, przygotowanie treści strukturalnej (structuralcopy), a następnie przygotowanie architektury informacji i projektu graficznego poszczególnych stron w modelu RWD.

Do realizacji portalu e-point użył swojej platformy ActiveContent, w której nową funkcją jest wsparcie budowy stron responsywnych w modelu wizualnym WYSIWYG (ang. WhatYouSeeIsWhatYouGet). Za pomocą jednego widoku redaktor strony może obsłużyć jej budowę od 4-calowych smartfonów do 40-calowych telewizorów Full HD.

ActiveContent to platforma dla zaawansowanych portali korporacyjnych. Obok wsparcia dla RWD, umożliwia budowanie stron z komponentów (widgetów), pełną kontrolę nad ich wyglądem dzięki menedżerowi szablonów, zarządzanie wersjami i datami publikacji stron. Nieograniczony dostęp do kodu HTML, CSS i JavaScript pozwala wdrożyć każdy projekt graficzny i zaimplementować dowolną interakcję.

Integracja z Google Analytics oraz wsparcie dla testów A/B pozwala zrozumieć zachowanie osób odwiedzających serwis. Dzięki połączeniu z silnikiem do budowy formularzy internetowych – ActiveForms, platforma pozwala inicjować procesy sprzedaży.

Nowy projekt spółka e-point SA zrealizowała na zlecenie ING Banku Śląskiego. Dzięki zastosowaniu nowoczesnych rozwiązań, prezentowana na stronie portalu ING Banku Śląskiego zawartość dostosowuje się do ekranów różnych urządzeń, i jest tak samo łatwa w odbiorze dla użytkowników smartfonów i notebooków jak i tabletów czy komputerów.

Pojęcia z artykułu

HTML — HyperText Markup Language / hipertekstowy język znaczników. Standardowy język znaczników opisujący strukturę strony internetowej: nagłówki, akapity, linki, formularze, obrazy i semantykę treści. HTML nie jest językiem programowania; współpracuje zwykle z CSS i JavaScript.

Dlaczego to ważne: Nadaje treści strukturę, którą rozumieją przeglądarki, czytniki ekranu i roboty wyszukiwarek. Poprawna struktura to fundament dostępności i SEO.

Kiedy się stosuje: Przy każdej stronie i szablonie; struktura nagłówków i znaczników wprost wpływa na pozycje w wyszukiwarce.

Czym grozi pominięcie: Bez semantycznego HTML strona może wyglądać dobrze, ale wyszukiwarka nie odróżni tytułu od ozdobnika, a czytnik ekranu gubi kolejność treści.

HTML — HyperText Markup Language. Standardische Markup-Sprache zur Beschreibung der Struktur einer Webseite: Überschriften, Absätze, Links, Formulare, Bilder und semantische Inhalte. HTML ist keine Programmiersprache; es arbeitet in der Regel zusammen mit CSS und JavaScript.

Dlaczego to ważne: Gibt dem Inhalt eine Struktur, die von Browsern, Screenreadern und Suchrobotern verstanden wird. Eine korrekte Struktur ist die Grundlage für Barrierefreiheit und SEO.

Kiedy się stosuje: Bei jeder Webseite und jedem Template; die Struktur der Überschriften und Tags beeinflusst direkt die Platzierung in Suchmaschinen.

Czym grozi pominięcie: Ohne semantischen HTML kann eine Seite optisch gut aussehen, aber Suchmaschinen können Titel von Dekorationen nicht unterscheiden, und Screenreader verlieren die Inhaltsreihenfolge.

Podsumowanie

e-point SA zaprezentował nowe podejście do projektowania responsywnych serwisów, opierając proces na treści, a nie na oprawie graficznej. Jak podkreśla Łukasz Franczuk, Kierownik Zespołu UX Design w e-point SA, zbyt często treść traktowana jest jako element drugoplanowy wobec nawigacji i bannerów. Prace nad nowym serwisem objęły analizę komunikacji marketingowej, przygotowanie treści strukturalnej, a następnie architektury informacji i projektu graficznego w modelu RWD.

Do realizacji portalu wykorzystano platformę ActiveContent, która pozwala budować strony responsywne w wizualnym trybie WYSIWYG — od 4-calowych smartfonów po 40-calowe telewizory Full HD. Projekt zrealizowano na zlecenie ING Banku Śląskiego, a integracja z Google Analytics oraz ActiveForms umożliwia analizę zachowań użytkowników i inicjowanie procesów sprzedaży.