Fluid vs. Fixed Web Sites: What’s Right For You?

FLUID VS. FIXED WEB SITES: WHAT’S RIGHT FOR YOU?

There are a lot of choices to make when developing a Web site. Some are obvious, like what content to keep and what to cut, or whether to offer e-commerce. However, the ramifications of some choices don’t become evident until after the site has been built.

One question that we ask as part of our Design Questionnaire is whether the client wants a “fluid” or “fixed” site. We also offer two additional choices: “Doesn’t Matter” and “Huh?”

The decision at this point will greatly influence the site design and the Information Architecture (how the information on the page is arranged.) Despite the importance of this choice, it’s often misunderstood by business owners until it’s too late. I’m here to clear up that confusion.

Fluid vs. fixed refers to whether your Web page will “stretch” or stay “fixed” as the width of a browser window changes. When you send out a postcard to a thousand prospects, you know that the dimensions of each card, say 4″ x 6″, will be identical no matter who receives it.

When you distribute information over the Web, things get trickier. Monitors range from 12″ – 23″ and up. Even people who have identical monitors may see differences depending on:

  • their screen resolution
  • their operating system
  • their choice of browsers
  • whether their browser window is “maximized”
  • the size and presence of their toolbar, status bar, address
    bar and favorites bar
  • a number of other variables.

Fluid Pages

A fluid page will flow to the confines of the browser window. This means paragraphs will rewrap as the browser window is resized.

Many people believe fluid pages look better on a wider variety of browsers because they are more “accommodating.” A truly fluid site is considered to be more “accessible” due to its ability to fit into any type of browser window, even a handheld device. However, these truly fluid sites give up almost all control over design and layout due to their nature.

Fixed Pages

A fixed page, on the other hand, will stay the same width and float on the background regardless of the size of the monitor. You can see an example at the Dish Diva’s site, which flyte designed. For example, if you have designed a fixed site to be 740 pixels wide, it will appear that wide on an 800 pixel-wide browser window or a 2,000 pixel-wide browser window. The difference will be in the background color or image, which will grow or shrink to fill up the “white space.”

Imagine an 8.5″ by 11″ page on an end table. Now move that same page to a large dining room table. The size of the page hasn’t changed, but there’s a lot more background, or in this case, table space, in view. That mimics the behavior of a fixed page. Whether the page works better as left or center justified is often determined by the design of the page.

Fixed pages are great when you want complete control over the layout of your page (or as complete as the Web will afford you.) One downside is that people who visit your site with a small browser window may have to scroll left to right, as well as up and down…a frustrating browsing experience. Visitors with a large monitor may see more  background than content.

Which is right for you?

There is no right answer here. I was a big proponent of fixed width design for years, but in the past few years I’ve realized the benefits of a fluid site and redesigned flyte’s own Web site to be fluid.

When making your decision, revisit some of your favorite sites and try resizing the browser window. This may give you an idea of which site is more appropriate for your business and your audience.

If you have further questions about fixed vs. fluid Web sites, please contact us.

–Rich Brooks

President, flyte new media

flyte crew page

We wanted to do something different for our “About Our Team” page. Something more interesting than the regular assortment of professionally taken photos that populate the Web sites of most businesses.

We looked into some illustrators, but their rates were too high or they looked like what you would get at the midway next to the cotton candy stand.

So we took another tack. Check it out.

Rich Brooks
My Mother Dressed Me That Way

Paypal Emailed Me

Paypal_logoA while back, in April of 2003, I wrote a newsletter called  "PayPal: An Inexpensive E-Commerce Solution." I talked about how easy it is to use PayPal to accept credit cards online. I also mentioned one caveat: that customers needed to signup for a PayPal account to use it.

Although that changed a while back, I never updated the article.

Late last night, Dave Nielsen of PayPal emailed me to say:

RE: your comment in your April ’03 newsletter where you say "Only people who have signed up with PayPal can use the PayPal system." 

Did you know that customers no longer need to have a PayPal account to pay?

