Basically like the title says, PageSpeed Insights fails to find the title and meta description tags of my .NET 9.0 Blazor Server website.
I already read a bunch of documentation and forums and believe I applied what is recommended for a good SEO. My understanding is that one of the most important things is to have the pre-rendered by Blazor, otherwise search engine won't catch meta tags properly. Unless I'm missing something, my headers are pre-rendered.
I'm using MudBlazor, if that matters.
My code
Here is a partial code of my app that describes how the meta tags are set up:
Program.cs
WebApplicationBuilder builder = WebApplication.CreateBuilder(args);builder.Services .AddMudServices() .AddRazorComponents(options => options.DetailedErrors = builder.Environment.IsDevelopment()) .AddInteractiveServerComponents();// [...]WebApplication app = builder.Build();app.UseHsts();app.UseStaticFiles();app.UseAntiforgery();app.MapRazorComponents<Components.App>() .AddInteractiveServerRenderMode() .AddAdditionalAssemblies(typeof(MyLibrary.Shared._Imports).Assembly);// [...]app.Run();App.razor
<html><head><HeadOutlet @rendermode="InteractiveServer" /><link rel="preload" as="script" href="_framework/blazor.web.js" /><script src="_framework/blazor.web.js"></script><!-- [...] --></head><body><Routes @rendermode="InteractiveServer" /><!-- [...] --></body></html>Routes.razor
<Router AppAssembly="@(typeof(MyLibrary.MainLayout).Assembly)"><Found Context="routeData"><RouteView RouteData="routeData" DefaultLayout="typeof(MyLibrary.MainLayout)" /></Found><NotFound><LayoutView Layout="@(typeof(MyLibrary.MainLayout))"><p>Sorry, there's nothing at this address.</p></LayoutView></NotFound></Router>MainLayout.razor
@inherits LayoutComponentBase<MudLayout><!-- [...] --><MudMainContent><MudContainer MaxWidth="MaxWidth.Large" Class="mt-6 mb-6"><ErrorBoundary><ChildContent> @Body</ChildContent><ErrorContent><MudAlert Severity="Severity.Error" Variant="Variant.Filled">🚧 Oops!.</MudAlert></ErrorContent></ErrorBoundary></MudContainer></MudMainContent></MudLayout>Home.razor
@page "/"<!-- This is a custom component I made to help me setting keywords, title, description, OG meta tags, see below --><PageHead Title="My page title" Description="My page description"/><h1>My page</h1>PageHead.razor
<PageTitle>@Title</PageTitle><HeadContent><meta name="description" content="@Description" /><meta name="keywords" content="@Keywords" /><meta property="og:title" content="@(SocialTitle ?? Title)" /><meta name="twitter:title" content="@(SocialTitle ?? Title)" /><meta property="og:description" content="@(SocialDescription ?? Description)" /><meta name="twitter:description" content="@(SocialDescription ?? Description)" /></HeadContent>PageHead.razor.cs
public sealed partial class PageHead : ComponentBase{ [Parameter] public string Title { get; set; } = string.Empty; [Parameter] public string Description { get; set; } = string.Empty; [Parameter] public string Keywords { get; set; } = string.Empty; [Parameter] public string? SocialTitle { get; set; } = null; [Parameter] public string? SocialDescription { get; set; } = null;}Inspector
When looking at Chrome/Edge's DevTools, I can Preview and see the HTML sent by the server. From my understanding, this is the HTML rendered in the web browser before blazor.web.js starts. In other words, the pre-rendered HTML. And as you can see on the anonymized screenshot below, the <title> and description meta tags are presents.
Question
Does anyone have an understanding of why PageSpeed Insights don't find these tags and what am I missing here, please? My website got crawled 2 weeks ago and still can't find it in Google when I type its exact title.
Thanks !