If you came here from Instagram, welcome. Here are the checklists I promised.

A website can look polished and still feel like a slightly edited template demo. It can also have a folder full of beautiful photos and still be missing the one horizontal image that works behind the homepage headline.

This website design checklist covers the decisions that are easiest to miss: reworking a Showit template around the actual business, setting up the details that matter at launch and planning images around the layout instead of hoping they fit. Use it before customization day, before a photoshoot or before you start generating AI brand images.

The checklists work for designers customizing templates for clients and for business owners customizing a template for themselves.

Get the printable website design checklists

Want a copy you can print and keep beside you while you work? Enter your name and email below and I’ll send the complete three-checklist PDF straight to your inbox.

Checklist 1

Showit template customization checklist

A template gives you a strong starting structure. It becomes a custom website when every page reflects this customer, this offer and this brand. Work through the checklist in order so you are not choosing colors and photos before the strategy is clear.

Before you touch the design

  • Identify the primary customer for this page.
  • Name the main problem, desire or decision that brings that person here.
  • Choose the one offer or next step the page should focus on.
  • Choose one primary call to action.
  • Gather the proof you have: testimonials, results, credentials, work samples or process details.
  • Collect the final copy, or at least an approved outline, before you start designing.
  • Flag missing information now instead of trying to hide the gap with design.

Rebuild the page around the customer

  • Check whether the demo section order fits the customer journey.
  • Move the most important message and call to action higher when needed.
  • Put proof close to the claim it supports.
  • Delete sections that repeat the same point.
  • Duplicate a layout only when the offer truly needs more explanation.
  • Add a section when the customer still has an unanswered question.
  • Make sure every section has one clear job.

Replace all demo content

  • Replace every demo headline, paragraph, testimonial and button.
  • Remove demo services, pricing, names, links and placeholder claims.
  • Use specific language that could only belong to this business.
  • Make the main offer easy to understand without reading every paragraph.
  • Write button labels that describe the next step, such as “Book your consult” instead of “Learn more.”
  • Make sure the About, Services and Process sections do not repeat the same introduction.

Create one visual direction

  • Finalize the color palette before you start swapping images.
  • Set a clear image direction: lighting, color, crops, subject and mood.
  • Use one cohesive image collection instead of a mix of unrelated pretty photos.
  • Decide where the design needs portraits, process images, details and faceless images.
  • Check that every image leaves usable space for headlines and buttons.
  • Create alternate mobile crops when the desktop composition will not translate.
  • Check that text and buttons have enough color contrast to read easily.

Adjust typography as a system

  • Assign fonts and sizes for headlines, subheadings, body copy, labels and buttons.
  • Adjust headline size, paragraph width and spacing together.
  • Keep body copy comfortable to read on desktop and mobile.
  • Use emphasis, such as bold, italics and accent fonts, the same way throughout the site.
  • Test the client’s longest real headlines to make sure they still fit.
  • Remove decorative type treatments that compete with the message.

Fix the rhythm of the page

  • Break up back-to-back text-heavy sections with proof, imagery, a gallery or a short call to action.
  • Check the spacing above and below every section.
  • Remove empty space that does not create a useful pause.
  • Keep related copy and buttons visually connected.
  • Vary the layouts without making sections feel unrelated.
  • Make sure the page still feels intentional after the demo content is gone.

Review the mobile version separately

  • Set the reading order yourself instead of accepting the automatic stack.
  • Resize headlines based on how they actually break on mobile.
  • Adjust section spacing instead of shrinking the desktop design.
  • Check image crops and focal points on a narrow screen.
  • Make buttons easy to find and large enough to tap.
  • Simplify side-by-side layouts and interactions that feel awkward on mobile.
  • Test menus, forms, sliders, galleries and pop-ups on a real phone.

Run the final customization test

  • Cover the logo. Could someone still mistake this for the template demo? If so, keep customizing.
  • Read only the headlines and buttons. The page should still make sense.
  • Click every button and link to confirm it goes to the right place.
  • Proofread everything, including contact details and social links.
  • Test the site on desktop, tablet and a real phone.

Checklist 2

Website launch settings checklist

These details do not change how the site looks, so they are easy to skip. They do affect how the site appears in search results, how links look when they are shared and whether inquiries actually reach the inbox.

SEO basics

  • Write a unique SEO title and meta description for every page.
  • Use one clear H1 per page that states the page’s main topic.
  • Add descriptive alt text to every meaningful image. Leave decorative images with empty alt text.
  • Rename image files with clear, descriptive names before uploading.
  • Set readable page URLs, such as /services instead of /page-2.
  • Hide or set to “noindex” pages that should not appear in search results, such as private thank-you pages.

