SEO Tips for Website Designers

What are the advantages for a Website Designers utilizing SEO?


Do you feel that as a web designer, it is important to know everything about SEO? Surprisingly you will find that many web designers know very little about Search Engine Optimization. Often people associate SEO only with online marketing. If you are a web designer you most likely love to create wonderful, artistic designs for your clients. For a web designer the best portfolio is of course, their websites. So wouldn’t you think it would be valuable to create websites that are optimized and easily found in search engines?

A web designer is going to deal with the majority of the frontend development and a lot of the on-site SEO will fall into the responsibility of the designer and developer. SEO is important for people to find your website without having to directly type in the URL. When your website/websites are not easily found you are risking losing thousands of viewers per day. For example, let’s say you average 500 visits a day from direct traffic only, and imagine that with search engine visibility, you now receive over 2,000 visits per day. What if out of 500 visitors per month, 10% of the visitors were valuable leads, meaning 50 visitors were interested in your services. After the utilization of SEO you begin to notice a boost of traffic resulting in 2,000 visitors per month, taking your 50 leads up to 200 valuable leads per month. Of course this is not an accurate example; however it is evident that if your traffic increases with “relevant” traffic, your conversion is most likely going to increase as well. With search engine optimization you can gain an increase in traffic that is equally relevant to your previous traffic, higher conversions, and more sales and greater visibility for you business.

Basics of a Search Engine

A crawler-based search engine, for example Google, has its own algorithm and process for crawling and indexing each website. The Web crawler will crawl the website pages collecting information and data from your websites content, and then follow the internal and external links, and depositing the information in a database called the index. As a web designer, you are going to want to be aware of the factors that search engines place high importance on in regards to relevancy. Ultimately, you want to rank high for each factor to ensure that your website will be displayed in the top results for your desired keywords. It is important to recognize common mistakes that cause your website to rank low in searches.

What are the Designers, Developers and Online Marketing Roles in SEO?

It is important to understand the difference between On-Site SEO and Off-Site SEO. On-site SEO can be anything related to the HTML, Navigation and internal Linking, Site Map, Image Sizes and Website Loading time, Alt Attributes, Keywords, and etc. The off-site SEO includes link building off site through article submission, blogging, commenting, and way to build back links to your web page. So whether you are a designer and developer working on the on-site SEO or you are the Online Marketer working on the Off-site SEO, you want your SEO to be intertwined and relevant for your targeted audience as well as visible and ranked high in Search Engines. You will find that it is best to have the same person design, develop and optimize your website for search engines.

Common on-site SEO Mistakes made by Designers and Developers

Some designers will not optimize the keywords within the content. For example often times you will come across an anchor link to that says “Click here”, “Read More”, or “Learn More.” This is a prime example of missing an opportunity to link back to a page with a relevant keyword. So say you want your reader to “Read More” about your website design services you could always create content saying, “Read More about our Website Design Services.” This is only one minor mistake out of thousands of missed SEO opportunities. Now you can see the importance as well as the detailed knowledge that one must utilize in order to fully embark on good, strong, solid Search Engine Optimization Strategy.

Another Common mistake made is with Title Tags and keywords. Often times web designers and developers miss the opportunity to optimize the Title tags for each Page, Page URL’s, the Main headings on each page, the first paragraph of content on each page with keywords and the body of text, alt attribute for image tags, and etc. Often times there are broken links that are not identified; there is poor internal linking and navigation, no sitemap, etc. These are all some of the basic examples of common mistakes that web designers and developers make. Here is a great article on Common Mistakes of Web Designers and Developers in regards to SEO.

An SEO conclusion for Web designers, Web Developers, and Online Marketers

Stop first and examine your website for common mistakes. Take the viewpoint of the audience when designing your website. First ask yourself, is the information presented clearly and easy to navigate? When you begin to think like the consumer or targeted audience you can soon realize simple mistakes in design and development that may frustrate a potential customer. Search Engine Optimization is designed in such a way to connect the right people to the right information. You want to your information to be relevant, clear, and to the point. Make it simple and relevant and notice that not only will your traffic increase, but also your bounce rate will decrease leaving you with higher conversion and happy satisfied customers.

Here are some helpful resources to learn more about SEO: SEOMOZ (Great resources and SEO articles), Google’s Blog (Covers a wide range of information in regards to Google, SEO, etc.), Google’s Search Engine Optimization Starter Guide (Great Resource for Understanding the Principles of SEO in Regards to Google’s Algorithm), and Search Engine Land (Great Search Engine Articles, Blogs, Forums, etc)

Although SEO is overwhelming at first it is important to know the wonderful outcomes it can provide for your businesses website, customers, and sales. Magic Logix is a Dallas Web Design Company that focuses on solutions for businesses wanting to utilize their Website Design, Website Development, SEO and Online Marketing to as a marketing resource it was intended to be. A website is not only a great tool for businesses to market their services online; it is also a great way for online merchants to manage their ecommerce websites through secure database applications, CMS, CRM, etc. At Magic Logix we believe that website design should be professional, website development should be validated and error free, and that SEO and online marketing should be relevant to the target audience that you are trying to reach.

