font-face cannot figure out use of variable at the end of .svg font file

Question

I found this css on the net, apparently it makes font face cross-browser compatible!

@font-face {
    font-family: 'Yanone Kaffeesatz Regular';
    src: url('fonts/YanoneKaffeesatz-Regular-webfont.eot');
    src: url('fonts/YanoneKaffeesatz-Regular-webfont.eot?iefix') format('eot'),
         url('fonts/YanoneKaffeesatz-Regular-webfont.woff') format('woff'),
         url('fonts/YanoneKaffeesatz-Regular-webfont.ttf') format('truetype'),
         url('fonts/YanoneKaffeesatz-Regular-webfont.svg#webfont1BSMunJa') format('svg');
    font-weight: normal;
    font-style: normal;
}

But I cannot figure out what is that variable at the end of .svg#webfont1BSMunJa, if I use different font than used on example site, do I need to change that finishing part? what does it do??

And another question, is double src: necessary? on some examples that line with iefix at the end wasn't present.

In this resource they state this way of doing thing should work also in ie6-9, but under 9 fonts are not actually loaded. http://www.960development.com/how-to-write-cross-browser-font-face-syntax/

Answer 1

Solution I have found is this:

@font-face {
    font-family: 'PFRondaSeven';
    src: url('font/pf_ronda_seven_bold-webfont.eot');
    src: local('☺'),
         url('font/pf_ronda_seven_bold-webfont.woff') format('woff'),
         url('font/pf_ronda_seven_bold-webfont.ttf') format('truetype'),
         url('font/pf_ronda_seven_bold-webfont.svg#webfont2zOjOL6G') format('svg');
    font-weight: bold;
    font-style: normal;
}

So I changed this: url('fonts/YanoneKaffeesatz-Regular-webfont.eot?iefix') format('eot'),

to smiley face...