Skip to content


«
»

Vytvářejte webové stránky online vizuálně i v HTML kódu

HTML Editor.in

Představíme Vám online editor, se kterým můžete tvořit webové stránky jako v textovém editoru (tzv. WYSIWYG způsob) či přímo v HTML kódu. Online HTML editor HTML Editor.in zvládá pohodlně obojí. Výhodou tohoto řešení je, že nemusíte stahovat a instalovat jakýkoli program a online editor je dostupný v jakémkoli prohlížeči a nemusíte řešit operační systém. Nehodí se však na tvorbu složitějších webů, je určen zejména pro začátečníky, kteří se učí HTML a pro rychlé provedení formátování.

Zejména začátečníky tento editor osloví. Je česky a běží na jakémkoli prohlížeči, takže si můžete stránky editovat kdekoli je Internet. Základní zobrazení je jako textový editor, do něhož píšete text. Lze používat styly nadpisů, různá písma, velikost, barvy, atd. Veškeré formátování se interně převádí do HTML kódu, do něhož se můžete snadno přepnout.

Web se dá tvořit podobně jako v textovém editoru

Web se dá tvořit podobně jako v textovém editoru

Můžeme provádět také složitější formátování a vkládat další objekty jako jsou tabulky, odkazy, speciální symboly a mnohem více. Pomocí tlačítka Zdroj vlevo nahoře se přepneme do režimu zdrojového kódu.

Zdrojový kód je odsazený, ale poměrně nepřehledný

Zdrojový kód je odsazený, ale poměrně nepřehledný

Kód je sice odsazen vzhledem ke struktuře dokumentu, avšak zbytečná odsazení působí nepřehledně. U složitější stránky se v něm zajisté ztratíme. Naopak chválím, že pro prázdnou stránku generuje základní struktur. Zkusme nyní se vrátit zpátky do textu a stránku upravit.

Na stránku přidejme odkaz a tabulku, vše jde snadno

Na stránku přidejme odkaz a tabulku, vše jde snadno

Vkládání je snadné, podobné jako v kterémkoli textovém editoru. Například u tabulky zadáváme velikost či barvy ohraničení, u odkazu zadáme cíl, případně další parametry. Okno editoru zůstává na pozadí viditelné s obsahem.

Snadné vkládání odkazů či tabulek

Snadné vkládání odkazů či tabulek

Poněkud méně přehledný je zdrojový kód. Sice se vše vkládá správně, ale kvůli odsazení se v něm můžeme již lehce ztratit a zejména pro začátečníky moc nepřehledný nebude. Ale hodí se každopádně k tomu, abychom si ověřili, jak se daný prvek chová a případně si kód zkopírovali k dalšímu použití.

Vygenerovaný kód sice není zrovna nejpřehlednější, ale funguje

Vygenerovaný kód sice není zrovna nejpřehlednější, ale funguje

Není to zrovna nejlépe přehledné, ale kód je funkční. Dodržuje také logické formátování namísto fyzického (tučný text je obalen tagem <strong>). Veškeré styly se zapisují přímo v HTML kódu, tzv. CSS inline. Většinou však máme pro weby externí CSS soubory se styly, který jen připojíme pomocí link rel. Snadno si editor také správně poradí s odrážkami, číslovanými seznamy či vložením tlačítka nebo jiného prvku. Například pro tlačítko se vygeneruje správný kód:

<input name=“tlacitko1″ type=“button“ value=“klikni zde“ />

Online HTML editor se hodí spíš pro začátečníky, kteří se seznamují s HTML. Uvidí tak, jak se co převádí do kódu, vlastní stránku lze tvořit vizuálně. Je také pomocníkem k rychlé tvorbě jednotlivých částí stránek či ke tvorbě šablon. Cílí však na začátečníky, kteří se seznamují s principy tvorby webu. Výhodou je dostupnost kdekoli je Internet, nezávisle na prohlížeči a systému a editor nevyžaduje žádný doplněk, vše běží pomocí JavaScriptu. Podobným online HTML editorem je HTML.am.

Rubrika: Ostatní, Představení, Tipy.

0 reakcí

Mějte přehled o nových komentářích, přihlašte se k odběru RSS kanálu komentářů tohoto příspěvku.

Některé HTML je povoleno

(vyžadováno)

(vyžadováno, nebude nikde zobrazeno)