Bei Online­hil­fe oder mehr­spra­chi­gen Web­sites kommt häu­fi­ger vor, dass Bil­der nicht nur mit Text (bei­spiels­wei­se Num­mern) ver­se­hen wer­den müs­sen, son­der auch in meh­re­ren Spra­chen iden­tisch aus­se­hen sol­len. Klingt nach Mühe und viel Arbeit? Nicht, wenn man weiß, wie’s schnel­ler geht.

Neh­men wir das Bei­spiel einer Online­hil­fe. Dar­in sol­len Menüs abge­bil­det wer­den, in denen der Benut­zer auf bestimm­te Stel­len hin­ge­wie­sen wer­den soll. Bei­spiels­wei­se But­tons. Und jetzt kommt Trick Num­mer 1:

  1. Im Datei­sys­tem für jede Spra­che einen Ord­ner anlegen.
  2. Den Screen­shot in der Quell­spra­che erstellen.
  3. Das Bild im Datei­sys­tem in dem Ord­ner für die jewei­li­ge Spra­che ablegen.
  4. Das Bild in Illus­tra­tor plat­zie­ren. Es wird eine Ver­knüp­fung erstellt in den Sprachordner.
  5. Die Illus­tra­tor-Datei eine Ord­ner­ebe­ne höher able­gen und den Text in der Gra­fik in einer neu­en Ebe­ne anle­gen (mit Pfei­len oder Lini­en, sie­he Bei­spiel unten).
  6. Das Bild als PNG in den sprach­be­zo­ge­nen Gra­fik­ord­ner expor­tie­ren – am bes­ten unter einem neu­en Namen.
  7. Spra­che wech­seln, den glei­chen Screen­shot erstel­len und im ent­spre­chen­den Ord­ner ablegen.
  8. Die Illus­tra­tor-Datei öff­nen und eine neue Ebe­ne anle­gen unter­halb der Textebene.
  9. Den zwei­ten Screen­shot plat­zie­ren. Da die Text­ebe­ne höher liegt, wer­den die glei­chen Stel­len wie im ers­ten Screen­shot angezeigt.
  10. Das Bild wie­der als PNG spei­chern – dies­mal mit dem glei­chen Namen im dazu gehö­ren­den Sprachordner.

Das lässt sich jetzt für alle iden­ti­schen Screen­shots wie­der­ho­len. Die Arbeit mit der Text­ebe­ne hat man nur einmal.

Bei­spiel für Num­mern in Illustrator.

Und wo bleibt Photoshop?

Es geht aber noch einen Tritt schnel­ler: Falls Sie im Screen­shot Ein­trä­ge (bei­spiels­wei­se Text­fel­der) ange­legt haben, die Sie nicht in jeder Spra­che wie­der­ho­len möch­ten, benö­ti­gen Sie Photoshop.

  1. Die Ein­trä­ge in der Quell­spra­che anlegen.
  2. Den Screen­shot in der Quell­spra­che erstel­len
  3. Die Text­fel­der mit Pho­to­shop aus­schnei­den und an der glei­chen Stel­le in einer neu­en Ebe­ne plat­zie­ren („Pas­te in place“).
  4. Das Bild als Pho­to­shop-Datei in der Ebe­ne höher als die Sprach­ord­ner spei­chern und in Illus­tra­tor platzieren.
  5. Neu­en Ebe­ne anle­gen und mit Num­mern und Text füllen.
  6. Das Bild wie­der in den ent­spre­chen­den Ord­ner als PNG exportieren.
  7. Spra­che wech­seln, glei­chen (lee­ren) Screen­shot erstellen.
  8. Pho­to­shop-Datei öff­nen, neu­en Screen­shot unter­halb der aus­ge­schnit­te­nen Fel­der ein­set­zen. — Jetzt sind die Text­fel­der plötz­lich gefüllt.
  9. Spei­chern und mit Illus­tra­tor öff­nen. Durch die Ver­knüp­fung erkennt Illus­tra­tor, die Ände­run­gen in der Pho­to­shop-Datei und aktua­li­siert die Ansicht automatisch.
  10. Und wie­der able­gen als PNG im jewei­li­gen Sprachordner.

Fazit: Durch die Kom­bi­na­ti­on aus Ebe­nen und Ver­knüp­fun­gen las­sen sich mit wenig Auf­wand iden­ti­sche Screen­shots in meh­re­ren Spra­chen erstel­len. Und falls die Screen­shots aktua­li­siert wer­den müs­sen: Das schreckt jetzt auch nicht mehr.