
The "Buy now" button in the mockup looks neat. In the German version it becomes "Jetzt kaufen," while in Finnish the same action may need a word three times as long, and the label spills outside its boundaries. This happens in almost every project where the design was drawn for a single language.
The problem isn't poor translation but the nature of languages themselves: the same idea takes up a different amount of space depending on the language. If you account for this at the outset, there will be noticeably fewer fixes after translation. Let's look at how much text length changes, why it happens, and how to design with a margin of safety.
How Much Text Length Varies Across Languages
English is considered one of the most compact languages for written text, which is why mockups are most often designed for it. When translated into Russian, German, French, or Spanish, the text usually grows, often by 20–30%. The exact figure depends on the subject and style, so it can't be treated as a rule. It is a planning benchmark, not a guarantee.
Short strings grow more than long ones. In a large paragraph the expansion is barely noticeable, but a word on a button or a menu item can grow one and a half to two times. A short phrase has no room to spare, and the translator must preserve both the meaning and a natural sound. That's why the interface suffers first.
The reverse also happens. Chinese, Japanese, and Korean take up noticeably less horizontal space, but characters need sufficient size and greater line height. Arabic and Hebrew are written right to left, so the layout has to be mirrored. The "growth" of text therefore concerns not only width but also line height and writing direction.
Why It Happens: Grammar, Long Words, and Polite Forms
In many languages grammar is expressed through endings and function words that English has almost none of. Russian needs cases, gender, and agreement; French and German need articles; Spanish needs agreement in gender and number. The English "New messages" becomes "Новые сообщения" in Russian, and each ending adds letters. These small additions add up to the extra percentage in length.
German and Finnish fuse concepts into a single long word. Instead of three separate words, you get one word of more than twenty letters. Breaking it across lines without losing readability is hard, and for a narrow button this is the worst case, because the string cannot be split. Besides, many terms simply have no short equivalent.
Politeness also affects length. Imperative phrases like "Get started" sound neutral in English, but a literal rendering in other languages can sound abrupt or unclear. The translator chooses a softer or more descriptive formula, and it turns out longer. This is exactly why professional translation is not a matter of substituting words from a dictionary: the meaning and tone must be conveyed the way they are expected in the reader's language.
Buttons, Menus, and Mobile Screens
The interface is the most vulnerable spot. Fixed-width buttons, bottom navigation tabs, and table labels are sized for a specific number of characters. On mobile screens the margin is even smaller: a bottom bar sometimes holds only four or five tabs. When an interface is translated, such elements break first.
The typical failures are familiar to many. Text gets cut off with an ellipsis and loses its meaning, overlaps an adjacent icon, or wraps onto a second line and inflates the button's height. For example, the label "Settings" in the German version becomes "Einstellungen," which may not fit even in small type on a narrow tab. Reducing the font size to make room is not a good idea, because readability suffers, especially on a small screen.
There are also less obvious problems. In the message "You have 3 new messages," the word changes form depending on the number, and different languages handle this differently. Dates, currencies, and word order also vary, so phrases assembled in code from fragments often break. Developers are better off storing phrases whole and leaving the translator room to change word order. This should be agreed upon before localization begins, not after the first user complaints.
Packaging, Banners, and Print
Print materials cannot be corrected once the run is out. If a label on a box doesn't fit the designated panel, the entire batch has to be reprinted. Labels are especially risky, since the space is tightly constrained by the shape of the packaging. That's why text length should be checked before the file is sent to print.
Advertising banners and slogans suffer differently. A short slogan is often built on wordplay and rhythm, and a precise translation can end up twice as long as the original. A headline that took one line on the banner suddenly needs three. Sometimes the only sensible solution is not to translate word for word but to find another short version with the same meaning.
Packaging also has a mandatory component. Ingredients, warnings, and instructions often must appear in the language of the country of sale, and they cannot be shortened for the sake of appearance. If a single label carries several languages, the area is divided between them, and the font must not drop below the permitted size. Requirements differ from country to country, so it's best to clarify them in advance. Making room for text in all languages is easier to build into the design from the start than to sacrifice the composition later.
How to Design with a Margin
The basic rule is simple: allow room for expansion. For interfaces, a common practice is to allow 30–40% more than the English text, and to allow even more for the shortest labels. This is a working recommendation, not a standard, and it should be refined for the specific languages in the project. It is best to test the mockup on the most demanding languages, such as German or Finnish.
Choose flexible components. Buttons that grow with their content, automatic line wrapping, responsive layouts, and relative units for spacing protect the design without manual adjustments. Don't bake text into images: a label inside a picture would have to be redrawn for every language. The font should also support all the required alphabets, including Cyrillic, Greek, and diacritical marks.
Finally, don't leave the translator without context. The word "Book" can mean either "a book" or "to reserve," and the lengths of these options differ. Provide screenshots, character limits, and notes for each string. Professional translation can tighten wording without losing meaning, but the translator needs to know the boundaries to do so.
Checking Mockups After Translation
Even with a good margin, checking is essential. Layout of a translation is a separate stage: review every screen and every page in all languages, not just the table of strings. Pay special attention to the longest strings, narrow blocks, and line breaks. If a native speaker reviews the mockup, they will spot both a cut-off phrase and an awkward line break.
Agree in advance on what to do about overflow: shorten the wording, change the component, or increase the space. When ordering translation online, tell the providers the format and constraints right away, and the text will fit the layout better. Planning for extra space is cheaper than fixing a finished print run or release.
Read also:
Need a professional translation? Order it online: choose the languages, upload your file and see the price in a few minutes.
Necessary cookies keep sign-in and preferences working. Optional Google Analytics and Yandex Metrica stay off until you allow analytics. You can use the site with necessary cookies only and change your choice later.