?低速度または大容量の画像を表示する際､すぐに画像が表示できない時にどのような表示をするかの違いです｡
ﾌﾟﾛｸﾞﾚｯｼﾌﾞは､まず画像全体を荒く(低解像度)表示して徐々に細かく(高解像度)表示する方式です｡
ﾍﾞｰｽﾗｲﾝは上から徐々に読み込んで表示する一般的な方式です｡
http://naifix.com/jpeg/

?jpgの方がpngよりﾌｧｲﾙｻｲｽﾞが小さくなる事が多い(=高速に表示できる)ですが､それぞれに利点と欠点があるので､利用する場所等により使い分ける事の方が大事だと思います｡
jpgは比較的簡単に圧縮率を上げ画像ｻｲｽﾞを落とす事が出来ますが､もちろん画像は劣化していきます｡また､透明を扱う事が出来ないので､透過素材を作ることができません｡
pngは圧縮画像(可逆)のため､画質が劣化しません｡その為jpgより画像ｻｲｽﾞは大きくなります｡ただ､きれいな画像を表示できますし透明を扱う事が出来ます｡
ﾌﾗｯﾄなﾃﾞｻﾞｲﾝの画像はjpgよりも､画像の質が下がらないpngの方がﾌｧｲﾙｻｲｽﾞを落とす事も出来るので､一概にjpg=低容量というわけでもないです｡

?圧縮に差が出るわけではないのでどちらが向いているという物でも無いです｡

?もうお分かりとは思いますが､どちらか片方を選択です｡

?綺麗なものを掲載したければpngを利用｡また､表示の仕方にもよりますが高速化するならｻﾑﾈｲﾙ用ﾌｧｲﾙを作成して､その後大きなｻｲｽﾞを表示させる等するのもｱﾘかもです｡

?固定回線もｽﾏﾎ等屋外回線も昔と比べるとかなり高速になってきてます｡数枚の画像程度で大きく差が出る事(体感で分かる程度の差)はもうあまりないと思います｡
それよりもそのｻｲﾄを保管しているｻｰﾊﾞを気にした方が現実的です｡供用ｻｰﾊﾞ(VPS等)を利用すると本当に遅いです｡少しでも速度を求めるなら専用ｻｰﾊﾞをﾚﾝﾀﾙしたり､高速を売りにしているｻｰﾋﾞｽを利用するなどした方が全然速度に差が出ますよ｡