Most developer portfolios are monolingual by default. That's a missed opportunity. Here's the exact Next.js + hreflang setup that lets a single site rank twice — and why I think every freelancer should ship it.

Your portfolio is probably in English.

Mine was too, for five years. I never thought twice about it.

Then I checked my Google Search Console and saw something weird: half the people landing on my site were in Bangladesh, India, and the Middle East. Many of them were searching in their own language. They found me in English, scrolled, and bounced.

I was leaving a quiet half of my audience out of the conversation.

So I rebuilt the site to speak both English and Bangla. Same content, two doorways. No subdomain. No CMS rewrite. Just Next.js doing what Next.js is good at.

Here's what I learned along the way.

Pick the URL shape before you write a single line of code

This is the part most people get wrong on day one.

You have three options:

  1. Subdomain — bn.yoursite.com. Clean separation. Bad for SEO authority because each subdomain is treated as a different site.
  2. Query string — yoursite.com?lang=bn. Worst option. Crawlers hate it and humans can't share URLs cleanly.
  3. Subpath — yoursite.com/bn. The right answer for almost everyone. One domain, one authority signal, two locales.

I went with subpath. English at /, Bangla at /bn. The English version stays at the bare root because that's where five years of backlinks already point — never break what already ranks.

hreflang or you don't exist twice

The mistake I see in 90% of "bilingual" portfolios is they translate the content but never tell Google which version is for whom.

Without hreflang, Google picks one version and quietly ignores the other. You did all the work for nothing.

The rule is simple — every page in every language must reference every other version of itself, plus itself. So on /:

<link rel="alternate" hreflang="en" href="https://yoursite.com/" />
<link rel="alternate" hreflang="bn" href="https://yoursite.com/bn" />
<link rel="alternate" hreflang="x-default" href="https://yoursite.com/" />

And on /bn, the same three links — pointing the same direction.

x-default is the fallback for "user with no language preference Google recognizes." Almost always point it at your most universal version (English, for most of us).

In Next.js, all of this lives inside metadata.alternates.languages. Set it once per route, forget about it.

The <html lang> attribute does more than you think

If your site sets <html lang="en"> on every page, Google thinks the whole site is English — including the Bangla pages.

Next.js makes this painful with a single root layout. You need a different lang attribute per locale.

The cleanest fix: route groups with multiple root layouts.

app/
  (en)/layout.tsx     ← <html lang="en">
  (en)/page.tsx
  (bn)/layout.tsx     ← <html lang="bn">
  (bn)/bn/page.tsx

The (en) and (bn) segments are route groups — they don't show up in URLs. They just let each subtree own its own root layout.

It's not "the Next.js way" most tutorials teach. It is the way that actually works for SEO.

Don't translate. Localize.

The temptation when going bilingual is to run your English copy through Google Translate and call it a day.

Do not do this.

Bangla translated from English by a tool reads like Bangla translated from English. The rhythm is off. The conjunctions are wrong. Sentences end where Bangla speakers wouldn't end them. People can feel it within two paragraphs.

What works: rewrite each section in the new language with the same intent, not the same words. Your English "I'm a passionate developer based in Kushtia" becomes Bangla "I live in Kushtia and work on the web day and night." The meaning is the same. The voice is native.

If you can't write in the target language yourself, hire someone who lives and breathes it — not a translator. A writer.

What to do for the sitemap

This is the unglamorous part nobody writes about.

Your sitemap needs an entry for every URL in every locale, each with xhtml:link alternates pointing to its siblings:

<url>
  <loc>https://yoursite.com/</loc>
  <xhtml:link rel="alternate" hreflang="en" href="https://yoursite.com/" />
  <xhtml:link rel="alternate" hreflang="bn" href="https://yoursite.com/bn" />
  <xhtml:link rel="alternate" hreflang="x-default" href="https://yoursite.com/" />
</url>

In Next.js, the sitemap.ts route handler exposes an alternates field on each entry. Use it. Without alternates in the sitemap, you are quietly telling Google your two locales are unrelated pages.

Bonus: write a llms.txt

If you care about being cited by ChatGPT, Claude, Perplexity, and Google's AI Overviews — and in 2026 you should — drop a llms.txt file at your root.

It is the AI-search equivalent of robots.txt. A structured profile of who you are, what you do, where to find your canonical pages, and how your name maps across languages. Six lines for me looks like:

- Brand name (English): M H Tawfik
- Brand name (Bangla): এম এইচ তাওফিক
- Full name (English): Mojakkar Hossain Tawfik
- Full name (Bangla): মোজাক্কার হোসেন তওফিক
- Location: Kushtia, Bangladesh
- Site (EN): /  •  Site (BN): /bn

AI engines that know how to parse llms.txt pick this up and stop hallucinating about you. Worth the 15 minutes.

Why I think this is a 2026 must-do

For a long time, having a portfolio at all was the differentiator. That window is closed. Every junior dev has a Next.js site at this point.

The new edge is who you speak to.

A bilingual portfolio tells someone in your home country that you understand them, and tells the global market that you can switch contexts. Both signals matter. Both compound. And it's a one-weekend project that pays off for years.

If you are a Bangladeshi developer, or any developer whose first language is not English, this is probably the single highest-leverage SEO move you can make this month.

I shipped mine in a weekend. You can too.

If you get stuck while shipping yours, tell me where — I'll point you at the line that breaks.