Pendapat saya tentang pemilihan format imej dalam halaman html_Pertukaran pengalaman

Seorang pelajar bertanya kepada saya hari ini: Format GIF digunakan dalam halaman dan herotannya terlalu hebat. Apa yang perlu saya lakukan? Masalah ini agak mudah, hanya gunakan JPG. Terdapat tiga format imej yang biasa kami gunakan pada halaman, GIF, JPG dan PNG. Jadi bagaimana kita memilih untuk menggunakan ketiga-tiga format ini? Mari kita bincangkan beberapa pendapat saya tentang penggunaan ketiga-tiga format ini berdasarkan pengalaman saya.

Mula-mula mari kita lihat penjelasan yang lebih formal tentang beberapa format (nota: kandungan berikut adalah daripada Baidu):

GIF bermaksud format Pertukaran Grafik, lanjutan imej GIF Ia adalah gif. Semua penyemak imbas grafik kini menyokong format GIF, dan sesetengah penyemak imbas grafik hanya mengenali format GIF. GIF ialah format warna yang diindeks Apabila bilangan warna kecil, fail yang dijana adalah sangat kecil:

Format GIF menyokong latar belakang telus. Jika warna latar belakang imej GIF ditetapkan kepada lutsinar, ia akan digabungkan dengan latar belakang penyemak imbas untuk menghasilkan imej bukan segi empat tepat.
Format GIF menyokong animasi. Sebelum kemunculan animasi Flash, animasi GIF boleh dikatakan sebagai satu-satunya bentuk animasi pada halaman web. Format GIF boleh menggabungkan imej bingkai tunggal dan kemudian memainkan setiap bingkai secara bergilir-gilir untuk menjadi animasi. Walaupun tidak semua pelayar grafik menyokong animasi GIF, pelayar grafik terkini sudah menyokong animasi GIF.
Format GIF menyokong perkembangan grafik. Progresif bermaksud gambar secara beransur-ansur muncul pada skrin.
Format GIF menyokong pemampatan tanpa kehilangan. Pemampatan tanpa kehilangan ialah kaedah yang berkesan untuk memampatkan imej tanpa kehilangan butiran imej Memandangkan format GIF menggunakan pemampatan tanpa kehilangan, ia lebih sesuai untuk garisan, ikon dan lukisan.
Kekurangan format GIF juga agak ketara. Warna diindeks adalah peninggalan sejarah permainan lama di bawah DOS hampir tanpa pengecualian menggunakan warna yang diindeks. Walau bagaimanapun, disebabkan oleh had lebar jalur, GIF menjadi popular dari era DOS hingga ke era Internet. Kelemahan terbesar GIF format warna diindeks ialah ia hanya mempunyai 256 warna, yang jelas tidak mencukupi untuk imej kualiti foto.

JPEG adalah singkatan daripada Joint Photograhic Experts Group (Joint Photographic Experts Group) Format ini selalunya ditulis sebagai JPG, dan sambungan imej JPG ialah jpg.

Kelebihan utama JPG ialah ia boleh menyokong berjuta-juta warna, jadi ia boleh digunakan untuk mengekspresikan foto. Di samping itu, kerana imej JPG menggunakan algoritma pemampatan lossy yang lebih cekap, panjang fail lebih kecil dan masa muat turun lebih pendek. Mampatan lossy memberikan beberapa butiran dalam imej untuk mengurangkan panjang fail. Nisbah mampatannya agak tinggi Menggunakan alat pemampatan JPG khas, nisbah mampatan boleh mencapai 180:1, dan kualiti imej tidak akan terlalu rosak dari perspektif penyemakan imbas, yang sangat memudahkan penghantaran rangkaian dan fail pertukaran cakera. JPG adalah lebih baik untuk foto daripada GIF kerana kehilangan beberapa butiran dalam foto tidak begitu jelas seperti seni garis. Selain itu, JPG mempunyai nisbah mampatan yang lebih besar untuk foto, dan kualiti akhir adalah lebih baik.

Tetapi dalam jangka masa panjang, dengan peningkatan jalur lebar yang berterusan dan pembangunan media storan, JPG juga harus menjadi format imej yang dihapuskan, kerana pemampatan yang hilang akan menyebabkan kehilangan yang tidak dapat dipulihkan pada imej. Oleh itu, imej JPG termampat secara amnya tidak sesuai untuk dicetak, dan sebaiknya jangan gunakan JPG semasa menyandarkan imej penting. Selain itu, JPG tidak sefleksibel seperti imej GIF Ia tidak menyokong kecerunan grafik, ketelusan latar belakang atau animasi.

PNG ialah format storan fail imej yang dibangunkan pada pertengahan 1990-an Tujuannya adalah untuk menggantikan format fail GIF dan TIFF sambil menambah beberapa ciri yang tidak ada pada format fail GIF. Nama Format Grafik Rangkaian Mudah Alih (PNG) berasal daripada "PNG's Not GIF" tidak rasmi Ia ialah format storan fail bitmap, disebut "ping". Apabila PNG digunakan untuk menyimpan imej skala kelabu, kedalaman imej skala kelabu boleh sehingga 16 bit Apabila menyimpan imej berwarna, kedalaman imej berwarna boleh sehingga 48 bit, dan ia juga boleh menyimpan sehingga 16 bit. data saluran alfa. PNG menggunakan algoritma pemampatan data tanpa kehilangan yang diperoleh daripada LZ77.

Format fail PNG mengekalkan ciri format fail GIF berikut:

