FAQ: “Can I add my external website header to Jive?”

Version 3

    We get this question a lot. The idea is that you’ve already got a global navigation solution on your external site, and you now want to use the same one on your Jive community website. However, this approach can have some technical challenges, and for many sites, may not deliver an optimal user experience. Often, a more customized approach to navigation can preserve a unified branding experience between the sites while keeping your users engaged in using the Jive site.

     

    Before jumping in to this, let's get a better understanding of what navigation encompasses, and what is involved in designing a navigation solution that fits your particular use case.

     

     


     

     

    What are we talking about?

     

    First, let's start with something simple — a definition on what navigation is.

     

    A consistent set of links or buttons that take the user to key sections of the site or application.

     

    This applies to anything with a user interface, whether it's a website, your PC, or your smartphone. As a general rule, navigation serves two functions:

    • to tell the user where they are
    • to enable the user to go somewhere else

     

    Global navigation, when applied to web design and information architecture, provides access to the main content sections or services of a site. It can also promote business objectives that drive users to additional sites or destinations outside of the current site architecture.

     

    For example, a user can browse Amazon.com or CNN.com and link into various sections or services. Not every section or service will have the exact same global navigation. Often, in fact, the navigation is contextual to the use case, or the goal of the particular service or section of the website. Yet, despite the shifts in global navigation as the context changes, these sites continue to have a sense of overall brand experience.

     

    Examples:

     


    Often, when site developers are asked to consider information architecture and interface usability within Jive, they can be distracted by business driven navigation objectives. The goal of the main site's global navigation is to promote links or sites that exist outside of the Jive community, or to create the illusion that the community is part of a bigger site architecture. However, the main goal of the Jive site architecture should always be to promote engagement and productivity within the Jive site. A good design can help you achieve both these objectives, but needs careful consideration.

     

     


     

     

    What are some solutions?

     

    The simplest way to promote a landing page outside of the current section of a site is to add a link that stands apart from the primary navigation.

     

    cnn.png  jive.png

     

    However, if the primary goal is to create the illusion that the Jive community is part of a larger site architecture, then this simple and easy solution probably won't achieve that goal.

     

     

    What about including the same global navigation from another website?

     

    Reusing an existing global navigation from another site without modfication is sometimes, but only rarely, possible. Here's why.

     

    First, we need to understand the basics of how a website is rendered in a browser — the various components that make up the overall user interface, which can differ tremendously from website to website.

     

    A website is a collection of web pages. A single web page, at its core, is made up of four primary components:

    • HTML — The building blocks of a web page. HTML can be created in various versions such as HTML 4.0, XHTML, HTML5, etc.
    • CSS — Cascading Style Sheets are a way of describing the look and formatting of the HTML content.
    • Javascript — Provides the ability to write functions that manipulate the structure, look, or format of the web page.
    • Images — Provide visual interest, communicate supplemental information, or otherwise enhance understanding of the page content.

     

    These components are used within the Jive product to deliver the user interface and user experience, the tools that help to drive real business value. This means that, unlike a website created from scratch, these components cannot be unique to each individual application. In the same way you couldn't simply drop a 2001 Hummer H1 engine into a 1987 VW Beetle--besides not fitting, it probably wouldn't even have compatible parts--it's not likely you could drop HTML, CSS, or scripts written for the context of another website and have it work the same within Jive. We must remember to take into account the primary components of a web page, the HTML, CSS, or Javascript and the degree to which these are interdependendent.

     

    With careful and meticulous attention to detail, a global header can be constructed in such a manner as to work within any website. But this is not the norm. Most headers rely on a specific set of base components such as CSS resets or on a particular version of HTML. These dependencies are typical because the development and creation time to produce freestanding, modular components is much more time- and resource-intensive. And in most cases, it's not necessary, because new pages written from scratch can be expected to use the same base components. Thus, for the most part, you can expect that a block of global navigation written for another website will need to be re-written within the context of the components of Jive.

     

     

    How do you sync across sites when changes are made?

     

    When creating websites from scratch, the HTML structure is likely to be updated frequently. Ensuring updates are made across services is as simple as making sure to include a template either through Server Side Includes (SSI), PHP, or whatever markup the site is using to serve the website. But, Jive is a standalone application, not a custom built website — we cannot import a template shared from another server.

     

    The simplest way to ensure a global navigation that is shared across Jive and external sites is management — coordinating the change across the various services and updating the code in each environment.

     

    Alternatively, if the global navigation is written in the expertly detailed manner  that allows it to be included into any site regardless of components, the global navigation and its supporting components can be included on the web page through JavaScript. Keep in mind, though, that this may impact performance: the browser resources required to do the rendering will be significant.

     

     


     

     

    So, can I use my header, or not?

     

    There isn't a firm answer: it depends on your site and your objectives. Careful consideration and understanding of the complexities involved are required to make an informed decision based on your unique use case. Jive Professional Services can help guide you through this process and provide a solution that meets your needs as well as your budget.