So, I’ve now updated the article. But, since I think Dave might be checking this blog, I’ll put my wish list for PayPal here:

  • Allow more customization of the PayPal checkout page so there’s a seamless integration between one’s Web site and the checkout
  • Offer built-in tools to accept more information during the buying process; I have to hire a programmer every time I want something special
  • Offer a better, more customized, shopping cart experience

I’m sure there’s more, but those are my biggies.

Rich Brooks
PayPal Merchant

Everybody Get Firefox

Firefox_1I’m already impressed.

I’ve only been playing around with Firefox 1.0, the new browser from Mozilla for a few minutes and already it’s my new favorite. It’s so much faster than Safari, which was so much faster than Internet Explorer (IE). Don’t wait! Download it now!

On top of that, it’s much safer than using IE according to experts much smarter and nerdier than me. Here’s an article on the dangers of IE at BBC online. Of course, this only affects Windows users. Mac users are generally safer, due to the security of the mac…and it’s low market share. (We don’t make as attractive a target.)

Plus, it’s got one feature that us mac users have never had in a browser before: the ability to format text in blog-like environments. Basically, I can create bold and italicized text, even links without knowing any HTML. It works like a stripped-down Word. (Admittedly, this is not a big problem for me, but is helpful for others.) In the past mac users had to type out the html code just to get this to happen in blogs.

At flyte, for a while we’ve been contemplating upgrading our pre-designed "ProSites" into more of a turnkey solution where clients could update their own sites through browsers. However, up until now we’ve held off because the technology was only available to 97% of the population. Maybe in 2005…

Rich Brooks
Firefox Enthusiast

Blog or Perish: Blogging and Your Business

BLOG OR PERISH: BLOGGING AND YOUR BUSINESS

Recently I suggested to a couple of clients that they create a blog to promote their businesses and Web sites. One of them asked me what a blog was and the other asked me which blogging software I recommended.

Hmmm, I thought. Time to get busy.

What is a blog?

Short for “web log,” a blog is an online journal of sorts. “Blogging” is the act of adding posts to a blog. “Blogger” is the author of a blog. “Bloggish” is how I feel after writing a really long blog.

Your blog can consist of regular posts, images or other types of files. Visitors can read your blog and even post comments if you allow it. Some blogging software allows visitors to subscribe to your blog as well.

How do I start a blog?

The two biggest players in the blogsphere are Blogger and Typepad. There are others, but to gain experience I started a blog with these two companies.

Blogger is completely free. Typepad is $4.95 a month for the entry-level blog, which is what I chose. Additional functionality is available for $8.95 or $14.95 a month.

I found both to be incredibly easy to use. You can use any browser to post to your blog, although I recommend Firefox for Mac users. For Windows users I recommend Firefox or Internet Explorer 5.5 and above. Of course, Windows users need to be concerned about using IE in general.

The reason I recommend these browsers specifically is that they allow for easier formatting of your blog; you can format your text, create links, and do spell checks in your blog without knowing any HTML.

If I had to recommend one over the other I’d recommend Typepad. Although Blogger is free, it doesn’t offer any hosting of images. You can host your images elsewhere and link to them. Of course, to do this, you need hosting space and comfort with both FTP and HTML.

There appears to be a partnership with another company offering free hosting for images, but they say it’s for Windows users only. In any case, it certainly wasn’t as simple to use as Typepad.

Why Would I Want a Blog?

A blog is a digital soapbox. With it, you can rage against the machine, promote your business, protest the war, support the troops, talk about your pet rock, or anything else. If you’re passionate about your business (or anything else) a blog is a great medium.

A blog can also help you attract new business. Incoming links help your site rank higher in the search engines, and your blog is a great place to create links to your site.

For example, imagine you are a professional organizer. You could blog about how you helped people clean up their work areas, create links to organizational resources, and post tips on how to keep a clean desk. Create links to and from your blog and Web site and you’ll more than double the chances of a prospect finding you.

