Resources for Search Engine Optimization

I felt it was important to first touch on the definition of search engine optimization. I found a very detailed description via Wikipedia:

Search engine optimization (SEO) is the process of improving the volume or quality of traffic to a web site from search engines via “natural” (“organic” or “algorithmic”) search results. Typically, the earlier a site appears in the search results list, the more visitors it will receive from the search engine. SEO may target different kinds of search, including image search, local search, and industry-specific vertical search engines. This gives a web site web presence.

As an Internet marketing strategy, SEO considers how search engines work and what people search for. Optimizing a website primarily involves editing its content and HTML and associated coding to both increase its relevance to specific keywords and to remove barriers to the indexing activities of search engines.

The acronym “SEO” can also refer to “search engine optimizers,” a term adopted by an industry of consultants who carry out optimization projects on behalf of clients, and by employees who perform SEO services in-house. Search engine optimizers may offer SEO as a stand-alone service or as a part of a broader marketing campaign. Because effective SEO may require changes to the HTML source code of a site, SEO tactics may be incorporated into web site development and design. The term “search engine friendly” may be used to describe web site designs, menus, content management systems, images, videos, shopping carts, and other elements that have been optimized for the purpose of search engine exposure.

Another class of techniques, known as black hat SEO or Spamdexing, use methods such as link farms and keyword stuffing that degrade both the relevance of search results and the user-experience of search engines. Search engines look for sites that employ these techniques in order to remove them from their indices.

I think that it is highly important for any company wanting to connect with its’ audience to spend some time making their site “findable”. Through the use of proper search optimization techniques company’s can see quicker results because the site is actually reaching their target audience. An article I found on A List Apart talks about the importance of findability and its role in the web development process. Findability, Orphan of the Web Design Industry is a cleverly written article by Aarron Walter that goes into detail the role that findability plays within a website creation and how to increase awareness of it amongst the web design team. I found this quote from the article very helpful in understanding its’ importance:

A website that ignores findability is whispering into the wind, hoping that someone passing by might catch a hint of its message. To further complicate the chances of reaching your target audience, a cacophony of other websites are vying for the same commodity—attention.

When it comes to searching the web for content I tend to fall back to Google for the most part. Lately I have begun to use Twitter more and more for searching usually as a second to Google. I was able to find this site per a fellow twitter user’s suggestion. The site has an article called Top 10 Must Read Search Optimization Blogs. The list provides screenshots and details of each of the blogs. There is even a reference to a blog called SEO Black Hat. Black Hat SEO techniques are usually frowned upon as poor practice for creating findable websites. I still think it would be a good resource to know what not to do when it comes to search optimization.

P.J. Fusco wrote an article on SEO Best Practices: 20 Questions. I found the article to be an insightful approach to creating a findable website. The list of questions work perfectly as a check list to ensuring your site follows the best practices of SEO. She has written a number of articles on search engine optimization and has worked in SEM (Search Engine Marketing) since 1996. You can follow her on Twitter @pjhfusco.

Evaluating the Competition

There are a number of sites that have been created to help establish an online community for rock climbing enthusiasts. There are also several sites you can buy the gear you need to get started. I have yet to find one that combines both. That is one of my goals for this project is to create a place for beginners in rock climbing to learn more about the sport and to be able to learn from experienced climbers. I am also including an e-commerce side to the site that will allow users to purchase their gear directly instead of having to go to another site. Here are the sites I have found that directly relate to my final project topic: (Click on the screenshots to get to the sites or you can click the links provided below them.)

RockClimbing.com Screenshot

Rockclimbing.com is a very extensive site when it comes to obtaining information about the sport. The partners link was a bit confusing at first. I thought it had something to do with business partners, but instead it is a way to find a climbing partner. You have to sign-up to search the database but despite that I think it is a very useful feature. Since my site is going to be focused within the Dallas Fort-Worth area I’m mainly going to point users to clubs and organizations available in the area. They can find people to climb with that way. Personally I would be more comfortable finding a partner that way than trying to find an individual through a database of people.

When I first found this site I thought that I had found one that had successfully combined the e-commerce side with the community side. Sadly, it doesn’t have both. The gear link takes you to a page that lists different gear according to a category and provides reviews for each type. When I tried to purchase some of the gear it reroutes me to a different site.

