Poznaj najnowsze informacje i statystyki z konferencji Google I/O 2019.
W wyszukiwarce Google dzieje się wiele świetnych rzeczy. Cieszymy się, że możemy o tym opowiedzieć podczas Google I/O 2019.
W tym poście skupimy się na sprawdzonych metodach zapewniania wykrywalności aplikacji internetowych JavaScript w wyszukiwarce Google, takich jak:
- Nowa wersja naszego niezawodnego Googlebota
- Potok Googlebota do skanowania, renderowania i indeksowania.
- Wykrywanie funkcji i obsługa błędów
- Strategie renderowania
- Narzędzia do testowania witryny w wyszukiwarce Google
- Typowe wyzwania i możliwe rozwiązania
- Sprawdzone metody SEO w aplikacjach internetowych JavaScript
Poznaj ponadczasowego Googlebota
W tym roku ogłosiliśmy długo wyczekiwanego nowego, ponadczasowego Googlebota.
Googlebot renderuje strony internetowe na potrzeby wyszukiwarki Google, korzystając teraz z nowoczesnego silnika Chromium. Będziemy też testować nowsze wersje Chromium, by aktualizować Googlebota. Zwykle robimy to w ciągu kilku tygodni od wydania stabilnej wersji Chrome. To ważne powiadomienie dla programistów stron internetowych i specjalistów ds. SEO, ponieważ wprowadzamy w Googlebotu ponad 1000 nowych funkcji, takich jak ES6+, IntersectionObserver i Komponenty sieciowe w wersji 1.
Jak działa Googlebot
Googlebot to potok składający się z kilku komponentów. Dowiedzmy się, jak Googlebot indeksuje strony w wyszukiwarce Google.
Proces ten wygląda tak:
- Googlebot umieszcza adresy URL w kolejce do indeksowania.
- Następnie pobiera adresy URL z żądaniem HTTP na podstawie budżetu indeksowania.
- Googlebot skanuje kod HTML w poszukiwaniu linków i umieszcza wykryte linki w kolejce do indeksowania.
- Następnie Googlebot umieszcza stronę w kolejce do renderowania.
- Tak szybko, jak to możliwe, instancja Chromium bez interfejsu graficznego renderuje stronę, co obejmuje wykonanie JavaScriptu.
- Googlebot używa wyrenderowanego kodu HTML do zindeksowania strony.
Na proces skanowania, renderowania i indeksowania może mieć wpływ konfiguracja techniczna. Na przykład długi czas odpowiedzi lub błędy serwera mogą wpływać na budżet indeksowania. W innym przypadku wymaganie JavaScriptu do renderowania linków może spowalniać ich wykrywanie.
Wykrywanie funkcji i obsługa błędów
Zawsze dostępny Googlebot ma wiele nowych funkcji, ale niektóre z nich nadal nie są obsługiwane. Jeśli polegasz na nieobsługiwanych funkcjach lub niewłaściwie obsługujemy błędy, Googlebot nie będzie w stanie wyrenderować ani zindeksować Twoich treści.
Przeanalizujmy poniższy przykład:
<body>
<script>
navigator.geolocation.getCurrentPosition(function onSuccess(position) {
loadLocalContent(position);
});
</script>
</body>
W niektórych przypadkach ta strona może nie wyświetlać żadnych treści, ponieważ kod nie obsługuje się, gdy użytkownik odmówi przyznania uprawnień lub gdy wywołanie getCurrentPosition zwróci błąd. Googlebot domyślnie odrzuca prośby o przyznanie uprawnień.
Jest to lepsze rozwiązanie:
<body>
<script>
if (navigator.geolocation) {
// this browser supports the Geolocation API, request location!
navigator.geolocation.getCurrentPosition(
function onSuccess(position) {
// we successfully got the location, show local content
loadLocalContent(position);
}, function onError() {
// we failed to get the location, show fallback content
loadGlobalContent();
});
} else {
// this browser does not support the Geolocation API, show fallback content
loadGlobalContent();
}
</script>
</body>
Jeśli masz problemy z indeksowaniem witryny JavaScript, zapoznaj się z naszym przewodnikiem rozwiązywania problemów.
Wybierz odpowiednią strategię renderowania dla swojej aplikacji internetowej
Obecnie domyślną strategią renderowania w przypadku aplikacji jednostronicowych jest renderowanie po stronie klienta. Wczytuje on kod JavaScript, który następnie generuje treść w przeglądarce.
Przyjrzyjmy się aplikacji internetowej, która wyświetla kolekcję grafik kotów i korzysta z JavaScriptu w całości w przeglądarce.
Jeśli możesz wybrać strategię renderowania, rozważ renderowanie po stronie serwera lub renderowanie wstępne. Wykonują one kod JavaScript na serwerze, aby generować początkową treść HTML, co może zwiększyć wydajność zarówno dla użytkowników, jak i robotów. Dzięki nim przeglądarka może zacząć renderować kod HTML, gdy dotrze on do sieci, co przyspieszy wczytywanie strony. Sesja renderowania na konferencji I/O i post na blogu o renderowaniu w internecie pokazują, jak renderowanie po stronie serwera i nawodnienie może poprawić wydajność i wygodę użytkowników aplikacji internetowych. Znajdziesz w nim też więcej przykładów kodu dla tych strategii.
Jeśli szukasz sposobu obejścia problemu, który pomoże robotom, które nie wykonują JavaScriptu, lub jeśli nie możesz wprowadzić zmian w bazie kodu frontendu, rozważ zastosowanie renderowania dynamicznego, które możesz wypróbować w ramach tego ćwiczenia z programowania. Pamiętaj jednak, że nie wpłynie to na wygodę użytkowników i wydajność takie jak w przypadku renderowania po stronie serwera lub renderowania wstępnego, ponieważ renderowanie dynamiczne powoduje wyświetlanie robotom tylko statycznego kodu HTML. To sprawia, że jest to raczej przerwa w działaniu niż strategia długoterminowa.
Przetestuj Twoje strony
Chociaż większość stron działa poprawnie z Googlebotem, zalecamy regularne testowanie stron, aby mieć pewność, że treść jest dostępna dla Googlebota i nie ma żadnych problemów. Istnieje kilka doskonałych narzędzi, które mogą Ci w tym pomóc.
Najprostszym sposobem na szybkie sprawdzenie strony jest test optymalizacji mobilnej. Narzędzie informuje nie tylko o problemach z dostosowaniem do komórek, ale także udostępnia zrzut ekranu przedstawiający treść w części strony widocznej na ekranie i wyrenderowany kod HTML widoczny dla Googlebota.
Możesz też sprawdzić, czy występują problemy z wczytywaniem zasobów lub błędy JavaScriptu.
Zalecamy potwierdzenie własności domeny w Google Search Console. Dzięki temu narzędziu do sprawdzania adresów URL możesz dowiedzieć się więcej o stanie skanowania i indeksowania adresu URL, otrzymywać wiadomości po wykryciu problemów przez Search Console oraz dowiedzieć się więcej o wydajności witryny w wyszukiwarce Google.
Aby uzyskać ogólne wskazówki i wskazówki dotyczące SEO, możesz skorzystać z audytów SEO w narzędziu Lighthouse. Aby zintegrować audyty SEO z pakietem testowym, użyj interfejsu wiersza poleceń Lighthouse lub bota Lighthouse CI.
Narzędzia te pomogą Ci identyfikować, debugować i naprawiać problemy ze stronami w wyszukiwarce Google. Powinny być częścią procesu programowania.
Kontaktuj się z nami i bądź na bieżąco
Aby być na bieżąco z ogłoszeniami i zmianami w wyszukiwarce Google, obserwuj naszego bloga dla webmasterów, kanał Google dla webmasterów w YouTube oraz konto na Twitterze. Aby dowiedzieć się więcej o SEO i JavaScript, zapoznaj się z naszym przewodnikiem po wyszukiwarce Google dla programistów i serią filmów na temat SEO w języku JavaScript.