A JavaScript library to make MSIE behave like a standards-compliant browser

June 24th, 2010 / No Comments » / by admin

Ie7-js Javascript Library

IE7.js is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6.

Usage

IE7.js

Upgrade MSIE5.5-6 to be compatible with MSIE7.

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script>
<![endif]-->

 

IE8.js

Upgrade MSIE5.5-7 to be compatible with MSIE8.

<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->

 

IE9.js

Upgrade MSIE5.5-8 to be compatible with modern browsers.

<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->

The script only fixes images named: *-trans.png

If you want the fix to apply to all PNG images then set a global variable as follows:

var IE7_PNG_SUFFIX = ".png";

You must set this variable before including the IE7.js script. Alternatively, you can set the variable inside the IE7.js script element:

<script src="IE8.js">IE7_PNG_SUFFIX=".png";</script>

download it here

CSS Hack for Safari & chrome, internet explorer 6 ,7,8, and Firefox

June 15th, 2010 / No Comments » / by admin

We all  have a problem with browser compatibility. Hacking CSS for me is not a shame since many browsers are not trying to be web standard compliant yet so what the hell! We try to do standard but they’re not (especially IE family). If css hack work why not implement it.

let do it…

Chrome & Safari(webkit)

@media screen and (-webkit-min-device-pixel-ratio:0) { 
  
/* Safari 3.0 and Chrome rules here */
#test1{background-color:blue;color:#fff;}
}

This is another way

body:nth-of-type(1) #test1{ background-color:aqua;}

IE 8 only

#test1{background-color:#fff \0/

IE7 only

#test1{*background-color:#fff}

IE6 only

* html #block { /* target IE6 only */ 
margin-top: 50px;
}

Note: remeber how ordeering these  are the most important part. Try to put a correct css on the top and folowing with hacks. These hacks do work!

enjoy!

CSS hack for Internet Explorer 8

June 1st, 2010 / No Comments » / by admin

