7 labākie bezmaksas tiešsaistes HTML redaktori, lai pārbaudītu savu kodu

7 labākie bezmaksas tiešsaistes HTML redaktori, lai pārbaudītu savu kodu

Katra jūsu izmantotā vietne balstās uz HTML. Lai gan tīmekļa izstrādātājiem ir nepieciešamas JavaScript, Python, CSS un servera puses skriptu prasmes, HTML to visu satur kopā.





Bez HTML nav tīmekļa, tāpēc jums jāzina, kā to izveidot un rediģēt. Tā vietā, lai datorā iestatītu HTML koda pārbaudes sistēmu, ir vieglāk pārbaudīt kodu pārlūkprogrammā.





Neatkarīgi no tā, vai meklējat mazus HTML fragmentus vai pilnus vietņu projektus, tiešsaistes HTML redaktors ir ideāls.





Kāpēc jums vajadzētu izmantot tiešsaistes HTML redaktoru

Izmantojot pārlūkprogrammas HTML redaktoru, ir lietderīgi izmantot tādas lietas kā Notepad ++ šādu iemeslu dēļ:

  • Tiešsaistes HTML redaktori darbojas tieši jūsu tīmekļa pārlūkprogrammā
  • Pārbaudiet savu HTML kodu tiešsaistē --- pārbaudiet, vai kods darbojas, kā paredzēts
  • Skatiet reāllaika tīmekļa priekšskatījumus-priekšskatījums tiek atjaunināts, rediģējot
  • Racionalizējiet savu darbplūsmu-vairs nav jāsaglabā, jāielādē pārlūkprogrammā, jāpārslēdzas uz redaktoru un jāatkārto
  • Platformas agnostiķis --- tie darbojas jebkurā ierīcē ar tīmekļa savienojumu.

Šis pēdējais punkts ir ļoti svarīgs. Tas nozīmē, ka jūs, iespējams, varat tikpat viegli izveidot tīmekļa lapu datorā kā Chromebook datorā. Jūs pat varētu izmantot Android planšetdatoru vai datoru par 50 USD, piemēram, Raspberry Pi.



HTML kodēšana ir pieejama, vienkārša vārteja programmēšanas un izstrādes izpratnei. Jums pastāvīgi jāpārbauda HTML kods-kas var būt labāks par reāllaika rezultātiem pārlūkprogrammas logā?

Apskatīsim dažus no labākajiem pašlaik pieejamajiem tiešsaistes HTML redaktoriem.





1. CodePen

CodePen ir “sociālās attīstības vide” tīmekļa izstrādātājiem, kas būtībā nozīmē, ka tas ir tiešsaistes redaktors ar sadarbības funkcijām. Tas piedāvā vienkāršu izkārtojumu. Jūs atradīsit HTML paneli, CSS paneli un JavaScript paneli, kā arī vienu priekšskatīšanai reāllaikā. Visus paneļu izmērus var pielāgot, velkot malas apkārt.

Jūs varat izveidot “pildspalvas”, kas ir kā atsevišķi rotaļu laukumi tīmekļa koda pielāgošanai. Vairākas pildspalvas var sagrupēt kolekcijās.





Lai gan reģistrēšanās pamata lietošanai ir bezmaksas, privātajām pildspalvām un kolekcijām ir nepieciešams Pro konts . Tas sākas ar USD 8 mēnesī un ietver aktīvu mitināšanu, iegulto tēmu, reāllaika sadarbību un piekļuvi CodePen pilnam tīmekļa izstrādes IDE.

Daudzi uzskata CodePen par labāko tiešsaistes HTML redaktoru. Izmēģiniet to, lai redzētu, vai tas atbilst jūsu vajadzībām.

2. JSFiddle

JSFiddle ir gandrīz tāds, kā tas izklausās: smilšu kaste, kurā varat izklaidēties ar JavaScript. Jūs droši vien zināt, ka JavaScript iet roku rokā ar HTML un CSS. Tas nozīmē, ka, izmantojot JSFiddle, jūs varat rediģēt visus trīs vienlaikus, izmantojot JSFiddle rediģēšanas saskarni.

Ja vēlaties, varat JavaScript pilnībā izlaist.

JSFiddle ir jauks tas, ka sānjoslā varat pievienot ārējos pieprasījumus. Tas ļauj iekļaut JavaScript un CSS failus ārpus vietnes, lai uzlabotu HTML. Noderīga ir arī poga Tidy, kas automātiski attīra jūsu koda ievilkumu, savukārt, noklikšķinot uz Sadarboties, iespējams sadarboties reāllaikā tiešsaistē.

Vienīgais trūkums ir tas, ka jums ir jānoklikšķina uz pogas Palaist, lai atjauninātu priekšskatījuma paneli.

3. JSBin

Apsveriet JSBin kā vienkāršāku un tīrāku alternatīvu JSFiddle. Jūs varat rediģēt jebkuru HTML, CSS un JavaScript kombināciju, vienkārši pārslēdzot paneļus ar augšējo rīkjoslu. Lai panāktu maksimālu elastību, pēc nepieciešamības varat pārslēgt arī priekšskatījuma paneli un konsoles paneli.

imessage uz mac nesūta ziņas

Bet, lai gan JSFiddle ļauj saistīt ārējos CSS un JavaScript resursus, JSBin ierobežo tikai iepriekš noteiktas JavaScript bibliotēkas. Tomēr izvēle ir laba, sākot no jQuery līdz React līdz Angular un citiem.

