Tue

28

Jul

2015

How to Pick the Perfect Template for Your Website

You’re starting your website, or maybe you’re thinking that your existing website needs a facelift. One of the very first steps is choosing the right template to serve as the foundation for your new design.

 

How to Choose the Best Template for Your Website
But if you’ve ever looked at row after row of templates, you might be thinking, “yikes, how am I supposed to choose?” Yes, it’s great to have so many options, but sometimes you need help narrowing it down. Let this post help you do that!

 

It takes a bit of skill to look past the sample content and the template name to actually picture your own website taking shape. Once you know how templates work, it will be much easier to figure out which one is right for you.

 

Note: Still using an old Jimdo template? In August 2014, we updated all our templates and added lots of new options. While you can keep using old templates, we encourage you to try out the new ones, especially since they support many of our new features. Check out our Template Filter to see the different options.


The parts of a Jimdo template


First thing’s first. Jimdo’s templates are based on structure, not content. This means that if you see a template that looks like a cooking website, or a travel website, or a skateboarding website, that doesn’t mean your website has to be somehow related to that topic to use that template.

 

In other words, don’t get distracted by the sample content. Try to look past it to see the “bones” of the different templates, and you’ll be much better able to picture how each template will work on your site.

 

Each Jimdo template is made up of the following parts:

 

  • Header: This will show up at the top of every page of your website. It’s usually the place for your logo and website name.
  • Navigation: The navigation is the menu that directs people to different pages of your site. Jimdo navigation bars come in different styles: breadcrumb, drop-down, slide-in, and normal (more on that in a bit).
  • Sidebar: The sidebar is your secondary content area, usually a narrow strip on the side of your website where you can add additional elements. The sidebar will show up exactly the same on every page of your site. It’s usually where people put contact information, social media links—anything important enough to show up on each page. Depending on the template, your sidebar can be on the left, right, or even on the bottom (meaning that “sidebar” is sometimes a misnomer...it can be a “bottom bar” or “footer” too).
  • Content Area: The content area is the “body” of your website, and the place where you will add most of your different elements. Each page of your website can have a different content area.

Note: One important thing to remember is that your header and sidebar/footer will stay the same on ALL pages. Your content area will change from page to page.


Once you get the hang of the different parts of a template, you can start recognizing them in different configurations. Some templates have large header areas, others have small ones. Some have prominent sidebars, others are more understated. When you decide which pieces you want, it’s easier to pick the template that’s right for you.

 

See below for a side-by-side comparison of four different Jimdo templates. The header/logo areas are highlighted in yellow, the navigation menus in blue, and the sidebars in red.

 

Jimdo Template St. Petersburg St. Petersburg

Jimdo Template Riga Riga

Jimdo Template San Francisco San Francisco


 

Notice how in Riga, the "sidebar" is actually on the bottom, giving you a wider content area. In Dublin, the navigation menu is vertical, whereas in the others it's horizontal.

 

Questions to start your template search


Ok, now that you know the different parts, you can start asking yourself the following questions:

 

  • How do you want your header to look? If you have a logo you love, you’ll want a template with a large header and logo area. Templates with large headers (also called “hero areas”) let you show off large, high quality images too.

     

    Some templates with large Header Areas: Barcelona, Amsterdam, Cairo, Shanghai, Rome, Zurich
    Some templates with small or no Header Areas: Dublin, Lima, Milano, Singapore
  • What kind of sidebar do you want? If you want one that is unobtrusive, or if you want to have a wide content area, choose a template with a sidebar on the bottom. If you want a sidebar that’s easy to see at all times, choose left or right. If you want no sidebar at all, that’s fine too. Just choose a template with a bottom sidebar and leave it empty. For more details on sidebars (with examples), check out How to Use a Template with a Left or Right Sidebar.

     

    Some templates with left/right sidebars: Hong Kong, Lima, Madrid, St. Petersburg, Verona, Helsinki
    Some templates with bottom sidebars: Barcelona, New York, Havana, Zurich, Berlin
  • How will people navigate your site? The navigation you choose depends in part on how many pages and subpages your website has. If you haven’t done so already, this is a good time to map out your site on a piece of paper so you know which pages you need and how people will get there. If you have only a few (say, 7 or fewer) navigation points, a horizontal navigation bar across the top will look great. If you have more than that, you might consider a vertical navigation with dropdowns where you can put subcategories.

     

    Some templates with horizontal navigation menus: Barcelona, Zurich, Riga, Prague
    Some templates with vertical navigation menus: Havana, Milano, Lima, Dublin

     

    Some templates also offer a “split” navigation. This means that part of your navigation will show up at the top of your page, and any sub-pages will appear further down on the left or right side of the page. Split navigations are great when you have a lot of content, a multilingual site, or a large store, and you don’t want to struggle with long, complicated drop-down menus. Below are two examples, Chicago and Hamburg, with their two-level navigations highlighted in orange.

Jimdo Template Chicago Chicago

Jimdo Template Hamburg Hamburg


 

Below is an example of a slide-in menu from template Sydney. Click on the little menu button on the top left, and the entire menu pops out.

 

Side-in menu
Slide-in menu

 


The template you choose might also depend on the type of website you want. Here’s a rundown of some of the different types of websites and the template tips that go with each one.

 

1. I want a template that works well with a blog


Blogs usually need sidebars—to hold your archives, recent posts, a search box, or social media buttons. If this is the case, choose a template with a sidebar on the left or right side.

 

If you need a lot of space to show off larger images, you could choose a template with a wider content area.

 

Try: Reykjavik, Milano, or St. Petersburg if you want a sidebar on the left or right. Singapore, Berlin, or Zurich if you want a wide content area.

 

