Gambar adalah komponen kunci dalam desain web. Mereka tidak hanya menyampaikan pesan dan membantu untuk mempertahankan perhatian pengunjung, mereka juga memainkan peran dalam seberapa cepat dan responsif website Anda. Mencolok keseimbangan terbaik antara kualitas gambar dan loading website kali akan menjaga pengunjung Anda bahagia. Sangat penting untuk mempertimbangkan Format, ukuran, kompresi, dan lebih ketika memilih gambar untuk website Anda. Gunakan ini enam tips dan trik untuk memastikan memastikan halaman web Anda tidak ditahan oleh gambar mereka.
Pilih format Anda
Halaman web cenderung menggunakan tiga format utama untuk menampilkan gambar: GIF, JPEG dan PNG. Tetapi karena mereka bekerja dengan cara yang berbeda itu sebenarnya terbaik untuk memilih pada kasus-per kasus. Ini akan memastikan Anda menyerang keseimbangan yang tepat antara kualitas gambar dan waktu loading. Berikut adalah cara membandingkan:
Saya akan merekomendasikan memilih JPEG untuk foto dan kemudian memutuskan antara GIF dan PNG 8-bit untuk logo dan ilustrasi sederhana. Dengan mengambil keuntungan dari dukungan format untuk transparansi, Anda dapat dengan mudah menempatkan logo cut-out atau ilustrasi di atas latar belakang berwarna atau bahkan foto.
Namun, jika Anda ingin langsing lebih banyak lemak dari halaman web Anda, jangan menganggap satu format akan selalu lebih baik daripada yang lain: jika Anda menggunakan Photoshop atau alat serupa untuk mempersiapkan gambar Anda, mencari ‘Save for Web’ pilihan – ini memberikan pilihan untuk semua tiga format lengkap dengan jendela pratinjau dan diperkirakan ukuran file, yang memungkinkan Anda untuk membuat pilihan terbaik untuk gambar itu.
Mengubah ukuran untuk web
Jangan menanamkan gambar besar langsung ke halaman web Anda, kemudian mengubah ukuran mereka dalam halaman web – halaman akan men-download seluruh gambar ketika dibuka, secara signifikan memperlambat waktu loading. Sebaliknya, memuat gambar ke editor gambar Anda dan membuat “thumbnail” copy yang menyusut dengan ukuran yang sama itu akan ditampilkan pada halaman. Jika Anda ingin orang dapat melihat gambar berukuran penuh, meng-upload secara terpisah dan kemudian menambahkan link yang dapat diklik untuk thumbnail.
Kompres dengan hati-hati
Kualitas gambar JPEG direpresentasikan sebagai persentase – semakin tinggi angka, semakin baik kualitas gambar (tetapi juga lebih besar file). Bereksperimen dengan pengaturan yang berbeda dari seluruh 50% sampai 90% dan menggunakan penilaian visual Anda sendiri untuk menentukan keseimbangan terbaik antara ukuran dan kualitas.
Drop gambar
Tanyakan pada diri Anda jika webiste Anda benar-benar membutuhkan semua gambar yang telah Anda upload. Jika Anda render teks sebagai gambar, periksa untuk melihat apakah dapat ditampilkan menggunakan web font bukan – ini jauh lebih cepat untuk menampilkan daripada gambar, dapat ditingkatkan dan ke bawah dan dicari juga. Demikian pula, menggunakan efek CSS dan animasi seperti gradien dan bayangan bukan efek berbasis gambar – tapi ingat untuk menguji ini di berbagai web browser karena tidak semua standar yang didukung, terutama di browser lama.
Periksa Web
WebP adalah baru, format gambar yang muncul yang bertujuan untuk menggantikan JPEG, GIF dan PNG dengan menggulung semua kemampuan mereka – lossy dan lossless kompresi pilihan, dukungan untuk transparansi – ke dalam format tunggal yang menjanjikan ukuran file yang lebih kecil dari kedua PNG dan JPEG. Namun, itu tidak didukung secara luas – hanya Chrome dan Opera browser native mendukung itu, misalnya, sementara sebagian besar editor gambar belum mendukung (orang lain, seperti Photoshop, memerlukan sebuah plugin terpisah). Ini adalah perkembangan menarik yang bisa mewakili masa depan gambar web, tapi untuk saat ini beberapa cara dari yang diadopsi secara luas, jadi mulai bereksperimen, tapi jangan beralih semua gambar Anda lebih – belum.
Cepat dan mudah
Jika Anda memiliki banyak foto untuk proses – misalnya, Anda ingin membuat sejumlah gambar thumbnail ukurannya – maka lihatlah alat batch processing seperti alat FastStone Photo Resizer untuk Windows. Cukup pilih gambar Anda, memilih apa suntingan berlaku untuk mereka (seperti mengubah ukuran atau mengkonversi ke format gambar yang berbeda) dan kemudian pilih folder output – Anda juga dapat mengubah nama foto dikonversi Anda juga (misalnya, dengan menambahkan _thmb ke akhir nama file). Jauh lebih cepat daripada melakukan hal-hal dengan tangan!
JaringanHosting Adalah penyedia ASP.NET Dan Windows hosting No # 1 di Indonesia. Web Hosting Kami get Microsoft Spotlight Penghargaan Dari Microsoft Dan Suami berdasarkan PADA beberapa persyaratan Utama, Yaitu: WebMatrix, WebDeploy, Visual Studio 2015, ASP.NET 4.6, ASP.NET MVC 6, Silverlight 5 dan Visual Studio Lightswitch