In-Depth Tutorial: Network Homepage

Yankee Magazine

When getting ready to design or redesign your website’s homepage, remember that you only have one chance to make a first impression! You’ve probably heard this saying before when referring to meeting people in person—well, think of your website’s homepage as your first encounter with a site visitor. And that encounter might be your best (and last) opportunity to quickly tell your story, engage and bond with site visitors, and—ultimately—convey a credible brand that visitors trust and will happily buy from.

With this In-Depth Tutorial, we’ll review a Network Homepage that is strong, effective, and the envy of many. We’re featuring the Network Homepage of Yankee—a page that convincingly conveys what Yankee is all about!

Yankee Homepage Yankee Homepage Yankee Homepage Yankee Homepage

Yankee Publishing has been around a long time and is considered the preeminent voice about everything in New England, from travel and historic sites to restaurants, New-England-style recipes, and fabulous fall foliage. Since the very first edition of Yankee Magazine was published in September 1935, Yankee has appealed to New Englanders, transplanted New Englanders, and New-England lovers everywhere.

When Yankee needed to reposition its content to become a digital-first publisher, the venerable brand started with a Network Homepage that quickly tells their story. In Mequoda parlance, a Network Homepage is what many simply call the “home” of any website—we use the term Network Homepage because any brand or website, properly designed and deployed, is really a full “network” of inter-related components and content that comprise vast resources for any site visitor. Plus, as a verb, “network” conveys the sense of cultivating people to help one another.

After Yankee launched its new website and Network Homepage in 2016, traffic soared 600% in just four years!

Now, let’s take a look at Yankee’s Network Homepage, and we’ll review it based on our checklist of core components that can help any website connect with visitors and accomplish the task at hand—to convey what you’re all about and engage visitors to want more!

Network Homepage URL

https://newengland.com

Choosing your website’s URL—which stands for Uniform Resource Locator (URL) in web-speak—is an important first step about where to house your brand and your content. And for Yankee, the decision became clear when they realized that years ago they had acquired the URL www.newengland.com and weren’t really using it. Bingo! The no-brainer decision to use newengland.com was made!

Your URL can help you gain traction with search engines such as Google when your URL is aligned with your content and is a primary keyword in your universe—“New England” in Yankee’s case.

For some, using a widely known brand name as the URL makes sense—such as Amazon.com, Time Magazine’s Time.com, NYTimes.com, or CNN.com.

And for others with initially lesser-known brands, choosing an off-beat URL can be a gamble—such as Fool.com for investing-advice purveyor The Motley Fool. The Motley Fool’s brand and URL support their unique perspective and a backstory about how Elizabethan court jesters (Fools) got away with telling the truth and sometimes going against conventional wisdom, delivering it with humor, and even avoiding getting their heads lopped off while doing it! Fool.com, like Yahoo.com, has become known in their space as a respected provider—in spite of the unique and seemingly unaligned URL and brand name.

Network Homepage Nameplate Header

Yankee Nameplate

For Yankee, while the URL choice seemed obvious, keeping the Yankee brand and logo front-and-center also mattered. And the scripted Yankee logo is recognizable to generations of subscribers to their magazine. So, the Network Homepage nameplate header incorporates both the legacy logo and the stated URL. It’s simple, it’s clear, and it immediately makes the connection between the Yankee brand and what it covers—New England! And this nameplate header, wherever it appears on other pages throughout the site, is always a clickable link back to the Network Homepage.

Other options for the Network Homepage’s nameplate header is a logo with a succinct tag line—don’t make it too large, hard to read, or over-complicated.

Hamburger Menu Icon

Yankee Off-canvas menu

The “Hamburger Menu” has become somewhat ubiquitous these days—that’s mostly good. Because for some site visitors, it’s an easily recognizable visual representation that indicates more menu navigation is available—there’s more to discover with the hamburger menu. The name comes from the appearance of three lines—a top bun, a hamburger patty in the middle, and a bottom bun. When clicking the three-line hamburger icon, expanded navigation options appear with a fly-out menu.