2. I want a template for a portfolio


If you’re looking for something to display your works of art, stick to a template with a wide content area and a sidebar on the bottom. The wide view lets you take advantage of all the new Photo Gallery options, and means that you can display large images to really catch people’s eye.

 

You might also take advantage of the high quality images you have by using a template with a full-screen background. You can even set the background to rotate through a group of selected images.

 

Since a portfolio site usually doesn’t need as many pages or sections as an ecommerce site, you can use a simple horizontal navigation across the top, or a slide-in navigation menu (sometimes called a “hamburger”) that won’t get in the way.

 

Try: Rio de Janeiro, Cairo, Zurich. Try Copenhagen, Sydney, or Cape Town if you want a slide-in menu.

 

Portfolio website using template Zurich The template Zurich is perfect for portfolio sites. With its wide content area and sidebar on the bottom, it's easy to show off your work. Here's an example from www.felicevagabonde.com.

 

3. I want a template for an online store


Online stores tend to need different categories and a way to organize lots of product pages. There are a few template tricks that can help you tackle that issue.

 

Use a template with a secondary navigation, or choose a navigation bar that allows you ample room for subpages. Templates with breadcrumb trails also help users know where they are and which category each item belongs to.

 

You could also look at templates with large hero areas (header areas) at the top, which are great for showing off the latest product.

 

Try: Bordeaux, Rome, Malaga, Melbourne, Miami, Chicago

 

Online Store Norla Design using Rome Template The online store Norla Design makes good use of the drop-down menu and large header area in template Rome.

 

4. I want a template that will fit a LOT of content


Websites with lots of pages and subpages can be a bit tricky to organize in a way that makes sense for visitors.

 

If you’re using a horizontal navigation bar that’s breaking into two lines, or if you have a vertical navigation that is trailing down way below your main content area so that people have to scroll down just to see all the menu items, then you know you’re either using the wrong template or need to reorganize your menu items.

 

To make room for a lot of content, choose a template with a roomy navigation menu. Look for drop-down menus, split level navigation, and breadcrumb trails.

 

Steer clear of slide-in navigation menus, which are tough to navigate for more than a few menu items.

 

Try: Bordeaux, Osaka, Malaga, Dublin, Lille

 

Template with a Breadcrumb trail The website www.chaletnantailly.fr uses a template with drop-down menus and a breadcrumb trail (both highlighted in red) to help visitors navigate the site. This is the Rome template.

 

5. I want to build a multilingual website


Multilingual websites tend to struggle with the same issues as content-rich websites, simply because multilingual websites need multiple copies of the same pages, but in different languages.

 

One way to tackle this issue is to use a template with a secondary navigation. That way, your top navigation can be divided among the different languages (such as English | French | Spanish) and you can add subpages underneath each of those.

 

You can also use templates with simple drop-down menus. In the example above from Norla Design, they use the template Rome to build a multilingual store.

 

Try: Lille, Bordeaux, Hamburg, Chicago, Madrid, and Hong Kong—they all have secondary navigations.

 

Multilingual website using template Hamburg The multilingual site www.freedomandspirit.be uses the secondary navigation of template Hamburg to divide their content into different languages. The three languages are in the top menu on the right, and the subpages for each language appear in a vertical menu on the left.

 

6. I want a business website that makes it easy for customers to find the most important information


That's music to our ears! Many of the most effective business websites make their most critical information available to visitors right away. Whether you're a restaurant posting your menu and opening hours, a salon posting your contact information and booking widget, or a store posting your locations and latest products, there are lots of templates that will suit you to a T.

 

In this case, you probably don't need to fit a lot of content, but you want to make sure the content you do have is easy to find without a lot of clicks. Choosing a template with a sidebar on the left or right is a good place to start, and you can put your basic stats in there so that people can easily find it. A sidebar on the bottom can work too, but it will take customers a few more seconds to scroll down to see it. You should also stick with a short navigation menu, either horizontal or vertical.

 

You also might skip templates with slide-in menus. It's just one more step that stands between your customers and the information they want.

 

Try: Amsterdam, Havana, Lima, Prague, Reykjavik, Madrid
Madrid

Template Havana is good for business websites Havana


 

Applying a new template to your website


Once you have a general idea of the kind of template you want (and some possible candidates in mind), you can test them out on your current website using the Template Selector. Just click on the Templates button in your Site Admin. You can use the Template Selector to see a preview of how each template would look with your current content. As long as you don’t hit “Save”, you won’t actually change your template.

 

You can change your template at any time in the Template Selector. Just choose “Templates” in your Site Admin and browse the options.

If you want to experiment more with the different templates before going public, check out some of our tips for renovating a website. You can also start a JimdoFree website and put in just some of your existing content to see how your navigation and photos could work with different templates, before making those adjustments on your real-life website.

 

Template Variations Click the "Variations" button for each template to see additonal options.

When you’re scrolling through the templates, remember to check out each template’s variations, too. They often come in different colors or with subtle changes to their navigation. On many templates, you can often choose whether you want your navigation and header area to be center, left, or right aligned. On top of the variations available, you can also use the Style Editor to adjust colors, fonts, and backgrounds.

 

All of these options allow you to adjust templates until you really feel like a website is fitting your needs and has become uniquely your own. That, after all, is what the whole process is all about.

 

If you have any questions or have any of your own recommendations when it comes to choosing a template, let us know in the comments!

 


Maggie

Maggie

Content Editor at Jimdo

 

Maggie joined the team to craft the voice of Jimdo for all products and marketing channels. In her previous work, she edited for organizations covering the environment, cities, and sustainable business. When she's not adding serial commas, you can find her camping with her husband, cooking, and reading New Scientist.