November 19th, 2008
CSS Tutorials
SitePoint CSS Tutorials - Sitepoint’s collection of useful CSS tutorials for advanced CSS users.
CSS Slicing Guide - Tutorial covering how to create a CSS structure by slicing a single image file.
Position is Everything - Analysis of common CSS bugs and instructions on how to fix them.
Floatutorial - Comprehensive tutorial on using float with CSS.
CSS Properties
CSS Properties - Alphabetical listing of every CSS property.
CSS Code Examples
glish CSS Layouts - Examples of some basic cross-browser CSS layouts.
DynamicDrive Code Library - Collection of submitted CSS code samples showing how to make good looking menus, forms, divs and more.
Web Design Library - Extensive library of CSS articles, tutorials and example code.
CSS Font Styling
CSS Font Reference Sheet - Reference sheet for using CSS.
Tags: CSS, resources, tips
Posted in Web Development | No Comments »
November 17th, 2008
From the obvious points to the light-bulb-over-the-head moments, there is a lot of advice floating around out there for aspiring web designers. Here are 5 pieces of advice you’ll get from anyone with experience:
Plan it out! Congrats, you’ve landed the project and now your just itching to go start the build. But you’ll save time in the long run by having an overview of your design. It just makes sense to do a site diagram in Visio or, if you’re old school, pick up that pencil and paper. You’ll catch the obvious mistakes/problems early on and will be able to fix them before its too late. As an added bonus, it gives clients something tangible to look at while you explain your ideas.
Practice, Practice, Practice. Once you’ve got the basics down practice. Volunteer (aka do work for free) at first to find your style and build up a portfolio. Do a site for your church/favorite local pub/barbershop quartet…whatever. Build up and maintain a few sites of your own - people will generally be more impressed with what you can do rather than where you went to school etc.
Be a “Jack of all Trades”. Web design is a competitive market, so don’t expect to be able to learn the basics and immediately land freelance jobs. Make yourself attractive to potential clients by learning HTML, XHTML, PHP, SQL, CSS, and Javascript. Its unrealistic to become an expert in every single one of these - but it pays to be familiar with them all.
Get Inspired! Take a look around the Internet for examples of good design (there are countless galleries around that were created for this purpose). Find out who designed your favorite sites and seek out their other work. Don’t steal their designs - but pay attention to the fonts, color schemes, and techniques they are using. Pay attention to things outside the world of web design as well; posters, menus, art, even graffiti on the street can be great sources of inspiration when your stuck.
Last but not least…
Go the extra mile! Experiment with new techniques and try things that would normally fall outside your comfort zone. Be available to your clients - this doesn’t mean you have to answer when they call you at 3am (unless your up anyway of course) but being approachable will make the relationship more successful. While you’re at it back up their site for them, clients will love you if you’re able to give them back lost material if/when something goes wrong. In short, do everything in your power to continue to grow as a designer and foster great relationships with clients - their recommendations are often the most direct route to your next project!
Any other bits of advice you’ve heard over the years that were particularly helpful? Let us know!
Tags: advice, guide, tips, Web Design
Posted in Design Tips, Web Design | No Comments »
November 10th, 2008
Here they are - the ten most valuable resources for logo design on the Internet…
Logo Design Articles
What Makes a Great Logo - Four principles that constitute a great logo design.
Ten Tips to Logo Design - 10 tips on creating a professional company logo.
The Philosophy of Logo Design - Thoughts on how best to approach the design of company logo.
Logo Design Trends - Eleven of the latest trends in logo design.
Logo Design Examples
LogoPond - Huge gallery of logos. Perfect if you need some inspiration
Collection of Hundreds of Web 2.0 Logos - Over 400 Web 2.0 logos in one image. If you need logo design inspiration, look no further.
Free Logo Designs - Collection of free logos in case money is tight.
Logo Design Tutorials
Web 2.0 Logo Design Tutorial - Tutorial on making a Web 2.0 style logo.
50 Logo Design Tutorials - Collection of various tutorials showing all the steps taken to design a certain logo.
Using Letters to Design a Logo - PDF that shows how you can design a logo with letters.
Tags: logo design
Posted in Design Tips | 2 Comments »
November 5th, 2008
There are a few brands, the crème de la crème, that consistently show up on various “Top 100″ type lists. You know which ones I’m talking about. They’re household names and for the most part come out on top because they’ve met and exceeded the expectations of reviewers/consumers/whoever. They’ve got the best of everything (insert famous ad tagline here) and they’re usually not hurting too badly financially. So when I stumbledupon the latest “Top 100 Brands” list here I took a look at some of the companies’ websites guessing I was in for an overdose of inspiration…
I was wrong. A few were great, most were fine, and some were pretty bad. The bad ones are here…enjoy!
Duracell
For a site with upwards of 80,000 visitors per month its amazing how dated Duracell is, and the slow-to-load, amateur-ish flash intro doesn’t help.
UPS
Yes, its bad - but I was going to let this one slide because it was UPS. That was until I checked out compete.com and found out they average over 12 million visits per month! I am truly speechless.
FedEx
Better than UPS…but not by much.
Colgate
AH my eyes!! Bad color choice and much too cluttered.
Ferrari
Cars this cool deserve a better website…’nuff said.
BMW
Granted it gets better as you delve into the site - but you don’t want this to be the first thing people see. Boring.
Merrill Lynch
I know its ‘professional’, and that a website probably isn’t a high priority for them right now…but come on, this looks like they haven’t upgraded since 1998.
McDonald’s
I’m not lovin’ it. The black background could look cool, but they have so little content on the page it ends up being overwhelming. The navigation is hard to use as well. They made it super interactive, problem is that when you move your mouse inadvertently what you were reading can disappear.
Nestlé
Where’s the yummy food? Seriously…not one chocolate chip? I realize they are a huge company, but it seems like they’re taking themselves a bit too seriously with this extremely corporate-feeling site.
BP
With second quarter earnings this year of $4.98 billion you’d think they’d be willing to drop the $5K or so it would take to make their site modern and maybe a bit better looking.
Avon
Avon’s business is looking pretty…they should know better.
Accenture
The biggest/best consulting firm around and this is all they’ve got? Tired design with hardly any navigation to speak of doesn’t convey the image they’re probably going for.
Marriott
Some useful features, but the site doesn’t have a very welcoming feel - why would I want to stay here? I think not having any pictures at all is a lost opportunity for any site trying to sell accommodations.
Canon
Know any other great brands whose websites don’t quite live up to your expectations? Let us know in the comments!
Tags: bad design, bad websites, branding, redesign
Posted in Inspiration, Web Design | 2 Comments »
October 28th, 2008
Let’s be honest…blogging is hard. In fact, Michael Parsons touts it as the “hand-to-hand combat of the writing world”. Creating and maintaining a successful blog is a huge undertaking, and those that are really successful at it put forth great amounts of effort. They eat, they sleep, and they blog.
The blogosphere really is another world, with it’s own set of rules and etiquette that you’ll need to learn. You should set aside time to read other people’s blogs, and try to establish relationships with other bloggers. Learn when to comment, when to post your own content, and when to link to other blogs. Staying up to date can quickly turn into a full time job if you let it, so here are a few tips to help:
- Write about something you like and write often. Seems like common sense, but readers will know if you aren’t sincere and you’ll build up loyal readership faster by making new content available regularly.
- Stay well-informed. Get your facts straight and be aware of what others are writing about the same topic. Readers will nail you to the proverbial wall for obvious duplicate posts or not fact checking first.
- Promote your blog. Readers will not be magically drawn to your site so you’ll need to do some grunt work, especially in the beginning. Ping, use trackbacks, and leave comments on other relavent blog posts to let others know what you are up to. Use gimmicks, wit, a specific tagline - anything to get noticed, the internet is a black hole of information that is easy to get lost in. Lastly, make use of social bookmarking and article submission sites by submitting one of your better posts once in a while to reel in new visitors.
- Don’t just blog for the sake of blogging. Have an opinion or something useful/interesting to say or no one will pay attention
- Have thick skin. Readers will leave harsh comments, its part of the game. Respond (tactfully) if you must and then move on. If it bothers you, use comment moderation to weed out the particularly hurtful ones.
- Hang in there. It will get easier. Most bloggers who get discouraged and quit do it in the first few months. Building an audience takes time, and it doesn’t really matter how many people you are reaching as long as that number keeps growing. The older your blog gets the more credibility it will earn.
It’s hard, and its not for everyone - but blogging can be very rewarding. Adding a blog is a great way to make sure your site has fresh content, you’ll get your point across to lots of people, and hopefully you’ll have fun and gain satisfaction from sharing information with others and participating in online communitites.
Tags: blog, tips
Posted in Inspiration, Web Development | 2 Comments »
October 17th, 2008
First a little news: the long-awaited “Upgrade Feature” on AgencyTool is now up and running! Not happy with your listings’ current placement? We’ve made it really easy to upgrade to a featured option and get top placement and more traffic. Check it out!
And now to the Dashboard updates…First up is the MagicToolBox, they’ve created several Javascript and Flash tools to make viewing/using images amazing.
There’s also a new Firefox extension called the Site Rank Reporter. It allows you to view ranking by keyword in graph format, or export ranking data from a range of dates into a single CSV or HTML file. Pretty cool. We’re excited about Catapulley.com as well, its a community for mobile designers focused on developing and launching new mobile apps.
That’s just a sampling, we add new resources pretty much every day so keep an eye on us to stay up to date!
Tags: mobile app, seo, tools
Posted in Site Updates | 1 Comment »
October 15th, 2008
With the last debate scheduled for tonight, and with the nation counting down the days till Nov. 4th - AgencyTool has decided to review each candidates’ website, putting all political biases and issues aside, and declare a winner! We’ll be evaluating the candidates’ respective websites on 4 major features…
Feature #1 - Landing Pages
Both campaigns feature their slogan of choice and cliche graphic of the ticket name prominently. Obama’s landing page has a simple design with a single family portrait style image. There’s an option to sign-up with your email address, but it’s pretty easy to get straight to the main homepage via the skip button. McCain’s landing page has much more content, featuring several videos set to play on repeat and four different options on how to get involved with the campaign. And the winner is…
Obama ✔McCain
We’re going with McCain on this one. Each landing page is equally easy to navigate through, but McCain’s offers more in the way of information and opportunity to get involved.
Feature #2 - Home Pages
Both sites have focused on recruiting for volunteer efforts in the area above the fold, have news and events sections below the fold, and have similar top navigation. They also both feature video feeds prominently, although the content differs. McCain has one video per day, while Obama has several different videos available.
Obama’s site has a cleaner look and still manages to display more total content. It feels more Web 2.0-ish (we realize this is not a technical term) with interactive maps, blog feed, and social media options directly on the homepage. McCain had a feature we got excited about - a choose your position bar (choices were supporter, undecided, or unregistered voter). However, after testing it out by having several different people pick different options we were disappointed to find out that the site doesn’t change at all in response to your selected viewpoint. Round 2 goes to…
✔Obama McCain
While the pages were more similar than not, Obama’s more up-to-date look and extra content gives him the advantage. Not to mention that McCain gets downgraded for having a potentially great tool that doesn’t work, or is just there to record IP addresses. On a sidenote: Google awards a PR8 to both candidate’s sites, and according to this post from ZB Blog Obama’s site pulls in much more traffic.
Feature #3 - Use of Blogging/Social Media
Again, more similarities here than differences. Each site has a blog with RSS feed, and does a great job of getting different types of content included - both make use of video, news articles, and candidate activity update type posts. Interestingly, both blogs steer away from commentary on the issues. On a positive (somewhat surprising) note, the comments section of both blogs doesn’t seem to be too heavily moderated. There are negative comments on each candidates blog - props go to both camps for not censoring the public.
As far as social media goes, McCain has the basics - links to MySpace, Facebook, and YouTube. Obama on the other hand, covers a wider range with a total of 16 social media options, those on McCain’s site plus twitter, flickr, linkedin and more. Obama’s site includes these links on the sidebar of every single page on the site, while McCain’s are on one page only. McCain has another interesting feature here - awarding points to users based on recruiting friends, posting pro-McCain comments on blogs, attending events, etc.
✔Obama McCain
Though its close, we give the edge to Obama. We’re excited that both camps have recognized the importance of social media and are actively engaging with it, but Obama’s site makes it easier to use and has a fresher looking blog with a greater variety of content.
Feature #4 - Issues Page/Store/Targets
This last section is a sort of catch-all for the rest of the aspects of the two websites. Each candidate’s site does a great job with their respective ‘Issues’ pages. Both are organized into clear categories (i.e. Education, Economy, Homeland Security) and the information given is - for the most part - a clear and concise summary of the candidates position and plan of action. Indeed the official websites are one of the few places you’ll get a straight answer from either campaign. It was also nice to see that both sites had links on how to register to vote, and an “En Espanol” button that made the websites visible in Spanish.
In true E-Commerce spirit, both sites also had online campaign stores. They had similar products available at similar prices, and the only real difference was that McCain’s store was operated independently. Proceeds from the McCain store “do not benefit McCain-Palin 2008 and should not be considered campaign contributions” where as Obama’s campaign gets 100% of their store’s proceeds.
A final component of the candidate’s we’re taking a look at is the targeted information areas (for lack of a better term). McCain calls his “Coalitions” and they include Americans of Faith, Arab Americans for McCain, Bikers for McCain, etc. Obama calls this section “People” and the topics include People of Faith, Students, Small Business, etc. We took this a different approach to the same thing and each did a good job of pulling group-appropriate content together.
✔Obama ✔McCain
Yeah, this one’s an even draw. Without getting into specific political issues and looking at these features from a strictly design/content perspective each of the candidates’ sites is exemplary…Job well done!
Final Score:
Obama’s Site: 3
McCain’s Site: 2
While it wasn’t a landslide, Obama’s site is the clear winner based on our criteria. Think we missed an important feature of either candidate’s site? Don’t agree with the results? Leave a comment and let us know.
Tags: election, McCain, Obama, webdesign
Posted in Web Design | 1 Comment »
October 8th, 2008
Any time spent searching for information on SEO (Search Engine Optimization) will bring back literally thousands of resources and sites dedicated to the subject. Why then are forums continuously overrun with requests for advice on this stuff? One reason could be because there is just so much information out there. You could easily spend hours researching and come away with only 2 or 3 major points. Not exactly efficient, especially for a subject that changes and evolves almost daily.
So here is my attempt at an easy to understand guide to basic SEO practices - which I realize may be completely obsolete by next Thursday.
Right off the bat you need to know there are 2 main categories for SEO: On-Page SEO and Off-Page SEO. Here’s what these mean in a nutshell:
On Page SEO: everything you do specifically on your website, i.e. site structure
Off Page SEO: everything you do outside of your immediate website, i.e. your relationship to other websites
ON PAGE - The Good
✔ Have a site map. If you don’t have a site map stop reading right now and go make one. Its one of the easiest ways to make sure the search engines find your site (and any new pages you add) easy to crawl.
✔ Keywords. Put the keywords you want to rank for in your URL and domain name if at all possible. Put them in your your title tag, and just for fun stick them in the meta tag as well. Now, Google says in no longer uses the Keyword meta tag, but others do so it can’t hurt to put them in there. Be careful though - every single keyword in the keyword meta tag MUST appear somewhere in your body text, otherwise google will mark it as irrelevant and penalize you.
✔ Links. Your internal links should have keywords, and lower level pages should be linked together appropriately. A general rule of thumb is that a user should be able to navigate to any page on your site within 3 or 4 clicks from the homepage. As for external links, make sure you only link to reputable sites (no links farms or ‘bad neighborhoods’) and check to make sure your links are all valid.
✔ Be old and new at the same time. Google likes old sites because of the perceived ‘trust’ they have, it also likes ‘fresh’ pages. The best site in Google’s opinion has been around for a long time and puts new content up on a regular basis. Good to know, even if you can only control the second part.
ON PAGE - The Bad
☠ Keywords. It’s a two way street, keywords are an essential part of good on page SEO but it can easily go wrong. Rules of thumb: Don’t have too many (keyword stuffing) and make sure every single one is 100% relevant to your site’s topic.
☠ Bad language/ethnic slurs/’stop’ words. Basically don’t use any word Google has associated with shady dealings in the past.
☠ All Flash with no HTML option. Most search engine spiders can’t read flash, give them an HTML option to read or they won’t index your page and your ranking may suffer.
OFF PAGE - The Good
✔ Links, Links, Links. Incoming links from quality sites are extremely important. You want stable (the older the better) links that contain your keywords in them pointing to you from a site that is a trusted source - you get bonus points if its from an “expert” site.
✔ Traffic. The more people on your site the better. If your site is new and you don’t have much traffic, you get a little boost if there is an increasing pattern, you also get a boost if people stay on your site for a long time (low bounce rate). If visitors bookmark your page…even better! I know this seems a bit out of your control - but by creating content on your site people actually want to read and find interesting you can encourage better traffic.
✔ Article Submission/Blogs. By creating articles and submitting them to other sites you not only create links pointing to your site, you create interest among visitors. The same is true for having a blog. You’ll be creating new content on a regular basis (which Google loves) plus you’ll be building a loyal base of readers who may help your site to be seen as a ‘trusted’ source and give you a consistent stream of traffic.
✔ Page Rank. It’s based on the number of quality links pointing back to you, but other factors are included as well. There are differing opinions among SEO professionals as to just how important Page Rank is. Many say that it isn’t important at all anymore, some still rely on it. Our take? Don’t obsess over your site’s Page Rank, but don’t completely discount it either.
OFF PAGE - The Bad
☠ Bad Links. Google is cracking down on link-buying by penalizing sites. Link exchanging is also an issue, while there is no penalty for exchanging links with other sites Google deems these type of links much less valuable than quality incoming (one way) links. You also want to look out for bad ‘link neighborhoods’ - sites linked together through spammy sites or link farms. If you link to these sites by accident chances are you’ll be OK, but if Google finds too many of these type of links on your pages you could be in trouble. Here is a tool to help check your links - Text Link Checker Tool.
☠ Being “spammy”. Link building activities can get a bad rep because there are so many ‘techniques’ that are just plain spammy. Mass-posting links into forums, posting links into comment sections of completely unrelated blogs, or mass-emailing hundreds of bloggers/webmasters asking for links are just plain annoying and not all that successful anyway.
Keep in mind these are just the basics, there’s a plethora of resources out there if you’d like in depth info on one specific aspect of SEO. Check out Vaughn’s Google’s Ranking Factors for more Google specific details, its a great resource if you’ve got the time to go through it.
If you have any SEO resources you use or just a great informational site let me know!
Tags: guide, internet, seo
Posted in Search Engine Optimization | 5 Comments »
