{"id":1554,"date":"2015-02-20T10:53:53","date_gmt":"2015-02-20T08:53:53","guid":{"rendered":"http:\/\/korsika.equinux.net\/?p=1554"},"modified":"2024-01-23T19:40:24","modified_gmt":"2024-01-23T17:40:24","slug":"mega-backgrounds-fuer-deine-mails-newsletter-mit-vollflaechigen-hintergruenden-kreieren","status":"publish","type":"post","link":"https:\/\/www.maildesigner365.com\/de\/mega-backgrounds-fuer-deine-mails-newsletter-mit-vollflaechigen-hintergruenden-kreieren\/","title":{"rendered":"MEGA Backgrounds f\u00fcr deine Mails: Newsletter mit vollfl\u00e4chigen Hintergr\u00fcnden kreieren"},"content":{"rendered":"[vc_row type=\"in_container\" full_screen_row_position=\"middle\" column_margin=\"default\" column_direction=\"default\" column_direction_tablet=\"default\" column_direction_phone=\"default\" scene_position=\"center\" text_color=\"dark\" text_align=\"left\" row_border_radius=\"none\" row_border_radius_applies=\"bg\" overlay_strength=\"0.3\" gradient_direction=\"left_to_right\" shape_divider_position=\"bottom\" bg_image_animation=\"none\"][vc_column column_padding=\"no-extra-padding\" column_padding_tablet=\"inherit\" column_padding_phone=\"inherit\" column_padding_position=\"all\" background_color_opacity=\"1\" background_hover_color_opacity=\"1\" column_shadow=\"none\" column_border_radius=\"none\" column_link_target=\"_self\" gradient_direction=\"left_to_right\" overlay_strength=\"0.3\" width=\"1\/1\" tablet_width_inherit=\"default\" tablet_text_alignment=\"default\" phone_text_alignment=\"default\" column_border_width=\"none\" column_border_style=\"solid\" bg_image_animation=\"none\"][vc_column_text]<strong>Mit vollfl\u00e4chigen Hintergr\u00fcnden kannst du in jeder Mailbox cool performen.<\/strong> Viele Design Ideen aus Mail Designer geben dir f\u00fcr diesen Style bereits einen Vorgeschmack, wie solche Mails wirken.\u00a0Mit Mail Designer und Mail Designer Pro kannst du diesen Newsletter-Style mit wenigen Handgriffen selbst gestalten.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-41099\" src=\"https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-1024x891.jpg\" alt=\"\" width=\"1024\" height=\"891\" srcset=\"https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-1024x891.jpg 1024w, https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-300x261.jpg 300w, https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-768x668.jpg 768w, https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-1536x1336.jpg 1536w, https:\/\/data.equinux.com\/com.equinux.wordpress\/uploads\/sites\/4\/2015\/02\/Bildschirmfoto-2024-01-23-um-18.32.02-2048x1782.jpg 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p><!--more--><\/p>\n<p><strong>R\u00fcckendeckung: Ab in den Hintergrund<\/strong><br \/>\nSuche dir eine Mail-Vorlage mit Hintergrund-Bild aus oder beginne \u201efrom Scratch\u201c mit einem neuen Design.<br \/>\nDurch einen Klick auf das Farbroller Symbol landest du im Hintergrund-Modus. Hier kannst du den Hintergrund f\u00fcr den inneren Bereich sowie den \u00e4u\u00dferen Bereich deines Newsletters bestimmen.<br \/>\nFalls im inneren Bereich bereits ein Hintergrund definiert ist, klicke in diesen Bereich und l\u00f6sche dort den Inhalt.<\/p>\n<p>Um ein Hintergrundbild komplett \u00fcber den inneren und den \u00e4u\u00dferen Bereich zu legen, musst du dein Bild auf den \u00e4u\u00dferen Bereich ziehen. Das klappt auch, wenn du nicht im Hintergrund-Modus bist.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Dein Hintergrundbild<\/strong><br \/>\nDie besten Ergebnisse erh\u00e4ltst du, wenn du deine Hintergrund-Bilder etwas zugeschnitten hast. Mail Designer zentriert die Bilder in deinem Newsletter-Layout. Damit die Bilder optimal im Layout sitzen, sollten sie in etwa eine <strong>Breite von 1.600px und ca. 2.400px L\u00e4nge<\/strong> (je nach dem, wie lang du deinen Newsletter planst) aufweisen.<br \/>\nSo bleibt etwas Spiel in der Inbox und deine Empf\u00e4nger k\u00f6nnen das Mail-Fenster aufziehen und verschieben ohne gleich an die Bildgrenze zu sto\u00dfen.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Dir fehlen Bilder? Hier einige Tipps<\/strong><br \/>\nIm Netzt gibt es viele Image-Sammlungen, die dir lizenzfreie Bilder zur Verf\u00fcgung stellen. Beispielsweise auf <a href=\"https:\/\/www.pexels.com\/de-de\/\" target=\"_blank\" rel=\"noopener\">pexels.com<\/a>\u2013 vergiss aber nicht am Ende deines Newsletters die Quellenangabe des Fotografen anzugeben.<br \/>\nHast du dein Image platziert, kannst du wieder in den Layout-Modus wechseln.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Bessere Lesbarkeit<\/strong><br \/>\nAuch farbige farbige Hintergr\u00fcnde von Textbl\u00f6cken kannst du einfach l\u00f6schen (Klick in den Bereich, dann l\u00f6schen mit der R\u00fcckschritt-Taste \/ oder via rechter Maustaste). Achte allerdings darauf, dass deine Textfarbe sich immer lesbar vom Hintergrund abhebt. Auch dann, wenn du das Fenster mit dem Inhalt gro\u00dffl\u00e4chig verschiebst.<\/p>\n<p>F\u00fcr bessere Lesbarkeit kannst du dir auch mit den Formen Overlays hinter deine Texte positionieren.<\/p>\n<ul>\n<li>Einfach eine Form in dein Layout ziehen,<\/li>\n<li>dann das Ganze schrittweise nach hinten verschieden<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p><strong>Transparenz:<\/strong> Auf Wunsch kannst du dabei auch die Deckkraft deiner Fl\u00e4chen regeln. Es funktioniert aber nur in einem Bildbereich eines Layoutblocks. Benutzt du Layout-Bl\u00f6cke mit Texten, hast du dagegen die M\u00f6glichkeit dir separate Text-Hintergr\u00fcnde einf\u00e4rben.<\/p>\n<p><strong> Mobilbereich anpassen<\/strong><br \/>\nIn der Mobilansicht musst du dein Design umstrukturieren, um auch hier einen guten Bildeindruck zu erzielen. Am besten gehst du so vor:<\/p>\n<ul>\n<li>Entkopple zu Beginn alle Layout-Bl\u00f6cke,<\/li>\n<li>positioniere als erste Item einen Layoutblock mit Bild,<\/li>\n<li>ziehe dein Hintergrund-Image als Aufmacher hier hinein<\/li>\n<li>und positioniere dann einen spannenden Bildausschnitt.<\/li>\n<\/ul>\n<p>Jetzt kannst du deinem Aufmacher noch Headlines, Texte und St\u00f6rer hinzuf\u00fcgen. Deine weiteren Inhalte ordnest du St\u00fcck f\u00fcr St\u00fcck als flie\u00dfendes Design an.<\/p>\n<p><em>Wie immer \u2013 mach\u2019 zum Abschluss den Check \u00fcber den Mobil-Simulator und nat\u00fcrlich mit einem Testversand.<\/em>[\/vc_column_text][\/vc_column][\/vc_row]\n","protected":false},"excerpt":{"rendered":"<p>[vc_row type=&#8221;in_container&#8221; full_screen_row_position=&#8221;middle&#8221; column_margin=&#8221;default&#8221; column_direction=&#8221;default&#8221; column_direction_tablet=&#8221;default&#8221; column_direction_phone=&#8221;default&#8221; scene_position=&#8221;center&#8221; text_color=&#8221;dark&#8221; text_align=&#8221;left&#8221; row_border_radius=&#8221;none&#8221; row_border_radius_applies=&#8221;bg&#8221; overlay_strength=&#8221;0.3&#8243; gradient_direction=&#8221;left_to_right&#8221; shape_divider_position=&#8221;bottom&#8221; bg_image_animation=&#8221;none&#8221;][vc_column column_padding=&#8221;no-extra-padding&#8221; column_padding_tablet=&#8221;inherit&#8221; column_padding_phone=&#8221;inherit&#8221; column_padding_position=&#8221;all&#8221; background_color_opacity=&#8221;1&#8243; background_hover_color_opacity=&#8221;1&#8243; column_shadow=&#8221;none&#8221; column_border_radius=&#8221;none&#8221; column_link_target=&#8221;_self&#8221; gradient_direction=&#8221;left_to_right&#8221; overlay_strength=&#8221;0.3&#8243; width=&#8221;1\/1&#8243; tablet_width_inherit=&#8221;default&#8221; tablet_text_alignment=&#8221;default&#8221;&#8230;<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[125,98,2908,3184,3553],"tags":[3245,9,176,3173,3246,1995,116,3247,3248,94,95,3249,3138,3254,3255,2935,3256,2938,2942,2942,198,3250,3251,102,3252,103,21,3253],"class_list":["post-1554","post","type-post","status-publish","format-standard","category-layout-de","category-mail-designer-2","category-newsletter-academy-2-de","category-tutorials-de-de","category-whats-new","tag-aussehen-2","tag-aussehen","tag-bilder","tag-bilder-2","tag-design","tag-halloween-email-subject-line","tag-digital","tag-digital-2","tag-digitale-kommunikation-2","tag-digitale-kommunikation","tag-digitales-marketing","tag-digitales-marketing-2","tag-email-de-2","tag-layout-de-2","tag-mail-de-2","tag-marketing-de-de","tag-mobil-de","tag-newsletter-de-2","tag-newsletters-de-2","tag-organisiert","tag-organisiert-2","tag-technik-2","tag-technik","tag-technik-news-2","tag-technik-news","tag-tools-de","tag-tools"],"_links":{"self":[{"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/posts\/1554","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/comments?post=1554"}],"version-history":[{"count":1,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/posts\/1554\/revisions"}],"predecessor-version":[{"id":41102,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/posts\/1554\/revisions\/41102"}],"wp:attachment":[{"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/media?parent=1554"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/categories?post=1554"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.maildesigner365.com\/de\/wp-json\/wp\/v2\/tags?post=1554"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}