Broken on Mobile: Why It Happens and What to Do About It

You pull out your phone to show someone your website, and there it is. The text is overlapping. The button is half off the screen. Your beautiful headshot is cropped so awkwardly you barely recognize yourself. And you feel that familiar sinking feeling, the one where you smile and say “oh, it looks better on a computer” while quietly dying inside.

You’re not alone in this. A lot of the women I work with have had this exact moment. They built a website they were proud of, or they paid someone to build one, and it looked great on a laptop. But somewhere along the way, nobody checked how it looked on a phone. Or it used to look fine on mobile and then something shifted, and now it’s a mess. Either way, it’s that quiet embarrassment that keeps you from sharing your link with confidence. And that’s a real loss, because you deserve to feel proud every single time you hand someone your website.

Let’s talk about why this happens, what’s actually going on behind the scenes, and what you can do about it, without needing to learn code or become a developer overnight.

Most People Are Looking at Your Site on Their Phones

Here’s something I remind my clients of all the time: the majority of people visiting your website are doing it from their phones. Not a laptop. Not a desktop monitor. A phone screen that’s roughly the size of a playing card.

Think about how you browse the internet yourself. You’re scrolling on your phone in the morning with your coffee. You’re tapping links from Instagram or Facebook on your phone. Someone texts you a website, you open it on your phone. That’s how your potential clients are finding you, too.

So when your site looks great on a big screen but falls apart on a small one, the version most people are actually seeing is the broken one. That’s not meant to make you feel bad. It’s meant to help you see the opportunity here. Fixing your mobile experience can make a bigger difference than almost any other single change you could make to your site.

Why Websites Break on Mobile

This is the part where I put on my biggest-geek-who-speaks-human hat. There are real, specific reasons why a website that looks fine on your computer can look terrible on your phone. And none of them are your fault.

The Site Was Designed Desktop-First (and Mobile Was an Afterthought)

This is the most common thing I see. Someone, whether it was you or a designer, built the website while looking at it on a nice big screen. Everything was placed exactly where it should go. Columns lined up perfectly. Text spacing looked gorgeous. And then someone said “okay, it’s done” and never really checked how all of that translated to a 6-inch screen.

The truth is, designing for desktop and designing for mobile are two different tasks. On a desktop, you have room for side-by-side columns, large images, and horizontal navigation menus. On a phone, everything has to stack vertically, images need to resize, and menus need to collapse into something tappable. If those adjustments aren’t made deliberately, things overlap, get cut off, or just look wrong.

The Builder or Theme Doesn’t Handle Responsiveness Well

“Responsive design” is just a fancy term that means your website automatically adjusts to fit whatever screen it’s being viewed on. Most modern website builders and themes claim to be responsive. And many of them are, mostly. But “mostly responsive” is like “mostly waterproof.” It works until it doesn’t.

Some themes handle basic text well but completely fumble with images, buttons, or custom layouts. Some builders let you do gorgeous things on desktop that simply don’t translate to mobile without manual adjustments. And some older themes were built before mobile browsing was as dominant as it is now, so their responsive features are clunky at best.

Things Were Customized Without Checking Mobile

This one sneaks up on people. You go in to update a heading, swap out a photo, or add a new section. It looks perfect on your laptop, so you hit publish. But you never pulled it up on your phone to check. And now that new section has text running off the edge, or a button that’s too small to tap, or an image that’s stretched in a weird way.

Every time you make a change on your website, it’s worth taking 30 seconds to check it on your phone before you walk away. I know that sounds like one more thing to remember. But it can save you from that awful moment of discovering it weeks later when a potential client is watching you pull it up.

Plugins or Add-Ons Are Conflicting

If you’re on WordPress or a similar platform, plugins can sometimes cause mobile display issues. A plugin might add a popup, a chat widget, a cookie notice, or a form that doesn’t play nicely with your theme’s mobile layout. You might not even realize that thing covering half your screen on mobile is coming from a plugin you installed months ago and forgot about.

What “Broken on Mobile” Actually Looks Like

Sometimes it’s obvious, like text literally overlapping other text. But sometimes it’s more subtle. Here are some things worth checking on your own phone right now:

  • Text that’s too small to read without pinching and zooming. If someone has to zoom in to read your homepage, that’s friction. And friction means they leave.
  • Buttons that are too small to tap, or too close together. If someone’s finger hits the wrong button, or they can’t tap the right one at all, they’re going to give up.
  • Images that are cropped weirdly, stretched, or so large they take forever to load. Your beautiful brand photo shouldn’t look like a funhouse mirror on mobile.
  • Horizontal scrolling. Your phone screen should only scroll up and down. If you have to scroll sideways to see all the content, something is off.
  • The menu is hard to find or hard to use. On mobile, your menu should be a simple hamburger icon (those three little lines) that opens a clean, easy-to-tap list.
  • Forms that are painful to fill out. If someone wants to contact you and the form fields are tiny or overlap each other, you’re going to lose that inquiry.
  • Pop-ups that take over the whole screen with no clear way to close them. This one drives me absolutely bananas. If someone can’t figure out how to close your popup on their phone, they’re closing your entire website instead.

