Cara menulis file index.html yang bagus - Jasa Pembuatan Website Ecommerce | Jasa Pembuatan Software Surabaya

[ad_1]

Setiap pengembang web ada di sana: Anda memulai proyek baru dan menonton file kosong yang dipanggil index.html. Anda mencoba mengingat suar apa yang seharusnya pergi ke again? Which are the meta tags that are best practice, and which ones are deprecated?

Recently, I found myself in this exact situation. My first instinct was to copy the head section from a previous project, but as I reviewed the code, I realized some tags were outdated or simply didn’t apply to my new project. What followed was a deep dive into HTML head tags — which ones are essential, which are optional, and which are just cluttering my code.

If you’re in a hurry and just want the template, you can find my complete starter template on GitHub. The repository contains two main files:

index.html: Model yang bersih dan minimalis dengan apa yang Anda butuhkan dan tidak ada tambahan yang tidak perlu.
index-commented.html: Model yang sama tetapi dengan komentar terperinci yang menjelaskan bagaimana dan mengapa Anda harus menggunakan setiap tag.

Artikel ini pada dasarnya adalah penyelaman yang mendalam dalam komentar index-commented.html File, memberikan lebih banyak konteks dan penjelasan untuk setiap keputusan yang dibuat dalam model.

Model ini mewakili pendekatan pendapat saya setelah penelitian tentang praktik terbaik saat ini. Ini bertujuan untuk menjadi basis yang solid untuk sebagian besar proyek web sambil mempertahankan kinerja, aksesibilitas, dan optimalisasi mesin pencari yang baik.

Mari selami komponen penting dari kepala HTML yang terstruktur dengan baik.

`Tag yang perlu Anda sertakan`

Tag ini harus ada di hampir semua dokumen HTML yang Anda buat. Mereka sangat penting untuk rendering, referensi, dan aksesibilitas yang tepat.

`and lang="en": Tentukan jenis dokumen dan bahasa`

Selalu mulai dokumen HTML Anda dengan deklarasi Doctrype. Ini memberi tahu browser versi HTML mana yang Anda gunakan (dalam hal ini, HTML5) dan membantu menjamin rendering yang koheren. ITU lang atribut pada tag specifies the language of your page – this is crucial for screen readers, search engines, and browsers. If your content is in a different language, change the code accordingly (e.g., lang="es" untuk bahasa Spanyol).