The reviews are really helpful but there aren’t a whole lot of users posting reviews. The most I could find were 1 or 2 reviews and only on a few items. That isn’t the creators of the website fault but it would be nice to see more than a couple reviews on an item. Majority of the items didn’t even have reviews. I’m curious if the people that created the site have tried out any of the equipment. It would be nice to see some of their opinions on the gear.

They have a classified section feature on the site. I considered having that feature added to my project but decided against it. I want the site to be more of a learning opportunity for climbers and hopefully create a teacher/student relationship between beginners and advanced climbers. While also including the ability to purchase gear directly from the site. I don’t really want to add a classified section but would be happy to post specials and sales available on gear in the area. Overall the site is constructed well. I think if the main nav is taking up the full screen it would seem appropriate for the information to follow suit. Either have the navigation fit to the content or the content fit to the navigation don’t try to do both. That is one of the design decisions I don’t completely agree with.

Screenshot of the ABC of Rockclimbing site portal

The ABC of Rockclimbing is a nicely designed site. The pictures of people rockclimbing definitely helps it to stand out against the previous site above. People for the most part are visual creatures so I think it is really important to included pictures on the home page of your site. One thing that I noticed on the site is the Flash tutorial guide. It shows you how to tie climbing knots through flash based animations. I thought that was pretty cool and a feature I definitely want to include in my site. Since my site is mainly focused towards beginners the ability for them to see an animated demonstration on something they need to know would be very helpful.

They also are a good resource of information to learn more about rockclimbing, techniques, history of the sport, styles, etc. I also like the feature they have that allows you to compare prices across all manufactures for a specific type of gear you might need. The ABC of Rockclimbing is a sub-site of Maxlifestyle.net. They provide information on a number of different subjects besides rockclimbing. They have established a community through a forum (like rockclimbing.com) and allow users to share pictures. Still although they have price information on gear and discounts you can’t buy directly from the site. You have to purchase from one of the available retailers.

The community is forum based where as for my project I’m going to go more along the lines of blogging. I have nothing against forums it is just that the demographic I’m trying to reach for my site doesn’t necessrily use forums quite as much as other forms of online social media.

The site also includes a News section, which is another feature I will be adding to my project. I want to provide news on environmental, political and cultural issues that will or have effected the climbing community.

Screenshot of Rock climbing for life website

Rock Climbing for Life is a really informative site and like my project idea seems to be targeted towards beginners. Overall there are a number of navigational and poor design problems with this site. One problem can be seen easily from the screenshot of the home page. Half of the text is missing for what appears to be  some type of offer. There are also some typos in the site. The illustration that is shown on all the pages is really nice and I’m curious of the person that created the site did it or not. If they did I fail to understand how come the rest of the site wasn’t designed with as much attention to detail as the illustration. The section on gear is very detailed and thorough it talks about the different types of gear required and what isn’t required. The writer tries to engage the audience with his descriptions which is always a nice quality to have in writing. Especially cause sometimes descriptions can come across as boring.

In regards to the site navigation it is pretty straight forward. Two of the links RCME and Free Course need some work. The RCME link takes you to what seems to be another home page design. The Home link doesn’t take you back to the original site you have to use the back button to get back to it. The Contact Us link takes you back to the familiar site navigation but it is the only one that does that. The Free Course link takes you to a page without any navigation on it and the only way to get back to the home page is with the back button. The typography hierarchy isn’t well thought out on those pages either with most of the text appearing to scream at the user. Also another thing I noticed about the FAQ link it keeps you on that different page but an additional link that wasn’t there before pops-up called Join Now. It leads you back to the original home page but it says there is no such url. Overall informative site but it needs work on both design and navigation.

Screenshot of YourClimbing.com site

YourClimbing.com is similar to the ABC of Rockclimbing.com but only because it is part of a group of sites. Enthusiast Group is incharge of the Your(InsertName).com sites. YourClimbing.com also provides links to YourRunning, YourCycling and YourMTB. They all seem to be based off the same template and aren’t designed very well with some of the pictures posted getting stretched and distorted. Also the typography hierarchy isn’t very well thought out and neither is the negative and postive spaces within the page design. One thing I found most annoying about the site is that it seems to really push users to sign-up for the newsletter. It shows up at the top of almost every page. Hopefully it goes away for users that have signed up but I don’t know for sure.

