Prepare your website before you convert it to an app

Test width

360px

Target

~2s first screen

Avoid

Pop-up stacks

Tool

Readiness score

1. Layout at 360px

Open your site in Chrome's device mode at 360px wide, then on a real low-end phone. Look for horizontal scrolling, tables that overflow, buttons under 44px, text under 16px and fixed headers that eat a third of the screen.

2. Speed on mobile data

The first screen of the app is your start URL. Make it light:

• Compress hero images (WebP/AVIF) and lazy-load the rest.
• Defer chat widgets, heatmaps and marketing pixels until after the page is usable.
• Remove render-blocking fonts you don't need.

3. Navigation for thumbs

Websites hide navigation in a hamburger at the top-left — the hardest place to reach. Either add a native bottom tab bar in the converter, or a sticky bottom nav in your CSS shown only in the app.

4. Logins that work in an app

Google blocks its sign-in inside embedded WebViews (error 403 disallowed_useragent). Make sure email + password or one-time codes are available, and hide the Google button inside the app if you can't add a Custom Tab flow.

5. Kill the pop-up stack

A first-time app user may see: cookie banner → newsletter pop-up → “get our app” banner → chat bubble. Inside your own app, at least two of those are absurd. Detect the app and remove them.

The app-mode snippet

Converted apps identify themselves in the user agent (; wv) for Android WebViews). Add this to your site's <head>:

<script>
if (/; wv\)/.test(navigator.userAgent))
  document.documentElement.classList.add('in-app');
</script>
<style>
.in-app .app-banner, .in-app .newsletter-popup { display: none !important; }
</style>

Now any CSS rule starting with .in-app applies only inside the app — no rebuild needed to tweak it.

6. Legal pages

Google Play needs a privacy policy URL. Make sure yours mentions the app, analytics and any push provider.