7 Penyunting HTML Dalam Talian Percuma Terbaik untuk Menguji Kod Anda

7 Penyunting HTML Dalam Talian Percuma Terbaik untuk Menguji Kod Anda

Setiap laman web yang anda gunakan bergantung pada HTML. Walaupun pembangun web memerlukan kemahiran dalam skrip JavaScript, Python, CSS, dan pelayan, HTML menyimpan semuanya bersama-sama.





Tanpa HTML, tidak ada web, jadi anda perlu mengetahui cara membuat dan mengeditnya. Daripada mengatur sistem ujian kod HTML di komputer anda, lebih mudah untuk menguji kod dalam penyemak imbas.



Sama ada bermain-main dengan potongan HTML kecil atau projek laman web penuh, penyunting HTML dalam talian sangat sesuai.





Mengapa Anda Perlu Menggunakan Penyunting HTML Dalam Talian

Menggunakan editor HTML berasaskan penyemak imbas masuk akal terhadap sesuatu seperti Notepad ++ kerana sebab berikut:

  • Penyunting HTML dalam talian berjalan terus di penyemak imbas web anda
  • Uji kod HTML anda secara dalam talian --- lihat apakah kod tersebut berjalan seperti yang diharapkan
  • Lihat pratonton web masa nyata --- pratonton dikemas kini semasa anda mengedit
  • Selaraskan aliran kerja anda --- tidak perlu lagi menyimpan, memuatkan dalam penyemak imbas, beralih kembali ke editor, dan ulangi
  • Platform agnostik --- mereka berjalan di mana-mana peranti dengan sambungan web.

Perkara terakhir ini sangat penting. Ini bermaksud bahawa anda boleh mengembangkan halaman web dengan mudah di PC seperti Chromebook. Anda mungkin juga menggunakan tablet Android, atau komputer $ 50 seperti Raspberry Pi.



Pengekodan HTML adalah gerbang mudah diakses untuk memahami pengaturcaraan dan pembangunan. Anda sentiasa perlu menguji kod HTML anda --- apa yang lebih baik daripada hasil langsung di tetingkap penyemak imbas anda?

Mari lihat beberapa editor HTML dalam talian terbaik yang ada sekarang.



1. CodePen

CodePen adalah 'persekitaran pembangunan sosial' untuk pembangun web, yang pada dasarnya bermaksud penyunting dalam talian dengan ciri-ciri kolaborasi. Ia menawarkan susun atur yang sederhana. Anda akan menemui panel untuk HTML, panel untuk CSS, dan panel untuk JavaScript, ditambah panel untuk pratonton masa nyata. Semua ukuran panel dapat disesuaikan dengan menyeret tepi.

Anda boleh membuat 'Pena', yang seperti taman permainan individu untuk mengubah kod web. Pelbagai Pena boleh dikumpulkan bersama menjadi Koleksi.



Walaupun pendaftaran untuk penggunaan asas adalah percuma, Pena dan Koleksi Peribadi memerlukan Akaun pro . Ini bermula dari $ 8 / bln dan termasuk hosting aset, tema yang dapat disematkan, kolaborasi masa nyata, dan akses ke IDE pengembangan web CodePen sepenuhnya.

Ramai orang menganggap CodePen sebagai penyunting HTML dalam talian yang terbaik. Cubalah untuk melihat apakah itu sesuai dengan keperluan anda.

2. JSFiddle

JSFiddle hampir seperti apa: kotak pasir di mana anda boleh bermain-main dengan JavaScript. Anda mungkin tahu bahawa JavaScript seiring dengan HTML dan CSS. Ini bermaksud bahawa dengan JSFiddle, anda dapat mengedit ketiga-tiganya sekaligus dengan antara muka penyuntingan JSFiddle.

Sekiranya anda mahu, anda boleh melangkau JavaScript sama sekali.

Apa yang menarik tentang JSFiddle ialah anda dapat menambahkan Permintaan Luaran di bar sisi. Ini membolehkan anda memasukkan fail JavaScript dan CSS di luar laman web untuk meningkatkan HTML anda. Juga berguna adalah butang Tidy, yang secara automatik membersihkan lekukan kod anda, sambil mengklik Bekerjasama membolehkan kolaborasi dalam talian masa nyata.

Satu-satunya kelemahan ialah anda mesti mengklik butang Run untuk mengemas kini panel pratonton.

3. JSBin

Anggap JSBin sebagai alternatif yang lebih mudah dan bersih daripada JSFiddle. Anda dapat mengedit kombinasi HTML, CSS, dan JavaScript hanya dengan menukar panel dengan bar alat atas. Untuk fleksibiliti maksimum, anda juga boleh menukar panel pratonton dan panel konsol seperti yang diperlukan.

windows 10 tidak dapat membuka pusat tindakan

Tetapi walaupun JSFiddle membolehkan anda menghubungkan sumber CSS dan JavaScript luaran, JSBin menghadkan anda ke perpustakaan JavaScript yang telah ditetapkan. Pilihannya bagus walaupun, mulai dari jQuery hingga React hingga Angular dan banyak lagi.

Walaupun JSBin percuma dan tidak memerlukan akaun, anda memerlukannya Akaun pro untuk ciri maju. Ini termasuk tong peribadi, penyematan tersuai, hosting aset, penyegerakan Dropbox, dan URL kesombongan untuk halaman yang diterbitkan melalui JSBin.

