Siteboxpro Blog on Web Design and Related Topics

Siteboxpro Video Portfolio

2011-05-29T13:57:00.000-07:00

We were playing around with Animoto this afternoon and put together a quick portfolio video...
Siteboxpro Video Portfolio

Name, rank and serial number - How do you get people to fill out your online forms

2010-09-23T11:06:00.000-07:00

I am sure you have seen some war movie in which the captured soldier is asked about the secret plans, and even under torturous conditions he will only provide his name, rank and serial number.

Your website visitors feel the same way when you hold information "hostage". They are going to clam up, and all you'll get out of them is limited info, or worse - nothing at all!

Keep it simple and necessary - Can you get away with only the name and phone number? If your visitor is serious, they will provide real information. Any additional information you require can be collected with a followup phone call or email.

Tell them what comes next - your visitors should know what is going to happen after they fill out the form. Will they have to check their email for a link, will something start to download or redirect them to the content they are requesting.

Send a confirmation message - While this has nothing to do with them filling out the form, it has everything to do with marketing. What if they stumbled onto your site and accidentally closed their browser? Now, they have an email confirmation page with a link back to your site! Smart move.

Your site visitors came to your site to make a purchase or engage your services, don't make it hard for them to get the process started online. Online forms are a vital part of your website (or at least it should be), make the most of them.

Must have iPhone apps for web designers

2010-05-19T11:26:00.000-07:00

If you are like me you know that the iPhone is more than just a cool toy, it can be a valuable tool and resource. And, if like me, you are a web designer who not only creates websites, but is involved with maintaining, tracking, enhancing and almost anything a clients asks to have done - you know how important it is to be "connected" at all times.

Now with all that said, here are my most used apps - these aren't just apps i saw on some other list page, but rather apps i used weekly, if not daily (and i will keep it brief by just giving the app name, the usage and why you need it.)

Analytics - This app is by AnalyticsApp.com and it is a complete Google Analytics application. You can get your Google stats instantly and you can track a huge number of sites.

FTPOnTheGo - Wow, this has come in very handy. This FTP client allows you to download files, like HTML, JSP, PHP or really anything and edit them in a text editor and send them back to the server.

GoDaddy - I have purchased tons of domains for clients on my iPhone.

CC Terminal - I can get paid anywhere anytime. this credit card app is easy to use and connects to your authorize.net account.

SEO Ranking - Add your domain, enter your keywords and find out where your site ranks. this app also keeps a graphical history so you can track your SEO successes (or slips).

That's it. I have a couple others dedicated to just web stuff, but I don't use them as much. Oh, the names that used above are how they appear on the phone, so if you search the App Store they should come up. They aren't all free either, but Analytics and FTPOnTheGo are worth the price.

Click here, click here!

2010-02-09T17:30:00.000-08:00

I was recently involved in a discussion regarding website usability with a few fellow web designers. It was during this conversation that I thought about the word "designer" in our titles. Most would say a web designers job is to make a website look good, and the siteboxpro team and myself would not argue with that - but there is more to it.

My REAL job is to ensure that our clients get a great website AND their clients get a great web experience. A great web experience is one in which the user is able to find information, navigate the site, and get what they expect. Plain and simple, the site should be easy to use. I've put together a very short list of things that help make any (your) website more user-friendly:

Click here! - if this phrase or hyperlink appears on your site, remove it. Instead, let the description be the hyperlink - example: "Click here to register" or better put "Register".
Going Home - your logo (which should appear at the top of your page) should be clickable and return the user to the homepage of your site.
PDFs and hyperlinks - open PDFs in a new window. All other hyperlinks should be in the same (parent) window - unless you are sending the user to a different website entirely.
No underlining - underlined text should be reserved for hyperlinks - use other typographical elements such as bold or italics to emphasise.
What's the status? - hyperlinks should have 3 states - not visited, visited and active - make sure you are using colors and decoration to let your visitors know where they have been and even more importantly where they haven't!