Tips on Your Blog

  • Write with your own voice, and what you’re passionate
    about
  • Try and write something almost every day
  • Link to other people’s blogs, and get them to link
    to yours
  • Blog posts don’t have to be long; sometimes a paragraph
    or two is enough

Where Can I See an Example of a Great Blog?

Why, right here!

If you’d like to talk to flyte about starting or promoting your own blog, please contact us.

–Rich Brooks

President, flyte new media

Capture Information from Your Web Site Visitors

CAPTURE INFORMATION FROM YOUR WEB SITE VISITORS

One thing your site visitors enjoy is their anonymity. They can learn about your company, find directions to your office, get prices on your products, view examples of your work, all without sharing one iota of personal information! Great for them, lousy for you.

Many of your visitors will gather information and move on…never to think about you again. (They don’t appreciate you the way that I do.) This is a missed opportunity! You may have the perfect solution to their need…if not now, later. How, then, to keep the lines of communication open?

To get visitors to part with their personal or contact information, remember back to the school lunch table when you wanted your friend’s pudding: trade them for something they value.

Chances are your visitors come to your Web site because they are looking for a solution to a problem. Offer them an article, a free sample, or a download that addresses a common need of your target audience. Trade your information for their contact information.

Here’s how it works:

A visitor arrives at your home page. You offer up a compelling headline of interest to your target audience:

  • Is Your Child Bipolar?
  • Free Red Sox Tickets
  • 10 Things Your Web Developer Doesn’t Want You to Know

Headlines that address avoiding pain rather than gaining pleasure are often more dramatic and will get people to take action (in this case, clicking the link.) Numbers often imply a short article packed with good information; thus, a good return on investment in the reader’s mind…another plus.

When they click on your link they’re taken to a page where they’re asked to complete a short form in order to view the article or be entered in a drawing. Gather as little information as possible for you to market successfully to them, despite your desire to know their household income and their favorite flavor slushie.

If you plan on marketing via email, you might offer an article available through email only, which requires them to enter their actual email address, as opposed to x@x.com (my personal favorite.)

Include a link to your privacy policy. If you don’t have one, write a clear, concise, truthful paragraph about what you plan to do with their information. Also make it understood that you reserve the right to contact them in the future, but at any time they can request to be taken off your list.

When you are ready to market to your contact list make sure it’s something of interest to your audience. As always, keep the focus on their needs and you’ll increase your chances of making the sale.

Not everyone will be willing to part with their contact information; however, those who do are going to be your best customers. Whether you’re a small business, a non-profit, or a charity, your list of contacts or customers can make or break your organization. Use this simple tool to get visitors to opt-in to your marketing.

If you’d like to talk to flyte about setting up a visitor data collection form please contact us.

–Rich Brooks

President, flyte new media

Increase Your Site Traffic Through Incoming Links

INCREASE YOUR SITE TRAFFIC THROUGH INCOMING LINKS

Over the past few months I’ve talked about ways to get more mileage from your Web site content by adding Share This Page functionality and creating printer-friendly versions of articles. These methods allow your site visitors to share your material and disseminate your marketing message for you. A third approach uses your content as bait to attract incoming links that increase traffic to your site and improve your rankings at the search engines.

Why Are Incoming Links Helpful?

Incoming links (links from other Web sites) drive more traffic to your site by increasing the number of paths to your site. In addition, they help you at the search engines.

An incoming link is seen as a “vote of confidence” by search engines and will improve your ranking. The importance of the page linking to you, the nature of the page’s content, the number of links on that page, and the words that are actually linked (usually displayed with an underline) all affect how important that link is for your ranking on a given search.

While you may have no control over the importance, content or number of links on another Web site’s page, you may be able to have some say in which words or phrases are part of the incoming link using the technique below.

How Do You Get Incoming Links?

By posting unique, interesting content in the form of articles, archived newsletters, and F.A.Q.’s, you give other site owners a reason to link to your Web site. However, don’t sit back and wait for someone to link to you…take action.

