Posts by Shane Bailey

The web is always growing and changing and people are constantly coming up with new ideas to help make things better both for the user and the developer. HTML5 and CSS3 are the newest changes to come to the web. There are a ton of new features that will make it easier on your users to both find and understand the content on your site. Some of these features add functionality like Video and Audio, some help with search engine optimization like the new structure tags, some help understanding like the new form tags and some just make the web look better like CSS3 drop shadows. In a series of articles we’ll go over these new functions and how they can help you and your visitors.

Lets take a look at HTML 5 first…

Page Structure

HTML5 introduces some new formatting tags to control the organization of a web page. This will help search engines and browsers understand the content of the page leading to higher search engine rankings for your site. These include the:

• < header >
  Typically a headline or grouping of headlines, but may also contain other information about a section.


• < na v >
  Defines the navigation or menu area, typically a list of links and should be contained in a section, header, or footer.


• < section >
  A section is a group of content that is related and can be nested inside of each other to organize information.


• < article >
  An individual entry in a blog, magazine, compendium, etc.


• < aside >
  An aside indicates content that is tangentially related to the rest of the page.


• < footer >
  The footer of a page typically containing information like copyright, who created or wrote the document, links to related documents, etc.

You can see how this new organizational framework would work in the chart below:

As you can see if it’s that much easier for a normal person to read, Google and Yahoo’s complex search engines should have an even easier time finding the appropriate content on a page.

Forms

HTML5 also added new functionality to forms. Most browsers do not support these functions yet, but we’ll show you on an Apple iPhone, Opera browser, and Safari browser how useful these new functions can be.

The new form functions include:

• Search
  When you start to type in the search field a small X appears to let you clear the field.




• Tel
  You’ll notice in the example that the iPhone’s number keyboard is enabled when the field is clicked.




• url
  You’ll notice in the example that the iPhone’s keyboard is enabled when the field is clicked.




• Email
  This field will check for certain characters like an @ and a . to make sure the email address is valid.




• datetime, date, month, week, time, and datetime-local
  Depending on your options this will either show a date picker, or a field to select a time or a combination of the above.




• Number
  This field only allows you to input a number or select the number by increments.




• Range
  This field brings up a new slider allowing you to select a certain range.




• Color
  This brings up your browsers color picker allowing you to select a color, but is not supported in any browser at this time.

In addition to these new fields there are also some improvements to how these fields work such as:

• Autofocus
  This allows you to set which field you want the users cursor to appear in when they enter the page.


• Placeholder
  This tag allows you to inset placeholder text into a field explaining what the field is for, when clicked this text then disspears.

Video and Audio

The < video > element is probably what most users are going to be excited about in HTML5 and as you probably figured out, it allows you to play a movie in your website. This tag can also contain images or audio associated with it in addition to video.

You may say, but I already have video on my website using flash! Well, that’s in the past now and to be honest, Flash is kind of clunky. First of all your users have to have a plugin to even see your flash video. To deal with the second, lets take a look at how the video is called into the page.

Here’s the old way:

Now here’s the new HTML5 way.

Not only is it easier to implement and much cleaner, but utilizing some of the options for video in HTML5 we can have a screenshot of the video appear and some text telling them where to download the video if their browser doesn’t support HTML5.

The HTML5 audio tag works in much the same way enabling sound on your website. Just think, you won’t have to worry about telling all your visitors to download multiple plug ins to see the content of your site. They’ll have everything they need already!

Coming Soon: CSS3’s new features

So you’ve developed your new website and set it live for the entire world to see. What do you do now? How do you know if anyone is visiting and if so, who are they? That’s where your website statistics come in. At first glance they can be kind of daunting. What’s the difference between unique visitors and hits? Don’t worry, we’re here to help. We’ve made this no-nonsense explanation of your websites stats so you can see what’s working and not working on your website.

Here are some of the more important statistics to look at:

Unique Visitors – This is one of the more important statistics to look at. The unique visitor’s statistic counts every IP address (we’ll say, computer) that visits your website. That means that if a user visits your site more than once (from the same computer) they will still only be counted once. There is a drawback to this statistic though. If someone visits your site from two different computers, the same user will be counted twice. Here’s an example, let’s say a user visits your site from their work computer, then goes home and visits your site from there, that user will be counted twice even though it’s the same user because they used two different computers with different IP addresses. Even so, this statistic gives you the most accurate count of how many people are actually visiting your website than any other statistic.

Number of Visitors – This is the total number of visits made by all visitors during the past month.

Visits/Visitor – The total number of visits divided by the total number of visitors which will show you about how many times your visitors revisited your website during the past month.

Pages – This statistic counts all pages visited on your site, but does not count graphics and other non-page files like hits does.

Pages/Visit –Pages per visit is an average reading of how many pages are viewed by each user when on each visit to your site. This, along with visits duration which we’ll discuss later, is a good example of how good your site is at keeping people interested.

Hits – This statistic counts every single file that’s accessed on your website. Each image, page, script, etc. will be counted as a hit. This figure is often read as how many people are visiting your site. If you’re looking for the answer to that, look to unique visitors to give you a better idea. Let’s say you have a page with ten images on it. Every time a visitor refreshes that page on your website those images and the page will be downloaded again, that’s 11 hits each time the page is refreshed.

Bandwidth – For most websites you don’t really have to worry about this statistic unless it skyrockets unexpectedly. This is a reading of the total number of bytes downloaded, which includes all graphics, pages, and downloadable files accessed by users. If this reading does increase unexpectedly a good thing to check for is outside (offsite) linking of files or images which can be seen by reading the Links section of your stats program.

