The Big Impact: Navigation

March 04, 2015

Bigimpact

Welcome to our series on making small changes that are guaranteed to help level up your blog's look. Every other week we’ll debut a new post, profiling some great blogs for inspiration that employ Typepad's built-in features. We'll also offer up tips and tricks that can help improve your blog's appeal, gain new readers, and build a more engaged community. Check out our other posts in the series here!

In our latest topical series, discussing how small changes can make a big impact, we've covered custom banners and sidebar headers. Today, we're continuing the discussion by reviewing an often overlooked area: navigation.

The navigation bar, and the content you add to it, is one of the few items that readers see on the first load of your blog. No matter the type of blog, no matter the content, readers need to be able to locate the most important parts of what your blog has to offer. Making the navigation bar the hub for your readers allows them to easily return and find what they're looking for. Examples of how to make certain your navigation bar is easily seen is what we're sharing today.

First, Oh Joy! demonstrates how a simple navigation bar can stand out against a minimalistic design, leaving no room for readers to be distracted and unable to locate key areas.

Oh Joy!

Next, Imagine Childhood highlights specific areas of their blog's content by utilizing custom images, in place of text, to create an eye-catching focal point.

Imagine Childhood

Want to know more about the navigation bar and how to style it? Our Knowledge Base has the answers you seek. Need help turning an idea for your navigation bar into reality? We're a help ticket away from your actualizing what you've already imagined.

All blogs featured in our current series can be found in the Typepad Showcase! If you think you have what it takes to be in the spotlight, submit your own blog today!

Introducing the Nimble Design Lab

March 03, 2015

Everyone knows that the most important thing about your blog is your content, but the way you display that content is important, too! You can make a great first impression on your readers by having a blog that looks fantastic, is accessible across many devices, and is easy for them to read.

The Typepad Team has been hard at work creating Responsive themes (Gourmet is a particular favorite), but this time we've stepped up our game.  Wouldn't you love your blog to look something like this one, gorgeous on all devices? Starting today, Beta team members will be able to do just that.

Screenshot_mel

We've rolled several amazing features into one giant piece of awesomeness that we've named the Nimble Design Lab.  You can use it to create a design like the one above and literally thousands of others.  There's a lot involved, so let's get started!

The Nimble Design Lab currently consists of three different, related features.  We'll go over each of them separately.

The first feature that works as a base to provide you with the other functions is our new responsive theme, Nimble. It's a great base theme that allows you to adopt a responsive feature set for your blog.  Responsive means that your blog will look as it should across all devices, whether it's a traditional laptop or desktop computer or the fanciest new tablet or smart phone.

Now that you have the Nimble base in place, what else can you do?  The answer is a staggering amount of things.  Let's take a look at some of the options that you have.

Nimble is currently available for one- and two- column layouts (we're working on the three-column ones for a later release). After you choose your layout, you can upload your own banner, if you like. We're offering additional banner options to allow you to choose between text or a banner image, and then keeping the banner the width of the blog or stretching it the full width of the browser.

Banner at blog width Banner stretched to browser width

Now let's really get into the nitty gritty!

Click the Style tab and you'll see a vast array of options.  These include Fonts (we'll come back to this), Banner, Navigation, Posts, Sidebar, Footer, Background, and Collections (we'll come back to this as well).

Under each of the sections, you'll see a large number of options.  You have the ability to do things like change background colors or upload an image to use as an overlay over the background color.   You can round corners and collapse the margins between columns.  You can choose colors for links, backgrounds, text, and more.  You can select different alignments for your navigation bar.  This is just a sampling of the things the Nimble Design Lab can do.

Styles

Ever wanted to apply different fonts to your blog's design but found it too difficult?  With the built in Font Selector, it's easy as pie.  Just scroll through the various options (Handwriting, Display, Serif, and Sans Serif) until you find one you like.  Don't see the perfect font?  You can import your own from Google Fonts.

Fonts

What if all of these options are a little overwhelming and you're not sure where to start?  Don't worry!  We've got you covered with Collections.  Simply click it and you'll have the option to choose from dozens of color collections and a dozen different fonts already pre-assembled to look great together.  You can apply these options to your blog and then tweak them to get the perfect look.

  CollectionsAs we mentioned, there are many great things that you can do with Nimble, but we really want to highlight the Highlight Bar!  If you have the "featured image with excerpt" option enabled at Settings > Posts, the first image in your post is going to look extra fancy:

Highlight_image

You'll be able to control the color of the Highlight Bar and its placement on the image.  It's just one more way to really make your images pop.

Take a look at some designs that we whipped up using the Nimble Design Lab.  Remember, this is a Responsive Theme, so we're going to show you how each design looks on a number of devices:

Screenshot_bri

Screenshot_jen

Screenshot_marilyn
You can see the various designs and combinations of colors, fonts, and features that can be effortlessly applied to your blog to make it a thing of beauty.

Another aspect of Nimble is that it's based on an entirely different layout scheme than previous fixed layouts in the past. If you're a fan of customizing your design with Custom CSS, you'll need to reacquaint yourself with the template structure by reviewing the source code of your blog. Test blogs are great for this type of design need.

If you're one for word play, you'll want to take notice of the theme name. You can probably see why we named it as we did! We've also still got at least one major feature we'll be adding soon! (Maybe you'd like to see your own design become a part of Typepad. Wouldn't it be cool to see your design on other blogs?) Let's just say you'll want to make sure you're a Beta team member to take advantage of the features when they're released for testing.

Are you as excited as we are? Let us know what you think by leaving us a comment here, a tweet @Typepad, or a message on Facebook. We'd love to hear from you!

Welcome

Need help?

Follow us!

Typepad on FacebookTypepad on TwitterTypepad on Google+Typepad on PinterestSubscribe to Everything Typepad

Like us!

Typepad Newsletter

Still having trouble? Contact Support.