I shipped 174 pages across 7 languages. Two were silently broken.

The reporter embarked on an SEO task that soon turned into six hours of debugging. The setup involved a SaaS site with a service catalog, where prices were stored in a database and required server rendering. A crawler hitting an empty div with id="app" saw no content worth indexing. One renderer was built and wired to seven language configurations, with each language having a homepage, a pricing page, and 15 platform pages. The site's sitemap amounted to around 174 URLs.

The reporter initially felt good about the number of URLs. However, after checking the hreflang cluster, they discovered two major issues. Firstly, the hreflang declarations were not independent but rather a cluster. If one page declared alternatives as zh, en, and x-default while another declared all seven languages plus x-default, the cluster contradicted itself.

Google's behavior in such a situation was to ignore the conflicting set. The fix was simple: generate hreflangs from a single array, use it everywhere, and include the current language in its own list.

Secondly, the Arabic language version was missing the dir="rtl" attribute, causing the text to appear left-to-right instead of right-to-left. The reporter had written code for RTL support, but a mistake in the implementation led to the attribute being omitted. The fix involved creating a function to set the language and direction, ensuring that the correct attributes were added to the HTML tag.

The reporter also addressed CSS issues, realizing that Arabic required specific styling adjustments, such as margin and text alignment. By using logical properties, they were able to achieve the desired results without adding extra overrides. The final check involved verifying that Googlebot correctly interpreted the Arabic language and direction settings, as well as ensuring that real content was present for the crawler.