Here’s a simple method to increase the likelihood of an incoming link: ask for it. Include a “Link to This Page” button on every page that you believe has worthwhile content.

Just seeing this prompt will encourage people to link to your articles. They may have enjoyed your article but it didn’t cross their mind that they could improve the quality of their own site by adding your link to their Resources or Links page.

The button or link should open a popup window when it’s clicked. This new window will contain a message from you along with the HTML code the visitor can place on their Web site to create the link to your site. The benefit to the other site owner is that he or she won’t have to write the code. The benefit to you is that you get to control the message, as well as specify which words will be linked.

What Words Should You Include in the Link?

Let’s say your company, XYZ Corp., offers consulting services to new businesses. As mentioned before, words that are linked carry more weight than words that aren’t. A link that includes your company name (as opposed to a link that just says “click here”) will give you a bigger boost when someone does a search for “XYZ Corp.”

Likewise, a link that includes some effective key phrases will help you most when someone is searching for your services but isn’t familiar your company. “Business Consulting for Entrepreneurs and Start-Ups from XYZ Corp.” would cover all bases.

How Do You Write This HTML Code?

If you aren’t familiar with HTML you’re probably using a Web developer to help you with your site. Share this article with your developer and ask them to write the code for you. They’ll need to create the popup window as well as the HTML code for the other site owner.

In Conclusion

Quality content is an essential part of any successful Web site. However, the creation of that content can be time consuming. To maximize the copy’s benefits use all the techniques we’ve reviewed and you’ll get the most of your Web site’s content.

By creating links for Share This Page, Print This Page and Link to This Page, you allow visitors to carry your content past the confines of your Web site and attract new visitors to your sites through incoming links.

If you’d like to talk to flyte about leveraging your content to attract incoming links please contact us.

–Rich Brooks

President, flyte new media

Using Style Sheets to Create Better Printer-Friendly Pages

USING STYLE SHEETS TO CREATE BETTER PRINTER-FRIENDLY PAGES

Forget what I said last month about printer-friendly pages. I didn’t know what I was talking about.

Well, maybe I’m being a little harsh. Let’s just say that this month’s me is more educated and knowledgeable than last month’s me. It’s an ongoing process of improvement. I can’t wait to see how smart I am next month.

Using Cascading Style Sheets: A Smarter Approach

After writing that article on multiple approaches to creating printer-friendly pages, I discovered a method that appears to offer almost all of their combined advantages with none of their drawbacks. It’s my recommendation that this is the approach you should use on your own Web sites with few exceptions.

Without getting too technical–geeks can contact me directly for details–Web designers can utilize something called cascading style sheets (CSS) which affect the way a page displays. These style sheets dictate the fonts, colors, margins, links, and just about everything else that impacts the layout of a page.

One Web Page: Multiple Layouts

You can also use multiple style sheets within a single Web page: one can control the screen layout and another the print layout. This allows you to create one Web page that’s optimized for both the screen and the printed page. Utilizing this method–no matter how many pixels wide your Web site may be–it can still print within the confines of an 8.5” by 11” sheet of paper.

Style sheets can also control which parts of the page will display. For example, using CSS you can hide the navigation, images or banner ads when someone prints the page. Alternatively, you could hide something on the screen that would show on the printed page, such as some marketing copy or a copyright notice.

You can also specify different fonts for the print version. Most people agree that sans-serif fonts such as Geneva, Helvetica and Arial work best on the screen. However, on the printed page, serif fonts such as Times New Roman and Georgia are easier on the eye.

For Example

Below are two images; one shows a screen shot of our recent press release for the Healthy Children Project; the second shows the same page when printed. Before using dual style sheets, this page might have been cropped when printed; now it wraps perfectly on the page. In addition, the navigation has been hidden to allow for a cleaner printout. Finally, the body copy has been specified as Times New Roman, while the original version used Geneva.

Image of Web page on screen Image of Web page when printed
Web Page on Screen Web Page on Paper

