Wskazówki, jak sprawić, by Twój blog był bardziej przyjazny dla urządzeń mobilnych

Opublikowany: 2017-02-25

Google ogłosił niedawno, że użyje aktualizacji algorytmu przyjaznego dla urządzeń mobilnych, aby sprawdzić, czy wszystkie blogi są przyjazne dla urządzeń mobilnych, i będzie karać tych, którzy nie są. To sprawiło, że wielu blogerów zastanawiało się, jak sprawić, by ich witryny były bardziej przyjazne dla urządzeń mobilnych i jak w ogóle wiedzieć, czy Twój blog jest przyjazny dla urządzeń mobilnych, czy nie. Dlatego zebraliśmy najważniejsze informacje o tym, dlaczego dostosowanie bloga do urządzeń mobilnych jest tak ważne i jak to zrobić.

W dzisiejszych czasach duża część odwiedzających bloga używa w tym celu swoich urządzeń mobilnych zamiast komputerów. A ponieważ Google obiecał poprawić rankingi witryn, które nadają się do przeglądania na urządzeniach mobilnych, ważniejsze niż kiedykolwiek jest upewnienie się, że Twój blog lub witryna są przyjazne dla urządzeń mobilnych.

Oczywiście nie chodzi tylko o to, czego chce Google. Uczynienie bloga przyjaznym dla urządzeń mobilnych leży również w najlepszym interesie Twoim i Twoich czytelników, ponieważ ponieważ tak wiele osób korzysta z urządzeń mobilnych do surfowania po Internecie, sprawi to, że czytanie Twojego bloga będzie dla nich wygodniejsze. Według badań Pew Internet Project, ponad jedna trzecia wszystkich posiadaczy telefonów komórkowych korzysta z telefonu częściej niż z komputera stacjonarnego lub laptopa, aby uzyskać dostęp do Internetu. Jeśli więc chcesz, aby Twój blog był łatwy do przeglądania na dowolnym smartfonie, a także zwiększał liczbę czytelników Twojego bloga, musisz pomyśleć o przyjazności dla urządzeń mobilnych. I faktycznie jest to łatwiejsze, niż mogłoby się wydawać.

Testowanie pod kątem przyjazności mobilnej

Ponieważ Google wymyślił ten przyjazny dla urządzeń mobilnych algorytm, umożliwił także każdemu testowanie swoich blogów i witryn pod kątem tego wskaźnika za pomocą narzędzia do testowania przyjaznego dla urządzeń mobilnych. Wystarczy wpisać adres URL swojego bloga w polu „ Wprowadź adres URL do przetestowania ”, kliknąć „ Uruchom test ”, a narzędzie poinformuje Cię, czy Twój blog jest przyjazny dla urządzeń mobilnych, czy nie.

Jeśli Twoja witryna jest przyjazna dla urządzeń mobilnych, możesz się trochę zrelaksować, ponieważ nie musisz nic robić. Jeśli jednak to narzędzie Google stwierdzi, że Twój blog nie jest najłatwiejszy do czytania na urządzeniu mobilnym, musisz jak najszybciej wprowadzić pewne ulepszenia w tym dziale.

Dla tych, którzy używają oprogramowania do zarządzania treścią (CMS) do prowadzenia swojego bloga, takiego jak WordPress, Joomla!, Drupal, Blogger, Tumblr, Google Sites, Bitrix itp., dostosowanie nie powinno stanowić problemu, ponieważ większość tych systemów oprogramowania oferować narzędzia, które automatycznie dostosują Twoją witrynę do urządzeń mobilnych. Ale jeśli poszedłeś do bardziej oldschoolowego korzenia, nie używając żadnego oprogramowania CMS do tworzenia swojej witryny, lub jeśli używasz CMS, ale Twoja witryna nadal nie spełnia standardów mobilnych, oto kilka wskazówek, jak ulepszyć przyjazność Twojej witryny dla komórek.

1. Zaktualizuj CMS do najnowszej wersji i korzystaj z motywów mobilnych