Empat. Liveweave

Liveweave secara visual serupa dengan editor sebelumnya, dengan antara muka pengguna yang menyenangkan. Seperti JSFiddle, Liveweave memungkinkan untuk kolaborasi masa nyata, dan seperti JSBin, ia membolehkan anda menghubungkan sumber sumber pihak ketiga seperti jQuery.

Tetapi ia juga mempunyai beberapa ciri unik. Lorem Ipsum Generator membuat teks placeholder pada kedudukan kursor semasa anda. CSS Explorer menyediakan alat WYSIWYG untuk membuat gaya CSS dan Color Explorer membantu anda memilih warna yang sempurna. Sementara itu, Editor Vektor membolehkan anda membuat grafik vektor untuk laman web anda.

permainan irama yang menggunakan komputer muzik anda

5. Rumah HTML

HTMLhouse adalah pilihan yang baik jika anda hanya mementingkan HTML (iaitu tanpa CSS atau JavaScript). Bersih dan minimum, ia dibahagikan secara menegak dengan penyuntingan di sebelah kiri dan pratonton masa nyata di sebelah kanan.

Berguna adalah kemampuan untuk menerbitkan HTML anda dan membaginya secara tertutup (melalui URL peribadi) atau secara terbuka (ditambahkan ke Halaman Semak Imbas HTMLhouse ). Ia mudah tetapi berkesan, betul-betul di mana editor HTML dalam talian dimainkan dan unggul.

Perhatikan bahawa HTMLhouse telah dibuat dan dikendalikan oleh orang-orang di Tulis.as , alat penulisan dalam talian tanpa gangguan. Ingatlah perkara ini jika anda merancang untuk menulis kandungan laman web anda sendiri.

6. HTMLG

HTMLG pilihan lain mengikuti corak yang sama menggunakan panel kod dan pratonton untuk HTML. Walau bagaimanapun, alat ini tidak termasuk CSS dan JavaScript dalam projek gabungan yang sama. Sebaliknya, jika anda ingin mengeditnya, anda perlu membuka tab baru dan mengeditnya sebagai projek yang berasingan.

Ini menjadikannya ideal untuk tweak HTML tulen dan kod ujian dalam penyemak imbas anda; lebih kurang jika anda mahu memasukkan suntingan CSS.

Perhatikan bahawa ada had 300 perkataan jika anda menguji halaman web penuh dengan HTMLG. Untuk menambahkannya, anda boleh mendaftar ke versi premium tanpa iklan, bermula dari $ 5,80 sebulan.

7. Dabblet

Menawarkan pengeditan HTML dalam talian yang sedikit berbeza, Dabblet membelah skrin menjadi dua, bukannya tiga / empat panel. Oleh itu, anda mempunyai paparan untuk HTML & Hasil, dan pandangan yang berasingan (tetapi dipautkan) untuk CSS & Hasil.

Ini menawarkan lebih banyak ruang, memberikan pandangan yang lebih jelas mengenai kod dan pratonton. Selanjutnya, pengesah HTML3 dan CSS w3.org bawaan menyoroti sebarang masalah.

Sekiranya anda memerlukan ruang desktop yang jelas untuk menguji kod laman web anda, ini mungkin penyunting HTML terbaik untuk anda.

Gunakan Penyunting HTML Dalam Talian Terbaik untuk Meningkatkan Kemahiran Anda

Sekiranya satu-satunya pendedahan kepada HTML adalah apa yang anda pelajari sedekad yang lalu, sekarang adalah masa untuk mengejar ketinggalan. HTML5 dikeluarkan pada tahun 2014 dan memperkenalkan beberapa standard dan ciri baru. Tidak pasti di mana hendak bermula? Lihat elemen HTML5 baru yang penting ini.

Ingin mempelajari amalan baik dalam reka bentuk dan pembangunan web HTML5? Periksa ini laman web dengan contoh pengekodan HTML yang berkualiti . Anda juga harus melihat alat-alat lain untuk meningkatkan kemahiran pengembangan web anda.

Berkongsi Berkongsi Tweet E-mel 15 Perintah Windows Command Prompt (CMD) yang mesti anda ketahui

Perintah arahan masih merupakan alat Windows yang kuat. Berikut adalah arahan CMD yang paling berguna yang perlu diketahui oleh pengguna Windows.

Baca Seterusnya Topik-topik yang berkaitan
  • Pengaturcaraan
  • Penyunting Teks
  • Pembangunan Web
  • Penyunting WYSIWYG
  • HTML5
  • Skrip
Mengenai Pengarang Christian Cawley(1510 Artikel Diterbitkan)

Wakil Editor untuk Keselamatan, Linux, DIY, Pengaturcaraan, dan Penerbit Podcast yang Dijelaskan, dan Benar-benar Berguna, dengan pengalaman luas dalam sokongan desktop dan perisian. Penyumbang kepada majalah Linux Format, Christian adalah Raspberry Pi tinkerer, peminat Lego dan peminat permainan retro.

Lagi Dari Christian Cawley

Langgan buletin kami

Sertailah buletin kami untuk mendapatkan petua, ulasan, ebook percuma, dan tawaran eksklusif!

Klik di sini untuk melanggan