Boleh menyokong imej berwarna dengan 256 warna menggunakan jadual carian warna atau palet.
Prestasi baca/tulis penstriman (kebolehstrim): Format fail imej membolehkan pembacaan dan penulisan data imej berterusan
Ciri ini sangat sesuai untuk menjana dan memaparkan imej semasa komunikasi.
Paparan progresif: Ciri ini membolehkan fail imej dipaparkan pada terminal semasa menghantar fail imej pada pautan komunikasi Keseluruhan garis besar dipaparkan dan kemudian butiran imej dipaparkan secara beransur-ansur Resolusi memaparkan imej dan kemudian secara beransur-ansur meningkatkan resolusinya.
Ketelusan: Ciri ini membenarkan bahagian tertentu imej tidak dipaparkan dan digunakan untuk mencipta beberapa imej tersendiri.
Maklumat sampingan: Ciri ini boleh digunakan untuk menyimpan beberapa maklumat anotasi teks dalam fail imej.
Bebas daripada perisian komputer dan persekitaran perkakasan.
Gunakan pemampatan tanpa kehilangan.
Ciri berikut yang tidak tersedia dalam format fail GIF akan ditambahkan pada format fail PNG:

Imej berwarna benar dengan setiap piksel ialah 48 bit.
Setiap piksel ialah imej skala kelabu 16-bit.
Saluran alpha boleh ditambah pada imej skala kelabu dan imej warna sebenar.
Tambah maklumat gamma imej.
Gunakan kod redundansi kitaran (CRC) untuk mengesan fail yang rosak.
Kaedah paparan anggaran berturut-turut untuk mempercepatkan paparan imej.
Kit alat baca/tulis standard.
Boleh menyimpan berbilang imej dalam satu fail.
Struktur fail

Ketiga-tiga format ini mempunyai kelebihan dan kekurangan tersendiri, antaranya PNG mempunyai banyak kelebihan. Walaupun popularitinya masih sangat umum, kelebihan istimewanya telah membuatkan kami sangat berminat dengannya. Sekurang-kurangnya saya suka format ini sekarang. Sudah tentu, bagi mereka yang mencipta halaman, jumlah saiz halaman adalah daya saing. Jadi kita masih perlu memberi perhatian kepada penggunaan campuran ketiga-tiga format ini. Jadi bila hendak menggunakan GIF, bila hendak menggunakan PNG, dan bila hendak menggunakan JPG? Mari analisa satu persatu di bawah.

Dalam kerja sebenar, saya mendapati bahawa grafik warna pepejal umum, seperti beberapa ikon kecil dan latar belakang berjubin, mempunyai warna yang agak sedikit Walaupun format GIF hanya mempunyai 256 warna, ia tidak dapat menampung jenis grafik ini Gambar mesti sangat sesuai. Sudah tentu, kami tidak menolak kekayaan warna beberapa ikon kecil khas, tetapi saya percaya bahawa sebagai ikon kecil, sedikit kehilangan warna tidak akan menjejaskan kesan visual keseluruhan Oleh itu, skop GIF yang berkenaan adalah: kecil ikon, latar belakang berjubin dan warna lain Agak sedikit imej kecil.

Bagaimana untuk memilih gambar yang begitu besar? Mula-mula, mari kita belajar tentang JPG. gambar JPG ini, 100% Ini bermakna tiada pemampatan Apabila kami mengeksport gambar yang sama dan membandingkannya dengan gambar kualiti yang berbeza, kami mendapati bahawa yang berkualiti rendah jelas lebih kotor daripada yang berkualiti tinggi, jadi foto itu kelihatan sangat buruk. Sudah tentu, kami juga mendapati keadaan ini masih menonjol dalam gambar dengan blok warna yang lebih besar. Jadi seperti langit, potret. Bintik-bintik gelap yang tidak sedap dipandang akan muncul terutamanya pada muka potret. Sudah tentu, jika anda tidak mempunyai keperluan yang ketat pada kualiti foto, anda boleh menggunakan JPG dan menurunkan kualiti. Tetapi ia tidak terpakai pada latar belakang dan ikon kecil.

Saya secara peribadi berpendapat PNG berada di antara GIF dan JPG berkualiti tinggi Pilih, jika ia ialah ikon kecil yang ringkas, PNG akan menjadi lebih besar sedikit daripada GIF, tetapi kualitinya serupa. Jika ia adalah gambar biasa, maka PNG masih kecil sedikit daripada JPG berkualiti tinggi, tetapi PNG masih mengalami kehilangan warna. Walau bagaimanapun, pada dasarnya mustahil untuk melihatnya jika gambar tidak diperbesarkan. Pada asasnya, kami tidak mencipta halaman hanya untuk orang ramai memperbesar dan mengkritik. Jadi PNG adalah pilihan di tengah. Sudah tentu, PNG juga mempunyai kelebihan yang besar, iaitu, ketelusan, walaupun IE6 tidak menyokong ciri ini sebelum ini. GIF juga mempunyai ketelusan, tetapi GIF hanya menyokong ketelusan mutlak dan tidak menyokong ketelusan, jadi selalunya terdapat bulatan titik putih di tepi imej GIF. PNG tidak mempunyai masalah ini Dengan perkembangan zaman, apabila IE6 menjadi sejarah, saya fikir kita akan dapat melihat kuasa sebenar PNG.

Sudah tentu, terdapat situasi istimewa yang mungkin sangat istimewa, dan di situlah imej latar belakang dan imej latar depan bertemu Tempat seperti ini memerlukan struktur warna yang konsisten untuk menghasilkan kesan visual yang baik. Jadi pada masa ini, berhati-hati untuk tidak mencampurkan format yang berbeza sebanyak mungkin.