Settings and connections

  • Add a favicon.
  • Add a social-sharing image so links look polished on social media and in text messages.
  • Connect the custom domain and confirm the site loads securely with https.
  • Connect Google Analytics and Google Search Console, then submit the sitemap.
  • Set up redirects for any old page URLs that are changing.
  • Customize the 404 page with a helpful route back into the site.

Forms, links and legal pages

  • Submit every form and confirm the notification reaches the correct inbox.
  • Test the email opt-in and confirm new subscribers reach the correct list and automation.
  • Check booking, scheduling and payment links.
  • Add the privacy policy and any other legal pages appropriate for the business, then link them in the footer.
  • Update the copyright year and business details in the footer.

Checklist 3

Homepage image shot list

A homepage does not need 20 versions of someone smiling at the camera. It needs a smaller group of images that each do a different job. Plan the image library around the page before the photoshoot, stock-photo search or AI image session.

The hero image

  • Create at least one wide horizontal image for the desktop hero.
  • Leave clean negative space where the headline and button will sit.
  • Keep faces, hands and important objects away from the copy area.
  • Create or test a separate crop for mobile.
  • Preview the image at the actual hero size before approving it.

The trust-building portraits

  • Choose two vertical or square portraits with different crops or expressions.
  • Use eye contact where a direct connection helps the section.
  • Include at least one natural expression or working moment.
  • Avoid repeating the same polished pose in every section.
  • Make sure the portrait style matches the rest of the image library.

The process images

  • Plan at least two images showing the person doing the work or a customer experiencing it.
  • Choose horizontal or vertical framing based on where the image will go.
  • Show a real action instead of another laptop pose with no context.
  • Include the tools, setting or interaction that makes the work recognizable.
  • Make sure the action is still clear after the image is cropped for the website.

The detail images

  • Collect three to five close-ups of hands, tools, materials, products or the workspace.
  • Use faceless details to add texture and breathing room between portraits.
  • Keep the details in the same visual style as the wider images.
  • Include a few simple images that can sit beside text without competing with it.
  • Check product labels, hands, reflections and background objects before approving each image.

The directional call-to-action image

  • Plan one image for the middle-of-page or final call to action.
  • Use the subject’s gaze, gesture, object placement or open space to lead the eye toward the button.
  • Decide whether the copy sits on the left or right before creating the image.
  • Keep the copy area quiet, with enough contrast for the text to remain readable.
  • Create a mobile crop that keeps the directional cue.

The complete homepage shot list

  • 1 wide desktop hero image with room for copy
  • 1 alternate hero crop for mobile
  • 2 vertical or square trust-building portraits
  • 2 process images showing the work or the experience
  • 3 to 5 detail or faceless images
  • 1 directional call-to-action image
  • Alternate crops for any image that sits behind important copy

Review the collection as a group

  • The lighting, color, styling and photo finish feel consistent.
  • The collection includes horizontal, vertical, close-up and faceless options.
  • Every image has a planned section or purpose.
  • The library does not rely on repeated laptop portraits.
  • Important faces, hands, products and actions survive the final crops.
  • Both the desktop and mobile layouts have usable image options.
  • Image files are sized appropriately for the web so the page still loads quickly.

Plan the page before you collect the images

A strong image library starts with the layout. When you know each section’s size, where the copy sits and what job each image has, you can give a photographer a clearer shot list, search stock photos faster or direct AI images with much more control.

Creating the images with AI? My free AI prompts for web designers include a website image-library prompt that builds the shot list and a brand-photo prompt that tells the image tool where to leave room for your copy.

Frequently asked questions

How do I make a Showit template look custom?

Start with strategy, not styling. Reorder the sections around your customer, replace every piece of demo content, use one cohesive image collection and adjust the typography and spacing as a system. Then cover the logo and ask whether the site could still be mistaken for the demo.

How many images do I need for a homepage?

As a starting point, plan for about 10 to 12 usable images with different jobs, including a hero image, portraits, process images, details and a call-to-action image. The exact number depends on the length and layout of the homepage.

Should I customize the desktop or mobile version first?

Start with the desktop structure, but review the mobile version throughout the customization process. Showit lets you adjust the mobile layout separately, so check the reading order, headline sizes, image crops, spacing and buttons before calling any page finished.

Can I use AI-generated images on my website?

AI-generated images can be used on a website when the tool’s current terms permit commercial use and you have the necessary rights or permission for any reference images, products or recognizable people. Review every image carefully for inaccurate faces, hands, products, text, backgrounds and other generated details before publishing it.

Want a stronger starting point?

Browse professionally designed Showit templates for coaches, photographers and creative businesses. Start with a polished structure, then use the checklist above to reorganize the pages, replace the demo content and make the design completely your own.

Shop Showit website templates

Keep reading

Free AI prompts for web designers

Copy four practical prompts for website copy, image planning, Claude wireframes and custom-looking brand photos.