ProCSSor is a free web service for formatting and prettifying CSS files on the fly.
It can grab a CSS file by simply copy-pasting, uploading or mentioning the URL directly.
The service has many options to create an output. Options include Brace Styles, Left/Right Columns or Indents.
Visit ProCSSor here.
Showing posts with label webmasters. Show all posts
Showing posts with label webmasters. Show all posts
17 October 2010
21 August 2010
Spoon Browser Sandbox: Perfect Cross-Browser Testing
Spoon Browser Sandbox allows you to run any browser right from your own browser. It requires the download of a plugin and works through virtualization to bring you popular browsers like Microsoft Internet Explorer, Mozilla Firefox, Google Chrome, Apple Safari and Opera.
The browsers offered are:
Microsoft Internet Explorer
Internet Explorer 6
Internet Explorer 7
Internet Explorer 8
Internet Explorer 9 Preview
Mozilla Firefox
Firefox 2
Firefox 3
Firefox 3.5
Firefox 3.6
Firefox 4 Beta
Google Chrome
Google Chrome
Google Chrome 5
Google Chrome 6 Beta
Apple Safari
Safari 3
Safari 4
Safari 5
Opera
Opera 9
Opera 10
Download Spoon Browser Sandbox here.
Note: Spoon also allows you to run application such as Office Suites, Media Editors etc. available in it's database. Visit their Apps page here.
The browsers offered are:
Microsoft Internet Explorer
Internet Explorer 6
Internet Explorer 7
Internet Explorer 8
Internet Explorer 9 Preview
Mozilla Firefox
Firefox 2
Firefox 3
Firefox 3.5
Firefox 3.6
Firefox 4 Beta
Google Chrome
Google Chrome
Google Chrome 5
Google Chrome 6 Beta
Apple Safari
Safari 3
Safari 4
Safari 5
Opera
Opera 9
Opera 10
Download Spoon Browser Sandbox here.
Note: Spoon also allows you to run application such as Office Suites, Media Editors etc. available in it's database. Visit their Apps page here.
15 December 2009
Browser Size: Check your website in different sizes
Google Labs has introduced yet another neat tool: Browser Size. Using this tool you can check your website in different browser sizes and optimize your website design.
Read excerpts from the Official Google Blog below:
Visit Browser Size here.
Read excerpts from the Official Google Blog below:
Browser Size is based on a sample of data from visitors to google.com. Special code collects data on the height and width of the browser for a sample of users. For a given point in the browser, the tool will tell you what percentage of users can see it. For example, if an important button is in the 80% region it means that 20% of users have to scroll in order to see it. If you're a web designer, you can use Browser Size to redesign your page to minimize scrolling and make sure that the important parts of the page are always prominent to your audience.
Visit Browser Size here.
10 December 2009
Make IE6 emulate IE7 or IE8!
IE6 is fast becoming an outdated browser, but the fact remains that 11% of users on the internet still use IE6 (according to w3schools.com statistics).
PNG transparency has been of the most annoying issues to deal with in IE6. Any webmaster who has faced this problem, has used either IE PNG Fix or jquery.pngFix.js PNG-Transparency.
IE :hover is another area which plagues not only IE6 but some of it's later incarnations as well. Whatever:hover is a small script that automatically patches :hover, :active and :focus for IE6, IE7 and IE8 quirks, letting you use them like you would in any other browser.
Another way to make IE6 emulate IE7 would be to use the IE7.js Javascript Library. IE7.js is a JavaScript library to make IE6 emulate IE7. This library fixes many CSS and HTML issues developers are constantly trying to deal with.
To apply the library to your website, you need to add the following code just before the </head> tag:
Some of the most important issues this library fixes are mentioned below:
CSS Selectors
parent > child
.multiple.classes
:hover
:first-child
[attr]
[attr="value"], [attr~="value"], [attr|="value"], [attr^="value"], [attr$="value"]
[attr*="value"]
CSS
Background-image – PNG alpha transparency (IE5.5+)
Background-attachment – Support fixed positioning
Position – Support fixed positioning
Margin – Support auto (IE5.x)
Cursor – Support pointer for IE5.x
Display – Convert list-item to block for IE5.x
HTML
img – PNG alpha transparency
abbr – Bug fixed
Please note that if Javascript is turned off, this trick won't work.
You can even make IE6 emulate IE8 if you wish! IE8.js is a JavaScript library to make IE6 emulate IE8. To apply the IE8.js library to your website, you need to add the following code just before the </head> tag:
Note: You don’t need to include the IE7.js if you are using IE8.js.
For more information, visit the ie7-js Google Code page here.
These tricks should help solve some of the issues with IE6 atleast until IE6 is completely eradication from the internet.
To force IE8 to render a page like IE7, please read my earlier post here.
PNG transparency has been of the most annoying issues to deal with in IE6. Any webmaster who has faced this problem, has used either IE PNG Fix or jquery.pngFix.js PNG-Transparency.
IE :hover is another area which plagues not only IE6 but some of it's later incarnations as well. Whatever:hover is a small script that automatically patches :hover, :active and :focus for IE6, IE7 and IE8 quirks, letting you use them like you would in any other browser.
Another way to make IE6 emulate IE7 would be to use the IE7.js Javascript Library. IE7.js is a JavaScript library to make IE6 emulate IE7. This library fixes many CSS and HTML issues developers are constantly trying to deal with.
To apply the library to your website, you need to add the following code just before the </head> tag:
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->
Some of the most important issues this library fixes are mentioned below:
CSS Selectors
CSS
HTML
Please note that if Javascript is turned off, this trick won't work.
You can even make IE6 emulate IE8 if you wish! IE8.js is a JavaScript library to make IE6 emulate IE8. To apply the IE8.js library to your website, you need to add the following code just before the </head> tag:
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->
Note: You don’t need to include the IE7.js if you are using IE8.js.
For more information, visit the ie7-js Google Code page here.
These tricks should help solve some of the issues with IE6 atleast until IE6 is completely eradication from the internet.
To force IE8 to render a page like IE7, please read my earlier post here.
Make IE8 render like IE7
IE8 is more a standards compliant browser than IE7. This makes some pages render incorrectly in IE8 if they are designed with to render properly in IE7.
You can force IE8 to render a page like IE7 by adding a special Meta tag in the <head> section as mentioned below:
Though it's a good idea to get everything working properly across all browsers the right way, this fix is a quick way to fix IE7 rendering issues in IE8.
You can force IE8 to render a page like IE7 by adding a special Meta tag in the <head> section as mentioned below:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
Though it's a good idea to get everything working properly across all browsers the right way, this fix is a quick way to fix IE7 rendering issues in IE8.
05 December 2009
Create and submit XML sitemaps
XML sitemaps are a proven way of ensuring your blog / website and all its pages are recognized by search engines. Creating and submitting / pinging your sitemap to the popular search engines, especially the big 3 Google, Yahoo! and Bing, is simple.
To create an XML sitemap, you can use some great free online XML Sitemap generators. I have listed some of my favorites below:
XML Sitemap Generator
Note: Also generates a text file of broken links.
XML Sitemap
Note: Allows sub level domains too. For eg: http://www.mysite.com/sublevel.
Create XML Site Maps
Once you have create your XML Sitemap, you need to upload it to your web server and submit it to search engines.
To submit your sitemap to Google and Yahoo!, visit this post. This post explains how to submit your blog sitemap, but the process to submit your website sitemap is the same.
Another way to submit your sitemap to Yahoo!:
http://search.yahooapis.com/SiteExplorerService/V1/updateNotification?appid=SitemapWriter&url=http://www.mysite.com/sitemap.xml
and
http://search.yahooapis.com/SiteExplorerService/V1/ping?sitemap=http://www.mysite.com/sitemap.xml
To submit your sitemap to Bing visit the Webmaster Center. The process to submit your sitemap here is similar to submitting to Google Webmasters Tools and Yahoo! Site Explorer. You can also ping the service:
www.bing.com/webmaster/ping.aspx?siteMap=http://www.mysite.com/sitemap.xml
or previously
http://webmaster.live.com/ping.aspx?siteMap=http://www.mysite.com/sitemap.xml
To submit your sitemap to Moreover.com:
http://api.moreover.com/ping?u=http://www.mysite.com/sitemap.xml
To submit your sitemap to Ask.com:
http://submissions.ask.com/ping?sitemap=http://www.mysite.com/sitemap.xml
Note: Replace http://www.mysite.com/ with your URL.
To create an XML sitemap, you can use some great free online XML Sitemap generators. I have listed some of my favorites below:
Note: Also generates a text file of broken links.
Note: Allows sub level domains too. For eg: http://www.mysite.com/sublevel.
Once you have create your XML Sitemap, you need to upload it to your web server and submit it to search engines.
To submit your sitemap to Google and Yahoo!, visit this post. This post explains how to submit your blog sitemap, but the process to submit your website sitemap is the same.
Another way to submit your sitemap to Yahoo!:
http://search.yahooapis.com/SiteExplorerService/V1/updateNotification?appid=SitemapWriter&url=http://www.mysite.com/sitemap.xml
and
http://search.yahooapis.com/SiteExplorerService/V1/ping?sitemap=http://www.mysite.com/sitemap.xml
To submit your sitemap to Bing visit the Webmaster Center. The process to submit your sitemap here is similar to submitting to Google Webmasters Tools and Yahoo! Site Explorer. You can also ping the service:
www.bing.com/webmaster/ping.aspx?siteMap=http://www.mysite.com/sitemap.xml
or previously
http://webmaster.live.com/ping.aspx?siteMap=http://www.mysite.com/sitemap.xml
To submit your sitemap to Moreover.com:
http://api.moreover.com/ping?u=http://www.mysite.com/sitemap.xml
To submit your sitemap to Ask.com:
http://submissions.ask.com/ping?sitemap=http://www.mysite.com/sitemap.xml
Note: Replace http://www.mysite.com/ with your URL.
Submit Blogger Sitemap to Google and Yahoo!
Sitemaps tell search engines about pages on your blog that they might not otherwise discover. Google provides a way to submit sitemaps through Google Webmaster Tools.
To submit a sitemap to Google Webmaster Tools:
Login to Google Webmaster Tools using your Google account.
Click on 'Add site' on your Google Webmaster Tools home and enter your blog's URL address. (If you already have your blog added you can skip this step and click on the blog's URL address that is displayed in the table below.
In the next step, if you haven't already verifed your blog, you will will need to verify your blog, before proceeding. Choose the Verification method as Meta tag and copy the meta tag code that is displayed.
Login to Blogger.com, go to Layout > Edit Html and paste the meta tag code you copied right after the <head> tag and Save the template.
Now go back to Google Webmaster Tools and click the Verify button. Once your blog is verified, you will get access to the Dashboard.
In the Dashboard to Site Configuration > Sitemaps and click the Submit a Sitemap button.
In the popup that opens,
add one of the following:
feeds/posts/default (added by default)
Note: If you use FeedBurner, the above will give you an error.
feeds/posts/default?orderby=updated
Note: This should work perfectly in most cases.
atom.xml?redirect=false&start-index=1&max-results=100
Note: This is a bit advanced and you can create one at the Blogger Sitemap Generator. You will also be able to submit your sitemap to Yahoo! and Bing.
feeds/posts/default?redirect=false (UPDATE)
Note: This is the correct (official) method.
Click on Submit Sitemap and you're done. Once the sitemap is successfully submitted, check back in 2 to 3 days to see detailed statistics of your blog (indexed pages, any errors, etc.)
Note: As you can see, the status of feeds/posts/default gives me errors. This is because I use FeedBurner. Don't worry about this as the other sitemaps are doing their job.
TIP: Once the sitemap has been submitted and your blog urls have been indexed, you can check your blog's search results in Google easily. To do this go to the Google homepage and type site:myblog.com as the search query and press Enter. Google will show only results from your site.
To submit a sitemap to Yahoo! Site Explorer:
Login to Yahoo! Site Explorer using your Yahoo! account.
Enter the URL of your blog and then click on Add My Site.
In the next step, if you haven't already verifed your blog, you will will need to verify your blog, before proceeding. From the menu on the left, click Authentication. Choose Add a META Tag and copy the meta tag code that is displayed.
Login to Blogger.com, go to Layout > Edit Html and paste the meta tag code you copied right after the <head> tag and Save the template.
Now go back to Yahoo! Site Explorer and click My Sites. You will see that the status of your site has been verified and is represented by a green checkmark.
From the menu on the left, click Feeds.
Add one of the following:
feeds/posts/default (added by default)
Note: If you use FeedBurner, the above will give you an error.
feeds/posts/default?orderby=updated
Note: This should work perfectly in most cases.
atom.xml?redirect=false&start-index=1&max-results=100
Note: This is a bit advanced and you can create one at the Blogger Sitemap Generator. You will also be able to submit your sitemap to Yahoo! and Bing.
Select Web Site Feed from the dropdown and click Add Feed. Once the sitemap is successfully submitted, check back in 24 hours to see detailed statistics of your blog (indexed pages, any errors, etc.)
To learn how to create and add sitemaps for your websites and submit sitemaps to more services, click here.
To submit a sitemap to Google Webmaster Tools:
Login to Blogger.com, go to Layout > Edit Html and paste the meta tag code you copied right after the <head> tag and Save the template.
Now go back to Google Webmaster Tools and click the Verify button. Once your blog is verified, you will get access to the Dashboard.
add one of the following:
feeds/posts/default (added by default)
Note: If you use FeedBurner, the above will give you an error.
feeds/posts/default?orderby=updated
Note: This should work perfectly in most cases.
atom.xml?redirect=false&start-index=1&max-results=100
Note: This is a bit advanced and you can create one at the Blogger Sitemap Generator. You will also be able to submit your sitemap to Yahoo! and Bing.
feeds/posts/default?redirect=false (UPDATE)
Note: This is the correct (official) method.
Note: As you can see, the status of feeds/posts/default gives me errors. This is because I use FeedBurner. Don't worry about this as the other sitemaps are doing their job.
TIP: Once the sitemap has been submitted and your blog urls have been indexed, you can check your blog's search results in Google easily. To do this go to the Google homepage and type site:myblog.com as the search query and press Enter. Google will show only results from your site.
To submit a sitemap to Yahoo! Site Explorer:
Login to Blogger.com, go to Layout > Edit Html and paste the meta tag code you copied right after the <head> tag and Save the template.
Now go back to Yahoo! Site Explorer and click My Sites. You will see that the status of your site has been verified and is represented by a green checkmark.
Add one of the following:
feeds/posts/default (added by default)
Note: If you use FeedBurner, the above will give you an error.
feeds/posts/default?orderby=updated
Note: This should work perfectly in most cases.
atom.xml?redirect=false&start-index=1&max-results=100
Note: This is a bit advanced and you can create one at the Blogger Sitemap Generator. You will also be able to submit your sitemap to Yahoo! and Bing.
To learn how to create and add sitemaps for your websites and submit sitemaps to more services, click here.
30 November 2009
Great tools for webmasters
How do I know if my website is attracting visitors?
How you can I get to the top of search engine rankings?
How can I check the speed of my website / blog?
What are the best keyword for my website / blog?
If you have a website or a blog, you've probably ask yourself these questions all the time.
iWebTool provides around 45+ tools that will help you answer all the above questions and more.
iWebTool allows you to use aby of their tools for free, 5 times an hour only. If you like what they have to offer you can opt for a Gold Account which will allow you to use their tools with no restrictions.
Visit the iWebTool Web Tools here.
How you can I get to the top of search engine rankings?
How can I check the speed of my website / blog?
What are the best keyword for my website / blog?
If you have a website or a blog, you've probably ask yourself these questions all the time.
iWebTool provides around 45+ tools that will help you answer all the above questions and more.
iWebTool allows you to use aby of their tools for free, 5 times an hour only. If you like what they have to offer you can opt for a Gold Account which will allow you to use their tools with no restrictions.
Visit the iWebTool Web Tools here.
Make your website / blog load faster
If your website / blog takes ages to load, it can have a very bad impression on your visitors and increase the site's Bounce Rate.
You need to optimize your website / blog and make it more efficient so it loads faster and provides content to your visitors and fast speeds. To analyze these issues there is a free tool available online. Web Page Analyzer is a free analysis tool and will immediately give a summary report of your website / blog status.
To get a free analysis visit Web Page Analyzer.
You need to optimize your website / blog and make it more efficient so it loads faster and provides content to your visitors and fast speeds. To analyze these issues there is a free tool available online. Web Page Analyzer is a free analysis tool and will immediately give a summary report of your website / blog status.
To get a free analysis visit Web Page Analyzer.
Subscribe to:
Posts (Atom)
















