Web Design and Usability

There are a lot of visually amazing websites out there. They make use of the latest and greatest technology. They use flash animation like no others. They capture your undivided attention…for about 10 seconds, and then what?

How do you stop the animation? Where is the navigation bar so you can find the information you were searching for?

Just because a site looks amazing doesn’t mean it is an amazing site. Design and usability must compliment each other.

http://www.joneschijoff.com/ is an example of a confusing site. A visitor to this site will lose interest when they can’t find their way around.

http://www.start-the-change.org/ is an example of a visually nice looking site but what is it? Why can’t you click on anything? How long does this intro video go on for?

Some of the most often used websites have very minimal UI designs. Facebook, Craigslist, and Google are three that come to mind which rely on a very light interface. When you decide it is time to make your presence felt on the internet and start planning your site, make sure you have a reason for your design.

[arrow_list]

  • Is 3D necessary?
  • Is there a purpose for Flash animation?
  • Did you add more when less is sufficient?
  • [/arrow_list]
    Most users want sites that are easy to navigate so they can quickly find the information they are searching for. Design can often get in their way leading to a bad user experience. Design needs to go hand in hand with the content creating a site a visitor enjoys looking at while they easily find what they came for.

    Contact me today to see how I can help you get started with your website or help you update your current one.

    Search Engine Optimization (SEO)

    What is SEO? If you browse twitter, you will find a million SEO Gurus who promise to take your website to the SEO promised land…page 1 of the search results.

    They all claim to have the magic formula to optimize your site to land it on the coveted first page but the secret is quite simple. If you have fresh, relevant content that people are searching for, your chances of landing on the first page are much higher. There are millions of websites out there so simple math will show only a few can land on the first page of a search.

    How can you get your site on the first page then? There are several ways help improve your chances as search engines crawl through your site. You can make sure you site has descriptive titles, keyword meta tags, optimized links and so on. You can add titles to your images. Ultimately, however, your content is going to be the key to high search rankings. Do people find what they need on your site? Do people share your site with others, do they link back to your site? Do you update your site often to keep your content relevant?

    If people find what they are looking for on your site, your ranking will improve. One factor Google takes into consideration is how many sites link back to your site and how relevant are those sites. When your site provides the answers to what users are searching for, they will link to it and share your site with others. As more and more sites link back to yours, your pagerank will improve.

    Contact me today to see how I can help you get started with your website or help you update your current one.

    Custom Facebook Tabs

    I am sure you have seen a Facebook business or fan page with a customized tab. Custom tabs are a great way to promote your product, brand, or small business but they can be difficult to create if you do not know HTML, CSS, JavaScript, etc. Facebook even makes it a little more challenging by using their own version of HTML called FBML. Hiring someone build a custom tab for you can be an expensive investment which is where Pagemodo comes in.

    Your Facebook Page in Your Own Style

    I built a custom landing tab from scratch for the Microsoft Imagine Cup and, while you have complete freedom to make it look and operate however you want, it can be a major pain trying to get it to display and function perfectly across all browsers.  Pagemodo does all the hard work for you.  You simply choose the plan that is right for you.  They offer a free account with the ability to build 1 custom page and premium packages for $9, $19, and $59 per month.  Once you sign up you can select from several different layout options.  Depending on which template you choose, you can upload images and videos to promote your brand.  Once you finish uploading your content, you simply publish it to your page.  No coding, no set up, no dealing with FBML, Pagemodo does it all for you.  Once you add the application to your account and publish it, you have a customized professional looking Facebook tab which can be set as the landing page for all new visitors.

    I quickly put together an example on my Facebook page to see how it worked and I was impressed with how easy the process was and how many layouts they had to choose from.  Now I just need to go back and put more time into the actual design.  If you have been thinking about creating your own customized Facebook page, give Pagemodo a try.

    Fire and Rescue Theme

    This theme was requested by a user who works as a Firefighter after he saw my previews for the Armed Forces themes. I loved the idea of doing a theme to honor the men and women who put their lives on the line to battle blazes and keep us safe.

    Along with the theme, you get the customized New Tab King extension designed to match the Fire and Rescue toolbar. The NTK extension adds useful functionality to the normally blank new tab. Other browsers such as Opera, Safari, and Chrome have similar functionality when you open up a new tab. NTK displays your most visited websites in order of frequency, previously closed tabs and plenty of other customizable features.

    You can install the Fire and Rescue theme here.

    Bing vs. Google

    I found an interesting site tonight. http://www.bing-vs-google.com/ lets you enter a search and view a side by side comparison of the Google and Bing results.

    For the first time in a very long time, I saw Google react to a competitor. Since Bing’s release a little over a year ago, Google has redesigned their results page, added the option to put background images on their home page, revamped their image search and more. Why? Easy, they have real competition now and competition leads to innovation and improvements. When Microsoft decided it was time to take the search engine battle seriously and threw a very large amount of money into the overhaul of Live Search, the best thing in web searching happened for the us, the consumer and end user.

    This cool site lets you compare search results from both search engines to discover which gives better results. Is Google the best search engine? Some would say absolutely, look at how many people use it. It is obviously the best. Well, by that logic, Internet Explorer is the best browser hands down. More people use it than any other browser so its obviously the best. I am pretty sure most of the people who use Google (and everyone that uses Firefox, Safari, Chrome, etc.) would disagree with that statement.

    Just because Google is the most used search engine does not mean it is the best. As with IE being the most used browser due to the fact it comes bundled with Windows and is the only browser many users know about, Google is the most used search engine because it is what most users are familiar with.

    Is Bing better than Google? I don’t know. That is entirely subjective and completely open to debate. Is Google the best? I don’t know. Maybe, maybe not. One thing I do know, Microsoft is serious about competing with Google and taking a huge chunk of it’s market share so Bing is worth taking a look at. A good place to start is at http://www.bing-vs-google.com/.

    Also, when you install my themes you have the option to install Bing in your browser search window and start using it. You can always switch back easily by clicking on the icon and selecting your favorite search engine.

    You may find that the answer to “What is better, Google or Bing?” is…yes.

    U.S. Navy Theme Available

    I am excited to announce that I have received permission from the Navy to use their official emblem and release my theme. You can view the listing at https://addons.mozilla.org/en-US/firefox/addon/57885 and install it. Currently, the theme is listed as experimental while it waits on review and approval from Mozilla to be made public.

    I have filled out the paperwork for the Air Force and Marines so hopefully I will get permission to use their official emblems soon. The Army will take a little longer because I couldn’t find their contact information but I was finally able to get an email to the proper department. Due to the recent snow on the East Coast however, they have not been able to get to their offices so I am still waiting for them to review my request.

    Personalized Theme Customization

    I get a lot of feedback from users for various reasons and one thing is certain, I cannot make everyone happy all of the time. Some users like light backgrounds with dark text while others like dark backgrounds with white text. People like different font sizes, different font colors, and various other looks within the theme.

    I try to design my themes based on the majority of feedback but I want everyone to be able to view their theme the way they want it. There is a way for everyone to be happy but it requires a little self-customization by using the userChrome.css file. This file is located in your user profile directory but how you find that is different for each OS.

    Windows XP: C:Documents and Settings[user name]Application DataMozillaFirefoxProfiles[random string].defaultchrome

    Windows Vista/7: C:Users[user name]AppDataRoamingMozillaFirefoxProfiles[random string].defaultchrome

    Mac OSX: /Library/Application Support/Firefox/Profiles/[random string].default/chrome/

    Windows users will find that they cannot see the Application Data folder unless they change their view settings to display hidden folders. XP users must click on Tools, then Folder Options. Vista/Win 7 users much click Organize, then Folder and Search Options. Then, select the view tab and change the settings to “Show hidden files and folders”.

    In the chrome directory, you will likely see a file called userChrome-example.css file. You can rename it and delete -example. If you open this file you will see:

    /*
    * Edit this file and copy it as userChrome.css into your
    * profile-directory/chrome/
    */

    /*
    * This file can be used to customize the look of Mozilla’s user interface
    * You should consider using !important on rules which you want to
    * override default settings.
    */

    /*
    * Do not remove the @namespace line — it’s required for correct functioning
    */
    @namespace url(“http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”); /* set default namespace to XUL */

    /*
    * Some possible accessibility enhancements:
    */
    /*
    * Make all the default font sizes 20 pt:
    *
    * * {
    * font-size: 20pt !important
    * }
    */
    /*
    * Make menu items in particular 15 pt instead of the default size:
    *
    * menupopup > * {
    * font-size: 15pt !important
    * }
    */
    /*
    * Give the Location (URL) Bar a fixed-width font
    *
    * #urlbar {
    * font-family: monospace !important;
    * }
    */

    /*
    * For more examples see http://www.mozilla.org/unix/customizing.html
    */

    You can add, change, and customize many different things in the theme that you do not like. Once you add the changes you want to make and save the file, your changes will appear once you restart Firefox. If you have any specific questions about to change something, please send me an email and I can give you the changes you would need to add to the userChrome.css file.

    To make the Menu popup windows light with dark text, right click and save this file and place it in the appropriate directory listed above.

    Julie & Julia

    My wife got the movie Julie and Julia as a Christmas present from her friend and we finally sat down together and watched it. The movie was entertaining, had some funny parts and Meryl Streep did an amazing job as Julia Child.

    After the movie I did some research on Julie Powell and the Julie/Julia Project. I read some of her blog and found a Newsweek article about her and some of the negative feelings so many people have about her now. I was shocked to see how many people strongly dislike this woman even though they have never met her.

    Based on what I found about her, I am sure the Julie Powell character played by Amy Adams was cleaned up and made more likable than the Julie Powell in real life but the level of scorn displayed by so many people who left comments about her was sad. Many of them said she was the perfect example of the sense of entitlement people have and the get rich quick mentality of so many Americans. They attacked her for being a bad cook and ripped into her for being a terrible writer.

    I don’t know Julie Powell, before today I have never read anything by her. I only know her story from the movie and what little I did read after watching it. She may be a terrible person, who knows. She may not be. I doubt anyone leaving comments about her one way or another has ever met her. However, what these articles and comments do reveal is the propensity for people to attack those who become successful.

    Julie Powell was a normal person just like 99% of us living in America. She was struggling with day to day life and wanted to do something different. She decided to start a blog to narrate her journey through Julia Child’s cookbook as she cooked every recipe in one year. She didn’t know that anyone would read it. She had no idea it would turn into a movie and lead to her future career as an author. She must have been a good enough writer though to attract readers who followed her journey through the cookbook. She must have been a good enough writer to land a movie deal for her story.

    One person who left a comment on the Newsweek story nailed it in my opinion.

    I detect a whole lot of jealous bloggers out there. Get over it, folks, and be happy for her success. I saw the film last night. Just beautiful.

    We love to attack those who make it, especially when we perceive in our own mind that they don’t deserve it. Julie Powell’s success has no impact on my life nor does it have any impact on the lives of most people. It does not make my life any worse that she made money doing what she did and it doesn’t make any one’s life better to attack her success. In fact, those who hate Julie Powell and attack her likely make their own life worse by getting emotionally tied to a person they do not even know.

    The Internet is a great tool but it has connected a world of strangers together in a way that makes us think we personally know others that we have never met. It gives us the very sense of entitlement she was accused of having to attack strangers we have never met because we feel they have wronged us or gained some advantage over us. “Authors” attack bloggers because they aren’t real writers. “Singers” attack contestants on American Idol because they aren’t real musicians. “Regular” people attack bloggers and American Idol contestants who become successful because, well, they are envious that a normal everyday person made it big when they didn’t. The success of others does not have any relevance on our lives unless we allow ourselves to become bitter and envious towards their success.

    I say good for Julie Powell. She set out to do something and became successful at it. What she does with her life, her marriage, her success is up to her. It sounds like she has made some bad decisions and for that, I hope she can turn them around for the better. Apart from that, her success affects my life in one simple way. She wrote a story that was turned into a movie. I watched that movie and for 1-2 hours I was entertained.

    Armed Forces Themes: Update

    I am working on getting these themes ready.  The themes are done and ready to release but I am waiting on the branches to approve my license application and give me the go ahead.  I was misinformed about the logos/emblems being public domain so I did have to go through their licensing department and get approval.  I have filled out the paperwork for the Navy and the Air Force and am trying to get the Army and Marine Corps on board as well.

    Hopefully it won’t be too much longer.

    Here is a preview of my themes.

    Armed Forces Theme Previews

    Honoring America's Armed Forces

    As I update all of my themes with minor changes for the upcoming release of Firefox 3.6 and get everything straightened out and fine tuned with the new addition of the Ask search extension and listings on AMO, I have many new themes in the works that I think many users will appreciate.

    When I started doing themes I always had a few ideas in mind that were never quite possible. As my abilities with CSS, JavaScript, and XUL grow and my understanding of how to implement features to make things easier for those of you who use my themes those ideas are now becoming possible. One of those ideas was to make themes to honor the members of our Armed Forces. I recently had a conversation with my cousin, who is retired Air Force, and another retired member of the Marines who gave me some key information on how to move forward.

    Right now things are in the design phase but I hope to have them out and ready to go very soon. If you, or a member of your family, serves in the Army, Navy, Air Force, or Marines I would really appreciate feedback on how you would like these themes to look. These themes are to honor the brave men and women who fight to keep our country safe so I want to get it right and put a design together that does them the justice and honor they deserve.

    I know a Firefox themes may pale in comparison to what they do for us but this is what I do and it is one way I can say “thank you”.