Cara Menerbitkan Claude Artifact Jadi Website Sungguhan yang Tayang

Fitur Artifacts di Claude adalah salah satu cara tercepat untuk membuat website lengkap. Anda menjelaskan apa yang dibutuhkan, Claude menulis HTML dan CSS-nya, dan Anda bisa langsung melihat pratinjaunya di jendela obrolan. Hasilnya bagus.

Lalu Anda menabrak tembok: bagaimana cara menayangkannya di internet?

Artifact itu hidup di dalam Claude. Anda bisa melihat pratinjaunya, menyalin kodenya, bahkan membagikan tautan ke percakapan, tetapi itu bukan website sungguhan. Tidak ada URL yang bisa Anda cetak di kartu nama. Tidak muncul di Google. Hilang jika percakapannya hilang. Dan jelas tidak bisa dihubungkan ke domain sendiri.

Panduan ini menunjukkan cara mengubah Claude Artifact menjadi website yang tayang dan di-hosting, lengkap dengan alamat sendiri, sertifikat SSL, dan formulir kontak yang berfungsi, dalam waktu kurang dari lima menit.

Apa Itu Claude Artifact?

Saat Anda meminta Claude membuat sesuatu yang visual, seperti website, grafik, atau aplikasi interaktif, ia menghasilkan kodenya dan merender pratinjau langsung di panel di samping percakapan. Anthropic menyebutnya Artifacts. Ini adalah berkas HTML/CSS/JS mandiri yang berjalan di browser.

Untuk pembuatan website, Artifacts memang mengesankan. Kodenya bersih, desainnya modern, dan perilaku responsifnya biasanya langsung berfungsi. Masalahnya bukan kualitas, melainkan pengirimannya. Artifact adalah pratinjau, bukan publikasi.

Langkah 1: Keluarkan Kode dari Claude

Pertama, Anda perlu memindahkan berkas HTML dari Artifact ke komputer Anda. Ada dua cara:

Opsi A: Salin Kodenya

1. Klik panel Artifact di Claude untuk memperluasnya.
2. Klik ikon kode(atau "View Source") untuk melihat HTML mentahnya.
3. Klik Copy untuk menyalin seluruh blok kode.
4. Buka editor teks biasa (Notepad di Windows, TextEdit di Mac, pastikan dalam mode teks biasa).
5. Tempelkan kodenya dan simpan berkas sebagai index.html di desktop Anda.

Opsi B: Unduh Artifact-nya

Beberapa paket Claude memungkinkan Anda mengunduh Artifact langsung sebagai berkas HTML. Jika Anda melihat tombol unduh di panel Artifact, pakai saja, karena lebih cepat. Pastikan berkas yang diunduh bernama index.html (ganti namanya jika perlu).

Langkah 2: Jatuhkan ke SiteDrop

Sekarang Anda punya berkas index.html di komputer. Agar tayang di internet:

1. Buka SiteDrop dan masuk (gratis untuk memulai).
2. Seret berkas index.html Anda ke dasbor SiteDrop. Itu saja. Satu kali seret.
3. Dalam waktu kurang dari lima detik, SiteDrop menayangkan situs Anda ke CDN global, mengamankannya dengan sertifikat SSL gratis (HTTPS), dan memberi Anda tautan yang sudah aktif.

Claude Artifact Anda kini menjadi website sungguhan yang bisa diakses siapa pun di dunia.

Langkah 3: Dapatkan Domain Sendiri

Tautan SiteDrop gratis berfungsi sempurna untuk dibagikan, tetapi jika Anda menginginkan alamat yang profesional (seperti www.yourbusiness.com), Anda bisa mengklaimnya langsung dari dasbor SiteDrop:

1. Buka pengaturan situs Anda di dasbor.
2. Cari nama domain yang Anda inginkan.
3. Klaim domainnya. SiteDrop menangani seluruh konfigurasi DNS secara otomatis. Tanpa dasbor registrar, tanpa catatan nameserver, tanpa menunggu 48 jam.

Langkah 4: Dapatkan Formulir Kontak yang Berfungsi (Gratis)

Jika Claude Artifact Anda menyertakan formulir kontak (dan kebanyakan website bisnis memang sebaiknya punya), SiteDrop otomatis menyambungkannya. Pesan yang dikirim lewat formulir masuk ke kotak masuk bawaan SiteDrop Anda, tanpa hosting email, tanpa alat formulir pihak ketiga, tanpa langganan bulanan.

