Profil SVG
- SVG 1.0: semua browser desktop dan seluler modern mendukung SVG 1.1, jadi jangan pernah memilih opsi ini.
- SVG 1.1: Anda hampir selalu menginginkan ini.
- SVG Tiny / Basic: ini adalah bagian dari SVG yang ditujukan untuk perangkat seluler. Hanya sedikit perangkat yang mendukung SVG Tiny dan bukan spesifikasi lengkap, jadi gunakan SVG 1.1.
Catatan: SVG Tiny tidak mengurangi ukuran file, itu hanya sebagian dari SVG yang memadai untuk perangkat daya pemrosesan yang rendah. Ini akan membuang gradien, opacity, font dan filter yang tertanam. Erik Dahlström mengatakan: Semua pemirsa penuh SVG 1.1 harus dapat menampilkan semua konten SVG 1.1 Tiny / Basic (sesuai spesifikasi), dan mungkin semua konten SVG 1.2 Tiny yang dihasilkan Illustrator juga.
Catatan font : jika Anda tidak memiliki teks di gambar Anda pengaturan ini tidak masalah.
Adobe CEF: jangan pernah gunakan opsi ini dari Anda yang ingin menampilkannya di browser. Ini cara Adobe menyematkan font dalam file SVG, sejauh yang saya tahu ini hanya didukung oleh plugin viewer Adobe SVG.
SVG: ini menyematkan font sebagai SVG, yang tidak didukung oleh Firefox, tetapi merupakan pilihan yang baik jika Anda bermaksud mendukung hanya perangkat seluler (yang biasanya menjalankan webkit).
Buat garis besar: Anda akan ingin melakukan ini sebagian besar waktu , kecuali jika Anda memiliki banyak teks. Jika Anda memiliki banyak teks, Anda ingin menanamkan font dengan WOFF tetapi Anda harus melakukannya dengan tangan.
Berlangganan :
Tidak ada: ini akan meniadakan pengaturan sebelumnya dan tidak akan menanamkan font apa pun, jika Anda tidak peduli bahwa font tersebut kembali ke font lain di komputer pengguna pilih ini.
Hanya mesin terbang yang digunakan: Anda akan menginginkan ini sebagian besar waktu jika Anda memilih untuk menanamkan font. Ini hanya menyematkan karakter yang digunakan sehingga tidak mengembang ukuran file Anda.
[sisa dari subsetting]: ini cukup jelas, Anda dapat memilih untuk menyertakan seluruh font atau himpunan bagian dari itu. Ini hanya berguna jika SVG Anda dinamis dan teks mungkin berubah berdasarkan input pengguna.
Gambar : ini hanya masalah jika Anda termasuk gambar bitmap
Sematkan: ini biasanya yang Anda inginkan , ini mengkode gambar sebagai data uri sehingga Anda hanya mengunggah satu file alih-alih file svg dengan gambar bitmap pendampingnya.
Tautan: gunakan ini hanya jika Anda memiliki beberapa file svg yang merujuk satu file bitmap (jadi itu tidak diunduh setiap kali ia membuat file svg).
Perhatikan bahwa gambar bitmap yang ditautkan tidak akan ditampilkan jika SVG ditampilkan melalui <img>tag, karena imgtidak memungkinkan memuat sumber daya eksternal. Selanjutnya: webkit memiliki bug yang tidak menampilkan gambar bitmap dalam file svg bahkan jika Anda menanamkannya. Singkatnya: gunakan <svg>tag biasa jika Anda ingin menyematkan atau menautkan gambar bitmap, jangan gunakan <img>.
Pertahankan Kemampuan Pengeditan Illustrator
Saya lebih suka menyimpan file .ai sebagai gambar sumber saya, dan menganggap file SVG sebagai Export for webfitur. Dengan begitu Anda fokus mengurangi ukuran file dan memiliki salinan asli dari file vektor Anda dengan semua kemampuan pengeditan. Jadi jangan pilih ini.
Tempat desimal
Standarnya 3adalah pengaturan waras dan Anda sebagian besar bisa melupakannya.
Namun, jika Anda memiliki jalur yang sangat rumit dengan banyak titik menurunkan pengaturan ini ke 1 atau bahkan 0 akan mengurangi ukuran file secara substansial. Tetapi Anda harus berhati-hati karena segmen bezier sangat sensitif terhadap pengaturan ini dan mereka mungkin tampak sedikit terdistorsi. Jadi, jika Anda menurunkan pengaturan ini selalu pastikan itu terlihat dapat diterima di browser.
Pengkodean
Penjelasan di balik pengkodean karakter agak teknis, dan hanya menyangkut file svg dengan teks. Pengkodean yang paling Anda butuhkan adalah UTF-8 , jangan ubah ini kecuali Anda tahu apa yang Anda lakukan.
Optimalkan untuk Adobe SVG Viewer
Adobe SVG Viewer adalah plugin browser dari waktu ketika browser tidak mendukung SVG secara asli. Saya tidak tahu apa fungsinya, tetapi tidak relevan, jangan periksa ini .
Sertakan mengiris data
Ini menambahkan metadata mengasapi ke file SVG Anda, kecuali jika Anda berencana membuka file SVG Anda nanti di Illustrator dan menemukan slice Anda (jika Anda memilikinya), jangan periksa ini
Sertakan XMP
Lebih banyak metadata tentang file, Anda dapat membaca di XMP di sini . jangan periksa ini
Keluarkan lebih sedikit <tspan>elemen
Ini akan berwarna abu-abu jika Anda tidak memiliki teks. SVG tidak mendukung tabel kerning, jadi, urutan karakter tertentu akan tampak terlalu spasi, yaitu AVA. Illustrator bekerja dengan menambahkan tspanelemen dan sedikit mengubah posisi karakter. Ini menambahkan sedikit mengasapi file jangan periksa ini kecuali Anda lebih peduli tentang ukuran file daripada tampilan teks .
Gunakan <textpath>elemen untuk teks di jalur
Ini akan berwarna abu-abu jika Anda tidak memiliki teks di jalur. Peramban cenderung sangat bervariasi dalam hal menempatkan teks di jalur, jadi Illustrator mencoba membantu dengan menerapkan rotasi dan posisi pada karakter alih-alih menyerahkan pekerjaan ke peramban. jangan periksa ini kecuali Anda lebih memperhatikan ukuran file daripada tampilan teks .
Secara umum, saya akan merekomendasikan Anda untuk melihat SVG secara umum, Anda akan menemukan bahwa itu mirip sekali dengan HTML dan memungkinkan Anda untuk mengubah hal-hal yang tidak dapat dilakukan dalam Illustrator.
