Zaawansowane szablony CSS dla klientów zapewniające spójny proof

Warstwa stylu to to, co faktycznie kontrolujesz po umieszczeniu recenzji i logo. Szablon CSS dla klienta określa proporcje karty, skalę czcionki i odstępy między cytatem a jego źródłem, a także reguły punktów przerwania. Pozostaje tylko wybrać gotowy wygląd, który pasuje do proofa, a następnie dostosować kilka elementów, które kłócą się z Twoją marką.

Suwaki, siatki, karty portretowe, ściany logo

Gotowe style dla klientów występują w kilku rozpoznawalnych kształtach:

1. Siatki recenzji, gdzie kilka referencji znajduje się obok siebie i ma równą wagę;
2. Suwaki, które po umieszczeniu dwudziestu cytatów zamieniają widoczność na przestrzeń;
3. Karty portretowe, z twarzą i jej atrybucją ułożoną pod tekstem;
4. Ściany logo, dostosowane do logotypów i znaków kwadratowych o bardzo różnych proporcjach.

Portrety to tutaj rozwidlenie drogi. W przypadku zdjęć skala czcionki musi pozostawiać miejsce na imię i nazwisko oraz rolę pod stałym rozmiarem obrazu, a cytaty z konieczności są krótkie. Bez nich recenzja może trwać dłużej, a atrybucja może być ograniczona do jednej małej linijki pod spodem. Suwaki mają swoje własne elementy, ponieważ elementy sterujące i znaczniki pozycji muszą mieć odpowiedni kontrast, aby wyglądały na klikalne.

Długie referencje zachowują się inaczej na wąskich ekranach

Większość pracy w zestawie stylistycznym klienta ma miejsce, gdy treść przestaje być przewidywalna:

1. 300-wyrazowa recenzja umieszczona w tym samym rzędzie co 12-wyrazowa;
2. Cudzysłowy, które otaczają wizytówkę na laptopie i pochłaniają połowę telefonu;
3. Mały kwadratowy znak, który znika obok szerokiego znaku słownego w jednej siatce;
4. Atrybucja, która oddala się od cytatu, gdy zwiększa się odstęp pionowy.

Stała wysokość jest przyczyną większości tych problemów. Pozwolenie kartom na rozrastanie się do ich zawartości, ograniczenie znaczników wartościami max-width i max-height zamiast wspólnej szerokości oraz zachowanie odstępu pod cytatem węższego niż odstęp między kartami rozwiąże większość problemów. Nicepage obsługuje niestandardowy CSS, gdy pojedyncza, uparta sekcja nadal nie działa prawidłowo, i to jest uczciwe zastosowanie: wyjątek w zestawie reguł, który w innym przypadku obowiązuje.

Najpierw wybierz styl według rozmiaru treści

Spójrz na to, co masz, zanim zaczniesz szukać ładnego wyglądu. Dwadzieścia krótkich rekomendacji i zestaw rekomendacji klienta wymagają siatki i ściany, obu cichych i spójnych. Trzy długie artykuły z liczbami wymagają szerokich paneli, gdzie wyniki mogą swobodnie oddychać. Zespoły, które mają oba style, zazwyczaj kończą na korzystaniu z dwóch powiązanych stylów na jednej stronie, połączonych wspólnym krojem i kolorem. Jeśli długość cytatów znacznie się różni, przetestuj tę zmianę przed czymkolwiek innym, ponieważ potwierdzenie klienta buduje zaufanie tylko wtedy, gdy wygląda na przemyślane.