I do appreciate that a brief description about the site is provided on the main page. The concept for the logo is a good start but it could be executed better. For one the .com needs to be next to the word climbing not underneath it. Also the typeface choice for the word climbing doesn’t really work well with the typeface for YOUR and .COM. The main nav is a bit frustrating in that it combines pop-ups and drop down menus.

The content looks like it could be setup so much better without having so much empty space. The blog available on the site seems to have a thriving community of participants which is always crucial on any community based site. It seemd to be the only feature that was worth looking into. It didn’t have any information that I could find about the rockclimbing, introduction to gear or anything. There are photos and videos and some fictional stories but not really much information beyond that. There may be more available if you sign up but I don’t see the point in requiring someone to sign-up to get information. I plan on the majority of the site for my project to be open to the public with little to no sign-up areas.

Screenshot of Bouldering.com website

Bouldering.com didn’t really provide an about us section or any information about the company for that matter.  It is obvious from first glance this is an e-commerce site for rock climbing, primarily bouldering which is a style of the sport. There isn’t any community section available on the site. I do like the clean design of the site. It does provide nice descriptions on each of its’ products as well as the option to add them to a wish list. The ability for users to add items to store for a later purchase is one I am seriously considering adding to the feature list of my project. It saves the user time from having to search for that specific item again when they are ready to come back and purchase it.

I like the large picture advertising the free shipping offer. The page layout of the site is executed well and makes it easy to navigate. It is very similar to the type of layout I have setup for the e-commerce side of my site design with some slight differences. One being I plan on having larger pictures of the products. For example when a user selects a specific product it is large enough for the user to see as much detail is possible. Also for the wearable items a size chart will be available with instructions to get the best fit.

Evaluating these sites have given me insight on what I can use to improve my project and what I need to avoid in order for it to be successful.

Planning and Integration of Essential Technology for Web

What are the essential technologies available for web development?

There are a number of technologies that can be used for web development. The essential ones are of course HTML, CSS, JavaScript and PHP. There are also others that are important when designing web sites. Actionscript is primarily used with Flash based websites. It is good language to know if you plan on creating an indepth Flash site. Speckboy Design Magazine has a list: 40 Free and Essential Web Design Development Books. They are all available for viewing through Google Books. The list not only contains books on the technologies mentioned above but other languages such as Perl and Ruby on Rails. It also lists a book that explains Mozilla and how applications are created with it. Other technologies to consider are programs like Adobe AIR, Coldfusion, Java and Flex.

What is involved in integrating technologies and media?

When it comes to integrating technologies with media (such as the web with mobile devices) it is important to understand the limitations of what that technology can do. Just because a 20 page article can be made into a website doesn’t necessarily make it a good choice. The relevance of the material to the target audience must first be determined. An article I found through art ed+web2.0+[e]merging media blog talks about bending the web to those who don’t have or want computers. An interesting concept but is it really necessary? I know there are a number of people who refuse to conform with the current trends of technology. But hey if my 80+ year old grandmother can use the Internet I really fail to understand why people would refuse to use a computer. Other than obvious reasons mainly to do with the lack of money. Basically, just because something can be done doesn’t mean it should. I’m not referring so much to the “make web analog thing” as I am to the conversion of technology with media in general. It’s important to consider the limitations of them, what purpose does the integration serve and who will benefit from this advancement. Those three things should be considered way before sitting down to write a single line of code.

What is an appropriate approach to planning interactive components?

When planning for interactive components within your website it’s important to determine whether they help or hinder the user. Does the added component benefit the user or is it just something cool? Basically the same question as the statement made before it but it’s important to repeat. If an interactive component doesn’t help the user or worse acts as a road block to what the user is trying to access it isn’t necessary. In fact it’s completely pointless and will more than likely cause them to leave the site. It is vital when considering these choice components to always keep your target audience at the forefront of your mind.

Web Project Management & Development

