Some years ago, I had a client email me that my portfolio / web design site was ranking higher for my client’s keywords, “san francisco autopsies”. Yikes.
I had built an autopsy service website for a client and I had backed up their site on my server and forgot to do a few things to make sure that my site would not overstep my client’s when users do searches for their business. Live and learn - it’s now a part of my checkoff list as I add new pieces to my website design portfolio.
So, what did I add to my checkoff list?
1. Remove the Title, Description and Keywords from each of the pages of the copied client website that I had installed for the client to get ranking.
2. Install the META tag in the <HEAD> section of the HTML “<meta name=”robots” content=”noindex,nofollow”>”
3. Create a robots.txt file in the top level directory of my website that “disallows” directories to be spidered by search engines. Name the file “robots.txt and here’s an example of what it should state:
4. Limit or eliminate any reference of the client’s business name in my portfolio.
If you’re a client of mine and you see my site coming up for your keywords, let me know and I will double check or take more extra precautionary measures to make sure that does not happen. You should see the results within about a week or less.
The best ranking tips is in the design of the website as you will find out by reading my top 10 tips. If I’ve designed your site, I have used all or most of the tips below already.
1. Write content for your website with key words and phrases that prospective visitors might use.
2. Make sure your home page has content rich in key words and phrases including a navigational menu preferably designed using CSS and not Javascript. Do not use a “splash” page for your home page [splash page definition].
4. When you write your keywords and phrases, be as specific as possible such as, “Napa Valley Wineries” instead of general phrases such as “Wineries”.
5. Include a footer at the end of each Web page that includes your sentence description of your website and the main links to the pages of your website. Some engines read from the bottom up.
6. Change the content on your home page at least once per month. Inactive websites drop rank.
You will find that companies will want the “bling” of animation, but it is known that animated banners whether it is Flash or GIF’s, users can easily be unnerved by them if they are animated in way where they are “in your face”. Encourage advertisers to keep their advertising banners simple with no animation with a strong call to action (click to buy). As a rule, “less is more” is a good thing to stand by. Flash banners are made by software, Macromedia Flash and GIF-animated banners are made by software such as Adobe ImageReady.
Example Flash banner:
Pros: Quality of animation generally better. Cons: Expensive to hire designers to produce - minimum generally $50 per hour. Another note, websites designed entirely by Flash do not rank high in search engines. It also takes about 3 times the amount of code which can take up bandwidth. Flash embeds are recommended over websites designed entirely by Flash.
Example GIF-Animated banner
Pros: Smaller file size and takes no extra coding. Much faster to produce. Cons: Animation choppier (animation can be made gradual such as the above example, but file size ends up too large).
I recently purchased “Transcending CSS”, and really liked how the author covered a wide territory of topics in Web development from a simple technique in creating a color palette to practical CSS techniques and highlights of the next generation CSS3. Lots of eye candy in the book too - which at times, was a little distracting, but none the less, worth the mula.
After a year of events such as getting married, acquiring guardianship of a kid and my mother’s passing (yes, that was 2007), I am putting my own nose to the grindstone. I am back with fury, burying myself into the world of code. I am currently taking courses, and as I read recently from a Web guru’s article, “A Web professional can never stop learning.” Fairly true considering how fast things change.
The focus seems to be in Web development are - designing by standards, usability/accessibility, CSS tableless formatting, less bling and more practicality. My goal this year is to try and at least get a good chunk of my client’s sites redone in XHTML and CSS’d out and of course any new stuff that comes in.
Several current projects I am really excited about is the new Arts Council site and the female version festival website of the Burning Man…. “Water Woman”. Will I have time to garden this summer? Don’t think so - too much to do and study.
It sounds obvious, but if you are the business owner and you are having your Web designer do all the Web stuff for you such as setting up the domain and hosting, make sure it’s purchased in none other than your own name and business name. A friend of mine had their Web person buy a domain for him in his business name, and turned around and held the domain hostage until my friend would pay up way more than the original price of the domain name. He took the Webmaster to court and won - but what a pain in the ass.
On occasion I get asked what program I use to develop websites and I say, “Notepad”… nothin’ fancy.
The options to build websites include using W.Y.S.I.Y.G. (”what you see is what you get”) programs such as Dreamweaver, Adobe GoLive and Microsoft Frontpage -OR- hand code. It is popular for developers to use a combination of the two utilizing a program and fixing errors by looking at the code.
The phrase “what you see is what you get” is kind of a fib. It is often not the case. Programs try to be psychic on what you are trying to achieve with your layout - it will look great until you browse the page in several browsers and realize that it looks nice in one and wonky in another.
I started my career in 1999 contracting for a large corporation using M.S. Frontpage and was frustrated early on. I’m sure the program is a long shot from it’s beginnings, but to say the least, I was embarrassed by my work because of many bugs and browser inconsistencies. That is when I decided to learn to hand-code sites and I’ve been Notepadding it ever since. It does not take fancy software to build a website except for the purchase of a graphic / photo editing program such as Photoshop.
Having learned how to build sites by hand, it takes less time, you’re able to troubleshoot issues faster, and the code is much cleaner - thus, page downloads faster because of unnecessary code that W.Y.S.I.Y.G. programs interject.
In addition to hand-coding, I validate the code using CSE Validator and W3C’s online validation service to spot any typos prior to launching a new site. When I first started using W3C’s service, it took a while to interpret the error messages, and I noticed that one error produced can have 15 baby errors stemming from it. So, by correcting that one error - all the sub errors disappeared. When one part of the code is off, it can throw everything off. That’s actually another blog - so I’ll just stop there.
Anyway, I think it’s really important for designers learn (X)HTML/CSS as in the end, it saves time and money.
Three-column layouts for the Web in most cases, makes a lot of sense. In the beginning, it was all about how creative I could get with layout and design, but practicality ends up winning. When you reflect on print design - a lot of it is in a multiple column format and it’s that way probably for a good reason - so why not for the Web too? So now, the goal is to create multiple column layouts, but attempt to not get too carried away with noisy design elements/clutter. I’ve done several sites where the first column is designated for email sign up, special interests and/or announcements, the center column is designated for the content or “meat” of the website, and the right column for advertisers. The next generation CSS3, will be introducing the ability to flow content from one column to the - next similar to the ability of print page layout programs such as Pagemaker. The ability to flow content, I think will be positive “usability” feature, but will probably take a while for bugs to be worked out.
I just spent the day working on an assignment for a Cascading Style Sheets e-class I’m taking. At first, I really struggled; but learned once again, to start with one style declaration at a time and build on one page element at a time. I really got into my funky CSS horizontal navigation bar. I think I will get a lot from this course and really enjoyed creating my first project.
It’s all about the projects and they’re all lined up, but which one do I get to first? Day before yesterday, I validated a 65 page website in XHTML within a day and a half. By the time I was finished, I was feeling rather ill from sitting for so long, but at least www.artscouncilnapavalley.org is live, and (for the most part) complete.
For those who are unaware of what XHTML is - it is a language a step away from the basic Web page language of HTML. XHTML is a strict form of HTML where the code is to adhere to specific guidelines for highest quality… a good, basic definition is found on the N.Y.P.L. website. Like I told my kids the other day…. one hundred years years ago there were no standards for building houses, but after years of issues, codes and standards were produced. The same thing is happening with the Web. So here I go XHTML’ing it //////.
Things seem to be going fine with the new site. No blaring browser issues at this point. The only issue is on our database-driven “Artist Opps” page, there are little question marks dotted throughout the page where the Doctype cannot render the character. XHTML does not like characters that are not encoded properly. Every character has a number associated with it. I’d have to go into the database and spend hours cleaning it up…. or better yet, just wait until the old opps expire and encode it properly next time.
