Email isn’t going away. It’s here to stay. In the same vein, email newsletters are becoming more popular (and more important) than ever. If you want to reach potential (and existing) customers, newsletters are a great way to spread your message to a large audience — whether it be upcoming projects, company news, or other business-related information., as well. In this tutorial, I’m going to walk you through how to create an email newsletter template in Adobe Photoshop, and we’re going to be using some common design patterns that I’ve found very effective. After you’ve completed the design process, you’ll be ready to code and style this template for your own business. Here’s a link to the post on. Painstakingly recreating an email message over and over just isn't the way to go when you need to let a lot of people know about a sale, memo or any other announcement. What Exactly Is an Email Newsletter? You’ve probably seen an email newsletter in your inbox before. It’s a cost-effective way for brands to communicate with their users or customers. If you’re a business like Sephora, for example, your newsletter invites customers to read about makeup tips, gives them a sneak peak at new products and probably offers a coupon. If you’re a content site, your newsletter includes an enticing headline for each new article to get users to click over to your site and read more. As long as you’re offering content that your customers or users find useful, you can leverage email newsletters to keep your brand fresh in their minds. The Purpose of an Email Newsletter The purpose of an email newsletter depends on your business. You can use it to drive sales through featured products and coupons. You can connect with customers through helpful tips and information. You can even boost your social following or traffic to your site. Just remember, good email campaigns are tailored to your needs as well as to the needs of your users. How Do Email Newsletters Work? A good email newsletter is not an update of company news. It’s a way to engage people and get them to take an action. It offers readers exclusive information they could not get anywhere else and then calls on them to click, buy or subscribe. To do that, your newsletter format should be simple and easy to read, yet attention-grabbing. How to Create a Newsletter Design in 7 Steps When it comes to email newsletter design and layout, there are some best practices to follow. Let’s look at the process, step by step. Getting Started: Newsletter Size and Dimensions As a general rule, it’s best to start your with a fixed width instead of a fluid/liquid layout. If you don’t know the difference,. This will prevent horizontal scroll bars, which pop up when you don’t use the full width of the screen. Design your newsletter with a width of around 550 to 600px and make sure the important information is within the top 300 to 500px. This is the size of an average “preview pane” in most desktop email clients. Best Software For Creating Html Emails In YahooSet Up the Document in Photoshop Open up Photoshop and create a new document with a width of 800px, a height of 1000px and a resolution of 72dpi. Be sure the color mode is RGB. For this newsletter example, I filled the background layer with a light gray. Then I created a container 600px wide to house the main content. I filled it with white and positioned it in the center of the document. Allow the User to View the Email in the Browser of their Choice I added this notice to the top of the newsletter using the, 10pt size: Email not displaying correctly? View it in your browser. It’s important to give people plenty of options for viewing your email newsletter. Some email clients might not download images by default. To improve accessibility, always include a link to view the email newsletter in a web browser. Create the Email Newsletter Header In this tutorial I’m creating an email newsletter called The Pet Digest to complement my new blog, The Pet Anthology. The goal is to keep interested readers up-to-date with the latest goings on through a weekly bundle. Since the branding on my blog has already been established, choosing the fonts, color, and graphics of my newsletter is easy. The above image is the header of the blog, which I also created in Photoshop. I’m going to retain the look and feel while making only slight modifications. I start by opening up the psd of the blog header and copying the mascot over into the newsletter template. From there, I grab the name and slogan and copy them into the email newsletter template, as well. With some minor revisions to the text, the newsletter looks like this: The fonts I used were: for the words Pet Digest, for the words Our Weekly Bundle, and for the. Create the Main Part of the Newsletter I created another rectangle that’s 600px wide under the header and extended it close to the bottom of the page. I then gather the content that will be featured in the week’s newsletter. Again, borrowing the design attributes already laid out in my blog, The Pet Anthology, I create the heading using, drag and drop the main image and copy in the article text. A dotted border placed underneath will separate each article field. I then duplicate the first entry twice and move them down to fill out the rest of the spots for this newsletter. I’ll place the new content in the duplicated spots shortly. Using, I insert the remaining two entries and erase the duplicated content. Add Social Links I want to include an area for social network and RSS icons, and I want to let the subscriber share the newsletter with friends. Best Software For Creating Html Emails In Yahoo MailI start by creating a rectangle 252px wide and include a call to action that encourages subscribers to follow us. I use the appropriate social network icons, changing the colors to reflect my branding. Keeping in mind the usability of email newsletters I decide to keep things simple. I then duplicate the rectangle and place it to the right, including the “Share this with you friends” text in the Museo font on top. Include a Footer To wrap things up, I create the footer, which will allow subscribers to get in contact with me or to unsubscribe from the newsletter. Every newsletter needs to have a link or a button to allow the reader to unsubscribe from the newsletter if they want to. Good tutorial.
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |