Tekst, który dopasowuje się do ekranu — nowość w edytorze Manifo

Duży nagłówek potrafi dobrze wyglądać na komputerze, ale na telefonie zajmować niemal cały ekran. Z kolei rozmiar dobrany do małego wyświetlacza nie zawsze sprawdza się na szerokiej stronie. Dlatego wprowadziliśmy w Manifo możliwość płynnego dopasowania wielkości tekstu do szerokości ekranu.

Możesz teraz określić najmniejszy i największy rozmiar tekstu, a pomiędzy nimi pozwolić mu skalować się automatycznie. Dzięki temu nagłówek stopniowo zmniejsza się wraz ze zwężaniem strony.

Jeden nagłówek, różne wielkości ekranu

Nowa opcja przydaje się przede wszystkim w nagłówkach otwierających stronę, tytułach sekcji i krótkich hasłach. Pozwala zachować wyrazisty wygląd na komputerze, a jednocześnie ograniczyć wielkość tekstu na telefonie.

Przykładowo: nagłówek może mieć maksymalnie 64 piksele na dużym ekranie i zmniejszać się do 32 pikseli na mniejszym. Nie musisz ustawiać osobnej wartości dla każdej szerokości pomiędzy nimi.

Za takim zachowaniem stoi funkcja CSS clamp(). W edytorze możesz korzystać z niej przez ustawienia wielkości tekstu, bez samodzielnego pisania kodu.

Szybka zmiana i dokładniejsze ustawienia

Podstawowa obsługa pozostaje prosta: możesz szybko zwiększyć lub zmniejszyć tekst. Bardziej szczegółowe opcje pozwalają zdecydować, czy jego rozmiar ma być stały, czy płynnie dopasowywać się do ekranu.

Stały rozmiar nadal ma swoje zastosowanie — choćby w krótkich opisach i drobnych elementach interfejsu. Płynny warto wybrać tam, gdzie tekst powinien mocniej reagować na dostępną przestrzeń.

Sprawdź nagłówek razem z resztą strony

Po ustawieniu wielkości tekstu przełącz podgląd między komputerem, tabletem i telefonem. Zwróć uwagę na podział tytułu na linie oraz jego odległość od zdjęcia, przycisku lub formularza.

Automatyczne skalowanie pomaga dopasować typografię, ale znaczenie nadal mają długość nagłówka i szerokość kolumny. Czasem skrócenie tytułu da lepszy efekt niż dalsze zmniejszanie liter.

Nową opcję znajdziesz w ustawieniach wielkości tekstu w edytorze Manifo. Wypróbuj ją na głównym nagłówku swojej strony i porównaj efekt na różnych ekranach.