Create a Newspaper Front Page in Photoshop

Introduction

The decline in traditional print newspaper sales remains a significant challenge for the industry because most consumers now prefer to access the latest news on social media and other digital platforms. Many publications have successfully adapted their business models and leveraged their brands to build a strong online presence, but newspapers continue to keep their loyal readers informed about local, national, and global events with physical copies of the papers.

First impressions count. The front page needs a compelling design to grab the reader’s attention and encourage them to pick up a copy. It should also establish the newspaper’s values and ideologies. This tutorial will explore the main elements as we build this front page:

Open Photoshop and let’s get started.

Step One – Create a New Document

Our front page is for a compact newspaper similar to The Daily Mail.

Start by pressing the blue “Create new” button or the shortcut Ctrl+N on your keyboard.

When the New Document window opens, click Print in the menu and then select the tabloid preset. We called our file “newspaper front page”.

Before you click the blue Create button, double-check the resolution is set to 300 pixels per inch. This setting is the industry standard and will ensure your images and text maintain their clarity when you print your product.

Step Two – The Masthead

In British publishing, the masthead is the banner name on the front page of the newspaper. It is called the nameplate in the US. We are going to limit our masthead to the name of the paper, date, issue price, and a link to the website.

Select the Type tool from the Tool bar or use the shortcut “T” on your keyboard. In the options bar, change your typeface to Times New Roman, adjust the weight to bold and go with a size 85pt font.

Press and hold your left mouse button and drag the cursor across the canvas to create the text layer. Type “Media Studies” or another short title.

If your Character panel is not available, you can open it by going to Window > Character in the main menu bar. Make sure “Media Studies” is highlighted and change the vertical scale to 120%. This minor adjustment should help the title stand out.

Create another text layer beneath the name but change the font weight from bold to regular and the size to 16pt. Type “Today’s Date” – of course you can use the actual date.

We also went to the Character panel to adjust the scaling back to 100% and deselect the bold button .

Using the same settings, create a third text layer. Type in the url of the newspaper’s website. We just used “media-studies.com”.

Finally, create a fourth text layer and type in the price – £1.20.

If you want more practice adding text in Photoshop, read our guide to using the Type tool.

Our front page contains lots of elements, so we organised the text layers into a group. You can see the result in the screenshot above.

In the Layers panel, left-click the top layer. Hold the Shift key and left-click the bottom layer. All four layers should be selected. Press the group icon at the bottom of the panel. To change the name of the group, double-click on the name and call it “Masthead”. We also right-clicked on the layer in the panel and picked the colour red from the bottom of the list of options.

Step Three – The Ear

The spaces either side of the masthead are called the ears. They are often used for advertising or to signal a special feature in the newspaper. We are going to add an ear to the right of our masthead.

Select the Rectangle Tool from the tool bar. If one of the other shapes is set by default, right-click the icon and you will see the list of options. Read our guide to the rectangle tool for more information if you are not sure how to create and manage shapes.

In the Rectangle options bar, click the Fill Color thumbnail and then the Color Picker icon. In the new dialog box, add the hexadecimal value #ec1211.

The Stroke was set to a 1px black line by default. Click on the thumbnail and change it to the No Color option – it’s the one with the diagonal red line against the white background.

Now you are ready to create the rectangle.

Press and hold the left mouse button. Drag the cursor across the canvas. Aim for around 6.5cm x 4cm.

We added a radius of 40px to the rectangle in the Properties panel to give the shape a softer appearance. You only need to type 40 into one of the fields if the link icon is selected.

Now for the text. Press the shortcut “T” on your keyboard or select the Type tool from the Tool bar. We are going to stick with Times New Roman. Select the bold weighting, change the font size to 24pt and the colour to white – #ffffff. We also picked centre text from the alignment options.

Type “Free Audio Book Download”. Split the text into three decks by pressing the Enter key after “Free” and “Book”.

Keep the Layers panel organised by grouping the shape and text layers into a folder. We labelled this group orange and called it “Ear”.

Step Four – The Banner

Most newspapers contain weekly supplements and features. For example, The Daily Mail has its lucrative MailTravel section which provides information to help readers “get the most out your holidays” and its City & Finance insights into business and the financial markets.

Select the Rectangle Tool from the Tool bar. Press and hold the left mouse button. Drag the cursor across the canvas.

You could have set some of the values before you created the rectangle, but we made the adjustments in the Properties panel.

First, we changed the values for the width and height to 27cm and 8cm respectively. You can also see the X and Y values in our screenshot to indicate where the rectangle is positioned on the canvas.

We clicked on the Fill colour in the appearance section and then the Color Picker icon. At the bottom of the Solid Color dialog box, we added a hexadecimal value of #0070b9 to create our blue background.

The Daily Mail often uses gradients in its banners. If you are comfortable using the gradient function, you could try to create your own background. The default “blue_07” option is quite effective. However, we are going to stick with the solid colour for this tutorial.

We kept the radius values at 0px and went for right angles this time.

Choose the Horizontal Type Tool from the Tool bar or use the shortcut “T” on your keyboard. Change your default typeface to Times New Roman, adjust the weight to bold and go with a size 68pt font. White should stand out effectively against our blue background.

Press and hold your left mouse button and drag the cursor across the canvas to create the text layer. Type “Unlock YOUR family finances”. You could press the Enter key to separate the words into two lines (decks).

Highlight the word “YOUR” and change the hexadecimal value of the colour to #eee327. The capital letters emphasise the direct appeal to the reader and the yellowish-gold colour should connote wealth.