</code>: Judul halaman</h4><p>Setiap dokumen HTML harus memiliki tag judul. Teks ini muncul di tab browser, bookmark dan hasil mesin pencari. Buat deskripsi Anda tetapi judul ringkas, idealnya di bawah 60 karakter. Judul yang bagus memberi tahu pengguna konten halaman Anda dan menyertakan kata kunci yang relevan untuk SEO.</p><h4 tabindex="-1"><code><meta name="viewport"/></code>: Konfigurasi jendela untuk desain reaktif</h4><p>Di dunia ponsel saat ini, meta-balise ini tidak dapat dinegosiasikan. Ini menunjukkan kepada browser seluler bagaimana mengontrol dimensi dan skala penskalaan. Mari kita terurai apa yang dilakukan setiap parameter:</p><ul><li><code>viewport-fit=cover</code>: Memastikan bahwa konten meluas di tepi layar (sangat penting untuk ponsel yang dipotong)</li><li><code>width=device-width</code>: Menentukan lebar halaman untuk mengikuti lebar layar perangkat</li><li><code>initial-scale=1.0</code>: Mendefinisikan level zoom awal saat halaman dimuat untuk pertama kalinya</li><li><code>minimum-scale=1.0</code>: Mencegah pengguna terlalu banyak</li><li><code>maximum-scale=5.0</code>: Memungkinkan pengguna untuk memperbesar hingga 5x (batasi aksesibilitas yang sepenuhnya membahayakan ini)</li></ul><p>Tanpa tag ini, perangkat seluler akan membuat halaman ke lebar layar desktop khas, kemudian kurangi, yang menyebabkan teks kecil dan tidak terbaca dan memaksa pengguna untuk memperbesar dan memanoramisasi.</p><h4 tabindex="-1"><code><meta name="description"/></code>,, <code><meta name="keywords"/></code>,, <code><meta name="author"/></code>: Meta informasi penting</h4><p>Meta Beacon ini memberikan informasi penting di halaman Anda:</p><ul><li><code>description</code>: Ringkasan singkat dari konten halaman Anda (idealnya 150-160 karakter). Ini sering muncul di hasil mesin pencari di bawah judul Anda.</li><li><code>keywords</code>: Kata kunci yang relevan dengan isi halaman Anda. Meskipun kurang penting untuk Google hari ini, mesin pencari dan robot lainnya masih dapat menggunakan informasi ini.</li><li><code>author</code>: Nama individu atau organisasi yang membuat halaman.</li></ul><p>Meskipun suar ini tidak secara langsung mempengaruhi rendering halaman, mereka berguna untuk referensi dan kategorisasi konten.</p><h4 tabindex="-1"><code><link rel="canonical"/></code>: Hindari pengindeksan ganda</h4><p>Tag ini membantu mesin pencari menghindari pengindeksan konten yang sama beberapa kali ketika dapat diakses melalui URL yang berbeda. Misalnya, jika halaman Anda dapat diakses melalui beberapa URL (seperti <code>example.com/page</code> Dan <code>example.com/page/index.html</code>), tag kanonik menunjukkan kepada mesin pencari mana URL adalah versi “resmi” untuk diindeks, mencegah indeksasi duplikat yang dapat membahayakan klasifikasi penelitian Anda.</p><p>Isi <code>href</code> Atribut dengan URL utama Anda ingin mesin pencari mengaitkan konten ini.</p><h4 tabindex="-1">Strategi Pengisian CSS: CSS Inline Kritis vs Gaya Eksternal</h4><p>Strategi pemuatan CSS ini mengoptimalkan kinerja dalam dua cara:</p><ol><li><strong>Kritik CSS online</strong>: Mengintegrasikan gaya penting langsung ke dalam dokumen HTML, Anda menghindari membuat permintaan jaringan tambahan yang akan memblokir rendering. Ini membuat gaya kritis untuk memuat dan mencegah flash dengan konten non -gaya (fouc) yang dapat terjadi ketika gaya mengurus konten.</li><li><strong>Biaya asinkron untuk CSS non -kritis</strong>: Teknik preload dengan Onload Manager memungkinkan lembar gaya utama memuat tanpa memblokir rendering. Ini berarti bahwa halaman Anda dapat mulai menampilkan dirinya sendiri sementara sisa gaya masih bertanggung jawab, menciptakan pengalaman pengguna yang lebih baik. Tag Notcript memberikan penarikan untuk pengguna dengan JavaScript yang dinonaktifkan.</li></ol><p>Atau, jika situs Anda tidak memiliki kebutuhan gaya penting di atas lipatan, Anda dapat menggunakan pendekatan yang lebih sederhana:</p><p>Ini lebih sederhana, tetapi dapat memperlambat rendering awal karena browser harus mengunduh dan menganalisis CSS sebelum menampilkan konten.</p><h4 tabindex="-1"><code><script/ type="litespeed/javascript"></code>:Script loading best practices</h4>For JavaScript,the<code>type="module"</code>attribute offers several advantages:<ul><li>Automatically defers script loading until the DOM is ready</li><li>Enables ECMAScript modules for better code organization</li><li>Runs in strict mode by default</li><li>Allows for cleaner dependency management</li></ul>For scripts that don’t depend on DOM elements and should run as soon as possible,consider adding the<code>async</code>attribute:Additionally,it’s good practice to register a service worker for offline capabilities:<div class="codeMirror-wrapper" contenteditable="false"><div contenteditable="false"><div class="codeMirror-code--wrapper" data-code="" data-lang="text/html"><pre><code lang="text/html"><script>if('serviceWorker' in navigator){window.addEventListener('load',()=>{navigator.serviceWorker.register('/service-worker.js')})}]]></script></code></pre></p></div></div></div><p>Skrip ini ditempatkan tanpa <code>defer</code> Atau <code>async</code> Atribut untuk dijaga dan dijalankan sesegera mungkin, memungkinkan kapasitas offline pada awal proses pemuatan halaman. Pekerja layanan berjalan di latar belakang, terlepas dari halaman web Anda, yang memungkinkannya untuk mengelola permintaan jaringan dan obrolan bahkan ketika pengguna pindah dari situs Anda.</p><h2 tabindex="-1">Tag yang mungkin Anda sertakan</h2><p>Tag ini tidak diperlukan untuk setiap proyek tetapi dapat berharga dalam situasi tertentu. Sertakan mereka sesuai dengan kebutuhan proyek Anda.</p><h4 tabindex="-1"><code><meta charset="utf-8"/></code>: Pengkodean karakter</h4><p>Tag meta ini menentukan pengkodean karakter untuk dokumen HTML Anda. UTF-8 sudah merupakan pengkodean karakter default di HTML5, jadi tag ini tidak sepenuhnya diperlukan dalam banyak kasus. Namun, termasuk, secara eksplisit memastikan konsistensi di semua browser dan mencegah masalah rendering karakter potensial, khususnya dengan karakter khusus atau huruf non -latin.</p><h4 tabindex="-1"><code><base href="https://dzone.com/"/></code>: Tentukan URL dasar</h4><p>Tag dasar menentukan URL dasar untuk semua URL yang berkaitan dengan dokumen. Jika semua URL di situs Anda sudah berkaitan dengan jalur root (“Anda tidak perlu memasukkan tag ini. Ini terutama berguna ketika situs Anda di-host dalam sub-direktori tetapi Anda ingin jalur terkait dengan root domain atau ketika mengembangkan aplikasi pada halaman dengan rute sisi pelanggan.</p><h4 tabindex="-1"><code><meta name="application-name"/></code>: Detail Aplikasi</h4><p>Jika aplikasi web progresif Anda (PWA) harus memiliki nama yang berbeda dari apa yang ditentukan dalam tag judul Anda, gunakan tag meta ini. Ini mendefinisikan nama yang akan muncul ketika aplikasi web Anda diinstal pada perangkat atau disematkan di menu start -up atau bilah tugas pengguna.</p><h4 tabindex="-1"><code><meta name="theme-color"/></code>: Warna antarmuka pengguna browser</h4><p>Tag meta ini mendefinisikan warna yang digunakan oleh agen pengguna dalam elemen antarmuka pengguna di sekitar halaman Anda, seperti bilah alamat browser di browser seluler atau bilah judul di beberapa browser desktop. Pilih warna yang mencerminkan identitas merek Anda untuk menciptakan pengalaman visual yang lebih terintegrasi.</p><h4 tabindex="-1"><code><meta name="color-scheme"/></code>: Dukungan mode terang dan gelap</h4><p>Tag ini menginformasikan browser jika situs Anda mendukung mode yang jelas, mode gelap atau keduanya. Nilainya <code>"light dark"</code> berarti bahwa kedua diagram didukung, cahaya lebih disukai. Ini membantu browser untuk membuat kontrol formulir, bilah gulir dan elemen lain dari antarmuka pengguna dalam palet warna yang sesuai, menciptakan pengalaman pengguna yang lebih baik yang menghormati preferensi sistem.</p><h4 tabindex="-1"><code><meta property="og:"/></code>: Integrasi media sosial dengan grafik terbuka</h4><p>Open Meta Graphics Beacon mengoptimalkan bagaimana konten Anda muncul ketika dibagikan di platform media sosial seperti Facebook, LinkedIn dan X (sebelumnya Twitter). Meskipun tidak penting untuk fitur dasar, mereka sangat meningkatkan penampilan dan komitmen konten Anda saat dibagikan.</p><p>Tag grafis terbuka meliputi:</p><ul><li><code>og:title</code>: Judul halaman / konten Anda (mungkin berbeda dari judul HTML Anda)</li><li><code>og:type</code>: Jenis konten (situs web, artikel, produk, dll.)</li><li><code>og:url</code>: URL kanonik halaman Anda</li><li><code>og:image</code>: URL ke gambar yang mewakili konten Anda</li></ul><p>Jika konten situs Anda cenderung dibagikan di platform sosial, pengisian suar ini dengan nilai -nilai yang sesuai dapat sangat meningkatkan tarif klik dan komitmen.</p><h4 tabindex="-1"><code><link rel="manifest"/></code> Dan <code><link rel="icon"/></code>: Dukungan PWA dan Favicons</h4><p>Untuk aplikasi web progresif, gunakan tautan manifes untuk menunjuk ke file JSON yang berisi metadata aplikasi Anda, termasuk ikon. Manifesto harus memasukkan ikon aplikasi Anda dalam berbagai ukuran untuk perangkat dan konteks yang berbeda.</p><p>Untuk situs web reguler yang bukan PWA, gunakan tautan ikon untuk menentukan favorit situs Anda. Meskipun secara teknis opsional, Favicon berkontribusi pada pengenalan merek dan pengalaman pengguna, sebagian besar situs harus menyertakan satu.</p><h4 tabindex="-1"><code><link rel="alternate"/></code>: Jenis konten lainnya untuk situs Anda</h4><p>Tag penghubung ini digunakan untuk beberapa ujung:</p><ol><li><p>Ini membantu pembaca RSS dan agregator aliran lainnya untuk menemukan umpan RSS di situs Anda. Sertakan jika situs Anda menyediakan umpan RSS (umum untuk blog, situs informasi atau koleksi konten yang diperbarui secara berkala).</p></li><li><p>Itu juga dapat digunakan untuk menentukan a <code>llms.txt</code> file untuk situs Anda sebagai <code>type="text/markdown"</code> Tautan alternatif. File ini menyediakan konten situs Anda dalam format mudah -untuk -digigit untuk model bahasa besar untuk memindai situs Anda. <strong>Catatan:</strong> Saya mencuri ide ini <a rel="noopener noreferrer" href="https://www.gilesthomas.com/2025/03/llmstxt" target="_blank">Giles Thomas</a>.</p></li></ol><p>Jika situs Anda tidak menawarkan fitur -fitur ini, Anda dapat dengan aman menghilangkan suar ini.</p><h4 tabindex="-1"><code><link rel="preload"/></code>,, <code><link rel="preconnect"/></code>,, <code><link rel="prefetch"/></code>: Optimalisasi Sumber Daya</h4><p>Suar penghubung ini membantu mengoptimalkan pemuatan sumber daya:</p><ul><li><code>preload</code>: Memberitahu navigator untuk mengunduh dan menyimpan sumber daya sesegera mungkin. Berguna untuk sumber daya kritis yang diperlukan pada awal proses rendering, seperti font atau gambar penting.</li><li><code>preconnect</code>: Tetapkan koneksi awal ke area eksternal dari mana Anda akan mencari sumber daya nanti. Ini menghemat waktu dengan koneksi ke pekerjaan jika perlu.</li><li><code>prefetch</code>: Menyarankan kepada browser bahwa sumber daya mungkin diperlukan untuk navigasi di masa depan. Browser akan mengunduhnya ke perlambatan, yang membuat halaman selanjutnya dimuat lebih cepat.</li></ul><p>Gunakan secara selektif sesuai dengan kebutuhan kinerja Anda. Sureserver dapat menyia -nyiakan bandwidth, jadi fokuslah pada sumber daya yang sangat kritis.</p><h2 tabindex="-1">Kesimpulan</h2><p>Model ini memberi Anda titik awal yang solid untuk proyek web apa pun. Tentu saja, model ini benar -benar keras kepala dan konfigurasi terbaik untuk kebutuhan Anda dapat bervariasi. Jika saya telah mengesampingkan beberapa tag umum dari model, itu mungkin karena mereka tidak diperlukan, setidaknya untuk kebanyakan kasus.</p><p>Saya salut pada komentar Anda! Jika Anda pikir Anda telah melewatkan sesuatu yang penting, buka masalah atau kirimkan permintaan traksi pada <a rel="noopener noreferrer" href="https://github.com/rogiia/html-starter-template" target="_blank">Repositori GitHub</a>.</p><p>Selain itu, jika Anda menginginkan model start-up yang lebih jauh dari file index.html, Anda mungkin ingin memeriksa <a rel="noopener noreferrer" href="https://html5boilerplate.com/" target="_blank">Html5 menuangkan</a>. Ini adalah sumber yang bagus untuk memulai dengan sangat cepat saat membuat aplikasi web progresif.</p><h2 tabindex="-1">Sumber daya</h2><p>Jika Anda ingin tahu lebih banyak tentang label kepala HTML, saya sarankan mulai di sini:</p><p>Dan sekali lagi, Anda dapat menemukan model index.html saya <a rel="noopener noreferrer" href="https://github.com/rogiia/html-starter-template" target="_blank">GitHub</a>.</p></div><p>[ad_2]</p></div><div class="entry-footer"><div class="row row-xs-center"><div class="col-md-6"></div><div class="col-md-6"><div id="entry-post-share" class="entry-post-share post-share"><div class="share-label"> Share this post</div><div class="share-media"> <span class="share-icon far fa-share-alt"></span><div class="share-list"> <a class="hint--bounce hint--top hint--primary twitter" target="_blank" aria-label="Twitter" href="https://twitter.com/share?text=Cara%20menulis%20file%20index.html%20yang%20bagus&url=https%3A%2F%2Fflazzo.com%2Fcara-menulis-file-index-html-yang-bagus%2F"> <i class="fab fa-twitter"></i> </a> <a class="hint--bounce hint--top hint--primary facebook" target="_blank" aria-label="Facebook" href="https://www.facebook.com/sharer.php?m2w&s=100&p[url]=https%3A%2F%2Fflazzo.com%2Fcara-menulis-file-index-html-yang-bagus%2F&p[images][0]=https://flazzo.com/wp-content/uploads/2025/04/18334716-thumb.jpg&p[title]=Cara%20menulis%20file%20index.html%20yang%20bagus"> <i class="fab fa-facebook-f"></i> </a> <a class="hint--bounce hint--top hint--primary linkedin" target="_blank" aria-label="Linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fflazzo.com%2Fcara-menulis-file-index-html-yang-bagus%2F&title=Cara%20menulis%20file%20index.html%20yang%20bagus"> <i class="fab fa-linkedin"></i> </a></div></div></div></div></div></div></article><div class="blog-nav-links"><div class="nav-list"><div class="nav-item prev"><div class="inner"> <a href="https://flazzo.com/orca-security-mengumumkan-solusi-baru-untuk-mendigitalkan-standar-bitbucket-untuk-masalah-keamanan/" rel="prev"><div style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/4fd5d8a827a0131be8e29c3a41ab488e-370x120.png);"><h6>Orca Security Mengumumkan Solusi Baru untuk Mendigitalkan Standar Bitbucket untuk Masalah Keamanan</h6></div></a></div></div><div class="nav-item next"><div class="inner"> <a href="https://flazzo.com/the-four-ps-how-the-firms-can-influence-the-buyers-response/" rel="next"><div style="background-image: url();"><h6>The Four PS How the Firms Can Influence the Buyers Response</h6></div></a></div></div></div></div><div class="related-posts"><h3 class="related-title"> Related Posts</h3><div class="mitech-swiper tm-swiper" data-lg-items="2" data-xs-items="1" data-pagination="1" data-auto-height="1" data-slides-per-group="inherit" ><div class="swiper-inner"><div class="swiper-container"><div class="swiper-wrapper"><div class="swiper-slide"><div class="related-post-item post-6747 post type-post status-publish format-standard has-post-thumbnail hentry category-blog"> <a href="https://flazzo.com/bersihkan-data-dari-acara-di-ansible-auture-interior-yang-diharapkan-eda/" class="link-secret"><div class="post-wrapper"><div class="post-overlay" style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/18361183-thumb-480x315.jpg)" ></div><div class="post-info"><div class="post-categories"> <span>Blog</span></div><h3 class="post-title"> Bersihkan data dari acara di Ansible Auture Interior yang diharapkan (EDA)</h3></div></div> </a></div></div><div class="swiper-slide"><div class="related-post-item post-6745 post type-post status-publish format-standard has-post-thumbnail hentry category-blog"> <a href="https://flazzo.com/zencoder-memperoleh-machinet-untuk-lebih-meningkatkan-agen-pengkodean-ai-nya/" class="link-secret"><div class="post-wrapper"><div class="post-overlay" style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/e3ca50c076641883b6d63ec3b17fc0d9-480x315.jpg)" ></div><div class="post-info"><div class="post-categories"> <span>Blog</span></div><h3 class="post-title"> Zencoder memperoleh Machinet untuk lebih meningkatkan agen pengkodean AI -nya</h3></div></div> </a></div></div><div class="swiper-slide"><div class="related-post-item post-6743 post type-post status-publish format-standard has-post-thumbnail hentry category-blog"> <a href="https://flazzo.com/strategi-optimasi-indeks-sql-server/" class="link-secret"><div class="post-wrapper"><div class="post-overlay" style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/18361232-thumb-480x315.jpg)" ></div><div class="post-info"><div class="post-categories"> <span>Blog</span></div><h3 class="post-title"> Strategi Optimasi Indeks SQL Server</h3></div></div> </a></div></div><div class="swiper-slide"><div class="related-post-item post-6741 post type-post status-publish format-standard has-post-thumbnail hentry category-blog"> <a href="https://flazzo.com/harness-meluncurkan-waap-cloud-yang-dapat-dilacak-untuk-menyatukan-keamanan-dan-pengamatan-untuk-aplikasi-asli-di-cloud-api/" class="link-secret"><div class="post-wrapper"><div class="post-overlay" style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/Web-Appplication-Protection-2-480x315.jpg)" ></div><div class="post-info"><div class="post-categories"> <span>Blog</span></div><h3 class="post-title"> Harness meluncurkan WAAP cloud yang dapat dilacak untuk menyatukan keamanan dan pengamatan untuk aplikasi asli di cloud, API</h3></div></div> </a></div></div><div class="swiper-slide"><div class="related-post-item post-6739 post type-post status-publish format-standard has-post-thumbnail hentry category-blog"> <a href="https://flazzo.com/kelanjutan-termometer-di-scala/" class="link-secret"><div class="post-wrapper"><div class="post-overlay" style="background-image: url(https://flazzo.com/wp-content/uploads/2025/04/18361251-thumb-480x315.jpg)" ></div><div class="post-info"><div class="post-categories"> <span>Blog</span></div><h3 class="post-title"> Kelanjutan termometer di scala</h3></div></div> </a></div></div></div></div></div></div></div></div><div class="page-sidebar page-sidebar-right"><div class="page-sidebar-inner" itemscope="itemscope"><div class="page-sidebar-content"><div id="search-3" class="widget widget_search tm-animation move-up"><h2 class="widget-title">Search</h2><form role="search" method="get" class="search-form" action="https://flazzo.com/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search…" value="" name="s" title="Search for:"/> </label> <button type="submit" class="search-submit"> <span class="search-btn-icon fa fa-search"></span> <span class="search-btn-text"> Search </span> </button></form></div><div id="recent-posts-3" class="widget widget_recent_entries tm-animation move-up"><h2 class="widget-title">Recent Posts</h2><ul><li> <a href="https://flazzo.com/bersihkan-data-dari-acara-di-ansible-auture-interior-yang-diharapkan-eda/">Bersihkan data dari acara di Ansible Auture Interior yang diharapkan (EDA)</a></li><li> <a href="https://flazzo.com/zencoder-memperoleh-machinet-untuk-lebih-meningkatkan-agen-pengkodean-ai-nya/">Zencoder memperoleh Machinet untuk lebih meningkatkan agen pengkodean AI -nya</a></li><li> <a href="https://flazzo.com/strategi-optimasi-indeks-sql-server/">Strategi Optimasi Indeks SQL Server</a></li><li> <a href="https://flazzo.com/harness-meluncurkan-waap-cloud-yang-dapat-dilacak-untuk-menyatukan-keamanan-dan-pengamatan-untuk-aplikasi-asli-di-cloud-api/">Harness meluncurkan WAAP cloud yang dapat dilacak untuk menyatukan keamanan dan pengamatan untuk aplikasi asli di cloud, API</a></li><li> <a href="https://flazzo.com/kelanjutan-termometer-di-scala/">Kelanjutan termometer di scala</a></li></ul></div><div id="media_image-1" class="widget widget_media_image tm-animation move-up"><img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2ODAiIGhlaWdodD0iOTQwIiB2aWV3Qm94PSIwIDAgNjgwIDk0MCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgc3R5bGU9ImZpbGw6I2NmZDRkYjtmaWxsLW9wYWNpdHk6IDAuMTsiLz48L3N2Zz4=" width="680" height="940" data-src="https://flazzo.com/wp-content/uploads/2019/02/blog-sidebar-ads.jpg" class="image wp-image-40 attachment-full size-full" alt="" style="max-width: 100%; height: auto;" decoding="async" loading="lazy" data-srcset="https://flazzo.com/wp-content/uploads/2019/02/blog-sidebar-ads.jpg 680w, https://flazzo.com/wp-content/uploads/2019/02/blog-sidebar-ads-217x300.jpg 217w" data-sizes="auto, (max-width: 680px) 100vw, 680px" /></div><div id="tag_cloud-1" class="widget widget_tag_cloud tm-animation move-up"><h2 class="widget-title">Popular tags</h2><div class="tagcloud"><a href="https://flazzo.com/tag/business/" class="tag-cloud-link tag-link-5 tag-link-position-1" style="font-size: 22pt;" aria-label="business (7 items)">business</a> <a href="https://flazzo.com/tag/featured/" class="tag-cloud-link tag-link-6 tag-link-position-2" style="font-size: 8pt;" aria-label="featured (1 item)">featured</a> <a href="https://flazzo.com/tag/it-security/" class="tag-cloud-link tag-link-7 tag-link-position-3" style="font-size: 22pt;" aria-label="IT Security (7 items)">IT Security</a> <a href="https://flazzo.com/tag/it-services/" class="tag-cloud-link tag-link-8 tag-link-position-4" style="font-size: 20.833333333333pt;" aria-label="IT services (6 items)">IT services</a></div></div></div></div></div></div></div></div></div><div id="page-footer-wrapper" class="page-footer-wrapper"><div id="page-footer" class="page-footer"><div class="container"><div class="row"><div class="col-md-12"><div class="page-footer-inner"><div id="tm-row-680fd069dce7a" data-vc-full-width="true" data-vc-full-width-init="false" class="vc_row vc_row-outer vc_row-fluid vc_row-o-content-middle vc_row-flex"><div id="tm-column-680fd069de055" class="wpb_column vc_column_container vc_col-sm-12 vc_col-md-8"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-heading highlight-01 left tm-animation move-up" id="tm-heading-680fd069de3ba"><h3 class="heading" style="">Jajaki potensi bisnis Anda dan temukan peluang untuk <mark>sukses yang lebih besar</mark></h3></div><div class="tm-spacer" id="tm-spacer-680fd069de6b8"></div></div></div></div><div id="tm-column-680fd069de7cb" class="wpb_column vc_column_container vc_col-sm-12 vc_col-md-4"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-button-group" id="tm-button-group-680fd069de9a4"><div class="tm-button-wrapper tm-animation move-up" id="tm-button-680fd069debab"> <a class="tm-button style-flat tm-button-custom tm-button-custom has-icon icon-left" href="https://wa.me/6281328189988?text=Hello%20Flazzo,%20kami%20ingin%20diskusi%20terkait..." target="_blank" rel="noopener"> <span class="button-icon"> <i class="far fa-comment-alt-dots"></i> </span> <span class="button-text" data-text="Konsultasi Gratis"> Konsultasi Gratis </span></a></div></div></div></div></div></div><div class="vc_row-full-width vc_clearfix"></div><div id="tm-section-680fd069e0494" data-vc-full-width="true" data-vc-full-width-init="false" class="vc_section"><div id="tm-row-680fd069e0850" class="vc_row vc_row-outer vc_row-fluid"><div id="tm-column-680fd069e0afa" class="wpb_column vc_column_container vc_col-sm-12 vc_col-lg-4"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-image tm-animation move-up" id="tm-image-680fd069e0d45"> <a href="https://flazzo.com/"><div class="image"><img loading="lazy" decoding="async" class="ll-image unload" alt="flazz-web" width="160" height="48" src="https://flazzo.com/wp-content/uploads/2020/12/flazz-web-50x15.png" data-src="https://flazzo.com/wp-content/uploads/2020/12/flazz-web-160x48.png" /></div></a></div><div class="tm-spacer" id="tm-spacer-680fd069e0f75"></div><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e10c9"><div class="heading" style=""><mark>Flazz Media Solutions</mark><br /> Jl. Papa Biru II/16 Malang<br /> Jawa Timur – Indonesia</div></div><div class="tm-spacer" id="tm-spacer-680fd069e13a1"></div><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e14ea"><div class="heading" style=""><a href="mailto:contact@flazzo.com">contact@flazzo.com</a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e17bc"></div><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e18fb"><div class="heading" style="">Telp. (+62) 341 438 1636</div></div><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e1c76"><div class="heading" style="">WA. <a href="https://wa.me/6281328189988?text=Hello%20Flazzo,%20kami%20ingin%20diskusi%20terkait..." target="_blank" rel="noopener">(+62) 813 2818 9988</a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e1f0c"></div><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e2063"><div class="heading" style=""><a href="https://www.flazzo.com/">www.flazzo.com</a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e2309"></div></div></div></div><div id="tm-column-680fd069e2422" class="wpb_column vc_column_container vc_col-sm-4 vc_col-lg-2"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-spacer" id="tm-spacer-680fd069e25d9"></div><div id="tm-widget-title-680fd069e2688" class="tm-widget-title widget style-01 tm-animation move-up"><h2 class="widget-title">Home</h2></div><div class="tm-list style-normal list-vertical tm-animation move-up" id="tm-list-680fd069e2872"><div class="list-item"><a class="link" href="https://www.flazzo.com/profil/"><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Profil</h6></div></div> </a></div><div class="list-item"><a class="link" href="https://www.flazzo.com/layanan/"><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Layanan</h6></div></div> </a></div><div class="list-item"><a class="link" href="https://www.flazzo.com/mengapa-kami/"><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Mengapa Kami</h6></div></div> </a></div><div class="list-item"><a class="link" href="https://www.flazzo.com/category/blog/"><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Blog</h6></div></div> </a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e2c14"></div></div></div></div><div id="tm-column-680fd069e2d37" class="wpb_column vc_column_container vc_col-sm-4 vc_col-lg-2"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-spacer" id="tm-spacer-680fd069e2e78"></div><div id="tm-widget-title-680fd069e2f02" class="tm-widget-title widget style-01 tm-animation move-up"><h2 class="widget-title">Dukungan</h2></div><div class="tm-list style-normal list-vertical tm-animation move-up" id="tm-list-680fd069e30bb"><div class="list-item"><a class="link" href="https://wa.me/6281328189988?text=Hello%20Flazzo,%20kami%20ingin%20diskusi%20terkait..." target="_blank" rel="noopener"><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Konsultasi Gratis</h6></div></div> </a></div><div class="list-item"><a class="link" href="#" ><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Hubungi Kami</h6></div></div> </a></div><div class="list-item"><a class="link" href="#" ><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Pusat Bantuan</h6></div></div> </a></div><div class="list-item"><a class="link" href="#" ><div class="list-header"><div class="marker"></div><div class="title-wrap"><h6 class="title"> Kebijakan Cookies</h6></div></div> </a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e3452"></div></div></div></div><div id="tm-column-680fd069e3577" class="wpb_column vc_column_container vc_col-sm-12 vc_col-lg-2"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-spacer" id="tm-spacer-680fd069e371c"></div><div class="tm-button-group" id="tm-button-group-680fd069e37ab"><div class="tm-button-wrapper tm-animation move-up" id="tm-button-680fd069e3967"> <a class="tm-button style-image tm-button-nm tm-button-" href="#" ><img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNzAiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCAxNzAgNDgiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHN0eWxlPSJmaWxsOiNjZmQ0ZGI7ZmlsbC1vcGFjaXR5OiAwLjE7Ii8+PC9zdmc+" loading="lazy" decoding="async" width="170" height="48" data-src="https://flazzo.com/wp-content/uploads/2019/02/mitech-button-google-play-light.jpg" class="attachment-full size-full" alt="" /></a></div><div class="tm-button-wrapper tm-animation move-up" id="tm-button-680fd069e3e86"> <a class="tm-button style-image tm-button-nm tm-button-" href="#" ><img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNzAiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCAxNzAgNDgiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHN0eWxlPSJmaWxsOiNjZmQ0ZGI7ZmlsbC1vcGFjaXR5OiAwLjE7Ii8+PC9zdmc+" loading="lazy" decoding="async" width="170" height="48" data-src="https://flazzo.com/wp-content/uploads/2019/02/mitech-button-app-store-light.jpg" class="attachment-full size-full" alt="" /></a></div></div><div class="tm-spacer" id="tm-spacer-680fd069e41a5"></div></div></div></div></div><div id="tm-row-680fd069e442d" class="vc_row vc_row-outer vc_row-fluid"><div id="tm-column-680fd069e46a5" class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-spacer" id="tm-spacer-680fd069e4837"></div></div></div></div></div><div id="tm-row-680fd069e4a59" data-vc-full-width="true" data-vc-full-width-init="false" class="vc_row vc_row-outer vc_row-fluid vc_row-o-content-middle vc_row-flex"><div id="tm-column-680fd069e4cca" class="wpb_column vc_column_container vc_col-sm-6"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-heading left tm-animation move-up" id="tm-heading-680fd069e4f60"><div class="heading" style="">© 2020 Flazzo. All Rights Reserved</div></div></div></div></div><div id="tm-column-680fd069e52e6" class="wpb_column vc_column_container vc_col-sm-6"><div class="vc_column-inner "><div class="wpb_wrapper"><div class="tm-social-networks style-solid-rounded-icon layout-inline tm-animation move-up" id="tm-social-networks-680fd069e555f"><ul class="list"><li class="item"> <a href="https://twitter.com/flazzocom" target="_blank" aria-label="Twitter" class="link hint--bounce hint--top hint--primary" rel="noopener"> <i class="fab fa-twitter link-icon"></i> </a></li><li class="item"> <a href="https://facebook.com/FlazzMediaSolutions" target="_blank" aria-label="Facebook" class="link hint--bounce hint--top hint--primary" rel="noopener"> <i class="fab fa-facebook-f link-icon"></i> </a></li><li class="item"> <a href="https://instagram.com/flazzocom" target="_blank" aria-label="Instagram" class="link hint--bounce hint--top hint--primary" rel="noopener"> <i class="fab fa-instagram link-icon"></i> </a></li></ul></div><div class="tm-spacer" id="tm-spacer-680fd069e5a25"></div></div></div></div></div><div class="vc_row-full-width vc_clearfix"></div></div><div class="vc_row-full-width vc_clearfix"></div></div></div></div></div></div></div></div> <script type="speculationrules">{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/"},{"not":{"href_matches":["\/wp-.php","\/wp-admin\/","\/wp-content\/uploads\/","\/wp-content\/","\/wp-content\/plugins\/","\/wp-content\/themes\/mitech\/","\/\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}</script> <a class="page-scroll-up" id="page-scroll-up"> <i class="arrow-top fal fa-long-arrow-up"></i> <i class="arrow-bottom fal fa-long-arrow-up"></i> </a><div id="page-mobile-main-menu" class="page-mobile-main-menu"><div class="inner"><div class="page-mobile-menu-header"><div class="page-mobile-popup-logo page-mobile-menu-logo"> <a href="https://flazzo.com/" rel="home"> <img data-lazyloaded="1" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNjAiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCAxNjAgNDgiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHN0eWxlPSJmaWxsOiNjZmQ0ZGI7ZmlsbC1vcGFjaXR5OiAwLjE7Ii8+PC9zdmc+" width="160" height="48" data-src="https://flazzo.com/wp-content/uploads/2020/12/flazz-web-160x48.png" alt="Jasa Pembuatan Website Ecommerce | Jasa Pembuatan Software Surabaya | Flazzo Official Site"/> </a></div><div id="page-close-mobile-menu" class="page-close-mobile-menu"></div></div><div class="page-mobile-menu-content"><ul id="mobile-menu-primary" class="menu__container"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-77 level-1"><a href="https://www.flazzo.com/"><div class="menu-item-wrap"><span class="menu-item-title">Home</span></div></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1098 level-1"><a href="https://flazzo.com/profil/"><div class="menu-item-wrap"><span class="menu-item-title">Profil</span></div></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-890 level-1"><a href="https://flazzo.com/layanan/"><div class="menu-item-wrap"><span class="menu-item-title">Layanan</span></div></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2581 level-1"><a href="https://flazzo.com/mengapa-kami/"><div class="menu-item-wrap"><span class="menu-item-title">Mengapa Kami</span></div></a></li><li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-2527 level-1"><a href="https://flazzo.com/category/blog/"><div class="menu-item-wrap"><span class="menu-item-title">Blog</span></div></a></li></ul></div></div></div> <script type="text/html" id="wpb-modifications"></script> <script type="litespeed/javascript" data-src="https://flazzo.com/wp-content/themes/mitech/assets/libs/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js" id="perfect-scrollbar-js"></script> <script id="mitech-script-js-extra" type="litespeed/javascript">var $insight={"templateUrl":"https:\/\/flazzo.com\/wp-content\/themes\/mitech","ajaxurl":"https:\/\/flazzo.com\/wp-admin\/admin-ajax.php","primary_color":"#086ad8","header_sticky_enable":"1","header_sticky_height":"80","scroll_top_enable":"1","light_gallery_auto_play":"0","light_gallery_download":"1","light_gallery_full_screen":"1","light_gallery_zoom":"1","light_gallery_thumbnail":"1","light_gallery_share":"1","mobile_menu_breakpoint":"1199","isProduct":"","noticeCookieEnable":"0","noticeCookieConfirm":"no","noticeCookieMessages":"We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.<a id=\"tm-button-cookie-notice-ok\" class=\"tm-button tm-button-xs tm-button-full-wide style-flat\">Ok, got it!<\/a>","isShowNewsletterPopup":""}</script> <script type="litespeed/javascript">var mainStyle=document.getElementById('mitech-style-inline-css');if(mainStyle!==null){mainStyle.textContent+='#tm-row-680fd069dce7a{background-color:#454545;background-image:url( https://flazzo.com/wp-content/uploads/2019/02/mitech-call-to-action-image-global.png);background-repeat:no-repeat;background-position:top 35% right -68px}#tm-row-680fd069dce7a{padding-top :84px !important;padding-bottom :84px !important}#tm-heading-680fd069de3ba{text-align:left}#tm-heading-680fd069de3ba .heading{line-height:1.4;color:#fff}#tm-button-group-680fd069de9a4{justify-content:flex-end}#tm-button-680fd069debab{text-align:left}#tm-button-680fd069debab .tm-button{min-width:170px;color:#086ad8;border-color:#fff;background:#fff}#tm-button-680fd069debab .tm-button:hover{color:#fff;border-color:#086ad8;background:#086ad8}#tm-button-680fd069debab .tm-button .button-icon{color:#086ad8}#tm-button-680fd069debab .tm-button:hover .button-icon{color:#fff}#tm-section-680fd069e0494{padding-top :84px !important;padding-bottom :52px !important}#tm-image-680fd069e0d45{text-align:left}#tm-heading-680fd069e10c9{text-align:left}#tm-heading-680fd069e14ea{text-align:left}#tm-heading-680fd069e18fb{text-align:left}#tm-heading-680fd069e18fb .heading{font-weight:700;color:#333}#tm-heading-680fd069e18fb .heading:hover{color:#086ad8}#tm-heading-680fd069e1c76{text-align:left}#tm-heading-680fd069e1c76 .heading{font-weight:700;color:#333}#tm-heading-680fd069e1c76 .heading:hover{color:#086ad8}#tm-heading-680fd069e2063{text-align:left}#tm-heading-680fd069e2063 .heading{color:#086ad8}#tm-heading-680fd069e2063 .heading:hover{color:#d2a98e}#tm-list-680fd069e2872{text-align:left}#tm-list-680fd069e2872{grid-template-columns:repeat(1,1fr)}#tm-list-680fd069e30bb{text-align:left}#tm-list-680fd069e30bb{grid-template-columns:repeat(1,1fr)}#tm-button-group-680fd069e37ab>div{padding:5px}#tm-button-group-680fd069e37ab{margin:-5px;justify-content:flex-start}#tm-button-680fd069e3967{text-align:left}#tm-button-680fd069e3e86{text-align:left}#tm-heading-680fd069e4f60{text-align:left}#tm-heading-680fd069e4f60 .heading{color:#7e7e7e}#tm-social-networks-680fd069e555f{text-align:right}#tm-heading-680fd069de3ba .heading{font-size:40px }#tm-button-680fd069debab .button-icon{font-size:14px }#tm-spacer-680fd069e0f75{height:31px }#tm-spacer-680fd069e13a1{height:10px }#tm-spacer-680fd069e17bc{height:10px }#tm-spacer-680fd069e1f0c{height:10px }#tm-spacer-680fd069e2309{height:50px }#tm-spacer-680fd069e25d9{height:28px }#tm-spacer-680fd069e2c14{height:50px }#tm-spacer-680fd069e2e78{height:28px }#tm-spacer-680fd069e3452{height:50px }#tm-spacer-680fd069e371c{height:87px }#tm-spacer-680fd069e41a5{height:50px }#tm-spacer-680fd069e4837{height:15px }@media(max-width:1199px){#tm-heading-680fd069de3ba .heading{font-size:34px }#tm-spacer-680fd069e25d9{height:0 }#tm-spacer-680fd069e2e78{height:0 }#tm-spacer-680fd069e371c{height:0 }}@media(max-width:992px){#tm-heading-680fd069de3ba{text-align:center}#tm-button-group-680fd069de9a4{justify-content:center}}@media(max-width:992px){#tm-heading-680fd069de3ba .heading{font-size:28px }#tm-spacer-680fd069de6b8{height:30px }}@media(max-width:767px){#tm-list-680fd069e2872{grid-template-columns:repeat(1,1fr)}#tm-list-680fd069e30bb{grid-template-columns:repeat(1,1fr)}#tm-column-680fd069e4cca{-webkit-order:3;-moz-order:3;order:3}#tm-social-networks-680fd069e555f{text-align:left}}@media(max-width:767px){#tm-spacer-680fd069e5a25{height:30px }}'}</script> <script data-no-optimize="1">!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).LazyLoad=e()}(this,function(){"use strict";function e(){return(e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n,a=arguments[e];for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(t[n]=a[n])}return t}).apply(this,arguments)}function i(t){return e({},it,t)}function o(t,e){var n,a="LazyLoad::Initialized",i=new t(e);try{n=new CustomEvent(a,{detail:{instance:i}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(a,!1,!1,{instance:i})}window.dispatchEvent(n)}function l(t,e){return t.getAttribute(gt+e)}function c(t){return l(t,bt)}function s(t,e){return function(t,e,n){e=gt+e;null!==n?t.setAttribute(e,n):t.removeAttribute(e)}(t,bt,e)}function r(t){return s(t,null),0}function u(t){return null===c(t)}function d(t){return c(t)===vt}function f(t,e,n,a){t&&(void 0===a?void 0===n?t(e):t(e,n):t(e,n,a))}function _(t,e){nt?t.classList.add(e):t.className+=(t.className?" ":"")+e}function v(t,e){nt?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\s+)"+e+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,"")}function g(t){return t.llTempImage}function b(t,e){!e||(e=e._observer)&&e.unobserve(t)}function p(t,e){t&&(t.loadingCount+=e)}function h(t,e){t&&(t.toLoadCount=e)}function n(t){for(var e,n=[],a=0;e=t.children[a];a+=1)"SOURCE"===e.tagName&&n.push(e);return n}function m(t,e){(t=t.parentNode)&&"PICTURE"===t.tagName&&n(t).forEach(e)}function a(t,e){n(t).forEach(e)}function E(t){return!!t[st]}function I(t){return t[st]}function y(t){return delete t[st]}function A(e,t){var n;E(e)||(n={},t.forEach(function(t){n[t]=e.getAttribute(t)}),e[st]=n)}function k(a,t){var i;E(a)&&(i=I(a),t.forEach(function(t){var e,n;e=a,(t=i[n=t])?e.setAttribute(n,t):e.removeAttribute(n)}))}function L(t,e,n){_(t,e.class_loading),s(t,ut),n&&(p(n,1),f(e.callback_loading,t,n))}function w(t,e,n){n&&t.setAttribute(e,n)}function x(t,e){w(t,ct,l(t,e.data_sizes)),w(t,rt,l(t,e.data_srcset)),w(t,ot,l(t,e.data_src))}function O(t,e,n){var a=l(t,e.data_bg_multi),i=l(t,e.data_bg_multi_hidpi);(a=at&&i?i:a)&&(t.style.backgroundImage=a,n=n,_(t=t,(e=e).class_applied),s(t,ft),n&&(e.unobserve_completed&&b(t,e),f(e.callback_applied,t,n)))}function N(t,e){!e||0<e.loadingCount||0<e.toLoadCount||f(t.callback_finish,e)}function C(t,e,n){t.addEventListener(e,n),t.llEvLisnrs[e]=n}function M(t){return!!t.llEvLisnrs}function z(t){if(M(t)){var e,n,a=t.llEvLisnrs;for(e in a){var i=a[e];n=e,i=i,t.removeEventListener(n,i)}delete t.llEvLisnrs}}function R(t,e,n){var a;delete t.llTempImage,p(n,-1),(a=n)&&--a.toLoadCount,v(t,e.class_loading),e.unobserve_completed&&b(t,n)}function T(o,r,c){var l=g(o)||o;M(l)||function(t,e,n){M(t)||(t.llEvLisnrs={});var a="VIDEO"===t.tagName?"loadeddata":"load";C(t,a,e),C(t,"error",n)}(l,function(t){var e,n,a,i;n=r,a=c,i=d(e=o),R(e,n,a),_(e,n.class_loaded),s(e,dt),f(n.callback_loaded,e,a),i||N(n,a),z(l)},function(t){var e,n,a,i;n=r,a=c,i=d(e=o),R(e,n,a),_(e,n.class_error),s(e,_t),f(n.callback_error,e,a),i||N(n,a),z(l)})}function G(t,e,n){var a,i,o,r,c;t.llTempImage=document.createElement("IMG"),T(t,e,n),E(c=t)||(c[st]={backgroundImage:c.style.backgroundImage}),o=n,r=l(a=t,(i=e).data_bg),c=l(a,i.data_bg_hidpi),(r=at&&c?c:r)&&(a.style.backgroundImage='url("'.concat(r,'")'),g(a).setAttribute(ot,r),L(a,i,o)),O(t,e,n)}function D(t,e,n){var a;T(t,e,n),a=e,e=n,(t=It[(n=t).tagName])&&(t(n,a),L(n,a,e))}function V(t,e,n){var a;a=t,(-1<yt.indexOf(a.tagName)?D:G)(t,e,n)}function F(t,e,n){var a;t.setAttribute("loading","lazy"),T(t,e,n),a=e,(e=It[(n=t).tagName])&&e(n,a),s(t,vt)}function j(t){t.removeAttribute(ot),t.removeAttribute(rt),t.removeAttribute(ct)}function P(t){m(t,function(t){k(t,Et)}),k(t,Et)}function S(t){var e;(e=At[t.tagName])?e(t):E(e=t)&&(t=I(e),e.style.backgroundImage=t.backgroundImage)}function U(t,e){var n;S(t),n=e,u(e=t)||d(e)||(v(e,n.class_entered),v(e,n.class_exited),v(e,n.class_applied),v(e,n.class_loading),v(e,n.class_loaded),v(e,n.class_error)),r(t),y(t)}function $(t,e,n,a){var i;n.cancel_on_exit&&(c(t)!==ut||"IMG"===t.tagName&&(z(t),m(i=t,function(t){j(t)}),j(i),P(t),v(t,n.class_loading),p(a,-1),r(t),f(n.callback_cancel,t,e,a)))}function q(t,e,n,a){var i,o,r=(o=t,0<=pt.indexOf(c(o)));s(t,"entered"),_(t,n.class_entered),v(t,n.class_exited),i=t,o=a,n.unobserve_entered&&b(i,o),f(n.callback_enter,t,e,a),r||V(t,n,a)}function H(t){return t.use_native&&"loading"in HTMLImageElement.prototype}function B(t,i,o){t.forEach(function(t){return(a=t).isIntersecting||0<a.intersectionRatio?q(t.target,t,i,o):(e=t.target,n=t,a=i,t=o,void(u(e)||(_(e,a.class_exited),$(e,n,a,t),f(a.callback_exit,e,n,t))));var e,n,a})}function J(e,n){var t;et&&!H(e)&&(n._observer=new IntersectionObserver(function(t){B(t,e,n)},{root:(t=e).container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}))}function K(t){return Array.prototype.slice.call(t)}function Q(t){return t.container.querySelectorAll(t.elements_selector)}function W(t){return c(t)===_t}function X(t,e){return e=t||Q(e),K(e).filter(u)}function Y(e,t){var n;(n=Q(e),K(n).filter(W)).forEach(function(t){v(t,e.class_error),r(t)}),t.update()}function t(t,e){var n,a,t=i(t);this._settings=t,this.loadingCount=0,J(t,this),n=t,a=this,Z&&window.addEventListener("online",function(){Y(n,a)}),this.update(e)}var Z="undefined"!=typeof window,tt=Z&&!("onscroll"in window)||"undefined"!=typeof navigator&&/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),et=Z&&"IntersectionObserver"in window,nt=Z&&"classList"in document.createElement("p"),at=Z&&1<window.devicePixelRatio,it={elements_selector:".lazy",container:tt||Z?document:null,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",data_bg_hidpi:"bg-hidpi",data_bg_multi:"bg-multi",data_bg_multi_hidpi:"bg-multi-hidpi",data_poster:"poster",class_applied:"applied",class_loading:"litespeed-loading",class_loaded:"litespeed-loaded",class_error:"error",class_entered:"entered",class_exited:"exited",unobserve_completed:!0,unobserve_entered:!1,cancel_on_exit:!0,callback_enter:null,callback_exit:null,callback_applied:null,callback_loading:null,callback_loaded:null,callback_error:null,callback_finish:null,callback_cancel:null,use_native:!1},ot="src",rt="srcset",ct="sizes",lt="poster",st="llOriginalAttrs",ut="loading",dt="loaded",ft="applied",_t="error",vt="native",gt="data-",bt="ll-status",pt=[ut,dt,ft,_t],ht=[ot],mt=[ot,lt],Et=[ot,rt,ct],It={IMG:function(t,e){m(t,function(t){A(t,Et),x(t,e)}),A(t,Et),x(t,e)},IFRAME:function(t,e){A(t,ht),w(t,ot,l(t,e.data_src))},VIDEO:function(t,e){a(t,function(t){A(t,ht),w(t,ot,l(t,e.data_src))}),A(t,mt),w(t,lt,l(t,e.data_poster)),w(t,ot,l(t,e.data_src)),t.load()}},yt=["IMG","IFRAME","VIDEO"],At={IMG:P,IFRAME:function(t){k(t,ht)},VIDEO:function(t){a(t,function(t){k(t,ht)}),k(t,mt),t.load()}},kt=["IMG","IFRAME","VIDEO"];return t.prototype={update:function(t){var e,n,a,i=this._settings,o=X(t,i);{if(h(this,o.length),!tt&&et)return H(i)?(e=i,n=this,o.forEach(function(t){-1!==kt.indexOf(t.tagName)&&F(t,e,n)}),void h(n,0)):(t=this._observer,i=o,t.disconnect(),a=t,void i.forEach(function(t){a.observe(t)}));this.loadAll(o)}},destroy:function(){this._observer&&this._observer.disconnect(),Q(this._settings).forEach(function(t){y(t)}),delete this._observer,delete this._settings,delete this.loadingCount,delete this.toLoadCount},loadAll:function(t){var e=this,n=this._settings;X(t,n).forEach(function(t){b(t,e),V(t,n,e)})},restoreAll:function(){var e=this._settings;Q(e).forEach(function(t){U(t,e)})}},t.load=function(t,e){e=i(e);V(t,e)},t.resetStatus=function(t){r(t)},Z&&function(t,e){if(e)if(e.length)for(var n,a=0;n=e[a];a+=1)o(t,n);else o(t,e)}(t,window.lazyLoadOptions),t});!function(e,t){"use strict";function a(){t.body.classList.add("litespeed_lazyloaded")}function n(){console.log("[LiteSpeed] Start Lazy Load Images"),d=new LazyLoad({elements_selector:"[data-lazyloaded]",callback_finish:a}),o=function(){d.update()},e.MutationObserver&&new MutationObserver(o).observe(t.documentElement,{childList:!0,subtree:!0,attributes:!0})}var d,o;e.addEventListener?e.addEventListener("load",n,!1):e.attachEvent("onload",n)}(window,document);</script><script data-no-optimize="1">var litespeed_vary=document.cookie.replace(/(?:(?:^|.;\s)_lscache_vary\s\=\s([^;]).$)|^.$/,"");litespeed_vary||fetch("/wp-content/plugins/litespeed-cache/guest.vary.php",{method:"POST",cache:"no-cache",redirect:"follow"}).then(e=>e.json()).then(e=>{console.log(e),e.hasOwnProperty("reload")&&"yes"==e.reload&&(sessionStorage.setItem("litespeed_docref",document.referrer),window.location.reload(!0))});</script><script data-optimized="1" type="litespeed/javascript" data-src="https://flazzo.com/wp-content/litespeed/js/794e07f7d63b0dc16ba3870b33d86e8e.js?ver=e567b"></script><script>const litespeed_ui_events=["mouseover","click","keydown","wheel","touchmove","touchstart"];var urlCreator=window.URL||window.webkitURL;function litespeed_load_delayed_js_force(){console.log("[LiteSpeed] Start Load JS Delayed"),litespeed_ui_events.forEach(e=>{window.removeEventListener(e,litespeed_load_delayed_js_force,{passive:!0})}),document.querySelectorAll("iframe[data-litespeed-src]").forEach(e=>{e.setAttribute("src",e.getAttribute("data-litespeed-src"))}),"loading"==document.readyState?window.addEventListener("DOMContentLoaded",litespeed_load_delayed_js):litespeed_load_delayed_js()}litespeed_ui_events.forEach(e=>{window.addEventListener(e,litespeed_load_delayed_js_force,{passive:!0})});async function litespeed_load_delayed_js(){let t=[];for(var d in document.querySelectorAll('script[type="litespeed/javascript"]').forEach(e=>{t.push(e)}),t)await new Promise(e=>litespeed_load_one(t[d],e));document.dispatchEvent(new Event("DOMContentLiteSpeedLoaded")),window.dispatchEvent(new Event("DOMContentLiteSpeedLoaded"))}function litespeed_load_one(t,e){console.log("[LiteSpeed] Load ",t);var d=document.createElement("script");d.addEventListener("load",e),d.addEventListener("error",e),t.getAttributeNames().forEach(e=>{"type"!=e&&d.setAttribute("data-src"==e?"src":e,t.getAttribute(e))});let a=!(d.type="text/javascript");!d.src&&t.textContent&&(d.src=litespeed_inline2src(t.textContent),a=!0),t.after(d),t.remove(),a&&e()}function litespeed_inline2src(t){try{var d=urlCreator.createObjectURL(new Blob([t.replace(/^(?:)?$/gm,"$1")],{type:"text/javascript"}))}catch(e){d="data:text/javascript;base64,"+btoa(t.replace(/^(?:)?$/gm,"$1"))}return d}</script></body></html>