When it comes to project planning I try to brainstorm as much as I can. It helps to iron out all the details. I do a little bit of freelance along side my part-time job. I like to use MacFreelance to manage my clients projects. It can be setup for fixed or hourly rate or both depending on the preset contract between me and my client. A classmate had mentioned BaseCamp which is more along the lines of this topic. While MacFreelance is great its primarily a billing and invoicing software. Most the communication with the clients are handled through email. That way I can keep track of our conversations, changes, etc.

Getting back to BaseCamp it seems to combine a lot of the stuff I already do in regards to project management. It’s an all-in-one resource but it’s not cheap. You can track project development, use calendars to layout the production schedule, and messages boards. It seems like a pretty cool setup. I typed in BaseCamp to twitter and a number of tweets came up. A user with the Twitter ID: revaville mentioned that she likes BaseCamp just not the price. She added a link to a free service called ClockingIt that is similar to BaseCamp. Clocking It allows collaboration on projects through private wikis and forums.

I checked out Ms. Curran’s twitter page and saw that she mentioned a second similar product, Bantam. You can sign-up for Free but I’m not sure yet whether it costs anything or not. I’m guessing no. The thing that is really interesting about Bantam is it integrates with Twitter. The interface is pretty similar to Twitter as it is shown in the video tour. It offers the same collaboration as the above mentioned programs, (ie. job tracking, messaging, calendars, etc.). But it also allows you to incorporate the features of a CMS with social media applications like Twitter, Facebook and FriendFeed. It states that it is real time streaming environment which is commonly associated with microblogging sites like Twitter.

CRM/CMS programs aside it comes down to the team whether they will get utilized to their full potential or not. A book by Ashley Friedlein, simply called Web Project Management: Delivering Successful Commercial Websites. Google books offered a preview of it. I found this quote in it to be more important than anything else:

…if design and creation are to be successful, you first need to clearly define what you are going to do and why. Equally, the maintenance and evaluation of a Web site post launch is often not properly addressed. In reality, this is usually the most expensive and important part of the site…Web development is an ongoing process, and this method (an eight stage framework to improve project development and management) shows very clearly how that process should evolve.

There are a few other suggested books regarding project management. Her book is a bit old dating back to 2000/2002 but I believe it has some invaluable tips to improve anyone’s project management skills.

Best Practices in Web Design & Development

There are a number of best practices a designer can follow to improve their design /development skills. Choosing a few of the best practices would set most designers on the right path. Just be careful not to overload yourself, because there are quite a number of articles out there.

I have included a couple that I found the most helpful and some that would be interesting to add to my knowledge base. Net tuts+ website article 30 HTML Best Practices for Beginners has a list that is not only good for beginners but works as a refresher for intermediate coders. The beginning of the list is mainly for those who are just starting out.

Practice#5: If you have JS files whose only purpose is to add functionality — for example, after a button is clicked — go ahead and place those files at the bottom, just before the closing body tag. This is absolutely a best practice.

I just had my first javascript class last quarter but I was taught to place javascript code underneath the CSS not underneath all the code. After reading that practice it makes sense in terms of download time to place the javascript code at the bottom.

Practice#15 Learn How to Target IE includes a code for doing just that. It is definitely something I need to work on improving for my sites.

Practice#16 Choose a Great Code Editor lists some code editors not only for PC but for Mac as well. Some of which I haven’t even heard of. I mainly use either BBEdit or Notepad++. I prefer Notepad++ to BBEdit but unfortunately it is only available on the PC. I am going to have to do some research on the code editors he has listed for Mac. Maybe I’ll find one I like even better than the two above mentioned ones.

Practice#18 Cut, Cut, Cut is so true. It really helps to go back and find ways to improve your existing code.

Even though the article is labeled 30 HTML Best Practices it does touch on other ways to help improve your coding in Javascript and CSS. It also states things you can work on to help improve the design of your websites. Overall I found it very helpful and have added it to my delicious account.

CSS Best Practices focuses more on CSS. This article and “30 HTML” both emphasize the importance of CSS Reset. Another practice that I found interesting (mainly because I’m a beginner in CSS and anything to write code quicker is almost always a good thing) is shorthand CSS.