In our world of growing use of mobile phones, the hamburger icon is a great saver of space on the screen—giving mobile users a friendlier and easier way to view and navigate, as desired and needed, without cluttering the screen (see the hamburger icon circled in red below):

Yankee Off-canvas menu

Yankee has smartly placed its Network Homepage hamburger icon near the top left of the page.

Social Media Icons

Yankee social icons

Every publisher should have social media presences these days—and you should let your site visitors know about all of them and how to navigate to your social media posts. Being active on social media increases your publishing brand’s reach and helps you connect with current customers, too. Yankee discreetly features their four primary social media outlets with icons and links, in the upper-left of the Network Homepage, directly next to the hamburger icon—Facebook, Instagram, Pinterest, and Twitter. And all of the links open as a new browser window, so you never lose the Yankee Network Homepage when navigating away.

Sign-in/Register/Join, and Intra-Site Search Functionality

Yankee sign in

This top-right section of the Yankee Network Homepage includes all of the options for joining Yankee, signing in if you’re already a registered user, and searching the site for specific content:

  • Intra-site search is featured with the recognizable magnifying-glass icon—and allows users to search the entire site for specific words and phrases. A search of “best lobster roll” delivers enticing results with links to “Read More”!
  • Yankee search results
  • “Sign in” functionality is specifically designed to allow previously registered users to log in with username (email address) and password. Once signed in, users will have access to any entitled content, and the Network Homepage display will recognize you by first name (the red “Register” button disappears when you’re logged in):
  • Yankee sign in
  • The red “Register” button on the Yankee Network Homepage is for new users to register for FREE at the site and to claim a free copy of Yankee’s Best New England Vacations guide as a reward for registering:
  • Yankee Data collection
  • The red “Join Now” button is to sign up for a Yankee All-Access Premium Charter Membership—if you’re already registered for FREE, signing up for an All-Access Membership entitles you to premium content; if you’re not registered at all, signing up for a premium membership registers you and gives you full access to all of the site’s content, both free and premium. Once you join as a premium member, the site’s conditional architecture won’t display the “Join Now” button when users are logged in.

Network Homepage Main Navigation

Yankee Main Navigation

