Earlier I used backpackit to write down notes, links etc. But It was cumbersome, I had to go to my backpackit page and than add the required thing still It allowed you to add notes, check lists, links etc.
Now a days I’m using Google Notebook. It allows you to add text clippings, images and links to your notebook. And you can access it on any machines. It becomes more useful and productive with the help of firefox extension for google notebook where you just select the text (or link, image) and right click and Note this! (Or Clip it) And you are done. Now you can access the notes on any other machines.

It also allows you to comment, tag your ideas along with providing the functionality of sharing the notebook and many new improvements.

Tell me how do you share notes when working across multiple machines.

“command based way to start your web journey”

An simple designed HTML page with javascripts to provide various functionality like search from google, yahoo etc and others like whois, dns lookup. It provides all these functionality with a simple command like interface. For example you can do :

-g India // to do a google search for India
-g India>> // to take you to first result of google search
-whois google.com // to do whois query

It also provides recommendation based on previous searches.
Try it..and give your feedback , would you prefer such homepage ?
For more details :TPHP: The Perfect Home Page

You can add this one line to .htaccess file (create this file if it doesn’t exist)

ErrorDocument 404 /web404.html

This will redirect all queries for files not found in that directory and sub directories to web404.html
On that page you can provide user with:

• Link to homepage
• Tell them to check the URL or Go Back
• Search functionality for your website will be very useful.

So yesterday I added a 404 page for my website: Check it out

I have also added similar functionality for my wordpress blog. For setting up 404 Error page on wordpress follow this well compiled article: Creating an Error 404 Page

Interesting read: Creating User Friendly 404 Pages

view-source:http://www.google.com/

this in location bar to view page source of google.com.
So i have made this Bookmarklet to view page source: View Source (So you can drag this to your bookmark toolbar to have quick access).

Similarly you can type javascript: in your location bar to open java script error console.

Update1:
Key Board Shortcut: Use Ctrl+U to view page source

Related Post:
Firefox About Pages
Little tweaks with javascript : Bookmarklets.
Open webpages in sidebar

What actually happened: Cross Site Scripting, when we want user to input some data (which may be html/javascript) and displays it back. So if html/script tags are not properly checked it can cause trouble. Earlier I hadn’t checked for javascript, iframe inputs. So somebody just inserted an iframe as message input in my shout box. And the source of iframe contained redirection to another website. So when shouts were displayed on the page the iframe code was displayed as it is and page got redirected to other page.

Luckily I checked the page just after the day this happened, So that way i actually got chance to update this orphaned code and made some fixes.

Solution : Idea is to filter meta characters such as (< , >, ‘ , ” etc) Which will prevent browser from processing them as part of some script, they will be processed as plain text only.
So while doing in php you can do:

$shout=str_replace("<","<",$_GET["shout"]);

And to be on safer side we should also replace following characters:

replace ( with (
replace ) with )
replace & with &
replace ' with '
replace " with "

Or If you are not expecting user to input these characters then you can simply replace these with null string;

Update: (25-apr-2008)
You can also use php functions htmlspecialchars, htmlentities, strip_tags.

The replacements which I have mentioned above can be easily done using htmlspecialchars but if you want to extend it to all html tags then you can use htmlentities. And to strip both html and php tags from string you can use strip_tags. The disadvantage with strip_tags is that it doesn’t validate html so can cause trouble in case of broken html tags. It also provide you option to exclude list of tags from being stripped.

So now you can enjoy Shout Box until some new bug is found or its hacked again [;)]

Related post:
SQL Attacks: Hacking (SQL injection)

Update(14th May 2008): XSS cheatsheet by ha.ckers.org lists possible cross site scripting methods on various browsers.

• Deleting Address: Highlight them and use SHIFT + DELETE to remove from drop down menu in address bar.
• Get Instant Downloads : Just drag the link to download icon in toolbar which you ca get by customizing your toolbar.

Read article for more such tips.
Related Links:

• Firefox about: pages
• Speed up firefox
• Firefox Tips

You can also create gadgets using : Make your Own Gadget (Which is as simple as filling out forms)

P.S. : My first post on wordpress blog. (I imported my previous posts from blogger)

RSS in plain English: Watch video

You may need a flv player to view it.

Read more friendly bit >> Improving interactivity with Javascript
In addition, I find image maps also very handy when it comes to intereactivity when used properly with tooltips…as i used them in Paint Chat.

Bonus link[ ] DailyBlogTips > Web 2.0 Webdesign Tutorials
Related post :

• Play with html using javascript

• Yahoo Search
• Flickr : http://m.flickr.com
• W3schools.com: http://w3scholls.com/wap.wml
• Google Mpas: http://www.google.com/gmm

Some more websites which works on mobile can be found here : Mobile Compatibe Wesites

So I thougth i should have a mobile webpage too.. so i searched for it and found this great tutorial on w3schools: WAP/WML tutorial. It has also got a demo page which works with explorer only but it contains simple and good examples explaining basic features of wml along with preview on how it looks on mobile.

The WAP (Wireless Application Protocol) protocol is the leading standard for information services on wireless terminals like digital mobile phones. WML stands for Wireless Markup Language. It is a mark-up language inherited from HTML, but WML is based on XML, so it is much stricter than HTML.

Tutorial was pretty easy..so i create my own pae which works on mobile. You can access it at:
http://www.aburad.com/m.wml, though it contain my pic, blog address and some content only(I will add some more content). WML supports wbmp(which is black & white) image format,( you can convert image to wbmp using http://www.online-utility.org/. It als o supports jpg format. One more thing while designing your pages for mobile, you can opera to see how it looks as it supports wml files. Or check it at online wap emulator: WapTiger
Some more links : Wap Tutorials(haven’t tried yet).

Related Post :Things You Never Knew Your Cell Phone Could Do