I am very interested in building an app like http://brdrck.me/settings/. My first questions are what is inside a web clip file? Is it a html or something else? The second question is how to add the icon to home screens programmatically. As you can see from the page I mentioned above http://brdrck.me/settings/. I tried to check its source code from browser but it turns out to be some normal CSS and javascript code in my Chrome browser and I don't know how to check the source in my Mobile Safari. Any one help?
You won't be able to get any valuable code from the source. Trust me. :D
But, I can help you out.
I use two different methods: The "Add to Homescreen" and .mobileconfig files (the one you have to install)
For adding to the homescreen check out this resource. With the help of some creative work-arounds, it isn't too difficult. http://mobile.tutsplus.com/tutorials/iphone/iphone-web-app-meta-tags/
The mobileconfig file is a bit more difficult, esp trying to get it signed, but this might help you a bit. Try to create one with a webclip then view the generated files source: http://support.apple.com/kb/DL1465
Hope this helps.