How to Check Your Mobile Experience (Without Any Special Tools)

You don’t need fancy software for this. Here’s what I tell my clients:

Pull up your website on your actual phone. Not a simulator, not a preview tool, your real phone. Open your browser and type in your URL. Then go through your site the way a stranger would. Start at the homepage. Tap through to your about page, your services page, your contact page. Try to fill out your form. Look at every page.

Ask a friend to do the same thing on their phone. Different phones display things differently. What looks okay on your iPhone might look different on someone’s Android. Having a second pair of eyes, and a second phone, helps.

Check it in both portrait and landscape mode. Most people browse in portrait (holding the phone upright), but it’s worth a quick look the other way too.

Be honest about what you see. This is the hard part. If something looks off, it’s not a reflection of you or your skills. It’s just an opportunity to make things better. And most of these fixes are very doable.

What You Can Do About It

Okay, so you’ve checked your phone and things aren’t looking the way you’d hoped. Here’s the good news: most mobile issues are fixable. And many of them are simpler to fix than you might think.

Start With the Most Important Pages

You don’t have to fix everything at once. Start with the pages people land on most, which is usually your homepage, your about page, and your contact page. Those are the three that matter most when someone is deciding whether to reach out to you.

Adjust Your Images

Oversized images are one of the biggest culprits behind slow loading and weird mobile displays. Make sure your images are sized appropriately (for most website use, images don’t need to be wider than about 1500-2000 pixels), and make sure they’re compressed so they load quickly. If you’re not sure how to do this, it’s something I walk clients through, and it’s easier than you’d expect.

Simplify Your Layout

Those fancy multi-column layouts that look editorial and polished on desktop? They often cause headaches on mobile. If you’re finding that columns are stacking oddly or content is ending up in a strange order on your phone, consider simplifying. Sometimes fewer columns and a cleaner structure make the whole experience better on every device.

Check Your Font Sizes

Body text on mobile should be at least 16 pixels. Anything smaller and people are squinting. Headings should be large enough to be clear but not so large that a single word takes up three lines. There’s a balance, and it’s worth spending a few minutes adjusting.

Test Your Buttons and Links

Make sure every button is large enough to tap easily and that there’s enough space between tappable elements. The general rule is that a button should be at least 44 pixels tall to be comfortably tappable on a phone. And links in your text should have enough space around them that you’re not accidentally tapping the wrong one.

Get Help If You Need It

Listen, I’m a huge fan of learning and doing things yourself. That’s a big part of what I do at Fairy Godmother of Tech, helping women understand their websites so they can own them with confidence. But I also know when something is worth handing off.

If your mobile experience is a mess and you’re not sure where to start, or if you’ve tried to fix it and things keep breaking in new ways, that’s a great time to bring in some help. Sometimes 30 minutes with someone who knows what they’re looking at can save you weeks of frustration.

Your Website Should Work for You Everywhere

This connects back to something I believe deeply: your website should fit you. Not just how it looks, but how it works. If it only looks good on a laptop screen that sits on your desk, it’s not fully working for you. Because your clients aren’t sitting at your desk. They’re on their phones, at the soccer game, in the pickup line, on the couch at 10 PM finally having a minute to themselves.

Your site should look like you and feel like you no matter how someone finds it. And if it doesn’t right now, that’s not something to feel embarrassed about. It’s something to get excited about fixing, because the difference it makes is real. When you can hand someone your phone and say “here, check out my website” without that little knot in your stomach, that feeling of relief is worth everything.

I make it easy. And this is one of those things that feels overwhelming until you actually start, and then you realize it was more doable than you thought.

Frequently Asked Questions

How do I know if my website is broken on mobile?

The simplest way is to open it on your actual phone and tap through every page. Look for text that’s too small, buttons you can’t tap, images that look weird, or anything that requires scrolling sideways. If something feels clunky or hard to use, your visitors are feeling that too.

Can I fix mobile issues myself, or do I need a professional?

It depends on your comfort level and what platform your site is built on. Some fixes, like resizing images or adjusting font sizes, are straightforward. But if things are consistently breaking or you’re not sure what’s causing the issue, it’s worth having someone take a look. There’s no shame in asking for help.

My website used to look fine on mobile. Why did it change?

This happens more than you’d think. Updates to your theme, your website builder, your plugins, or even your phone’s browser can shift how things display. If you’ve also made changes to your content without checking mobile each time, those edits can add up. It’s usually not one big thing but a bunch of small things.

How often should I check my website on mobile?

I recommend checking it on your phone every time you make a change, even a small one. Beyond that, do a full walk-through of your site on your phone at least once a month. It only takes a few minutes and it keeps you from being surprised by something that’s been broken for weeks without you knowing.

If your website no longer feels like you, let’s talk about it – Book a Free Website Clarity Call with Beth →