Social Networking as a Marketing Tool Pt. 1

In this blog I wanted to give a breif overview of using social networking sites as a marketing tool for your business. A lot of people just use myspace, but there are literally hundreds of other social networking sites on the web you can use to generate leads to your website. In essence, by having consistent information about your company across all the major social networks you are simultaneously link building to enhance your search engine placement as well as creating a coherent, branded experience for your end users.

It isn't enough to simply set up the accounts though, you have to add as many contacts in these social networks as possible. You also need to interact with these accounts, so in addition to your main company accounts you will need to set up individual professional accounts within these networks to add comments, information, etc... to your main account.

In my research the most high traffic sites that fruit the best results are primarily Myspace, Linkedin, Ning, Blogger, Multiply and Facebook but be aware there are literally tens of thousands of these sites on the web.

The more resence you have accross all of these networks the more your company will achieve what is called "Omnipresence" in the world of marketing, which, in a nutshell, is the effect of being visible across multiple platforms/ demographics to all your prospective clients. I wioll

Well what are you waiting for? Get social!

Dynamic prefilled input fields in Joomla! with jQuery

Suppose the following inline JavaScript from the Joomla! (v. 1.0.16) CMS in the mod_search.php module:

<input type="text" onfocus="if(this.value=='search...') this.value='';"
onblur="if(this.value=='') this.value='search...';"value="search..." size="20"
class="inputbox_site_search" alt="search" maxlength="20" id="mod_search_searchword"
name="searchword" />

In English:

• The search input field will display the value "search ..." when the page loads.
• When the user clicks on the input field (onfocus), the value "search ..." clears.
• When the user clicks elsewhere on the page (onblur), the value is "search ..." again, unless the user filled out the form field with a value.

Rather than using inline JavaScript, it would be beneficial, considering modularity and re-usability of the code, to use unobtrusive JavaScript with the help of jQuery. After implementing this, the inline JavaScript can be safely removed from Joomla!'s mod_search.php module.

Change this line (in the mod_search.php module) from:

$output = 'Search <input name="searchword" id="mod_search_searchword"
maxlength="20" alt="search" class="inputbox'. $moduleclass_sfx .'"
type="text" size="'. $width.'" value="'. $text .'"
onblur="if(this.value==\'\') this.value=\''. $text .'\';"
onfocus="if(this.value==\''. $text .'\') this.value=\'\';">';

To:

$output = '<label for="mod_search_searchword">Search</label>
<input name="searchword" id="mod_search_searchword" maxlength="20"
alt="search" class="inputbox'. $moduleclass_sfx .'" type="text"
size="'. $width .'">';

Another change from the original Joomla! mod_search.php module is the addition of the <label> tag. The <label> has been added for accessibility and usability reasons. One advantage is, if the user clicks on the <label> enclosed word, the related form field will be selected. Load the scripts within the <head> section of the Joomla! template and upload them into the appropriate directory on a server ("jquery.prefilled.input.js" is the code sample at the bottom):

<script language="javascript" type="text/javascript"
src="templates/<?=TEMPLATE_NAME?>/scripts/jquery-1.2.6.min.js">
</script>
<script language="javascript" type="text/javascript"
src="templates/<?=TEMPLATE_NAME?>/scripts/jquery.prefilled.input.js">
</script>

Helpful links about this procedure:

• http://jquery.com => jQuery web site
• http://visualjquery.com/1.1.2.html => jQuery cheat sheet
• http://en.wikipedia.org/wiki/Unobtrusive_JavaScript => Unobtrusive JavaScript
  

Other Notes:

• this.value in jQuery is notated as $(this).val()
• the html attribute onfocus is focus() in JavaScript
• the html attribute onblur is blur() in JavaScript
• #mod_login_username is the CSS id for the input user name field in Joomla! CMS
• if more than three form fields are used, perhaps a loop can be implemented by creating an array of the input values and CSS id's
  

The JavaScript ("jquery.prefilled.input.js") file (for the search input field only):

$(document).ready(function(){
// Setting initial values for prefilled input fields
var seek = "Search ..."; // values can be changed to whatever you want
// assigning the variables to the input form elements
$("#mod_search_searchword").val(seek); // setting a value for search field
// styling the input values for usability
$("#mod_search_searchword").css({color: "#666666", background: "#E4E4E4"});
// when inactive the greyed out color will be displayed
// END of setting initial values
// "Search ..." functions
// clearing the value for "Search ..."
$("#mod_search_searchword").focus(function(){
if($(this).val() == seek){
$(this).val("");
}
$("#mod_search_searchword").css({color: "#000000", background: "#FFFFFF"});
});
// entering the value of "Search ..." when user has not filled out form field
$("#mod_search_searchword").blur(function(){
if($(this).val() == ("")){
$(this).val(seek);
}
$("#mod_search_searchword").css({color: "#666666", background: "#E4E4E4"});
});
// END of "Search ..." functions
});

reiner krämer.
:)

Something I Learned Today...