Because you only need to create one version of the page (rather than a second “printer-friendly” version) this is a more cost-effective approach. Updates are easier and cheaper since there’s only one page to change. Often, even the most conscientious Web developer may forget to update the secondary “printer-friendly” version, leading to inconsistency on the site.

One caveat: a Web page needs to be set up with CSS to take full advantage of this approach. The time it takes to retrofit pages with CSS can vary based on how the pages were set up and the size of the site. Still, the future cost-savings should counter-balance any initial outlay.

If you’d like to talk to flyte about using CSS to provide better printer-friendly pages please contact us.

–Rich Brooks

President, flyte new media

Printer-Friendly Pages Will Increase Your Market Reach

PRINTER-FRIENDLY PAGES WILL INCREASE YOUR MARKET REACH

In last month’s newsletter we talked about how you can leverage your Web site content…specifically how a “share this page” feature can help your online business grow.

This month we’ll examine another method of reaching more people: printer-friendly pages. Each day more people turn to the Internet to conduct research on subjects from breast-feeding to diaper pails to digital camera reviews. (On an unrelated topic, my wife and I had our second baby, Sophia, two weeks ago.) When they find the information they need they often print these Web pages, allowing your site–and your brand–to travel even further. These printed pages may be filed away, shared with a friend, or posted on a communal bulletin board.

Many site owners don’t give this a lot of thought: if a visitor wants to print a page, just hit “print,” right? Well, if you’ve ever printed a page and had the right side cropped you know it isn’t always that simple.

Why Do Printers Crop Web Pages?

Most printed material comes on “portrait” oriented paper, 8.5″ x 11″, not the other way around. However, computer monitors tend to be of the “landscape” persuasion, leading to cropped text on the right side. (A Macintosh is smart enough to resize the Web page appropriately for the printer…which doesn’t help the 97% of your visitors on Windows machines.)

Web designers customarily create Web pages that have a minimum- or fixed-width size, which gives the designer more control over the way the pages display on the screen. This size–often based on the resolution of the monitor–is usually wider than a printed page.

Making Your Content “Printer-Friendly”

There are several ways in which you can make your pages “printer-friendly,” each with their own plusses and minuses. You’ll need to decide which one–or ones–best suit your needs.

Database Solutions/Content Management Systems

The most elegant solution is to have all of your content stored in a database and dynamically generate your Web pages. This method formats your content beautifully whether it’s on the screen, the printed page, or delivered in another format, such as “share this page,” an email newsletter, on a PDA, etc.) The downside is that this is the most expensive solution and isn’t appropriate for smaller sites.

Printer-Friendly Versions

This is how many of our clients address this problem. On Web pages that are likely to be printed, such as articles or white papers, they offer a printer-friendly version of the same content on a separate, fluid page which will properly wrap to any size size paper.

By clicking on a printer icon or appropriate link, a new window opens with just the article and possibly some identifiying information, such as a URL or the author’s name. The downside of this approach is that if a change is made to an article it needs to be made in both versions.

PDF Documents

PDF, or Portable Document Format, is another solution. It gives you near complete control over your page’s appearance when printed: colors, images, fonts, layout, clip art, and so on, all appear as designed. It’s especially useful when used for registration forms and other documents that require strict formatting.

It has its shortcomings, however. It takes additional time to develop PDF documents, they don’t update automatically when the page’s content is changed, and despite the fact a PDF reader is available for free, there is a small percentage of the population that can’t open them.

Fluid Web sites

It certainly is possible to develop a Web site that is completely fluid and will wrap to any width. The benefit of such a solution is that when an article is changed it doesn’t need to be updated elsewhere. It’s also the simplest solution for your visitor who wants to print a page; all they need to do is just hit “print.”

However, it does limit the width of images you can use on your site. If you have a logo at the top of the page that’s 600 pixels wide, that’s as “thin” as your page can shrink. It also limits the number and width of columns you can use if you have a lot of table data. There are also certain design approaches that can’t be used on a completely fluid design.