Jeśli korzystasz z CMS, wszystko, co możesz potrzebować, to zaktualizować oprogramowanie lub zmienić motyw, którego używasz na swoim blogu. Większość systemów CMS zapewnia już wszystkie narzędzia, dzięki którym Twoja witryna jest przyjazna dla urządzeń mobilnych, ale musisz upewnić się, że Twój system CMS jest zaktualizowany do najnowszej wersji. Na przykład Joomla jest dostarczana z obsługą mobilną tylko wtedy, gdy jest zaktualizowana do najnowszej wersji oprogramowania. Inne oprogramowanie może jednak wymagać zmiany motywu witryny, aby była przyjazna dla urządzeń mobilnych, ponieważ niektóre starsze motywy po prostu nie wyglądają dobrze na urządzeniach mobilnych, dlatego też nie są dla nich odpowiednie. W tym celu przejdź do panelu administracyjnego swojego CMS, znajdź zakładkę motywów na swoim dashboardzie i zmień motyw swojego bloga na taki, który jest responsywny i przyjazny dla urządzeń mobilnych. Na przykład WordPress oferuje setki różnych motywów, a duża część z nich jest bezpłatna i responsywna. Niestety, jeśli korzystasz z systemu CMS, który nie oferuje obsługi urządzeń mobilnych, potrzebne będą dalsze ulepszenia i może być mądrzej po prostu zmienić oprogramowanie do zarządzania treścią.

2. Użyj podtytułów

Zasadą, jeśli chodzi o zawartość bloga, która jest wygodna dla użytkowników mobilnych, jest umożliwienie im wchłaniania tekstu w mniejszych akapitach, w przeciwieństwie do umieszczania artykułu w jednym długim tekście. Dlatego tekst posta na blogu powinien być dobrze ustrukturyzowany, aby czytelnik mógł łatwo orientować się w tekście. Można to łatwo zrobić za pomocą podtytułów. W przypadku korzystania z podtytułów tekst jest automatycznie dzielony na wiele podrozdziałów i jest mniejsze prawdopodobieństwo, że czytelnik straci swoje miejsce podczas czytania artykułu. A ponieważ utrata miejsca podczas czytania czegoś na smartfonie to dość częsty problem wielu użytkowników urządzeń mobilnych, bo mobilne przewijanie utrudnia czytanie długich, monotonnych tekstów, rozwiąż to za pomocą nagłówków.

Nagłówki można łatwo wstawiać za pomocą tagów nagłówków. Znacznik największego i najważniejszego nagłówka to <h1>. Ten tag jest najczęściej używany w tytule tekstu. Inne nagłówki mają hierarchię od <h1> do <h6>, która jest ledwo zauważalnym nagłówkiem, ale nadal pomoże Ci podzielić treść i ułatwi jej czytanie.

3. Wybierz odpowiedni rozmiar obrazów

Blogerzy zwykle wybierają rozmiar obrazów, których zamierzają użyć w swoich postach na blogu, zgodnie z normalnym rozmiarem ekranu komputera, ale gdy posty na blogu są wyświetlane na mniejszych ekranach, takich jak telefon komórkowy, obrazy na ogół się kończą się w tym samym rozmiarze. Oznacza to, że użytkownicy urządzeń mobilnych nie widzą obrazów w odpowiednich proporcjach. Postaraj się więc, aby Twoje zdjęcia nie tylko były mniejsze, zazwyczaj najlepsze są zdjęcia poniżej 1500 na 2500 pikseli, ale także mniejsze – zalecane jest poniżej 500 KB. Oprócz posiadania zdjęć przyjaznych dla urządzeń mobilnych, zmniejszenie rozmiarów plików obrazów pozwoli również użytkownikom szybciej ładować strony, ponieważ mniejsze zdjęcia zużywają mniej danych do załadowania.

Aby zmniejszyć rozmiar zdjęć, użyj dowolnego edytora zdjęć, który masz pod ręką, ponieważ nie potrzebujesz Photoshopa, aby to zrobić. Zalecamy używanie JPEGmini lub Pixlr , ponieważ dzięki tym edytorom zdjęć możesz zmniejszyć rozmiar zdjęć bez uszczerbku dla ich jakości.

4. Użyj responsywnego projektu

Responsywny projekt bloga lub strony internetowej daje możliwość wygodniejszego przeglądania go z wielu różnych platform i urządzeń o różnych rozmiarach ekranu, ponieważ automatycznie dostosowuje Twoją witrynę do szerokości okna przeglądarki. Aby zapewnić odwiedzającym bloga wygodę czytania, podczas tej adaptacji zazwyczaj zmienia się wygląd bloga, na przykład zmniejszają się obrazy, kolumny ustawiają się w pionie, a także zmienia się menu. Ale jeśli te zmiany nie zajdą same, istnieją narzędzia, których możesz użyć, aby zrobić to samodzielnie.