Lai gan JSBin ir bezmaksas un tam nav nepieciešams konts, jums būs nepieciešams Pro konts papildu funkcijām. Tie ietver privātas tvertnes, pielāgotas iegulšanas, līdzekļu mitināšanu, Dropbox sinhronizāciju un iedomātus vietrāžus URL lapām, kas publicētas, izmantojot JSBin.

Četri. Liveweave

Liveweave vizuāli ir līdzīgs iepriekšējiem redaktoriem ar patīkamu lietotāja interfeisu. Tāpat kā JSFiddle, arī Liveweave ļauj sadarboties reāllaikā, un tāpat kā JSBin, tas ļauj saistīt iepriekš definētus trešo pušu resursus, piemēram, jQuery.

Bet tam ir arī dažas unikālas iezīmes. Lorem Ipsum Generator izveido viettura tekstu jūsu pašreizējā kursora pozīcijā. CSS Explorer nodrošina WYSIWYG rīku CSS stilu izveidei, un Color Explorer palīdz izvēlēties perfektas krāsas. Tikmēr vektoru redaktors ļauj savai vietnei izveidot vektorgrafiku.

Windows 10 domā, ka printeris ir bezsaistē

5. HTML māja

HTMLhouse ir laba iespēja, ja jums rūp tikai HTML (t.i., nav CSS vai JavaScript). Tīrs un minimāls, tas ir sadalīts vertikāli, rediģējot kreisajā pusē un reāllaika priekšskatījumu labajā pusē.

Noderīga ir iespēja publicēt savu HTML un koplietot to privāti (izmantojot privātu URL) vai publiski (pievienots HTMLhouse pārlūkošanas lapa ). Tas ir vienkārši, bet efektīvi, un tieši šeit tiek izmantots tiešsaistes HTML redaktors, kas ir izcils.

Ņemiet vērā, ka HTMLhouse tika izveidots un to uztur cilvēki vietnē Rakstīt.kā , tiešsaistes rakstīšanas rīks, kas novērš uzmanību. Paturiet to prātā, ja plānojat rakstīt savu vietnes saturu.

6. HTMLG

Cita opcija HTMLG ievēro to pašu koda un priekšskatījuma rūtju izmantošanas modeli HTML. Tomēr šajā vienotajā projektā šis rīks neietver CSS un JavaScript. Drīzāk, ja vēlaties tos rediģēt, jums ir jāatver jauna cilne un jārediģē tie kā atsevišķi projekti.

Tas padara to ideāli piemērotu vienkāršiem HTML pielāgojumiem un koda testēšanai pārlūkprogrammā; mazāk, ja vēlaties iekļaut CSS labojumus.

Ņemiet vērā, ka, pārbaudot pilnas tīmekļa lapas, izmantojot HTMLG, ir noteikts 300 vārdu ierobežojums. Lai to palielinātu, varat reģistrēties premium versijai bez reklāmām, sākot no USD 5,80 mēnesī.

7. Dabblet

Piedāvājot nedaudz atšķirīgu attieksmi pret tiešsaistes HTML redaktoriem, Dabblet sadala ekrānu divās, nevis trīs/četrās rūtīs. Tātad jums ir HTML un rezultātu skats un atsevišķs (bet saistīts) skats CSS un rezultātam.

Tas piedāvā vairāk vietas, nodrošinot skaidrāku koda un priekšskatījuma skatu. Turklāt iebūvētais w3.org HTML un CSS validators izceļ visas problēmas.

Ja vietnes koda pārbaudei ir nepieciešama brīva vieta darbvirsmā, tas varētu būt labākais HTML redaktors.

Izmantojiet labākos tiešsaistes HTML redaktorus, lai uzlabotu savas prasmes

Ja jūsu vienīgā saskare ar HTML ir tā, ko iemācījāties pirms desmit gadiem, tagad ir īstais laiks, lai panāktu. HTML5 tika izlaists 2014. gadā un ieviesa nedaudz jaunu standartu un funkciju. Vai neesat pārliecināts, kur sākt? Apskatiet šos būtiskos jaunos HTML5 elementus.

Vai vēlaties uzzināt labo praksi HTML5 tīmekļa dizainā un izstrādē? Pārbaudiet šos vietnes ar kvalitatīviem HTML kodēšanas piemēriem . Jums vajadzētu arī apskatīt šos citus rīkus, lai uzlabotu savas tīmekļa izstrādes prasmes.

Kopīgot Kopīgot Čivināt E -pasts 15 Windows komandrindas (CMD) komandas, kas jums jāzina

Komandu uzvedne joprojām ir spēcīgs Windows rīks. Šeit ir visnoderīgākās CMD komandas, kas jāzina katram Windows lietotājam.

Lasīt Tālāk
Saistītās tēmas
  • Programmēšana
  • Teksta redaktors
  • Web izstrāde
  • WYSIWYG redaktori
  • HTML5
  • Skriptu veidošana
Par autoru Kristians Kovlijs(Publicēti 1510 raksti)

Redaktora vietnieks drošības, Linux, DIY, programmēšanas un tehniski izskaidrota jomā un patiešām noderīgs Podcast apraides ražotājs ar lielu pieredzi galddatoru un programmatūras atbalstā. Žurnāla Linux Format līdzstrādnieks Kristiāns ir Raspberry Pi mīļotājs, Lego cienītājs un retro spēļu cienītājs.

Vairāk no Kristiāna Kaulija

Abonējiet mūsu biļetenu

Pievienojieties mūsu informatīvajam izdevumam, lai iegūtu tehniskus padomus, pārskatus, bezmaksas e -grāmatas un ekskluzīvus piedāvājumus!

Noklikšķiniet šeit, lai abonētu