Create another text layer and type “Essential guide to empowering your wallet”. Although the values for typeface, weight and colour are all the same as the “YOUR” settings, we changed the font size to 24pt.

We also opened the Character panel and set the tracking to 25 and the horizontal scaling to 110%. These adjustments ensured the subheading stretched across the banner.

The last element we need for the banner is the image. You can insert your own picture. We simply added a silhouette between the “Rectangle 2” and “Essential…” layers to achieve our final design.

Step Five – Main Story

Designers use placeholder text to fill the spaces where the actual content will eventually go and get a sense of how the final product will look. We are going to add “dummy copy” to our front page instead of writing an original headline and article.

Go to Edit > Preferences > Type to open up the dialog box. Tick the box for “Fill new type layers with placeholder text”.

Kicker

Let’s create the kicker first. This line of text provides a little more information to the headline and “kicks” the reader into the story.

Select the Type tool. Add the following values in the Options bar: Times New Roman; bold; size 30pt; and left alignment.

When you create the text layer, it should now be filled with the dummy copy. We just want the first line. In the Character panel, select underline. The option is circled in the following screenshot:

Headline

For the headline, we changed the weight to regular and the font size to 92pt. We also set the leading to 82pt in the Character panel to tighten the space between the two decks. The lorem ipsum text did not quite fit, so we needed to delete a few characters to get this result:

Byline and Main Copy

We are now going to create the byline and a column for the main copy.

Add a byline next to identify the name of the reporter Select the Type tool and change the font size to 12pt. Do the same for their job title.

With the same settings, create another text layer for the main copy. The column should have a width of around 7.5cm and 18cm in height. Highlight the first paragraph and select the bold option in the Character panel. This will help the reader locate the start of the story.

Remember to indent the start of new paragraphs.

Hopefully, your main article will look something like the one in our screenshot.

The text is left aligned with a ragged right edge. This style is a typical convention of the publishing industry.

Use the rectangle tool to add a line between the byline and the main copy to separate the two elements. A height of 0.06cm should work.

Finally, type “Page 2” into another text layer. Position the link just beside the main copy. We used size 10pt and capital letters.

Step Six – The Main Image

The main image is often the first thing readers see when they pick up the newspaper, so it needs to be visually striking. Ours will relate to content inside the newspaper.

Use the rectangle tool to create the border for the main image. The width and height should be around 10cm x 20cm. Instead of fill, use a black stroke 10px in width.

We used a stock image from Unsplash for our main image. Make sure you use your own original material and layout if you are creating a newspaper front page for your media studies coursework.

Go to File > Open and locate your image in File Explore. Once you click the open button, the image will open in another document window.

You now need to drag and drop the image layer onto the “newspaper front page” canvas. Select the Move Tool or use the shortcut “V” on your keyboard, click on the image and drag it up to the tab of the other document. Hold the button. Wait until you see Photoshop switch windows and then drop your image into the your first document.

Make sure the image layer is beneath the rectangle. Using the Move tool and the black border as a guide, decide which section of the photograph you want to display on the front page because we are going to crop the image. Pay close attention!

Select the rectangle layer in the Layers panel. It’s called “Rectangle 3” in our screenshot above.

Select the Magic Wand tool in tool bar or use the shortcut “W” on your keyboard. This tool automatically selects an object or area in the image. We want the space inside the border.

Move the cursor to the middle of the rectangle and press the left mouse button. The inner section of the rectangle should now be selected.

Now select the image layer in the Layers panel. This step is important.

You want to invert the selection. Go to File > Inverse. The select lines will shift.

Press the delete key.

Press Ctrl+D to deselect.

After you add a caption, your front page should now look like this:

Captions are important because they can help anchor the preferred reading of the image. We used size 18pt font for the caption. It is right aligned with a ragged left edge so the text sittings neatly against the border. The page number is size 10pt.

The photograph was taken by Francesca Di Pasqua during a protest against climate change. You can download the file for this tutorial by clicking this link.

Step Seven – The Off Lead

The off lead is the second most important story on the front page of the newspaper. We are going to use a white font for the secondary headline, so it stands out against a black background. This different style should make it clear to the reader this article is separate from the top story.

Use the rectangle tool to create the background shape. The fill should have a hexadecimal value of #000000.

Select the Type Tool and change the font colour to white – #ffffff. We went with size 18pt font with a bold weight to make the secondary headline more prominent. Left alignment. Importantly, this text layer has to be above the shape layer in the Layers panel.

Once you have added the dummy copy, you need to create the secondary story. We went back to the main copy, duplicated the layer, and dragged it beneath the new headline because we wanted to ensure it had the exact same format. We did delete the first paragraph to quickly get rid of that bold weight.­

This is the final result:

Conclusion

We hope you enjoyed making the front page of the newspaper and developed your technical proficiency in the software. The obvious next step is to create a two-page in Photoshop.

For more information about newspapers, you could read our The Daily Mail and The Guardian study guides, especially if you are following the AQA A-Level Media Studies specification. The guides focus on the newspaper industry and how the publications continue to engage their readers. Our guide to the i newspaper is also worth a look.

In terms of industry, the word tabloid comes from the style of journalism which delivered short and accessible stories. Think of the format as easy to swallow tablets compared to more difficult pills offered by the broadsheet newspapers. The Daily Mail was originally a “high brow” broadsheet but switched to the more digestible compact size in 1971. The term was coined by the newspaper industry because many publishers wanted to avoid being associated with the “low brow” tabloids.

If you followed our size guide at the start of this tutorial, your final product should meet the industry standards.