Na przykład Foundation 3 , Skeleton i Bootstrap . Te struktury automatycznie dostosują Twojego bloga, dzięki czemu będzie on łatwy do odczytania na każdym urządzeniu. Korzystanie z nich jest znacznie łatwiejsze niż samodzielne kodowanie każdej możliwej kombinacji. Oczywiście możesz to również zrobić, używając nowych jednostek długości względnej CSS3, takich jak szerokość okna (vw), wysokość okna (vh), minimalna wysokość i szerokość okna (vmin) oraz maksymalna wysokość i szerokość okna (vmax). Jednak kodowanie wymaga umiejętności i czasu, a jeśli nie jesteś doświadczonym programistą, sugerowałbym skorzystanie z pierwszej opcji.

5. Używaj prostych projektów

Użytkownicy mobilni preferują proste projekty witryn, ponieważ duże i skomplikowane witryny internetowe działają wolno na urządzeniu mobilnym. Proste projekty ułatwiają również skupienie uwagi czytelnika na treści, zamiast rozpraszać go fantazyjnym designem, ponieważ statystycznie większość użytkowników mobilnych ma dość krótki czas skupienia uwagi.

Oznacza to, że układ witryny jest prosty i łatwy do zrozumienia. Jeśli używasz motywu oferowanego przez dostawcę usług, możesz go po prostu zmienić na prostszy. Na przykład WordPress oferuje wiele eleganckich, prostych projektów, które nie przytłoczą urządzeń mobilnych, ale nadal będą dobrze wyglądać na komputerze stacjonarnym. Jeśli jednak stworzyłeś swoją witrynę przy użyciu HTML, możesz pobrać prosty szablon, który sprawi, że Twoja witryna będzie wyglądać świetnie i będzie również przyjazna dla urządzeń mobilnych. Na przykład Envato Market oferuje wiele różnych prostych projektów do wyboru i wykorzystania w witrynie.

6. Użyj standardowych czcionek

Ciekawe czcionki mogą sprawić, że blog będzie wyglądał bardziej kreatywnie, ale te czcionki mogą być również irytujące dla mobilnych czytelników bloga, ponieważ nie wszystkie urządzenia mobilne obsługują fantazyjne czcionki na komputery stacjonarne. Aby zobaczyć zawartość, użytkownicy urządzeń mobilnych będą musieli pobrać nowe czcionki na swoje telefony, co jest kłopotem, który dla wielu nie jest tego wart. Co więcej, nawet jeśli mają wstępnie zainstalowane wszystkie czcionki, niektóre bardziej kreatywne czcionki mogą być trudne do odczytania na smartfonie ze względu na mniejszy rozmiar.

Wybierz więc tradycyjne czcionki, takie jak Times New Roman, Verdana, Comic Sans MS, WildWest lub Bedrock. A także sprawdź czytelność czcionki, którą zdecydujesz się użyć, aby upewnić się, że tekst nie stanie się nieczytelny po wyświetleniu na mniejszym ekranie smartfona. Ogólna zasada jest taka, że ​​każdy tekst na stronie powinien mieć co najmniej 14 px, ponieważ w ten sposób tekst będzie wystarczająco duży, aby był czytelny nawet na urządzeniu mobilnym z bardzo małym ekranem.

7. Zminimalizuj zawartość na stronie

Gdy strona jest ładowana na dowolnym urządzeniu, czy to na komputerze, tablecie czy smartfonie, urządzenie pobiera całą zawartość strony. Zwykle nie powoduje to żadnych problemów, jeśli korzystasz z komputera, ale duże ilości danych mogą przytłaczać urządzenia mobilne. Aby tego uniknąć, należy zminimalizować ilość treści na każdej stronie, ponieważ dzięki temu Twój blog będzie działał na każdym urządzeniu mobilnym.

Zaleca się zmniejszenie zawartości strony poniżej 5 MB na stronę. Możesz łatwo sprawdzić rozmiar zawartości swojej strony w dowolnej przeglądarce. Wystarczy skorzystać z jednego z wielu narzędzi do sprawdzania rozmiaru stron internetowych, które są dostępne online. Jeśli przekracza 5 MB, zmniejsz ręcznie rozmiar i ilość tekstu, obrazów i innych elementów strony lub użyj fragmentów bloga, aby ułatwić odwiedzającym przeglądanie Twojego bloga.

