Trzy strategie dotyczące treści w responsywnym projektowaniu stron internetowych: planowanie, ustalanie priorytetów, destylacja

Dla większości marketerów termin „responsywne projektowanie stron internetowych” najprawdopodobniej przywołuje obrazy twórców stron internetowych i ramek. Ale powinien przywodzić na myśl ciągi zdań i fragmenty tekstu.

Treść to silnik, który najpierw przyciąga potencjalnych klientów, a następnie prowadzi ich przez cykl sprzedaży. A głównym zadaniem responsywnego projektowania stron internetowych jest upewnienie się, że treść jest łatwa do strawienia, niezależnie od tego, czy odwiedzający korzysta z telefonu, tabletu czy komputera.

Responsywne projektowanie stron internetowych to okazja do ponownego wyobrażenia sobie treści, tak aby każde zdanie przyciągało więcej czytelników i gromadziło więcej leadów.

Co to jest projektowanie responsywne?

Najpierw trochę informacji na temat responsywnego projektowania stron internetowych. Koncepcja jest prosta – stwórz pojedynczą stronę internetową, która automatycznie optymalizuje swój projekt pod kątem urządzeń mobilnych lub komputerów stacjonarnych, w zależności od urządzenia, z którego korzysta odwiedzający. Prostym sposobem sprawdzenia, czy witryna jest responsywna, jest: w widoku pulpitu (i w widoku okna, a nie w widoku pełnoekranowym) chwyć prawy dolny róg witryny i powoli zmniejszaj ją do rozmiaru smartfona. Jeśli witryna zmienia się w widok przyjazny dla urządzeń mobilnych w miarę zmniejszania się, oznacza to, że jest responsywna. Jeśli po prostu kurczy się w trudną do odczytania, przewijaną i ściskaną witrynę, nie jest responsywna.

Projektowanie responsywne zaczyna się od zrozumienia, że ​​urządzenia mobilne to nie tylko kolejna platforma dla tych samych treści. Szybki rozwój urządzeń mobilnych zmienił kształt, organizację i rozmiar treści. Poza tym ludzie oczekują zasadniczo różnych rzeczy od treści mobilnych.

Oczekiwania te dotyczą wszystkich elementów firmowej kampanii treści — niezależnie od tego, czy jest to marketing e-mailowy, treści społecznościowe czy internetowe. Treść Twojej witryny musi być responsywna i zoptymalizowana pod kątem urządzeń mobilnych, podobnie jak szablony e-mail marketingu i kampanie społecznościowe.

Dlaczego potrzebujesz responsywnego projektu

Jeśli nie masz responsywnego projektu, potrzebujesz go. Google karze rankingi wyszukiwania firm bez responsywnego projektu. A ruch w sieci mobilnej jest tak wszechobecny, że wszystkie witryny muszą inteligentnie obsługiwać użytkowników mobilnych i stacjonarnych z tej samej witryny.

Kilka szybkich statystyk: Mobile generuje 41 procent wszystkich kliknięć płatnych wyników wyszukiwania i 31 procent wszystkich wydatków na płatne wyniki wyszukiwania (Merkle RKG) i 53 procent wszystkich otwarć e-maili (Litmus). Biorąc pod uwagę trendy mobilne, liczby te nie zwolnią w najbliższym czasie.

Wyniki tworzenia treści, które są naprawdę zoptymalizowane pod kątem urządzeń mobilnych, mogą być oszałamiające. Firma Act-On stwierdziła 93,5-procentowy wzrost liczby potencjalnych klientów dzięki responsywnemu projektowi. Jakie inne proste rozwiązania mogą natychmiast podwoić liczbę leadów sprzedażowych?

Trzy kroki do optymalizacji treści pod kątem responsywnego projektu.

1. Planuj w różnych działach

Projektowanie responsywne to nie tylko kwestia uwolnienia zespołu cyfrowego od tworzenia stron internetowych. To praca zespołowa między copywriterami, projektantami i strategami.

Skuteczne planowanie zapewni, że treść, kodowanie i projekt zazębiają się, aby Twoja witryna stała się maszyną do generowania leadów. Zacznij od początku, ustalając podstawy: profile odwiedzających witrynę, motywy odwiedzających i pożądane wyniki. Kto odwiedza Twoją stronę internetową? Dlaczego? Co chcesz, aby zrobili, gdy dotrą do Twojej witryny?

Współpraca między działami od samego początku zapewni, że projekt jest równowagą między dzwonkami i gwizdkami projektowymi a zorganizowaną i efektywną treścią.

2. Nadaj priorytet treściom w przejrzystej hierarchii

Priorytetyzacja treści jest niezbędna w responsywnym projektowaniu stron internetowych. Kiedy strona przeglądarki na komputerze zmniejsza się do rozmiaru ręcznego, treść ulega pomieszaniu. Szeroka, wielokolumnowa strona internetowa jest wciśnięta w jednokolumnową stronę mobilną. Jeśli strona internetowa nie jest poprawnie zaprojektowana, niektóre z najważniejszych treści mogą znaleźć się na dole strony, co wymaga długiego (zbyt długiego) przewijania, aby dotrzeć.

Przypisanie poziomów priorytetów tworzonym treściom stworzy strukturę, która zapewni, że Twoje najważniejsze treści znajdą się na szczycie. Utwórz hierarchię treści, identyfikując zawartość według poziomów. Idealnie byłoby, gdyby taka identyfikacja miała miejsce w zespołach marketingowych lub copywriterskich i została jasno przekazana projektantom i kierownikom projektów. Ta współpraca doprowadzi do projektu, który zachowuje hierarchię treści dla widzów mobilnych.

Destyluj zawartość do rozmiaru mobilnego

Tak jak użytkownicy oprogramowania lub systemu operacyjnego oczekują funkcjonalnego i intuicyjnego wyglądu, dzisiejsi czytelnicy oczekują treści, które zostały fachowo ułożone w zwięzłe fragmenty.

Pomyśl o swojej strategii treści jako podobnej do UI lub UX dla czytelników. Tak jak projektowanie doświadczenia użytkownika wymaga czasu, wysiłku i iteracji, treść powinna być wielokrotnie opracowywana z myślą o czytelniku. Ukryta struktura będzie miała ogromny wpływ na użyteczność (lub czytelność w przypadku treści).

Jeśli po ostatecznym szkicu nadal przedstawiasz czytelnikowi duże fragmenty szarego tekstu, potrzebujesz jeszcze jednej rundy destylacji treści. Kontynuuj dzielenie treści, aż pozostaną Ci wypunktowania, komunikaty i zwięzły tekst podzielony na oferty multimedialne, takie jak zdjęcia i filmy. Rozważ przekształcenie fragmentów złożonego tekstu zawierających duże ilości danych w infografikę, w której połączenie tekstu i elementów wizualnych może przekształcić dane w łatwo przyswajalną wizualizację.

Fragmentacja w pionie – dzielenie tekstu na pionowe fragmenty, które można umieścić obok siebie, każdy z własnym nagłówkiem i zdjęciem – umożliwia czytelnikom skanowanie w bok i konsumowanie pionowych fragmentów kawałek po kawałku.

Ten mały system dostarczania treści jest bardziej atrakcyjny wizualnie niż ściana szarego tekstu, sygnalizując czytelnikowi, że autor i projektant wykonali już pracę polegającą na zidentyfikowaniu poszczególnych myśli, ułożeniu ich w zwarty tekst i przedstawieniu ich w zwięzłej formie. sposób.

Responsywny projekt to nie tylko kolejna rzecz do dodania do i tak już zbyt długiej listy rzeczy do zrobienia. To nie jest irytacja ani niski priorytet. To szansa na wyostrzenie treści, dopracowanie projektu strony internetowej i zadowolenie klientów korzystających z urządzeń mobilnych w ramach jednego projektu.

~ Chcesz poznać wszystkie sztuczki związane z responsywnym projektowaniem stron internetowych, w tym zarządzanie procesem tworzenia, szacowanie kosztów i stawianie na urządzenia mobilne? Zobacz całe seminarium internetowe Projektowanie responsywne: 10 zaleceń i zakazów dotyczących stron internetowych i poczty e-mail.