"A corporate website is a complex beast, subject to the whims of management, marketing, personal design tastes, and customer feedback. When building or redesigning a site, it is critical to keep the company's primary objectives at the forefront of all design activity, and let the form follow the function. It is also critical to consider the best development platforms, from choosing a CMS platform to getting a good hosting solution. These decisions set the tone for the rest of the site's construction, and many future headaches can be avoided with some smart planning..."

Magic Logix Launches New Website!

Magic Logix is happy to announce the launch of our new website. The new site features cutting edge Web 2.0 technology, professional design and a more consistent overall look and feel.

Hassan Bawab, Managing Director, would like to personally thank everyone in our IT department who contributed to building the new website, especially Steve Floyd, Reiner Kramer, Brady Mathews and Ron Leon.

Please take the time to stop by www.magiclogix.com and let us know what you think!

Design 101

One of the most important aspects of the industry we are in is Graphic Design. Why is it so important? Perception is reality for most people. If your presentation is flawed or is viewed as amateur, all the sales, networking and customer service in the world won't fix the way a person looks at you and or your services.

In this blog I wanted to explain what the basics are for good graphic design. Hopefully by learning what goes into a well designed, balanced website or brochure, you will learn how to identify bad design practices and more importantly how to avoid them.

Good Graphic Design is clean, legible, appealing and attractive; it conveys a message that will encourage a response. A businesses designed collateral (their image) is what connects them with their customer. I am not going to get into all the different aspects of what makes a good website, the focus here is simply what are the basic components that go into a good design. The key elements of good design are as follows:

1. Typography
This is more or less the type of font(s) that you use. Typography is one of the most fundamental elements of design. This is often where bad designs begin. The wrong font can kill an entire theme and make the businesses using them look like hacks.

2. Color Theory
Remember the monochromatic color wheel in art class? Some colors work together, some don't. This is also another key part of design that gets overlooked. Having good color theory can be crucial when attempting to convey a concept or theme.

3. Concepts/ Themes
A good website, brochure, banner or even business card always starts with a relevant theme or concept. For example, you don't put butterflies on a bikers business card any more than you put skulls on a florists business card. You would be surprised how many designers in our industry don't understand this.

4. Composition
This is more or less how things are arranged within a given canvas or space. Bad composition is also where most bad designs start.

Summary
If one or all of these elements are not right, then you have effectively identified bad design practices. One of the best things about working with Magic Logix is that you can rest assured we keep a watchful eye on the quality and consistency of each and every graphic design project that comes through our desk.

Web 2.0 For The Laymen

One of the most common buzzwords I hear misused is “Web 2.0”. It seems like everyone in the industry these days throws that word out as little more than a selling point, often with no understanding of what it actually means. I thought I would start off the Magic Logix blog right and explain this new approach to the web in Laymen terms as well as offer some insights into relevant technologies. Hopefully some people out there might get a better understanding of what web 2.0 is and more importantly how they can use it to their benefit.

The one thing you need to understand is that Web 2.0 is an idea. It’s not a specific technology, script or platform as much as a way of approaching the web. The term began originally with a conference between O'Reilly and MediaLive International. Legendary web jedi Dale Dougherty and tech guru Tim O'Reilly basically founded the concept after the dot-com bubble burst in the fall of 2001. They used the term to describe newly emerging web applications and architecture in the post dot-com collapse. In an article published September 2005 entitled “What Is Web 2.0 - Design Patterns and Business Models for the Next Generation of Software” O'Reilly outlines the new terminology very concisely by contrasting older web based business models with newer ones that utilize this paradigm through enhanced architecture, community interaction and various web based applications.

For those who don’t understand the tech lingo I will try my best to put it in simple terms. Basically the web sucked up until the late 90’s. It was one big mess of hyperlinks and inefficient scripts. Obtaining cutting edge programming that enabled visitors to interact with a website (registering as a user for example) were expensive and too complicated for novice users and new web start ups to employ. The larger companies that could afford to develop these types of scripts prospered and the ones that didn’t, didn’t. All of this came to a head (supposedly) the fall of 2001 and bam! Web 2.0! Well, actually it’s a lot more complicated than that, but you get the picture.

The comment features on this blog, social bookmarking sites like Digg.com, technorati, the superstar tags you see on Jobster.com or the dynamic user features you enjoy on Flickr.com are all shining examples of a Web 2.0 approach to the internet. Whether it is a more efficient way of sharing content or just an enhanced user experience, the general premise and democratic ideals stay the same.

The prospect of trying to hand code a company website for someone who has trouble logging into their e-mail correctly is slim at best. With Web 2.0 that is no longer the case. The explosion of open source CMS projects like Joomla! and Mambo allow people to cut out the expensive web maintenance that kept most business owners out of the game. Portals like Myspace.com have made coders out of everyone from disaffected hipsters to aging soccer moms the world over, so the transition isn’t hard to see in the near future.

The funniest thing to me is that the web actually really started to take off just as it was reported to fall apart. Some have argued the whole thing is little more than an over-hyped marketing ploy. Whatever the case, with recent statistics indicating that 17.2 % of the world’s population is now online, a strong web presence may be crucial for future business models.