8. Korzystaj z filmów z YouTube

Jeśli masz tendencję do zamieszczania wielu filmów w artykułach na swoim blogu, musisz pamiętać, że będą one wyglądać zupełnie inaczej na urządzeniu mobilnym niż na komputerze. Co więcej, niektóre urządzenia mobilne nie obsługują nawet niektórych formatów wideo, więc aby uniknąć sytuacji, w której użytkownik nie będzie mógł odtworzyć wideo w Twojej witrynie, użyj osadzonego YouTube. Kod osadzania, który YouTube zapewnia dla każdego z ich filmów, jest już responsywny, co oznacza, że ​​będziesz mógł oglądać wideo na prawie każdym urządzeniu i nie będziesz już musiał się stresować rozmiarami i formatami wideo.

Możesz uzyskać kod do osadzenia filmu z YouTube, klikając przycisk „Udostępnij”, który znajduje się pod przyciskiem „ Subskrybuj ”, a następnie kliknij kartę „ Osadź ” i skopiuj otrzymany kod do swojej witryny. I masz w swoim poście wideo o idealnym rozmiarze, nawet bez konieczności konwertowania lub dostosowywania go w inny sposób.

9. Zastąp linki przyciskami i menu, które można dotknąć

Często linki w witrynie są zbyt małe, aby użytkownik mobilny mógł łatwo i dokładnie dotknąć palcem. I to może być naprawdę denerwujące dla czytelnika bloga, gdy nie może dokładnie dotknąć treści, którą chce wyświetlić. Dlatego powinieneś zastąpić wszystkie linki na swojej stronie przyciskami o rozmiarze co najmniej 44 na 44 piksele.

Jeśli korzystasz z systemu CMS, takiego jak WordPress, możesz po prostu użyć wtyczek, aby utworzyć te przyciski. Przejdź do panelu sterowania CMS, znajdź odpowiednią wtyczkę, zainstaluj ją i postępuj zgodnie z instrukcjami, aby poprawnie z niej korzystać. Ale jeśli sam zakodowałeś stronę, możesz użyć jednego z tych darmowych generatorów przycisków linków, co pozwoli zaoszczędzić czas, który poświęciłbyś na samodzielne kodowanie przycisków.

10. Kontynuuj testowanie

Na koniec, gdy dokonałeś wszystkich ulepszeń i uważasz, że Twój blog jest tak przyjazny dla urządzeń mobilnych, jak to tylko możliwe, przetestuj go ponownie za pomocą narzędzia testowego Google lub innego narzędzia do testowania przyjaznego dla urządzeń mobilnych, które możesz znaleźć w Internecie. Jeśli teraz wszystko jest w porządku, a narzędzie zapewnia, że ​​Twój blog nie dostanie kary, ponieważ nie jest przyjazny dla urządzeń mobilnych, możesz się zrelaksować i dalej rozwijać swoją witrynę, tworząc świetne treści. Ale dla pewności sugerowałbym przetestowanie swojej witryny na wielu różnych urządzeniach.

Poproś znajomych lub członków rodziny, aby spojrzeli na Twojego bloga na swoich telefonach i tabletach. Przetestuj swoją witrynę z urządzeń z systemem Android i IOS, a także urządzeń, które mogą mieć zupełnie inny system operacyjny. I przeglądaj wszystkie główne strony swojego bloga na tych urządzeniach. Tylko testując w prawdziwym życiu, czy Twój blog jest przyjazny dla urządzeń mobilnych, możesz mieć pewność, że Twoja witryna jest rzeczywiście łatwa do przeglądania i odczytywania ze wszystkich gadżetów.

Przyjazność mobilna to nie tylko ładny projekt witryny, ale także poprawa doświadczenia użytkownika w witrynie. Dlatego, gdy uczynisz swojego bloga bardziej przyjaznym dla urządzeń mobilnych, więcej osób będzie chciało wrócić do Twojej witryny, ponieważ będzie ona łatwa do przeglądania i zrozumienia. A ponieważ liczba osób, które używają telefonów komórkowych jako podstawowych urządzeń do surfowania po Internecie, rośnie z każdym kolejnym rokiem, tylko w Twoim najlepszym interesie jest upewnienie się, że Twoja witryna jest przyjazna dla tych użytkowników smartfonów i wyświetla treści je w wygodny i czytelny sposób.