.color {color: #777;} /* for all browsers */
* html .color {color: #C39;} /* for IE6 */
*+html .color {color: #66F;} /* for IE7 */
.color {color: #0FC\0/;} /* for IE8, going last */

IE bugs fixes

March 4th, 2010 / No Comments » / by admin

Do you hate IE? I do but IE8 is an exception so far it’s still not up to what Mozilla or Safari.

However, this is really awesome tip we all can try if we run into IE troble.

Position Relative and Overflow Hidden

It happens when the parent element overflow set to hidden and the child element is set to position:relative.

Add position relative to the parent element.

Min-Height for IE

It’s simple, IE ignores min-height properties and you can use the following hack to fix it.

This solution works like a charm in IE6, Mozilla/Firefox/Gecko, Opera 7.x+, Safari1.2

selector { min-height:500px; height:auto !important; height:500px; }

Bicubic Image Scaling

IE image scaling is horrible so we use this generic IE code in our stylesheet.

img { -ms-interpolation-mode: bicubic; }

 

PNG Transparency

I am not sure if this is going to work as I normally using unitpng.js

img { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(&#8230;); }

Disabled IE default Vertical Scroll bar

By default, IE displays vertical scrollbar even though the content fit nicely in the window. You can use overflow:auto to show it only when you need

html { overflow: auto; }

IFrame Transparent Background

In firefox and safari you shouldn’t encounter this problem because by default, the iframe background is set to transparent, but in IE, it doesn’t. You need to use allowTransparency attribute and put the following CSS code to achieve that.

/* in the iframe element */ <br /> <iframe src="content.html" allowtransparency="allowtransparency"></iframe></p> <p>/* in the iframe docuement, in this case content.html */ <br /> body { background-color:transparent; }

:hover Pseudo Class

IE only supports :hover pseudo class for anchor element. You can achieve the same effect using jQuery hover event.

/* jQuery Script */<br /> $(&#8216;#list li&#8217;).hover(</p> <p> function () {<br /> $(this).addClass(&#8216;color&#8217;);<br /> },</p> <p> function() {<br /> $(this).removeClass(&#8216;color&#8217;);<br /> }<br /> );</p> <p>/* CSS Style */<br /> .color {<br /> background-color:#f00;<br /> }</p> <p>/* HTML */</p> <ul id="list"> <li>Item 1</li> <p></p> <li>Item 2</li> <p></p> <li>Item 3</li> <p> </ul> <p>

I haven’t try this fixed yet however, it’s promising. Note for future reference.

SEO to follow on twitters

October 9th, 2009 / No Comments » / by admin

  • 1 Matt Cutts – Head of web spam team at Google.
  • 2 SE Roundtable – Constant updates to their quality blog posts
  • 3 WebProNews – Twitter account is constantly updated and well worth adding to your list.
  • 4 Arron Wall – Author of SEO Book
  • 5 SEOmoz – The best of the SEO web. Not many tweets but interesting t the same time.
  • 6 Fantomaster – Very technical SEO Guru
  • 7 Mashable – CEO at Mashable, Constatly updating.

Font usage in design(in Short)

October 6th, 2009 / No Comments » / by admin

AVENIR

For book without a large amount of text

Bell Centennial

For listening and very poor printing condition

Bell gothic

For very small text containing large amounts of information

Din

For signage posters and display

Franglin Gothic

For newspaper and where available space is limited

Frutiger

For Large signage as an all-purpose for print media

Futura

For large displays; small text in books

gill Sans

For signage; as an all – purpose font for print media

Helvetica

For large or small text; as an all-purpose type face

Meta

for text and numbers, especially corporate communication

Myriad

For large displays;as an all purpose font for print media

trade Gothic

For newspaper, especially classified ads

Univers

For packaging signage and textbooks

VGA Rounded

For instruction manuals and print advertising

Adobe Caslon

For magazines, journals, textbooks, and corporate communication

Adobe Garamond

For textbooks and magazines

Bembo

For posters, packaging, and textbooks

Bodoni

For headlines, Text, and logos

Clarendon

For dictionaries and headlines

Courier

For tabular materials, technical documentation, and word processing

Excelsion

For newsletters, reports, and proposals

Lucida

For low resolution printing, small point sizes and revered-out halftones

Minion

For Limited edition books, newsleters, and packaging

Perpetua

For displays with fine lettering

Sabon

For books and corporate communication

Stempel Schneidler

For displays and fine, legible text type
For newspapers, magazines, and corporate communication

Trajan

For books magazines, posters and billboards

Walbaum

For magazines, Journals, and corporate communication

Web Trends 2010 condense by Lars Hilse

October 3rd, 2009 / No Comments » / by admin

Think of the mobile users!

Yet it has been proven that the most revisited websites among mobile users are those that automatically redirect them to a dedicated mobile version of the site. This technology, by the way, identifies the device you surf with and if it turns out to an iPhone, Blackberry, etc. it will direct you to a site especially designed to save bandwidth and display the site so that if comfortably fits into the hand-held devices screen.

Responsive disclosure

The times are getting faster and faster and hardly anyone has time to read through tons of website content. All you want is to get the message across with as little text as possible. However, what you don’t want is to leave the interested visitor in the dark about something. So here is how you can serve both interests:

You know that every copy has a bottom line where you sum things up, right?

What you do now is take the bottom line to the top because it expresses all you want to convey in a nutshell. The rest of the text remains hidden with a "read more" button below the bottom – sorry – top-line. The interested visitor to your website is not overwhelmed but has the possibility to read more if they should desire to.

Static Menus

You read through a website, ALL the way down and then you want to contact the owner of the website, jump to another part of the site but you can’t because you have to scroll all the way up again to get to the menu. True, this is nothing dramatic if you have a really interested visitor to your site. But wouldn’t it be nicer to have the whole menu in place and constantly visible to your user so they can – without having to scroll – take direct action?

Clear and Simple Website Designs

We have seen everything by now. Or have we? The times of frilly flash based sites are over. So are the times where you’ve had to undergo tremendous investments for video productions. Especially in fast times people want to get to the information fast and independent of any browser issues or missing plug-ins. Your 2010 website should have a clear, transparent design, convey the message of your operation immediately through either pictures or wording and have easy navigation and perhaps a search function. That’s it. Recent surveys have revealed that the more design goes into a site, the bigger the distraction from the core information of a site.

Multimedia Content

There are those of us that digest information best when reading it. That’s the crowd most websites are created for. The people who have an easier time by getting information presented to them through video or a guided presentation are totally neglected by most online platforms. The production of high class videos is fairly expensive, true. But let’s not forget that all we want to do is to get the point across. The budget you’re going to have to devote to either a mid-class video or a guided presentation with a little bit of voice to it are – in context to the potential ROI increase – fairly small.

Interactivity

Have you ever taken time on how long it took you to find the "contact us" section of a website? And sometimes you end up not finding it at all simply because it’s not there. Recent trends are that we’re getting a lot of users to the web which have tremendous expectations towards customer service. Also on a website, so the logical consequence should be that the website operators react, right? Wrong! And if they do it takes ages and the efforts are half hearted. If you manage to include a live chat function in your online presentation you’re off to a pretty good start. This technology allows a website visitor to click a button and you can chat with them in a dedicated chat room. Cool, ey? Another good tip is to have your "contact us" button visible and easily accessible at all times, allowing the visitor to pick up the phone or write an email immediately. When thinking things through you should also consider moving away from displaying your email address on your website because nothing is worse than sitting at your friends or work computer and having to go through the hassle of opening your webmail program to reach out. So replacing your email address with a webform will make life easier for your visitors – oh yes, and by the way: it may also reduce SPAM to your own inbox as well.

Customer Self Service on your Website

Believe me, there are several things you can do to reduce customer service costs. Why don’t we start with making all your documentation available online? And while we’re at it we of course want to make sure to get updated information about the customer which is the reason why we’ll have the information available but people have to register for an account to access it.

All you want is your visitor’s data!

Even though we can extract a significant amount of information out of our website visitors, their true identity and contact information mostly remain a secret to us. So we have to find ways that will want to make them reveal this data to us, right? What you should prefer in the context is a non militant approach, simply because that will scare the people away from your website.

Most important is that the methods you choose are individual and somewhat new. No customer is going to go for "old tricks". Keep in mind: a web form which requires the customer to fill in their contact details actually gives you their details. If you just put up your email address they’ll write you an email which in 90%+ will not even include their real name.

RealTime Website Visitor Analysis / Analytics

The instruments most people utilize to get a clue about what’s going on on their website are hardly more than good jokes. The website analytics industry is so filled with products which will blow your mind. If you’re the no-budget person you’ll definitely want to have a look at instruments like Google Analytics, a free service which offers you more than enough insight into website visitor’s behavior, their location, allow specific segmentation, give you access to tons of metrics, etc. The next level is instruments which let you monitor your website traffic in real time. And that’s not it. The system will – upon the behavior of the website visitor – calculate the probability whether they are seriously interested or they’re just there to kill time. Should you not be overwhelmed by now: an operator gets this specific visitor indicated on a screen from which the operator can then open a livechat window on the website visitor’s screen, directly engaging in a conversation.

You can use the web to make inter-organizational collaboration more efficient. The secret here is that you store your documents, spreadsheets, presentations, etc. on the web. Probably the niftier phrase to use here is "in the cloud". This way you’ll have your documents readily accessible regardless where you are. Ok, the protesters of you will intervene by bringing up the fact that not everyone is not connected everywhere, which is entirely true. The solution to this is that clever services like Google Docs have tools available that let you work offline by downloading a small plug-in. Your work’s progress is then synchronized the next time you have an online connection. These services allow you to collaboratively work on documents, spreadsheets and presentations through the browser, regardless what computer you’re at in the world and never fear loss of data. Give it a try. It’s going to blow your mind, trust me.

default web font for windows

September 22nd, 2009 / No Comments » / by admin


Windows fonts / Mac fonts / Font family

Normal style Bold style
Arial, Arial, Helvetica, sans-serif Arial, Arial, Helvetica, sans-serif
Arial Black, Arial Black, Gadget, sans-serif Arial Black, Arial Black, Gadget, sans-serif
Comic Sans MS, Comic Sans MS5, cursive Comic Sans MS, Comic Sans MS5, cursive
Courier New, Courier New, Courier6, monospace Courier New, Courier New, Courier6, monospace
Georgia1, Georgia, serif Georgia1, Georgia, serif
Impact, Impact5, Charcoal6, sans-serif Impact, Impact5, Charcoal6, sans-serif
Lucida Console, Monaco5, monospace Lucida Console, Monaco5, monospace
Lucida Sans Unicode, Lucida Grande, sans-serif Lucida Sans Unicode, Lucida Grande, sans-serif
Palatino Linotype, Book Antiqua3, Palatino6, serif Palatino Linotype, Book Antiqua3, Palatino6, serif
Tahoma, Geneva, sans-serif Tahoma, Geneva, sans-serif
Times New Roman, Times, serif Times New Roman, Times, serif
Trebuchet MS1, Helvetica, sans-serif Trebuchet MS1, Helvetica, sans-serif
Verdana, Verdana, Geneva, sans-serif Verdana, Verdana, Geneva, sans-serif
Symbol, Symbol (Symbol2, Symbol2) Symbol, Symbol (Symbol2, Symbol2)
Webdings, Webdings (Webdings2, Webdings2) Webdings, Webdings (Webdings2, Webdings2)
Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2) Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2)
MS Sans Serif4, Geneva, sans-serif MS Sans Serif4, Geneva, sans-serif
MS Serif4, New York6, serif MS Serif4, New York6, serif

1 Georgia and Trebuchet MS are bundled with Windows 2000/XP and they are also included in the IE font pack (and bundled with other MS applications), so they are quite common in Windows 98 systems.

2 Symbolic fonts are only displayed in Internet Explorer, in other browsers a font substitute is used instead (although the Symbol font does work in Opera and the Webdings works in Safari).

3 Book Antiqua is almost exactly the same font that Palatino Linotype, Palatino Linotype is included in Windows 2000/XP while Book Antiqua was bundled with Windows 98.

4 These fonts are not TrueType fonts but bitmap fonts, so they won’t look well when using some font sizes (they are designed for 8, 10, 12, 14, 18 and 24 point sizes at 96 DPI).

5 These fonts work in Safari but only when using the normal font style, and not with bold or italic styles. Comic Sans MS works in bold but not in italic. Other Mac browsers seems to emulate properly the styles not provided by the font.

6 These fonts are present in Mac OS X only if Classic is installed.

cSS Play : Text overlay images

August 16th, 2009 / No Comments » / by admin

HTML code

<div class="image"> <p> <img src="images/3754004820_91a5c238a0.jpg" alt="" /></p> <h2>A Movie in the Park:<br />Kung Fu Panda</h2> </div> <p>CSS code

.image {<br /> position: relative;<br /> width: 100%; /* for IE 6 */<br /> }</p> <p>h2 {<br /> position: absolute;<br /> top: 200px;<br /> left: 0;<br /> width: 100%;<br /> }

image

Cross-browser semi-transparent backgrounds

August 16th, 2009 / No Comments » / by admin

css code

.trans_box2 {<br />
font-family:verdana;<br />
font-weight:bold;<br />
padding:40px;<br />
margin:30px;<br />
border:solid 1px #555;<br />
/* Mozilla ignores crazy MS image filters, so it will skip the following */<br />
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src=’/75p_honey.png’);<br />
}<br />
/* IE ignores styles with [attributes], so it will skip the following. */<br />
.trans_box2[class] {<br />
background-image:url(/75p_honey.png);&#160;

html code

<div style=”float:left;background-image:url(/flowers.jpg);border:solid 1px #000;padding:10px;” mce_style=”float:left;background-image:url(/flowers.jpg);border:solid 1px #000;padding:10px;”>
<div class=”trans_box1″ style=”float:left;” mce_style=”float:left;”>
I like flowers.
</div>
<div class=”trans_box1″ style=”float:left;” mce_style=”float:left;”>
They smell nice.
</div>
<div class=”trans_box2″ style=”float:left;” mce_style=”float:left;”>
<a href=”http://www.google.com/search?q=flowers+bees+honey” mce_href=”http://www.google.com/search?q=flowers+bees+honey”&gt;When combined with bees, they make honey…></a>
</div>
<p>

Page Rank do and Don’t

August 13th, 2009 / No Comments » / by admin

DO

Content is the king. Search engines love fresh and quality content, since that’s what the users want – more new things to read every day and every hour. When your site changes often – search engine crawlers come back more often as well. Of course by generating new content you raise the chance that more of your pages will be found.

Once you have the content generated, here is what you can do to have your site found more often by new visitors:

  1. Use Google Sitemaps to see how Google sees your site, when it was last updated, whether you have any problems on your site, etc. I’ve written an article on this topic: How to Improve Site’s Ranking with Google Sitemaps. You also want to provide a sitemap for your visitors.
  2. Get involved in communities relevant to the content of your site. Visit their forums and mailing lists, and help other people by answering their questions, posting links to your site if they contain information relevant to your replies. Usually you are allowed to have a signature, where you can link to your site. However be aware that more and more sites implement a new link attribute rel="nofollow", which tells Google (MSN, Yahoo and other sites) to not count those links to your site’s ranking credit. This is to avoid comment spam. You can find the details here: Official Google Blog: Preventing comment spam.
  3. The head section of the document should include meta entries for keywords and description. Though it’s been said that the keywords meta entry has little or no weight with Google, but is still useful with other search engines. Also make sure that the title of the document includes the most important keywords and phrases, as Google gives a heavy weight to those. The keywords need to be included in the H1 and H2 header entries, and also once in bold, once in italic and if possible in the URL.
  4. Spell check your content. Google doesn’t like when misspelled words are used, as it tries to auto-correct search words. Some sites use misspelled words to get more traffic to their site. e.g., "hign paying keywords" instead of "high paying keywords"
  5. It’s been said that sites containing valid XHTML are favored by the search engines. But it should at least use valid HTML. One other thing to make sure is that your site is readable by non-graphical browsers, such as Links and Lynx. Blind users use those to browse the Internet and search engines favor sites that are useful to more people. In fact search engines see your site as text, so things like javascript, DHTML and Flash may make it hard for the search engine to crawl your site.
  6. Publish articles on other sites relevant to your expertise. Make sure that those articles link back to your site. I’m somewhat weary about submitting my articles to other sites, since then I end up with a duplication problem and a chance that a search engine would penalise duplicated content sites. Hopefully it somehow knows where the content has appeared in first place. But I don’t want to take chances. So may be submitting unique articles which don’t appear on my site is a much safer strategy.
  7. Sometimes your site competes with many other sites for the same keywords. Rather than optimising all of your site for the same keywords, try to find less competitive keywords and optimise some of your pages for those keywords. There are both commercial and free programs to help you do that.
  8. Learn from your competitors. Go to Google and search for the competing keywords, go to the first few sites with high page rank and analyse those sites, see what they have done differently than your site. Granted the site might be just very popular and linked from many other sites, but more often than not reading through the source code of the site can tip you off how to do better. You can find out which sites link to that site by searching Google for link:yoursite.com and you may want to try to get your site listed on those sites.
  9. Since it’s not enough to have a high ranking for your front page (Google gives different page ranks to different pages), once your site is established you should try to get other sites to link to other sections of your site as well. For example if you have a big site and you can identify segments which are different from each, try to raise a page rank for the sub-directories corresponding to those sections.
  10. Have each page linking to several other pages on your site (crosslinking). That should be especially helpful for balancing the page ranking across different pages of your site, and of course it should help your visitors to find related content on your site.
  11. Try to include a few outbound links to high quality sites in every document. That indicates a quality connection between your document and others sites that Google already considers to be quality sites. When linking to those sites, try to include the important keywords in those links.
  12. Analyse your log files and see who refers to you the most. Try to find more similar sites. The referral information also reveals the keywords used to find your site. Often you find new keywords that you haven’t thought of when targeting your site. By using those newly discovered keywords you can create more content that targets the unexpected traffic even better.

DON’T

  1. If you created a new site, do not put ads on it right away – Google marks those sites as suspected "ad farm" sites and won’t index them for a certain period of time (placing them into the sandbox). The common suggestion is to have your site up for one month with the content, before you can put ads in it. However there is no official word on that – so a shorter or longer period might be required.
  2. Google gives high ranking to sites that have inbound links from other sites. But not just any sites. Those need to be sites with high ranking. That means that you can’t just create a bunch of sites and have them link to each other and have your ranking go up. Neither submitting reciprocal links with link exchange sites will help. In fact it’ll make things worse, as Google doesn’t like "link farms". Sites linking to yours should also be relevant to your content.
  3. Including links to social bookmarking services, like reddit.com, digg.com, del.icio.us, etc. (there are hundreds of those now and their number is growing) will allow your visitors to submit your site’s links to those services in one click (e.g., see some of those at the end of this article). However most (all?) of those sites implement the link attribute rel="nofollow", which won’t help your site’s ranking.
  4. Avoid duplicated content. There are many sites out there that spring up overnight, by copying content from other sites, buying pre-made sites, etc. Google detects those and penalises the guilty, by not indexing them. Instead of duplicating content, quote the relevant parts and provide a link to the original source. Also make sure that a single page on your site is linked to via a canonical URL, i.e. if you link to the same page as http://www.example.com/ and http://example.com/ some search engines consider that as duplicating content.
  5. Avoid keyword spamming. Overoptimising and overusing key terms or using irrelevant keywords on your pages will negatively affect your site’s ranking
  6. Do not include invisible text. One can create invisible text by choosing the font colour which is the same as of the background, putting the text at the very bottom of the page, so that the visitor won’t see it, and other ways. The idea is to include certain keywords multiply times to make the page appear more relevant. This technique doesn’t work anymore, since modern search engines catch that trick and punish sites using it.
  7. Search engines don’t like dynamic pages that contain query characters like "?". Try avoiding those. You could try using rewriting rules to map good URL names to those dynamic URLs behind the scenes. Google definitely doesn’t index pages containing "&id=" as a parameter in your URLs.
  8. Do the redirects correctly. If you must move a document to a new location, the old location has to issue a 301 redirect code, which tells the crawler that the page has moved permanently. Webmaster have tried to use a 302 redirect (temporarily moved) to fool the users and redirect them to a different page than the one indexed by the spider. Though I can see how the spider can be fooled to not do the redirect, when it spiders the pages. This is because spiders can be identified as such before the page is served to them. So one could serve different pages to visitors and search engine crawlers. But don’t do that.
  9. Don’t post too many links on a single page. Google suggests less than 100. When linking to other sites, avoid linking to sites with bad reputation. When you receive a request to link to another site, first go and check that the site is of a good quality and that it’s of a relevant content.
  10. Don’t use unauthorised computer programs to submit pages, check rankings, etc. Such programs consume computing resources and violate their Terms of Service. Therefore if you still plan to uses one, you’d have to check whether it conforms with the rules or not.
  11. When having other sites link to yours (inbound links), try to use different wordings for the anchored text. If it’s always the same wording, search engines may consider those links as an attempt to raise your page rank and your site’s page rank will be devalued.
  12. Several sources indicate that submitting your site via "Add URL" to various search engines might be a bad idea. The premise is that if spiders can’t find your site via other sites linking to you, then your site probably is not worthy their time. But this is only relevant for new sites.


why you need site map

August 11th, 2009 / No Comments » / by admin

What is a sitemap?

A sitemap is basically a page or pages that serve/s as a directory by listing all the links to all documents and files found in a website. It is not merely a random listing of links, but organized in such a way that it gives the web user an idea of how all the information that can be found in the site fits into an outline or framework. It is like viewing the table of contents of a book, or viewing the “concept map” of the site’s content.

What is a spider?

In SEO language, spider is not an animal found in your closet. This electronic search spider is actually a bot which collects data and copies content to be stored in the search engine’s database when keywords are fed into the search dialogue box. The spider reads the content of the site and sends another bot to follow the links and copy the content contained in them.

What purpose does a sitemap serve?

A sitemap like any other map gives directions to a navigator. It primarily targets search engine spiders so that they are properly directed to your site and to the links where keywords entered in the search dialogue appears.  As such, it is actually a useful tool in search engine optimization. A well organized site map would guide the spider to find the information it needs when keywords are entered during a search operation.

As an additional beneficial consequence, sitemaps have proven to be useful even to web users. Since a sitemap displays all the links to information found in a website, it helps the user to search for a particular topic in mind. Many users also use the sitemap to navigate between pages in a site.

What are the benefits of having a sitemap for my website?

1. No page would be left unturned Going back to the purpose of sitemaps, having one would mean faster and easier tracking and crawling of spiders all over your site. As a result, search engines would surely get to the view all the pages of your site and not just the pages containing random keywords.

2. Easier navigation for site visitors Once a web user has accessed your sitemap, they need not go back to the search engine page to look for what they need. If what they are looking for is in your site, then they would have an easier and faster way of locating it.

3. Potential advertising value If it so happens that a relevant product or service company reaches your site, then it would be easier for them to see how best they can position themselves in the different pages of your site as a paid page advertisement.

4. Encourage greater traffic to your site If your company website has a sitemap then potential buyers would have an easier time in accessing your latest products and services. Moreover, they would not miss out on any product that might be off future interest to them since the sitemap would display all information found the site.

How are sitemaps formatted?

There are at least three major types of sitemaps: indexed, full categorical, and restricted categorical. An indexed site map appears as an alphabetical listing or directory. A full categorical map displays all links classified into categories; while a restricted categorical sitemap displays all links listed in a chosen category at a time. The full and restricted sitemaps are very similar except that the former displays all links in all categories all at once in a page, while the latter focuses only the links under the selected category for easier and less eye-straining viewing.

The most widely used format is the full categorical. Based on the results of a 1999 SURL study on sitemap designs, the full categorical format is most preferred by users since it is easier to search for topics within the site and it allows easier comparison between and among categories.

Some tips in setting up your sitemap

1. Link the sitemap only to your homepage. This is to ensure that the spider starts searching from your homepage down to all the pages listed in your sitemap. In this way, no page would be left unvisited by the spider.

2. Do not go beyond 30 pages for a sitemap. Large websites having 50 or more pages should not go beyond 30 since this adds more pages to the site, and might make search engines think that the sitemap is a link farm. Also, this prevents overcrowding of links which could be tiring to view.

3. Check all the links listed in your sitemap. It can be discouraging when you click on a link only to find out that nothing is displayed. Test your sitemap; click all links in every page to make sure that all links are indeed linked to the right page.

4. Give keyword-rich titles to sitemap links. Keyword-rich titles give your site more advantage in being searched properly under the right category. But be sure to have this sitemap link linked back to the sitemap (e.g. back to sitemap).

5. Provide a short description for the links in the sitemap. Doing so would give readers a better idea of what to find in the link and save them time on surfing.

6. Be consistent in designing your sitemap with the other pages of the site. Employ a recurring design and the same HTML template for all pages to establish identity and build character to your website.

SEO practice you should and shouldn’t do

August 11th, 2009 / No Comments » / by admin

1. Things that you should not do in your web page titles

  • Do not use web page titles
  • that have no relation to the content on the page.
  • Do not use general web page titles such as "Untitled" or "New Page".
  • Do not use the same title for more than one web page.
  • Do not use very long titles that do not help your users.
  • Do not stuff unnecessary keywords in your title tag.

2. Things that you should not do in your meta tags

  • Do not use meta description tags that have no relation to the web page content.
  • Do not use general descriptions such as "My web page" or "About kittens".
  • Do not use only keywords in the description.
  • Do not copy the entire content of the web page in the meta description tag.
  • Do not use the same description tag on more than one web page.

3. Things that you should not do with your URLs

  • Do not use lengthy URLs with unnecessary parameters and session IDs.
  • Do not overuse keywords in your URL (kittens-cute-kittens-all-about-kittens.htm).
  • Do not use too many sub directories (../here/there/down/2/buried/deep/down/content.htm).
  • Do not use directory names that have no relation to the web page content.

4. Things that you should not do with your website navigation

  • Do not show the same content with different domains or sub-domains.

Reason to search engine optimization (SEO)your website

August 11th, 2009 / No Comments » / by admin

(SEO) is an essential requirement of websites making constant efforts for high popularity. If you have been ignoring this fact, it is time to bring modification in your thought process. How can you consider it possible for your website to exist in the hard-hitting competition? No matter, how captivating your website is, it has no market value in case you are not able to divert web traffic towards it. As the discussion unfolds, you can introduce yourself to most eligible reasons for opting for SEO practices.

 

Wavering Behavior of Search Engines

Search engines are in constant process of refining their algorithms, so that web surfers are presented with productive search results. While this can affect your website ranking, you must keep close association with vibrant nature of search engine algorithms and this is possible by following successful SEO strategies. By doing so, you can bait search engine spiders to make frequent visits to your website and index its web pages amongst top search results.

How Web Traffic Moves

The web traffic takes suggestions from search engines to choose its path leading to various websites. The majority of web surfers use popular search engines for finding top results related to products and services hunted by them. It is also a noteworthy fact that most of search engine users get satisfied with the results offered on the first and second search engine page. Thus, it is very important to let your website find its position amongst top search results. Only search engine optimization techniques can help you in this regard.

Online Promotion of Business

There is no better way than SEO to market your products and services on internet. You can extract advantages out of techniques like content development, article distribution, link building, PPC and others to spread the message about your website. Thus by optimizing your website for search engines, you not only make it eligible for higher ranks, but also promote it over vast web space.

High Sales and Conversions

SEO can build a bridge for potential buyers of your products and services to reach your website and contribute towards successful sale. Thus, your ultimate aim of getting desired returns on investments can be entertained by allowing your website to be optimized for search engines. Once your website starts selling, you must continuously fuel the performance of search engine optimization practices to take sales program to its peak value.

Your Inability to Popularize Website

The websites become popular, when their owners have right skill sets and plenty of time to endorse it over web. Even the capable web designers find themselves incapable of making their website trendy and accepted. This might happen due to scarcity of time and required amount of knowledge to perform these tasks. In such situation, a SEO expert is going to share your burden and make your website scale new heights of popularity.

search engine optimization can’t be neglected, when every website around you is trying to hold its feet on the land of popularity. Thus, make sure you follow the advice and start appreciating the use of SEO tools for the sake of your website.

Submit your site to search enigine

April 27th, 2009 / No Comments » / by admin

Submit your site

SEO basic, you can do it yourself!

April 27th, 2009 / No Comments » / by admin

  • Keywords in URL
    For example http://www.aboutdoghealth.org/ use whole words – keywords to best describe your site. Don’t rely on this if you don’t have keywords in other parts of your site.
  • Keywords in <title> tag
    This shows search results as your page title, so this is one of the most important things and it shouldn’t be long 5-6 words max, and use keyword at the beginning.
  • Keywords in anchor texts
    Also very important, especially for the anchor text, because if you have the keyword in the anchor text in a link from another site, this is regarded as getting a vote from this site not only about your site in general, but about the keyword in particular.
  • Keywords in headings (<H1>, <H2>, etc. tags)
    One more place where keywords count a lot. But beware that your page has actual text about the particular keyword.
  • Keywords in the beginning of a document
    While coding your page put your main content before side bar. Because this also counts, though not as much as anchor text, title tag or headings
  • Keywords in <alt> tags
    Spiders don’t read images but they do read their textual descriptions in the <alt> tag, so if you have images on your page, fill in the <alt> tag with some keywords about them.
  • Anchor text of inbound links
    This is one of the most important factors for good rankings. It is best if you have a keyword in the anchor text but even if you don’t, it is still OK.
  • Origin of inbound links
    It is important if the site that links to you is a reputable one or not. Generally sites with greater Google PR are considered reputable and the .edu and .gov sites are the most reputable
  • Links from similar sites
    Having links from similar sites is very, very useful. It indicates that the competition is voting for you and you are popular within your topical community.
  • Metatags
    Metatags are becoming less and less important but if there are metatags that still matter, these are the <description> and <keywords> ones.
  • Unique content
    Having more content (relevant content, which is different from the content on other sites both in wording and topics) is a real boost for your site’s rankings.
  • Frequency of content change
    Frequent changes are favored. It is great when you constantly add new content but it is not so great when you only make small updates to existing content.
  • Site Accessibility
    Another fundamental issue, which that is often neglected. If the site (or separate pages) is unaccessible because of broken links, 404 errors, password-protected areas and other similar reasons, then the site simply can’t be indexed.
  • Sitemap
    It is great to have a complete and up-to-date sitemap, spiders love it, no matter if it is a plain old HTML sitemap or the special Google sitemap format.

Hostdepartments.com is really completly utterly rip off

March 25th, 2009 / No Comments » / by admin

  • Server is full of virus.
  • irrespondsible support
  • crash often
  • all you can imagine about bad thing!
  • don’t sign up with them!

Resize Background image with Jquery

February 27th, 2009 / 13 Comments » / by pisakec

<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jquery.dimensions.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		var $winwidth = $(window).width();
		$("img.source-image").attr({
			width: $winwidth
		});
		$(window).bind("resize", function(){
			var $winwidth = $(window).width();
			$("img.source-image").attr({
				width: $winwidth
			});
		 });
	});
</script>

In order to get this inline image to behave more like a background image, we can use that unique class we applied to apply some absolute positioning.

img.source-image {
	position: absolute;
	top: 0;
	left: 0;
}

Because of this absolute positioning, anything that you want to put over it will also need positioning and a higher z-index value. If your source image is particularly tall, or your browser window is particularly wide, the image could easily become taller than your browser window and force a vertical scrollbar. In order to prevent this, simply set the overflow value on your body to hidden:

body {
  overflow: hidden;
}
Or Just css

Forget this javascript business! Thanks to Anders comment pointing out Stu Nicholls version, here is an even better way to handle this without the need for any javascript at all!

Since we already have a unique class on the image, the image is absolutely positioned, and the scrollbars thing is already taken care of, let’s just set the width using a percentage directly in the CSS:

#img.source-image {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

CSS Amazing tricks

February 26th, 2009 / 4 Comments » / by pisakec

Css Round Corner

div.rounded {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  padding:10px;
  border:3px solid #f3ddac;
  background: #fff3d8;
}

the html

<div class="rounded">
<h2>The Example</h2>
</div>

Certainly, it’s perfectly work on Firfox !

Creating Link Blocks

a.blocklink {
display:block;
width:160px;
background:#f0f0f0;
color:#999;
font-family:corbel, verdana, sans-serif;
padding:4px;
text-decoration:none;
font-weight:normal;
font-size:0.72em;
border:1px solid #dadada;
}
a.blocklink strong {
font-family:georgia, helvetica, sans-serif;
display:block;
color:#656565;
font-weight:bold;
font-size:1em;
margin:0 0 3px 0;
font-style:italic;
}
a.blocklink:hover {
background:#dcdcdc;
color:#303030;
border:1px solid #adadad;
}
a.blocklink:hover strong {
color:#cb0000;
}

the html

<a href="#" class="blocklink">
<strong>Link Block Heading</strong>
This is the text contained within the link block... </a>

Mimicking Drop Shandow

img.demo2 {
padding:1px;
border:2px solid #dcdcdc;
background:#ababab;
}

CSS transparency for All Browser

February 26th, 2009 / 1 Comment » / by pisakec

Transparency is one of those weird things that is treated completely differently in all browsers. To cover all your bases, you need four separate CSS statements. Fortunately they don’t interfere with each other really, so using them all every time you wish to add transparency is no big hassle and worry-free. Here they are, and are currently set to 50% transparency:

.transparent_class {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
  • opacity: 0.5; This is the “most important” one because it is the current standard in CSS. This will work in most versions of Firefox, Safari, and Opera. This would be all you need if all browsers supported current standards. Which, of course, they don’t.
  • filter:alpha(opacity=50); This one you need for IE.
  • -moz-opacity:0.5; You need this one to support way old school versions of the Mozilla browsers like Netscape Navigator.
  • -khtml-opacity: 0.5; This is for way old versions of Safari (1.x) when the rendering engine it was using was still referred to as KTHML, as opposed to the current WebKit.