In Conclusion

As a Web site owner you should be looking to maximize your results. Printer-friendly pages allow you to extend your reach and get more mileage out of your content and your site. Just be sure to put identifying information on your printer-friendly pages, regardless of which solution works best for you. Your Web site address, contact information, or even a short marketing blurb are all appropriate methods of tagging your work.

Consider this: a lobster shack that only offers dine-in service can only sell to the tourists and locals who walk through its doors. A lobster shack that will pack lobster to travel and can ship anywhere in the U.S.will greatly increase its market share.

Package your content…to go.

If you have any questions or comments about this article, please contact us.

–Rich Brooks

President, flyte new media

Leverage Your Content to Reach New Prospects

LEVERAGE YOUR CONTENT TO REACH NEW PROSPECTS

ATTENTION: Join us on 5/30/2013 for a FREE live webinar on Turning Likes Into Sales.

If you’ve read our previous email or print newsletters, or heard me wax poetic at a Search Engine Seminar or in person, you’ve learned that it’s important to have unique, compelling content on your site.

Clients and prospects call us, asking how their site can rank higher in the search engines or how they can attract more traffic. I usually recommend that they start by posting content (in the form of articles, white papers, FAQ’s, etc.) to their site on a regular basis…content that is of interest to their target audience.

Why Content Helps Your Business

Often, site owners don’t understand how this will help. I’m here to tell you that quality content attracts visitors. First, search engines love content, gobbling it up for breakfast and returning regularly to sites that continually post fresh material. The content from your site appears on the SERP (search engine results page.) If you’re writing about what your prospects are searching for, you’ll appear on their SERPs.

Second, you can leverage the content on your site in several ways to bring in even more traffic and reach new clients. To paraphrase Archimedes, you can move the world if your lever is long enough. Here are some ideas that can help:

  • A Share This Page link
  • A Print This Page link
  • A Link to This Page link
  • An Email Newsletter signup link (deliver future content twice:
    through your email newsletter and your Web site)
  • Submit each new content-rich page to search engines through
    free submit pages; primarily Google and Yahoo

It’s easy to create links or icons for the first three or four items and post them on the articles on your site. Today we’ll talk about the Share This Page link.

Why Share a Page?

Whether it’s called “share this page,” “email this article to a friend,” or “recommend this site,” the benefits of having a visitor tell another person about your Web site or business should be obvious.

One of my clients recently asked why should he bother putting a Share This Page link on all of his articles. “How is this different from having someone just use the email this page option on their browser?” Good question. It’s true that certain browsers include a built-in “email this page” feature. However, there are a number of advantages to creating your own link.

Make It Easy for Visitors to Help You Out

Not all browsers offer the option of emailing a Web page. Often, even if they do, users don’t know about this feature or aren’t thinking about it as they read this article. A gentle reminder in the form of a link or icon may get them to think, “Janey was looking for a house. This article is right up her alley!”

Control the Message

When you leave it to your visitors to share your page, you lose all control of the message. By creating a simple form, you can choose to send the entire article or include only the link and a description (to encourage the recipient to visit your site.)

You can also include your own marketing materials in the email…your mission statement, links to featured products in your online store, a signup for your email newsletter, or whatever will help you achieve your business goals.

Gain Insight

With this simple form, you’ll know when a visitor is sharing your content. You can track which articles are being shared most often and which are receiving the most click-throughs from the recipients. If you’re curious to know whether it’s more effective to share an entire article or just the link, this is a perfect way to test out both possibilities.

In Conclusion

If you’re just posting new articles to your Web site you’re not leveraging them for all they’re worth. Simple online tools like Share This Page allow visitors to promote your company to prospects you wouldn’t have otherwise reached.

In future Honey Roasted Peanuts we’ll look at other ways of leveraging your content for optimal results.

If you have any questions or comments about this article, please contact us.

–Rich Brooks

President, flyte new media