Iklan
Saya melakukan sedikit pengembangan Web, dan Google Chrome adalah browser utama saya hari ini. Chrome cukup ramah bagi pengembang, dan Anda juga dapat menyiapkannya Firebug di Chrome Cara Memasang Firebug di IE, Safari, Chrome & Opera Baca lebih banyak . Tetapi hari ini saya ingin menunjukkan kepada Anda ekstensi Chrome berbeda yang disebut Pendule. Pendule melengkapi fitur Inspect Elemen bawaan Chrome dengan beberapa tambahan menarik.
Menu Pendule
Tombol bilah alat Pendule mengeluarkan menu yang tampak apik, dibagi menjadi enam area utama. Pertama, Lembar Gaya bagian. Itu Lihat CSS opsi mungkin tampak berlebihan - lagipula, Chrome sudah memungkinkan kita melihat CSS... atau bukan?
Banyak situs web menggunakan CSS terkompresi, dengan beberapa mengompresnya hingga tidak terbaca. Jika Anda satu-satunya pengembang Web di situs Anda, Anda mungkin dapat memutuskan sendiri seberapa besar Anda ingin mengompres CSS. Bagi saya, tidak ada keberuntungan seperti itu. Salah satu situs web tempat saya bekerja memampatkan CSS menggunakan alat PHP yang disebut
Mengecilkan, jadi memeriksa CSS dengan alat bawaan Chrome menunjukkan sesuatu seperti ini:
Bukan format yang paling mudah dibaca yang bisa dibayangkan. Dengan Pendule, saya dapat dengan mudah mempercantik CSS di sisi saya. Saya cukup klik tombol Pendule dan klik Lihat CSS. Saya kemudian mendapatkan sesuatu seperti ini:
Masih belum bisa dibaca. Tapi klik Mempercantik CSS tombol dan saksikan keajaiban terjadi:
Sekarang kita bicara! Meskipun Anda tidak dapat mengubah apa pun dalam tampilan CSS, ini merupakan peningkatan besar dalam hal CSS yang dikompresi.
Menangani Gambar
Pendule juga menawarkan beberapa utilitas terkait gambar yang menarik:
“Lihat informasi gambar”Membawa Anda ke halaman web yang benar-benar baru yang berisi semua gambar dari halaman saat ini, masing-masing dengan sejumlah informasi terkait:
Ini berguna karena memungkinkan Anda menggulir semua gambar satu per satu dan mengauditnya satu per satu. Misalnya, beberapa situs web menyajikan konten dari satu server dan gambar terkait dari server lain (untuk mempercepat proses). Dengan tampilan ini, Anda dapat melihat dengan tepat dari mana setiap gambar berasal dan dengan mudah melacak yang tidak disajikan dari sumber yang tepat.
Anda juga dapat membaca teks Alt untuk setiap gambar, yang bisa menjadi kunci untuk penawaran SEO. Namun, jika Anda hanya tertarik pada teks Alt, Pendule memungkinkan Anda dengan mudah mengauditnya di halaman, menggunakan "Tampilkan teks alternatif" pilihan. Saat diaktifkan, gambar pada halaman Anda terlihat seperti ini:
Yang satu ini kebetulan berasal dari posting indah berjudul 3 Tanda Apple Menggantikan Microsoft Untuk Menjadi Kekaisaran Jahat, tetapi intinya di sini adalah potongan "alt =" kecil di atas gambar. Ini terlihat seperti tooltip, tetapi Anda tidak perlu mengarahkan mouse Anda ke atasnya untuk membuatnya ditampilkan. Dengan "Tampilkan teks alternatif”, Anda bisa menggulir halaman web Anda dan melihat gambar apa yang hilang atau salah Alts.
Utilitas Lain-Lain
Menu Utilities Miscellaneous Utilities mengemas beberapa barang menarik. Itu Lihat JavaScript produk satu halaman web dibagi menjadi beberapa bagian, satu bagian untuk setiap skrip yang berisi halaman saat ini. Mirip seperti “Lihat CSS"Opsi kita mulai dengan, Lihat JavaScript memungkinkan Anda mempercantik kode agar dapat dibaca. JavaScript hampir selalu terkompresi (bahkan lebih dari CSS), jadi ini adalah opsi yang sangat berguna jika Anda suka membaca kode untuk mengetahui cara kerja sesuatu.
"Tampilan penggarisOpsi ”meredupkan halaman dan menindihnya dengan bingkai yang dapat diubah ukurannya dan dapat diseret dengan label kecil yang menunjukkan dimensinya pada waktu tertentu. Ini sangat berguna untuk memeriksa untuk melihat apakah elemen disejajarkan dengan benar, misalnya.
