🧹

How to Clean Up an HTML Table

Quick answer: A table pasted from Excel, Word, or Google Sheets carries fixed pixel widths, inline styles, and Office-specific classes on every cell. Clean it by removing those attributes while keeping the <table>, <tr>, and <td> structure intact — the goal is smaller markup with the same data, not a different shape.

Why does a pasted table carry so much extra markup?

Copy a range of cells out of Excel and every cell brings its own style attribute with it — a fixed pixel width, a border declaration, a font family, sometimes a background color, whether you set one or not. Word tables add the same MSO namespace tags and classes (MsoTableGrid, for one) that show up in any Word-pasted content. Google Sheets is more restrained but still wraps most cells in inline styles for column width and text alignment.

None of it is wrong, exactly. It's just describing formatting your site's CSS should already be handling, cell by cell, in a format that has nothing to do with how your site actually renders tables.

What should you keep, and what should you remove?

Keep the structure: <table>, <thead>, <tbody>, <tr>, <td>, and <th>. That's the actual shape of your data, and it's what a screen reader or a script parsing the table depends on. Remove the inline style attributes, the fixed pixel widths, and any Office-specific class values — none of that survives the trip to a real website with real CSS intact anyway, since your stylesheet is going to override most of it or clash with it.

This is a different job than the general-purpose HTML cleaner most tools default to, because most of those default to stripping table tags along with everything else — useful when a table was used purely for layout (a leftover from email-style HTML), wrong when the table is actually tabular data you want to keep.

Does the cleanup affect accessibility?

It can improve it. Tables pasted from Excel almost never use <th> for header rows — every cell comes through as a plain <td>, header row included, since Excel has no concept of a semantic table header. A screen reader has no way to announce "Price" when it reads the value in a row below it if the header cell isn't actually marked as a header.

Once you're cleaning the table anyway, it's worth converting the header row's cells to <th scope="col">. That one change is what lets assistive technology associate each data cell with its column label, and it costs nothing once you're already editing the markup.

Free Web Design & Marketing Guides. Practical guides on web performance, SEO, and getting more from your website — no email gate. Browse the Guides →

How do you clean a table without breaking it?

The safest approach parses the table as an actual document rather than pattern-matching the text, so it can walk every cell and remove attributes by name without touching the tags that define the table's shape. The HTML table cleaner on this site does exactly that: paste a table copied from Excel, Word, or Sheets, and it strips the inline styles, fixed widths, and Office classes while leaving every <table>, <tr>, and <td> exactly where it was. It's the same cleaning engine behind the Word to HTML Cleaner, scoped to leave table markup alone.

Frequently asked questions

Why is a table pasted from Excel so much bigger than it needs to be?

Excel writes a fixed pixel width, border, and font style into every single cell, plus Office-specific classes and namespace tags identical to what Word produces. A ten-row, three-column table can carry more markup in its formatting than in its actual data.

Should I remove the table tags to clean it up?

No. The table, row, and cell tags are the structure — removing them loses the data's shape entirely. What you want to remove is the inline styles, fixed widths, and classes wrapped around that structure, not the structure itself.

What's the difference between <td> and <th>?

<th> marks a header cell — a row or column label — and <td> marks a regular data cell. Using <th> for your header row (with a scope attribute of "col" or "row") is what lets screen readers announce which column a data cell belongs to.

HTML & CSS Cleaner Tool

As web developers and designers, we often encounter HTML files laden with inline styles—those pesky CSS rules embedded directly within HTML tags. While this approach might seem convenient at first, it can lead to bloated code, slower page load times, and maintenance headaches. Fear not! Our HTML and CSS Cleaner Tool comes to the rescue. Whether you’re a seasoned developer or just starting your web journey, understanding the importance of clean HTML and CSS is essential.

Built and maintained by Bootstrap Creative, a web design and marketing agency for B2B and manufacturing companies. · Blog