It can be really difficult to get a design right, especially for your own company. I'll be launching a major redesign of our website later this week, so I can definitely empathize.
I have a few suggestions for areas for improvement, some of them technical, some not. It's a little detailed, but please don't get discouraged because I mean it to be constructive and helpful. Hopefully you'll be able to gain some insight from it. I'll start off with the design related comments.
Design
It really seems as if you have a few different styles here, and they don't quite mesh. The top navigation bar is sleek and iPod-ish, but it doesn't match the latest news bar below. The navigation on the side is more of a grunge style. The header and footer are something else entirely. You may want to look at making a more consistent style throughout. I would pick one style and then evaluate each element based on whether or not it fits visually.
There is also a lot going on with each page; probably too much, I think, to be as effective as you might want. For each page, pick a primary goal to focus on, generally called a 'primary call to action'. This goal can be informational (you want to inform the visitor about your services or showcase some work), or it can be actionable (you want the visitor to fill out your contact form, sign up for your newsletter, go to another page, etc.). You can also have a secondary call to action, which should complement the primary call, but represents less of a commitment. An example of this would be having a primary call of filling out a free quote form and a secondary call of finding out more information about your services.
Almost all of the content on each page should support the theme of your calls to action for that page and should directly or indirectly encourage the reader toward your primary goal. There are different ways to visually direct the attention of a visitor including contrast, repetition, alignment, proximity, size, color, images, motion, sound, and your copy.
Each content block should be evaluated on the basis of whether it supports the primary call or distracts from it. Those that distract or call attention away from the primary call should be removed or given a page of their own, if needed. Some content blocks, like navigation, may not be removable in all circumstances and so you should make an effort to minimize their visual impact in relation to the primary call to action.
Put another way, it should be blindingly obvious what action a user should take for each page. Simpler is often better because it's more usable and eliminates indecision. That doesn't mean you can only have two links on each page, but it means you should carefully consider each element and emphasize accordingly.
Let's take a look at what this could mean in terms of your design. Because motion is a very strong visual element, the eye is drawn instantly to your graphic in the upper right of your header. You might say, That's good, right? It shows that we can do really cool Flash effects. That may be so, but graphic overpowers the contact button right below it, which is more probably your intended call to action. The next most powerful visual element is probably your 'Houston Web Design' banner, but again, it doesn't lend itself to an action. There are too many strong visual focal points scattered around the page that as a visitor, I become confused as to what I should do next. Because of that, many visitors will simply give up rather than explore further.
There are also some other unneeded elements in the design. You don't really gain anything by featuring the search engine and Joomla logos. In fact, those images add to the visual noise. I'd recommend removing them and putting them on their own page. I'd also recommend placing all of your social media contact information in a single content block rather than having some at the top right and others at the bottom.
A few final pointers on design before moving on to the technical suggestions. Experiment with using more whitespace. A lot of text can be overwhelming and more whitespace can actually have a calming effect. Also, try lowering the opacity on the reflection for your headers. The effect as it stands is a little too much. Your shape of your logo is great, but the color combination makes it appear washed out, especially against the background. The gradients, shadows, and the beveled edges on the header text are also overdone and don't convey the most professional image. For your header, I'd suggest simplifying it by using solid color text, without the special effects, and using the same font for 'Modern Media Studios'.
Technical
Yahoo has some great resources for making fast-loading websites that I really recommend. One of them is the
YSlow Firebug plugin, which runs on Firefox. Download the plugin and also read their best practices guidelines.
There are a few things from their list that could make an immediate impact on your website. Right now, your homepage is weighing in at about 374 kilobytes and make 63 file requests for an empty cache. It might be hard with Joomla, but you could probably get that size down to around 100K and about 10 file requests. Here's how:
Combine your CSS images using CSS sprites. You have 34 right now, you could probably get this down to 2-3. Combining the images will also reduce the overall page size in addition to reducing the number of requests.
Use repeating backgrounds where possible. The gradient part of your background could be 1 pixel wide rather than 777.
Reduce the level of detail in your images if possible. In some cases, there is no visual difference in a lower resolution image, but the file savings will be substantial. You can also reduce your color count to reduce image file size.
I would highly, highly recommend against using both MooTools and jQuery together on the same page. They both accomplish the exact same thing and each library represents a significant percentage of your download size. Any script or plugin for one library can be found in the other. A place you can start looking is
Ajaxrain.com.
Combine your JavaScript files together where possible. Older browsers can only handle a few concurrent downloads at a time and having multiple large JavaScript files can significantly affect your page's rendering time because JavaScript files block other downloads. Because of this, it's also recommended to place the JavaScript at the bottom of the code whenever possible so that it is rendered last. The creator of YSlow has a neat tool called
Cuzillion that can help you find the optimal order for the elements of your page.
You may also be able to combine some of your CSS files.
I would also strongly consider getting rid of your Flash header. In addition to the design issues it represents above, it also comprises nearly 25% of your page download size, for each and every page. I would recommend creating a Flash showcase page rather including the Flash header on every page.
This is minor, but you also have two favicon files, but you only need one.
Other technical issues are also minor, but include validating your HTML and CSS. Your CSS may not be able to validate fully because of your rounded corners, but there are still a few errors there that don't have to do with rounded corners.
Regarding the perceived delay on the dropdowns, it's probably because the delay option in the dropdown script is set too high. It looks like the default is 800 milliseconds, but if you drop that down to 500 or below, it'll feel more responsive.
Miscellaneous
I know it's probably there for SEO, but from a usability standpoint, the list of different towns at the bottom isn't ideal. I'd recommend getting rid of the links and use a separate SEO and/or PPC campaign for each of the town landing pages.
A search function would also be helpful.
I hope this wasn't too much all at once and I do hope that it's helpful. I want to encourage you because you're close and with just a few minor changes, you could make quite a nice site. If you have any questions about what I wrote or need me to clarify something, feel free to ask. Good luck.