Yankee’s Network Homepage main navigation bar follows a logical flow of options, left to right—from free content to premium content in ranked order. Yankee follows Mequoda’s best practice of making the nameplate and main navigation persistent on the page, so that scrolling down will always display these items (without having to scroll back to the top for navigating elsewhere or remembering what site you’re visiting). Yankee’s main navigation includes eight total items—eight to ten is ideal—and one- or two-word navigation labels are best, but Yankee makes it work when more than two words are needed. And simply perusing each navigation item reveals the dramatically deep archive of content Yankee has accumulated online:

  • The “HOME” button will always bring you back to the Network Homepage.
  • TODAY” brings users to daily free content that is published at the site and is also sent to registered users by email, with a drop-down menu to select “Travel,” “Food,” or “Living” topical content:
  • Yankee Today
  • FOLIAGE” brings users to all of the content about spectacular New England fall foliage—it’s such a popular topic that the main navigation is deserving of an item for it:
  • Yankee Foliage
  • BEST OF” navigates to an index page featuring links to the “Best of” guides for each of the six New England states, updated annually:
  • Yankee Best Of
  • FREE GUIDES” brings users to an index page of more than two dozen free guides, all about New England. The guides are really free, but you must log in to access the content—handing over your email address to register for a FREE account is the “price” users pay to access this free content:
  • Yankee Free Guides
  • SHOP” navigates users to a New England shop of goods for sale—from Yankee Charter Memberships and Yankee Magazine gift subscriptions to books, calendars, and New England items such as a woolly dust mop and wind chimes:
  • Yankee Shop
  • YANKEE MAGAZINE & TRAVEL LIBRARY” presents a drop-down menu for users to choose “Free Previews”—free peeks at key premium content; “Learn More”—a Sales Letter Landing Page (SLLP) for becoming a Yankee All-Access Charter Member; “Join Now”—links directly to an NC4 Order Landing Page for becoming a Yankee All-Access Charter Member; “Current Issue”—navigates to the most recent issue of Yankee Magazine; “Back Issues”—navigates to the library of all available back issues of Yankee Magazine; “Special Collections”—navigates to an index page of comprehensive, topic-specific, specially curated premium collections:
  • Yankee Magazine & Travel Library
  • WEEKENDS WITH YANKEE TV” main navigation item shows users a drop-down menu for a variety of ways to access video content from Yankee’s PBS television series Weekends with Yankee—with five full seasons (and more coming), premium members can access and view this engaging video content on-demand:
  • Yankee Weekends with Yankee

    Featured Navigation Tiles

    Yankee Featured Tiles

    Our latest best practices call for incorporating appropriate and aligned imagery in tile-like format on the Network Homepage—as a way to visually display the brand and content and to provide additional ways to navigate to key content by clicking on specific tiles. Usability studies show that users like multiple ways to access content, and visual presentations can be very engaging and helpful in guiding the way.

    Yankee is all about beautiful and engaging images, to help convey the essence of New England and to showcase their fantastic professional photography—you can only really use so many words to describe the colors of New England fall foliage, but a stunning image quickly captures the beauty!

    For Yankee’s Network Homepage, two rows of three tiles each—six in all—present images aligned with six navigation items that can also be found in the top navigation bar. The tiles don’t represent all of the navigation items, but they’re a good mix of the most popular premium and free content types. This presentation says it all—“Welcome to New England!”

    SEO Copy & Map of New England

    Yankee SEO Copy and Map of New England

    Under the navigation tiles on the Network Homepage, Yankee includes definitional and descriptive copy that explains New England. This copy is designed for Search Engine Optimization (SEO) and to quickly serve readers about the nature of New England. Placing copy like this on the Network Homepage—copy that seems to belong on an “About Us” page—is a great strategy for helping search engines index the page, giving it even more importance and weight. The key is to keep the copy brief, so users aren’t subject to endless scrolling—and to make it snappy while including keyword phrases, a not-so-easy task for even the most experienced writer.

    Yankee Map of New England

    Yankee’s Network Homepage yet again deftly deploys imagery—this time, a simple map—to define its content coverage, geographically speaking. Each of the six New England states is colorfully featured, with key locations highlighted, and the region’s relationship with the ocean is perfectly clear and obvious. Nice job, Yankee! The map image is followed with a quick state-by-state summary of all six New England states, calling out notable features, people, and locations:

    Yankee Guide to NE States

    Network Homepage Footer Items

    Yankee Homepage Footer

    The footer on Yankee’s Network Homepage may seem daunting, but it’s an all-inclusive way to know about even more navigation items—organized in neat columns and concisely labeled. The far-left column repeats the top navigation bar items and includes contact information for Yankee, along with a copyright statement. The middle four columns of items are simply more detailed ways to navigate to specific content. And the far-right column is just about everything else, including fun items such as the “Yankee HQ Webcam” that literally shows the Yankee headquarters building 24-hours-a-day from the outside. The far-right column also includes the all-important “Privacy Policy” link. You can also navigate to other Yankee Publishing websites, including The Old Farmer’s Almanac and Family Tree Magazine. Finally, a logo and link to a Yankee partner, New England Inns & Resorts rounds out the footer.

    Network Homepage Mobile Responsiveness

    Yankee Mobile Responsiveness

    In today’s world, all website pages should be designed for mobile responsiveness—and Yankee’s Network Homepage is no exception, especially considering that more than half of all Yankee’s website traffic comes from mobile devices.

    On a mobile device, Yankee’s Network Homepage is clean and uncluttered and very user-friendly. Top navigation seen on the desktop version is stripped away, in favor of the hamburger-menu icon—and the footer is a condensed version of the desktop footer, only including key items.

    And, as with the desktop version of Yankee’s Network Homepage, the mobile version keeps the nameplate and hamburger-menu icon persistent on the screen when you scroll—making navigation easier and keeping the Yankee brand top-of-mind and top-of-screen at all times.

    Yankee Network Homepage Improvement Ideas

    As with all things in life, continuous improvement should be part of business processes—including the design and function of your Network Homepage. With digital publishing, nothing is ever “once and done”—times change (think COVID pandemic!), consumer behavior changes, and there’s always room for improvement with everything!

    For Yankee’s Network Homepage, here are some ideas for improvement that can help capture more email addresses, enhance the user experience, and drive more premium orders:

    • Enhanced conditional architecture: Mequoda’s Haven WordPress System is designed for conditional architecture, whereby the user’s status determines some elements to serve—or not to serve—on the page. Yankee should fully enable and maximize this functionality to serve ads to Network Homepage visitors, depending on user status.
    • Bottom OFIEs: With full optimization of conditional architecture, Yankee should serve bottom OFIEs (Order Form in Editorial) on the Network Homepage, just above the footer and below the state-by-state summary copy, as follows:
      • For Network Homepage visitors who are unknown and not logged in, the bottom OFIE should advertise one of Yankee’s free guides—with the goal of capturing a new email address. Here’s an ad that already appears elsewhere on Yankee’s site that could easily be formatted for a Network Homepage bottom OFIE:
      • Yankee Bottom OFIE
      • For Network Homepage visitors who are known, logged in, and are not currently a Yankee All-Access Charter Member, Yankee should serve a bottom OFIE that advertises membership. Here’s an ad that already appears elsewhere on Yankee’s site that could easily be formatted for a Network Homepage bottom OFIE:
      • Yankee Homepage Bottom OFIE
      • For Network Homepage visitors who are known, logged in, and are active Yankee All-Access Charter Members, Yankee could choose to serve no ad at all on the bottom of the Network Homepage—or, for premium members, Yankee could use the space to feature the most current issue of Yankee Magazine with a link to its page. A great engagement play for premium members!

    Summary

    Yankee’s Network Homepage is a publisher’s delight—brand-building and practical and beautiful and engaging, all intended to bond with visitors, showcase all of the content, and keep visitors and users coming back for more!

    Here’s a performance checklist you can use, to ensure your own Network Homepage follows Mequoda’s current best practices!

    Mequoda’s Network Homepage Checklist

    Element Criteria Done?
    Network Homepage URL Reflect your brand or primary keyword phrase/topic
    Nameplate Header Use your logo and a succinct tag line
    Hamburger Menu Icon Include near top of page; top-left is an ideal spot
    Ensure the displayed fly-out menu is somewhat comprehensive
    Social Media Icons Display icons for social media outlets where you regularly post, in a clear and conspicuous place (top or bottom of page)
    Include links to your social media presences as "open a new window"
    Sign In/Register/Join + Intra-Site Search Functionality Include top-right-of-page sign in (for previously registered users); register (for new users to sign up); and join (buy a premium membership or subscription) items
    Use recognizable magnifying-glass image for intra-site search functionality
    Main Navigation Order your navigation items, left to right, from free to premium content types
    Start on the left with a "HOME" navigation item
    Don't include too many items in main navigation (8-10 items is ideal)
    Keep navigation labels clear and short (one- or two-word labels are best)
    Featured Navigation Tiles Showcase your brand and your content with image-centric navigation tiles under the main navigation bar
    Include brief mouse-over copy for each tile and make the tiles links to the corresponding content type
    SEO Copy and Images Include descriptive SEO copy on your Network Homepage
    When appropriate, include aligned images with your SEO copy
    Network Homepage Footer Be comprehensive, but don't go crazy
    Include your contact information: postal address, email address, phone number
    Include a link to your Privacy Policy
    Mobile Responsiveness Ensure the mobile version of your Network Homepage is clean, uncluttered, and mobile-responsive
    Continuous Review & Improvement Don't just create your Network Homepage and forget it; commit to reviewing it at least once/year and ensuring compliance with current best practices

    Print Checklist

    Bottom Line: If you want to create an engaging Network Homepage—just like Yankee’s—follow this checklist, and you’ll have a great starting place for creating a compelling page.

Comments

Leave a Reply