Visits Duration – We spoke about this statistic earlier. This statistic tracks how long visitors stayed on your site before leaving. If you notice that most of your visitors are leaving in the 30-60 second range, don’t worry, that’s not unusual as most people online are more impatient than they are in. Another possibility is that they could have found the information they needed quickly, which means your website is working. If, however, you notice that no one is staying longer than 60 seconds you may need to reevaluate your website.

Entry Page – This statistic tracks the number of visitors who entered your site on each page. The highest number is usually the “/” directory, your root directory, or your index page which means that the visitor most likely came in through your normal domain name.

Exit Page – The Exit Page statistic tracks the number of visitors who left your site after viewing a particular page. This can let you know where your problem pages are. Most of the time the highest figure on this statistic will be the home page or root directory just like your entry page stats due to impulsive visitors.

Links – Links found in this section show the number of visitors who found your site by clicking on outside links or links from other websites to yours. These are usually broken down into search engines and websites so you can see which sites are helping deliver the traffic you need to be successful.

Search Keyphrases and Keywords– These two sections list the phrases and individual words that visitors used in search engines to find your site. This can be helpful in learning what people visiting your site are most interested in. Beware though, due to spam bots exploiting this technology you may receive some strange phrases and words.

Now that you know what your statistics mean you can tell how your site is working to fulfill your goals. If you’re site isn’t working for you, Integrated Webworks can help you get the traffic you need. Check out our Internet Marketing section to find out how.

Have you ever met a really well dressed person with no personality to back it up? That’s a good example of how it feels to find a well-designed website without quality content to keep you interested. You can’t gain long term customers with just a pretty face. Your content is the best way to build a long term relationship with your customers, but that’s not the only reason “content is king”.

Search Engines look at the content of a website more than anything else. A search engine can distinguish the quality of the content and use that rating as the most important value when placing your site. Google, Yahoo, Bing, and other search engine’s main job is to find the best and most useful content for a given search term. If you want to rank high in the search engines, you have to provide the most useful content for your customers. 

Speaking of customers, a user may be initially impressed by the look and feel of your site, that “wow” factor, but it’s not enough to keep them there for long, or to keep them coming back. Providing information that your customers can use is the main way to make people spend more tim e on your site. Integrated Webworks can advise you on the content of your site and, if needed, even outsource your content needs.

It’s also important to keep your information up to date. If you ate the same meal every night you would eventually get tired of it. A frequently updated site is necessary to stay on top of search engines and keep customers interest. Integrated Webworks can provide tools to update your site easily, allowing you to provide your customers with quality on-the-spot information.

In today’s social media landscape, good content is more important than ever. People are more willing and able to pass information around the web than ever before. If you can provide content that people are interested in, they WILL share it with the world. Services such as Twitter, Facebook, and a variety of mobile phone applications make sharing your information easy. When your customer shares your content online with a friend, that friend will share it with another, and soon your one customer will have multiplied to 10, 20, or more. Integrated Webworks provides social media integration to make it as easy as possible to share information with your customers.

1) Usability testing doesn’t have to be a huge task. Having five users test your site will catch most of the problems on your website before launch. The biggest issues are usually caught by the first one or two users and the rest of the users will usually confirm their findings. Any testing is better than none.

2) Users make purchases from websites based on perceived security, privacy, quality of content and design, in that order. Make sure if you’re selling a product or collecting any information about a user that your site is visibly secure with a privacy policy in place, then you’re free to work on the content and design of the site. This is particularly true in commerce, medical and insurance sites where trust has a lasting effect.

3) Modern Eye-tracking software has discovered a variety of useful information related to usability issues. For example, users tend to focus on faces and eyes when viewing a website, but if a face is looking in the direction of your content we will follow its gaze. This is an effective tool to drive users to information on your site.

4) First impressions count. Quality of design is a huge factor in establishing credibility. While content is king, packaging that content in a nice wrapper can give that content more credibility than it would have on its own and allow you to make certain pieces of information more prominent than others.

5) Most users still don’t scroll down a homepage, so make sure the most important content is “above the fold” which currently is around 768 pixels high. Some important content to include in this area are: the name of the website, benefits of the website, and the navigation elements relevant to the user.

6) Separating product pages from marketing pages helps you stand out. This allows each page to achieve its task efficiently. The marketing pages sell to the user while the detailed information pages provide additional information letting the user compare products. Provide detailed information on your products, but make sure you the information is easy to digest. Don’t use jargon your users aren’t likely to understand.

7) Most users will avoid anything that looks like an advertisement. Make sure your important content doesn’t look like an ad, because most users will treat it like one. The reverse applies too, people will click on ads that look like content, but this usually results in short-term revenue instead of long-term trust.

8) Forms are useful for communicating and collecting information from your users, but forms should be carefully designed for ease of use. Most forms are vertically oriented and read from top to bottom, so labels should generally be above the fields and left aligned. Try to keep the required fields to a minimum and if you must require certain fields, validating that information on the fly can be very helpful.  Most users find it annoying to fill out a form and have to go back and change information after an unsuccessful submission.

9) Icons aren’t as important as you think, in recent studies it was found that initial performance on a link is best with text alone, but frequent users can use either equally effectively. Icons are not faster relative to text links alone, but if you’re going to use icons make them as large as possible and collected into a taskbar area in a horizontal layout for to make them most usable. This is because users have to discover what the icon means on their first visit, while text links tell the user what the link is immediately.

10) According to recent studies an ideal search box is 27 characters wide. Making your search box 27 characters wide, much like Google’s search box, will accommodate 90% of user’s searches. This can be highly important depending on how much information is on your site. If you have clear and concise navigation, it is more useful than a search box, but if a user can’t find the information they are looking for in the first few seconds, the search box will become their primary navigation.