Simple things go a long way. It is the part of every web design to ensure a website is functional, easy to use and - of course - looks good.

Empty Anchor Tag is Not Clickable

2009-10-13T06:49:00.001-07:00

From time to time, not often, but it happens - we here at SiteBoxPro get stumped with browser quirks. Something will work great in one browser, but totally fail in another. We don't necessarily promote one browser over another (Firefox rocks), but we do have to implement websites that work across the most common ones.

With that said, we had a situation that required the use of an empty anchor tag. In FireFox everything worked great, but in Internet Explorer (7.x) it was not clickable. We added a non-breaking space - still no go. After some Google searching we found the solution: add a transparent 1px gif as a background image. Odd right? But it worked like a champ. Here is the info we found:

"Say you have an anchor element that you've given display:block and some dimensions with no content or background image, in order to make a clickable area, but in Internet Explorer it's not clickable. In order to keep the anchor invisible you can add a transparent 1px background-image. Suddenly, Internet Explorer understands that this is a clickable element. "

Thanks to the folks at iBloomStudios! Great post guys - and we wanted to spread the word.

Here is our code:


.polBox {
 display: block;
 height: 60px;
 width: 140px;
 position: absolute;
 left: 360px;
 top: 176px;
 background-image:url(/images/transPic.gif)
}

Here is our HTML


href="http://www.siteboxpro.com" target="_blank" class="polBox"

Does my business even need a website?

2009-10-03T21:49:00.000-07:00

Yes.

Ok, maybe I should elaborate since a one-word, one-sentance post doesn't cover all the "why"s you might have. But, truly the answer is yes. Without question, your business should have a website. Why not take advantage of a very practical, useful and more importantly - affordable medium, such as the internet.

Now, with that said, does your business website need to be come monster web, with hundreds os pages, links and graphics? Does it need to cost $4000? No. It can be 1 page. That's right, ONE SINGLE PAGE. That page needs to cover the who, what, where, when, why and how or your business. Anything more than that, for the sake of this article, is gravy!

The simple fact is, wait for it....people use the internet! Shocker, right? They use it before they make a purchase, they use it to find businesses and as part of their research. We aren't even going to talk about sites where a consumer can actually make an online purchase.

Another good reason to have a site, even if it is a one-page online-business card site, is to feed other sites. You know why they call it "the web", because it is a woven network of shared\sharable data. Your one-page can be used to feed other pages, such as online yellow pages, listing sites and professional directories, and you, for the most part don't even need to do anything but sit back in reap the rewards.

We hope you would select SiteBoxPro to get your site up and running, but no matter who designs and hosts your website we hope that you would explore the web as a place to promote your business.

Can social networking hurt your business?

2009-09-18T19:00:00.000-07:00

Social networking is a great tool in marketing your business. A small amount of time and effort on a weekly basis keeps customers informed, and more importantly keeps your company's name in front of their eyes. But, is there a downside?

We here at SiteBoxPro can think of a few scenarios in which social networking can actually hurt you business:

What are others saying about your business: you should not respond to every negative comment said about your company, but be aware of negative comment and we suggest you combat negatives with an equal amount of positives (real positives, not just stuff you made up).
Right content, wrong location: Make sure the sites you use to network are used by the people who would benefit from your business. Different audiences and demographics use and prefer differnt sites, make sure you are hitting the right ones.
Sitting it out: If you are one of those people who think that social networking isn't right for your business, think again. You can take advantage is a the most attractive feature, which is the price...FREE! Using the internet is a first step in making almost any purchase, make sure you products and services are respresented.

If you have a comment or question, post it here, We want to get you involved, and maybe others could benefit from your experiences. What has worked for you? What has failed?

Is Superscripting messing up your line height?

2009-09-03T07:28:00.000-07:00

If you have ever added a registration ® or trademark ™ to your website content and then superscripted it (making it slightly smaller and pushed to the top) then you also know that it messes up your line spacing (the space between lines is taller than the others).