Practice#3 Shorthand CSS: One good and important feature of CSS is the ability to write code in a minimized way. Instead of creating a CSS rule and adding lines of properties, you can use the shorthand version and simplify your code. I will give you the example of border, but there are different CSS properties that have the shorthand ability like margin, padding, font, background and list-style. You can check Dustin Diaz’ blog for the best CSS shorthand resource on the web.

It would definitely take some getting used to, but I can see the efficiency in it. The only concern would be whether it would work across all browsers.

Practice#7 talks about how to setup a proper drop cap. The code is provided on how to create one with a span. Daniel Koskinen posts a comment about how to control a drop cap with pseudo-classes. I definitely need to practice both of those techniques and see which one works best. A lot of the other practices I am proud to say I utitlize in my CSS scripting.

24 JavaScript Best Practices for Beginners is an excellent list to go by for someone just starting in JavaScript. A lot of the practices are new to me mainly because I just started coding JavaScript. Some of them I already knew about. That alone makes me feel a little better that I’m not a complete noob! But hey everyone had to start somewhere.

Here are  a few articles that focused more on a specific aspect of web design:

404 Best Practices This article provided some interesting alternatives to the design of a 404 page. It is very frustrating when users happen upon this page either by accident (typing the URL wrong) or by a developer’s error. Practice#5 Way to Contact/Report Error is a great way to get feedback on the issue. I especially liked the message the bird states in the word bubble. Very funny. Looks like it is the 404 page for Twitter but not sure. Also, note the error page in that practice is for a error 500 (internal server error) not a 404 error but still funny.

Breadcrumbs in Web Design: Examples and Best Practices I created a breadcrumb navigation for my Intermediate Scripting project. It was the simple text based one but it was needed for my site due to the amount of information. I plan on going back and adding more pages, but I digress. I thought the examples in this article were nicely designed. Some were a bit confusing. For designers not familiar with breadcrumb navigation it is a good article. For those that are familiar the examples help to create some nice variations to the basic breadcrumb.

Down to the Wire

This quarter has been more hectic than most for some reason. It could be because I have two scripting classes or it could be the two part-time jobs plus freelance. Nah….I can’t really count one of them anymore because it is more like a contract job than a part-time job. Whatever the reason I have been insanely busy. I can’t wait til break. I have been wanting to update my intro to scripting project and play around in Flex, among other things. The main reason I’m looking forward to the break is that I’ll finally get a chance to relax a bit and work on my professional site. Finally! I also want to get this blog’s content better organized and incorporate it into my site design.

I hope everyone’s quarter is going well. I’ve gotten most of my assignments done it’s just a few things left that I need to really work hard on to complete. Only two more weeks left….better get back to work.

Spring Cleaning

In an effort to better organize my information I have created a new blog for my Intermediate Scripting class. I will shortly be setting up an individual blog for my Programming Logic class. (but it can wait til tomorrow cause it is already almost 3AM and I’m very tired)

The pages I created for the two classes on this blog worked well for retaining the information I needed to present for my assignments, but it left little room to provide comments.

For some reason the comments are disabled after two comments are posted. Despite my efforts to correct the problem no more comments can be posted to those pages, much to my disappointment. So for the time being I have created the additional blog. If you are interested in keeping up with the posts for my Intermediate Scripting class you can follow the link on the main page or from the About page. I have also included a link to it above.

As soon as I get my domain setup I will establish the blog there and create a more cohesive and fluid environment for it.

Under Construction

Well the links I setup for my Flash work are currently not working cause the teacher has archived the files from their original location. I will be setting up my own site and will re-link the files once that is accomplished. So just a heads up if you try to use the links to see any of my Flash work I apologize for the inconvenience. The problem will be corrected as soon as possible. Thank you for visiting my blog.

Also, I will be reorganizing the blog to accomodate the previous flash class assignments and for the classes I will be posting assignments for this quarter.

Flash Intro Final

Here is my final intro with preloader. Still having some issues that will have to be corrected.

Final

White Rabbit Flash Intro

Week 9 Assignment:

Here is the progress on my intro. I still have a lot more to add to it but so far I think its turning out nice.

Intro Progress