Mywebdunia's Blog

Archive for January 2009

These are some of the tips for Search Engine Optimization..
1. Find the best keywords that match your site content.
2. Title and META tags should be different for different pages relevant to your content on the page.
3. Optimize your Website Title to limited characters.
4. Optimize your META tags ie., keywords and description part. Limit the META tags characters to 150 characters and to not repeat your keywords more than 3 times.
Here’s the syntax:

<meta name=”keywords” content=”keyword1, keyword2, keyword3, keyword4″ />

<meta name=”description” content=”some description about your site content goes here ” />

5. Use Headings. Make sure that you include at least H1-H3 when assembling your page.
6. Use Title and ALT Attributes for images and links.
7. Create a sitemap page.
8. Include a robots.txt File.
Open up a text editor, such as Notepad and type “User-agent: *”. Then save the file as robots.txt and upload it to your root directory on your domain.
9. Install a sitemap.xml for Google ie., sitemap.org
10. Validate Your Code for HTML and CSS

Here is a link to the W3C’s HTML Validation Tool and to their CSS Validation Tool.

If you are looking for simple CSS based menu try these as your options

HTML goes here

<div id=”menu”>
<ul>
<li><a>Home</a></li>
<li><a>About</a></li>
<li><a>Profile</a></li>
<li><a>Gallery</a></li>
<li><a>Contacts</a></li>
</ul>
</div>

CSS goes here
#menu{
font-family:Verdana,Arial;
background-color:#000000;
height:30px;
line-height:30px;
}
#menu ul li{
display:inline;
list-style-type:none;
}
#menu a{
font-weight:bold;
font-size:12px;
color:#ffffff;
text-decoration:none;
padding:0 5px;
}
#menu a{
font-weight:bold;
font-size:12px;
color:#cccccc;
text-decoration:none;
padding:0 5px;
}

Tags: ,

If you looking for the transparent background for your drop down menu, either it might be for vertical menu or for horizontal menu. This is how you can get it done

#menu{
background-color:green;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); // for IE
opacity:0.5; // rest all browsers
}

If you want to set transparency for images or text, it could be done easily using CSS class attribute. Below example sets 50% transparency.

Example:
.transparentClass{
filter:alpha(opacity=50); // for IE5-7
-moz-opacity:0.5; // Netscape Navigator.
opacity:0.5; // for all other browsers
-ms-filter:”progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”; // for IE5-8
}
The following code can be used to set transparency. the four
seperate CSS Statements are used for different browsers.


Categories