{"id":12585,"date":"2021-08-09T09:03:18","date_gmt":"2021-08-09T09:03:18","guid":{"rendered":"https:\/\/hosteko.com\/blog\/?p=12585"},"modified":"2021-08-09T09:03:18","modified_gmt":"2021-08-09T09:03:18","slug":"pengertian-manfaat-dan-fungsi-inspect-element","status":"publish","type":"post","link":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element","title":{"rendered":"Pengertian, Manfaat dan Fungsi Inspect Element"},"content":{"rendered":"<h2><strong>Pengertian Inspect Element<\/strong><\/h2>\n<p>Inspect element\u00a0adalah fitur browser yang memungkinkan untuk memeriksa kode HTML dan CSS pada suatu website. Artinya bisa mengetahui berbagai kode warna yang digunakan website tersebut, jenis font atau ikon yang dipakai, dll.<\/p>\n<p>Perubahan yang bisa dilakukan oleh inspect element tool ini hanya bersifat sementara. Jadi tidak perlu khawatir akan merusak desain dan konten dari website tersebut saat menggunakan alat ini. Walaupun sebenarnya inspect element tool tersedia di semua browser populer, disini akan membahas tool yang dimiliki oleh Google Chrome.<\/p>\n<h2><b>Manfaat Inspect Element Chrome<\/b><\/h2>\n<p>Ada banyak manfaat yang bisa didapatkan dari inspect element tool chrome, diantaranya :<\/p>\n<ul>\n<li><b>Temporary changes<\/b><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bisa menggunakan alat ini untuk membuat perubahan yang bersifat sementara pada sebuah halaman website. Fitur ini bisa memudahkan web designer dalam perencanaan design.<\/p>\n<ul>\n<li><b>Hide personal details<\/b><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bisa menggunakan inspect element tool untuk menyembunyikan informasi personal yang ada di halaman web saat mengambil tangkapan layar. Fitur ini akan sangat membantu blogger\u00a0dan\u00a0content writers.<\/p>\n<ul>\n<li><b>Diagnose bugs and broken links<\/b><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Jika seorang web developer bisa menggunakan alat ini untuk menemukan link yang rusak dan menemukan bugs pada website yang sedang dikerjakan.<\/p>\n<ul>\n<li><b>Find hidden items<\/b><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bisa menggunakan alat ini untuk menemukan konten tersembunyi di dalam halaman website. Fitur ini sangat berguna untuk digital marketer dalam mencari keywords atau kata kunci tersembunyi dari sebuah blog.<\/p>\n<ul>\n<li><b>Coding experiment<\/b><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Jika tertarik untuk belajar coding HTML dan CSS, alat ini bisa menjadi sarana eksperimen. Tidak perlu khawatir melakukan untuk kesalahan karena semua perubahan akan hilang setelah memencet tombol refresh pada browser.<\/p>\n<h2><strong><span id=\"Fungsi_Inspect_Element\">Fungsi Inspect Element<\/span><\/strong><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-12588 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.gif\" alt=\"\" width=\"1440\" height=\"810\" \/><\/p>\n<p>Selain berguna untuk melihat berbagai elemen di balik layar website,\u00a0inspect element\u00a0juga mempunyai fungsi lain. Berikut daftar lengkapnya :<\/p>\n<ul>\n<li><strong>Mengedit Website<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Developer bisa melihat bagaimana perubahan desain website sebelum menerapkannya secara permanen.<\/p>\n<ul>\n<li><strong>Melakukan Audit Kode<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Developer juga bisa mengecek link atau kode yang rusak pada halaman tersebut.<\/p>\n<ul>\n<li><strong>Berlatih Coding<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bagi yang sedang belajar coding bisa praktek tanpa perlu khawatir melakukan kesalahan. Selain itu juga bisa melihat langsung hasilnya.<\/p>\n<ul>\n<li><strong>Melakukan Riset Kata Kunci <\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bisa melihat kata kunci SEO apa yang dipakai oleh kompetitor di halaman mereka.<\/p>\n<ul>\n<li><strong>Mencari Inspirasi Desain<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Mengetahui jenis font atau kode warna yang dipakai di website tertentu yang membuat tertarik.<\/p>\n<ul>\n<li><strong>Menjaga Privasi<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Bisa menyembunyikan info pribadi atau info rahasia saat mengambil screenshoot\u00a0untuk dibagikan ke orang lain.<\/p>\n<h2><span id=\"Kenapa_Saya_Harus_Menggunakan_Inspect_Element\"><strong>Alasan Harus Menggunakan Inspect Element<\/strong><\/span><\/h2>\n<p>Jika tidak pernah mengintip kode situs web karena penasaran mungkin bertanya-tanya mengapa harus belajar cara menggunakan Inspect Element.<\/p>\n<ul>\n<li><strong>Desainer<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Ingin melihat dulu bagaimana desain situs akan terlihat di seluler? Atau ingin melihat bagaimana warna hijau yang berbeda akan terlihat pada tombol pendaftaran? dapat melakukan keduanya dalam detik dengan Inspect Element.<\/p>\n<ul>\n<li><strong>Pemasar<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Ingin tahu kata kunci apa yang digunakan pesaing dalam tajuk situs mereka, atau ingin melihat apakah pemuatan situs terlalu lambat untuk uji PageSpeed<b> <\/b>Google? Inspect Element dapat menunjukkan keduanya.<\/p>\n<ul>\n<li><strong>Penulis<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Lelah mengaburkan nama dan email di tangkapan layar? Dengan Inspect Element dapat mengubah teks apa pun di laman web dalam sedetik.<\/p>\n<ul>\n<li><strong>Agen Pendukung<\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Perlu cara yang lebih baik untuk memberi tahu pengembang apa yang perlu diperbaiki di situs? Inspect Element memungkinkan untuk membuat contoh perubahan cepat untuk menunjukkan apa yang dibicarakan.<\/p>\n<h2><span id=\"Cara_Menggunakan_Inspect_Element\"><strong>Cara Menggunakan\u00a0Inspect Element<\/strong><\/span><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-12589 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul-1.gif\" alt=\"\" width=\"1440\" height=\"810\" \/><\/p>\n<p>Setelah mengetahui manfaat yang bisa didapatkan dari\u00a0inspect element, berikut adalah penjelasan menggunakan melalui browser.<\/p>\n<h3><span id=\"Cara_Inspect_Element_Chrome\"><b>1. Cara Inspect Element\u00a0Chrome<\/b><\/span><\/h3>\n<ul>\n<li><strong><span id=\"1_Untuk_coba_kode_html\">Untuk coba kode html<\/span><\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Ini yang paling basic dan sering digunakan untuk screenshoot terus upload di sosmed.<\/p>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>\n<li>Pergi ke page atau halaman web yang diinginkan, disini misal ke trending youtube indonesia.<\/li>\n<li>Klik kanan di bagian yang diinginkan, terus pilih inspect element. Atau gunakan CTRL + SHIFT + I (Windows) dan Command + OPTION + I (MacOs).<\/li>\n<li>Selanjutnya edit sesuai yang diinginkan.<\/li>\n<li>Jika sudah Enter dan selesai.<\/li>\n<\/ul>\n<\/li>\n<li><strong><span id=\"2_Untuk_coba_kode_CSS\">Untuk coba kode CSS<\/span><\/strong><\/li>\n<\/ul>\n<p style=\"padding-left: 40px;\">Berikut merupakan cara inspect element dengan kode CSS, yaitu :<\/p>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>\n<li>Tekan tombol CTRL + SHIFT + I atau bisa langsung dengan F12 pada keyboard.<\/li>\n<li>Selain itu juga bisa klik kanan pada halaman yang akan tampil. Nantinya akan melihat menu bertuliskan inspect lalu klik.<\/li>\n<li>Setelah itu akan melihat tampilan yang mana diharuskan untuk melakukan pengaturan tampilan tombol dengan CSS. Bisa memilih tombol seleksi, yang akan berada pada jendela seleksi elemen. Untuk memudahkan bisa menggunakan cara rumus di keyboard dengan CTRL+SHFT+C. Lalu pilihlah this is button dan lanjutkan proses.<\/li>\n<li>Setelah selesai bisa menambahkan sebuah style rule yang diinginkan. Bisa menambahkannya dengan cara klik ikon tambah yang mana berada di bagian kanan. Lalu nantinya akan muncul style rule CSS. Untuk itu bisa menambahkan class dengan kode CSS.<\/li>\n<li>Lalu bisa mengetik sendiri bagaimana style yang diinginkan. Namun ingat, jangan untuk melakukan copy paste.<\/li>\n<li>Setelah itu akan melihat kotak yang mana memiliki warna dan juga memiliki kode yang dapat digunakan. Kotak tersebut juga mencakup background dan juga warna. Bisa memilih kotak tersebut, untuk yang ingin mengganti warna yang diinginkan dan sesuai dengan yang disukai.<\/li>\n<li>Nantinya juga akan muncul kotak color picker, yang mana bisa memilih warna lain yang diinginkan dan berasal dari halaman web yang ada. Cara ini dapat di lakukan dengan mengarahkan langsung kursor, pada objek yang memiliki warna. Klik warna tersebut untuk dapat menggunakannya.<\/li>\n<li>Untuk yang ingin mengatur dimana letak jendela inspeksi berada, bisa klik option, lalu nantinya di bagian kanan akan ada tombol close. Dalam hal ini dapat memilih jenis tampilan apapun yang diinginkan.<\/li>\n<li>Lalu dapat dengan bebas, menyalin kode CSS yang ada dan telah dibuat, dengan hanya klik bagian inspector stylesheer dan nantinya akan langsung di tampilkan kode CSS.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3><span id=\"Cara_Inspect_Element_Firefox\"><b>2. Cara Inspect Element Firefox<\/b><\/span><\/h3>\n<p>Cara penggunaan pada browser Firefox hampir dengan dengan Google Chrome, yaitu :<\/p>\n<ul>\n<li aria-level=\"1\">Buka alamat\u00a0website\u00a0yang akan dicek menggunakan browser Firefox.<\/li>\n<li aria-level=\"1\">Klik kanan &gt;&gt; Inspect Element (Q).<\/li>\n<\/ul>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-right kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;right&quot;,&quot;id&quot;:&quot;12585&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;3&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;5&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;0&quot;,&quot;greet&quot;:&quot;Jadilah yang pertama untuk memberi nilai&quot;,&quot;legend&quot;:&quot;5\\\/5 - (3 votes)&quot;,&quot;size&quot;:&quot;22&quot;,&quot;title&quot;:&quot;Pengertian, Manfaat dan Fungsi Inspect Element&quot;,&quot;width&quot;:&quot;110&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 110px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 17.6px;\">\n            5\/5 - (3 votes)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Pengertian Inspect Element Inspect element\u00a0adalah fitur browser yang memungkinkan untuk memeriksa kode HTML dan CSS pada suatu website. Artinya bisa mengetahui berbagai kode warna yang digunakan website tersebut, jenis font atau ikon yang dipakai, dll. Perubahan yang bisa dilakukan oleh inspect element tool ini hanya bersifat sementara. Jadi tidak perlu khawatir akan merusak desain dan [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":12590,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rop_custom_images_group":[],"rop_custom_messages_group":[],"rop_publish_now":"initial","rop_publish_now_accounts":{"twitter_2392824914_2392824914":""},"rop_publish_now_history":[],"rop_publish_now_status":"pending","_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"enabled":false},"version":2}},"categories":[3],"tags":[4591,4592,4589,4590,4588],"class_list":["post-12585","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-alasan-harus-menggunakan-inspect-element","tag-cara-menggunakan-inspect-element","tag-fungsi-inspect-element","tag-manfaat-inspect-element","tag-pengertian-inspect-element"],"featured_image_src":{"landsacpe":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul-1140x445.png",1140,445,true],"list":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul-463x348.png",463,348,true],"medium":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul-300x169.png",300,169,true],"full":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png",1920,1080,false]},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog\" \/>\n<meta property=\"og:description\" content=\"Pengertian Inspect Element Inspect element\u00a0adalah fitur browser yang memungkinkan untuk memeriksa kode HTML dan CSS pada suatu website. Artinya bisa mengetahui berbagai kode warna yang digunakan website tersebut, jenis font atau ikon yang dipakai, dll. Perubahan yang bisa dilakukan oleh inspect element tool ini hanya bersifat sementara. Jadi tidak perlu khawatir akan merusak desain dan [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\" \/>\n<meta property=\"og:site_name\" content=\"Hosteko Blog\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-09T09:03:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Risa Y\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Risa Y\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#article\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\"},\"author\":{\"name\":\"Risa Y\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b\"},\"headline\":\"Pengertian, Manfaat dan Fungsi Inspect Element\",\"datePublished\":\"2021-08-09T09:03:18+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\"},\"wordCount\":907,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png\",\"keywords\":[\"alasan harus menggunakan inspect element\",\"cara menggunakan inspect element\",\"fungsi inspect element\",\"manfaat inspect element\",\"pengertian inspect element\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\",\"url\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\",\"name\":\"Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png\",\"datePublished\":\"2021-08-09T09:03:18+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png\",\"width\":1920,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/hosteko.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Pengertian, Manfaat dan Fungsi Inspect Element\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/hosteko.com\/blog\/#website\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"name\":\"Hosteko Blog\",\"description\":\"Berita &amp; Informasi Dunia IT\",\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/hosteko.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\",\"name\":\"HOSTEKO\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"width\":195,\"height\":57,\"caption\":\"HOSTEKO\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b\",\"name\":\"Risa Y\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"caption\":\"Risa Y\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element","og_locale":"en_US","og_type":"article","og_title":"Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog","og_description":"Pengertian Inspect Element Inspect element\u00a0adalah fitur browser yang memungkinkan untuk memeriksa kode HTML dan CSS pada suatu website. Artinya bisa mengetahui berbagai kode warna yang digunakan website tersebut, jenis font atau ikon yang dipakai, dll. Perubahan yang bisa dilakukan oleh inspect element tool ini hanya bersifat sementara. Jadi tidak perlu khawatir akan merusak desain dan [&hellip;]","og_url":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element","og_site_name":"Hosteko Blog","article_published_time":"2021-08-09T09:03:18+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","type":"image\/png"}],"author":"Risa Y","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Risa Y","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#article","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element"},"author":{"name":"Risa Y","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b"},"headline":"Pengertian, Manfaat dan Fungsi Inspect Element","datePublished":"2021-08-09T09:03:18+00:00","mainEntityOfPage":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element"},"wordCount":907,"commentCount":0,"publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"image":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","keywords":["alasan harus menggunakan inspect element","cara menggunakan inspect element","fungsi inspect element","manfaat inspect element","pengertian inspect element"],"articleSection":["Blog"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#respond"]}]},{"@type":"WebPage","@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element","url":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element","name":"Pengertian, Manfaat dan Fungsi Inspect Element - Hosteko Blog","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage"},"image":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","datePublished":"2021-08-09T09:03:18+00:00","breadcrumb":{"@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#primaryimage","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/hosteko.com\/blog\/pengertian-manfaat-dan-fungsi-inspect-element#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/hosteko.com\/blog"},{"@type":"ListItem","position":2,"name":"Pengertian, Manfaat dan Fungsi Inspect Element"}]},{"@type":"WebSite","@id":"https:\/\/hosteko.com\/blog\/#website","url":"https:\/\/hosteko.com\/blog\/","name":"Hosteko Blog","description":"Berita &amp; Informasi Dunia IT","publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/hosteko.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/hosteko.com\/blog\/#organization","name":"HOSTEKO","url":"https:\/\/hosteko.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","width":195,"height":57,"caption":"HOSTEKO"},"image":{"@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b","name":"Risa Y","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","caption":"Risa Y"}}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2021\/08\/Desain-tanpa-judul.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/12585","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/comments?post=12585"}],"version-history":[{"count":3,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/12585\/revisions"}],"predecessor-version":[{"id":12598,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/12585\/revisions\/12598"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media\/12590"}],"wp:attachment":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media?parent=12585"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/categories?post=12585"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/tags?post=12585"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}