Ini salah satu keunggulan terbesar dibanding pilihan hosting lain: formulir kontak Anda benar-benar berfungsi sejak situs diunggah.

Tips agar Claude Artifact Lebih Bagus

Kualitas website Anda bergantung pada kualitas prompt Anda. Berikut beberapa tips untuk mendapat Artifact yang lebih baik dari Claude:

Jelaskan Bisnis Anda dengan Spesifik

"Buatkan website satu halaman untuk bisnis grooming anjing keliling bernama Paws & Shine di Manchester. Sertakan bagian hero dengan tagline, bagian layanan dengan 4 layanan beserta harganya, testimoni pelanggan, dan formulir kontak. Gunakan skema warna teal hangat dan krem dengan elemen desain modern yang membulat."

Semakin spesifik Anda, semakin rapi hasilnya. Sertakan nama bisnis asli, layanan asli, harga asli, dan warna pilihan Anda.

Minta Semuanya dalam Satu Berkas

Tambahkan "letakkan semua CSS langsung di dalam berkas HTML" atau "buat satu berkas index.html yang mandiri" ke prompt Anda. Ini membuat pengunggahan ke SiteDrop mulus: satu berkas, satu kali seret, selesai.

Minta Responsif untuk Ponsel

Tambahkan "buat sepenuhnya responsif untuk ponsel, tablet, dan desktop" ke prompt Anda. Claude umumnya melakukannya dengan baik, tetapi menyebutkannya secara jelas memastikan tidak ada titik henti yang terlewat.

Gunakan Prompt Creator SiteDrop

Tidak yakin cara menulis prompt yang bagus? Prompt Creator SiteDrop mengajukan beberapa pertanyaan tentang bisnis Anda dan menghasilkan prompt yang pas untuk ditempel ke Claude. Semua detail teknisnya diurus untuk Anda.

Mengapa Tidak Cukup Membagikan Tautan Percakapan Claude?

Claude memungkinkan Anda membagikan tautan percakapan, dan penerimanya bisa melihat Artifact-nya. Jadi untuk apa repot memakai SiteDrop? Karena tautan percakapan yang dibagikan:

• Bukan URL sungguhan: Anda tidak bisa mencetak tautan percakapan Claude di kartu nama atau mencantumkannya di profil Google.
• Tidak punya domain: website Anda berada di claude.ai/share/..., bukan di nama bisnis Anda.
• Tidak bisa dirayapi: mesin pencari dan mesin jawaban AI tidak dapat menemukan atau mengutipnya.
• Tidak punya formulir kontak: pengunjung tidak bisa menghubungi Anda.
• Bisa hilang: jika Anthropic mengubah kebijakan berbagi atau Anda kehilangan percakapannya, tautannya rusak.
• Menampilkan merek Claude: bukan merek bisnis Anda.

Situs yang di-hosting di SiteDrop adalah milik Anda. Domain Anda, merek Anda, formulir kontak Anda, analitik Anda. Ini website sungguhan, bukan pratinjau di dalam produk milik orang lain.

Apa Lagi yang Bisa Dilakukan Setelah Menerbitkan?

• Edit konten secara visual: gunakan editor visual SiteDrop untuk mengubah teks, gambar, dan konten langsung di halaman.
• Tambahkan gambar Anda sendiri: ganti gambar placeholder dengan foto bisnis asli Anda.
• Perbarui kapan saja: buat ulang Artifact di Claude dengan perubahan, unggah ulang ke SiteDrop, dan situs Anda yang tayang langsung diperbarui.
• Pantau pengunjung: lihat berapa banyak orang yang mengunjungi situs Anda dari dasbor SiteDrop.

Seluruh Prosesnya, Langkah demi Langkah

1. Buka Claude dan jelaskan website Anda (atau gunakan Prompt Creator).
2. Claude menghasilkan Artifact. Lihat pratinjaunya untuk memastikan Anda menyukainya.
3. Salin kodenya atau unduh berkas HTML-nya.
4. Seret berkasnya ke SiteDrop.
5. Website Anda tayang. Jika mau, klaim domain sendiri.

Total waktu: kurang dari lima menit. Total biaya: gratis untuk memulai.