The fix is simple, just create a style for superscript and give it a line-height of zero:

sup {line-height: 0px;}

Its a nice little trick and is supported in (I think) every browser.

Social Media Tips

2009-08-31T07:58:00.000-07:00

If you are using Twitter, Facebook, LinkedIn or other social media tools to promote your business or brand, make sure your website also drives traffic to these outlets.

This can be accomplished simply by creating a link or graphic to your Tweets or Facebook page or can be as complex as integrating your most recent Tweets or Facebook status updates directly on your website. This type of cross-linking builds fans, followers, etc. and it is great for SEO (search engine optimization).

For help with your social media marketing, contact SiteBoxPro today!

User Centered Design

2009-07-15T20:07:00.000-07:00

User Centered Design is the process of placing the user experience or the users perspective first. This philosophy determines a great deal in how your website is designed, the naming of menu items, links and even photos.

Thinking about your audience will then lead you to thinking about how to progressively "walk" them through your site and ultimately brining them to your "call to action" (how they signup or make a purchase). What information is useful prior to purchase and do they know what the next step is in the process.

Here is an example. My son is on a swim team and their end-of-season banquet requires the purchase of a ticket (part of their fund-raising). As parents we were told to go online and pay for them.

After a good 2-3 minutes of searching, the ticket purchase information was located, buried in the online store. There wasn't a single mention or link on the homepage of the website to the store's item. The event calendar had no link to the ticket purchase page either. How many phone calls did this generate, and if this was your business - how many people would just give up?

Remember - think as a site visitor who knows NOTHING about what you do, what you sell, how to buy, own, subscribe or rent it.

Just in case you wanted a stinking badge

2009-06-10T19:21:00.001-07:00

Adam Kalsey create a nifty badge generator, in case you don't know what a badge is here is the one we created:

Ok, so their dorky and simple, but there inlies the beauty of the badge. Simplicity. Sometimes making something fancy or overly-ornate does not always translate to better. Which is our "Smart Things" tip of the week, if you can keep it simple, do so.

Think about the purpose of what it is you are creating, whether is be a simple badge (also refered to as sticker button) or an entire site. In the case of this button, the text is clear to read, and when linked will properly represent to the visitor what they should expect to see (the SiteBoxPro.com homepage).
Check out Adam's button creator at: http://www.kalsey.com/tools/buttonmaker/ , play around some as it might be a little tricky to get the desired widths of each box, but fun at the same time!

Lesson: Margins vs Padding

2009-06-05T14:06:00.000-07:00

Within CSS margins perform are almost the same function as the CSS Padding attribute, except for one important difference: a margin defines the white space AROUND an HTML element's border, while padding refers to the white space INSIDE the element border.

What are keywords and how to pick'em

2009-06-02T13:03:00.000-07:00

Keywords are single words or phrases that, when either used repeatedly in a single web page or set within particular HTML tags, act to indicate to a search engine the intent of the page and it's content.

In days of old (ok, maybe 5 0r 6 years ago), this all could be accomplished using META data (also know as META tags). The overuse, or moreso ABUSE or META data made them obsolete. Search engines are smarter now and rely on page element (title tag, page name) and content to determine which words are key.

This is not to say that you can not control, and in most cases very well, how your page is read for keywords, but one of the overlooked aspects is the selection process. What are your keywords? What should they be?

Think from a SEARCHERS point of view!
If you sell apple seeds on line, think about the different ways people might discribe what you do. Obvious keywords like "apple" and "seeds" come to mind, but what about "growning fruit" or "fruit trees"? Thinking in these terms will help you particularly when approaching a competitive market.

What sets you apart?
Again, using apples as an example, maybe you want to create a page about "Golden delicious", and how you are the areas largest seller of Golden delicious apple seeds.

Remember: Nothing happens overnight.
Be patient, and willing to try different combinations of words and phrases. To do this, you will need a good site statistics tool, you could even use Google Analytics, which can track which keywords got people to your site.