HTML tagy pro text, zarovnání, velikost, písmo

Zdá se, že proč znáte HTML tagy pro text, jestliže teď v téměř žádném adminu je pohodlný vizuální editor, který je umisťuje automaticky? Faktem je, že formátování obsahu na webu je radikálně odlišné od práce v kancelářských aplikacích. Nestačí jen dát textu zajímavý vzhled, protože správný návrh závisí nejen na zobrazení webových stránek, ale také na jeho propagaci ve vyhledávačích.

HTML tagy a atributy: základy syntaxe

Každý text má skrytý kód, který "vysvětluje" počítači, co a jak se má zobrazit na obrazovce. Všechny informace se zaznamenávají pomocí sady univerzálních prvků.


Značky HTML pro text jsou v podstatě příkazy, které na stránku přidávají určité bloky nebo mění jejich vzhled. Správný formát zápisu vypadá takto:
Vezměte prosím na vědomí, že všechny značky nejsou spárovány. Například
(přeskočení čáry) nebo (přidání vodorovného řádku) vůbec nemusí být ukončeno.

Proč nemohu kopírovat články z aplikace Word a jiných programů do editoru webů

Ačkoli moderní kancelářské aplikace používají pro text textové HTML tagy, ve 99% případů není pro webové stránky vhodný nativní kód. Dokonce i když se samotný dokument obvykle objevuje v samotné aplikaci, může dojít k vyblednutí vložení na formátovací stránky. Kvůli velkému množství nepotřebných značek a atributů však vyhledávače nemohou dostatečně analyzovat obsah stránky. To zase komplikuje rozvoj vašeho zdroje. ZískatČistý a relevantní kód, nejprve je třeba vymazat text z tagů HTML vytvořených běžným editorem. Existuje několik způsobů, jak to udělat:
  • "Uteče" prostřednictvím článku "Poznámkový blok" a teprve pak jej vložit na místo. Aplikace utírá celý HTML, takže po tom budete muset znovu formátovat text (pomocí nástrojů editoru nebo ručně).
  • Napište a publikujte články prostřednictvím aplikace LiveWriter. Populární editor blogu okamžitě generuje správný kód. A na samostatné kartě můžete vidět, jak text vypadá na webu.
  • Použijte HTML Cleaner. Tato služba online nezničí celý kód, ale pouze další fragmenty. Pomocí filtrů zvolíte, které značky chcete uložit. K formátování je také výkonný vizuální editor, který do kódu přidává již optimalizované příkazy.
  • Před zveřejněním nové položky vždy zkontrolujte HTML. Nemělo by obsahovat jiné značky než ty, které momentálně kontrolujeme.


    Body

    Tento prvek je přítomen prakticky ve všech článcích. Každý odstavec by měl být umístěn uvnitř takového kontejneru - zjednodušuje formátování a umožňuje vám uložit jeden styl na všech stránkách webu. Pro snadnost je značka vždy napsána z nového řádku.

    Zarovnání

    Samostatná značka HTML "Text Alignment" se již dlouho používá. Místo toho byl vytvořen univerzální atribut ALIGN. Chcete-li změnit pozici textového bloku na stránce, musíte vybrat jednu ze tří hodnot - CENTER, RIGHT nebo LEFT. Podobně můžete nastavit zarovnání pro další prvky - například,záhlaví
    V některých situacích se k zarovnání použijí jiné značky HTML. Text v centru, například, může být uspořádán pomocí prvku. Jak pohodlná je samostatná značka? Na rozdíl od atributu pracuje s libovolným obsahem, včetně fotografií, videí, blesku apod.

    Záhlaví a titulky

    Systém titulků vám umožňuje vytvořit logickou strukturu obsahu. Když je text rozdělen na sémantické bloky, čtenář je mnohem jednodušší soustředit se a naučit se nové informace. Vyhledávače také analyzují záhlaví, aby pochopili, co vyvolává vyhledávací stránka. To je důvod, proč SEO specialisté doporučují používat tematické klíče v nich.
    V jazyce HTML se používá šest úrovní titulků - od

    do

    . V tomto systému existuje jasná hierarchie:




  • . Hlavní název (název článku, produkt v online obchodu atd.). V textu může být pouze jeden

    . Zpravidla obsahuje hlavní klíč.
  • . Tituly druhé úrovně rozdělují text na sémantické bloky. Například pokud uděláte hodnocení notebooku, můžete udělat několik

    s názvy různých modelů.

  • . Třetí úroveň je požadována, pokud je text mezi dvěma

    rozdělen na malé bloky. V našem příkladu mohou být pro každý model kritéria hodnocení - "Výkon", "Paměť", "Grafická karta" atd.



  • ,

    ,

    . V praxi jsou extrémně vzácné. Ale obecný princip je stejný - musí být "zabudován" do blokupodnadpis nejvyšší úrovně.
  • Sledujte správnou hierarchii. Při návratu k našemu příkladu to znamená, že nemůžete okamžitě zadat jména modelů jako

    nebo

    . A ještě více použijte pro homogenní podkapitoly různých úrovní (řekněme, notebook, který získal poslední místo v žebříčku pomocí

    ).
    Ale zde je schéma, které vám pomůže okamžitě pochopit a zapamatovat si správnou strukturu hlaviček HTML.

    Seznamy

    Všechny výpisy a pokyny se nejlépe provádějí ve formě seznamů pomocí speciálních HTML tagů textu (typická chyba je jen několik odstavců začínajících pomlčkou nebo číslem). Struktura těchto bloků je velmi jednoduchá. Nejprve určit typ seznamu - označený nebo očíslovaný.
    Všechny prvky se nacházejí mezi štítky otevírání a zavírání. Každá položka seznamu začíná novým řádkem a má formát
  • . Počet prvků není omezen.

    Výběr písma: a její atributy

    Co mohu změnit pomocí značky HTML? Velikost textu, písmo a barva - a bez přidání nových tříd CSS. Je velmi výhodné, když potřebujete vybrat pouze jednu větu nebo fragment.
    má několik vlastností:
  • Obličej. Umožňuje změnit písmo textu. Můžete zobrazit několik možností pomocí čárky (Tahoma, Verdana). Pokud uživatel nemá první písmo nainstalováno, systém jednoduše použije alternativu.
  • Velikost. Chcete-li zvýšit nebo snížit text, do uvozovek zadejte hodnotu od 1 do 7.
  • Barva. V závislosti na provedení můžete vybrat jeden ze standardních odstínů (červená, zelená, modrá) nebo zadejte libovolný barevný kód, který si vyberete.
  • Nepoužívejte odstavce naformátované pomocí namísto podkapitol. Je lepší umístit stejné parametry při registraci se správnou značkou.

    Typy výběru textu

    Jednobarevný text je zdlouhavý, dokonce i v odstavcích odstavců. Chcete-li přitáhnout pozornost a zvýšit zájem čtenáře, doporučujeme graficky zvýraznit klíčové body. Zde jsou některé příkazy, které vám pomohou s tímto úkolem zvládnout.
    . Extrémně populární značka HTML. Odvážný text okamžitě zachycuje oko, a proto s jeho pomocí je vhodné zdůraznit důležité teze a fakta. Mnoho značek zaměňuje a. Vizuálně není žádný rozdíl, ale pracují jinak. První jednoduše změní vzhled textu a druhý provede funkci ukazatele a zvýrazní nejdůležitější fragmenty (tématické klíčová slova a fráze pro SEO). . Elegantní a přesná kurzíva je ideální pro navrhování vědeckých pojmů, cizích slov a různých citací. Ve vážných publikacích se jména uměleckých děl rozlišují také šikmým textem. . Zřejmě tolik sporů nezpůsobilo žádné HTML značky. Podtržení textu je zřídka používáno, protože tato metoda přidělování historicky zakořeněných hypertextových odkazů. Pokud používáte články, pamatujte si, že je vhodný pouze pro krátké úryvky - ne více než 1 řádek. . Zajímavá značka, která vám umožňuje překrýt část textu. Velmi relevantní v reklamě - například zdůraznitkontrastu mezi starými a novými cenami. . Nejjednodušší způsob, jak zvýšit velikost písma bez dalších parametrů. . Pracuje na stejném principu jako předchozí značka. Text uvnitř se snižuje vzhledem k hlavnímu textu. . Správným názvem pro tento formát je horní index. V zásadě je tato značka určena pro matematické kroky a poznámky pod čarou. Snižuje velikost písma a posune zvýrazněný text nahoru. . Dolní index se často nachází v různých vzorcích. Vybraný fragment je umístěn pod hlavním textem.

    Semi-kontejnery

    Protože některé bloky byly nalezeny v mnoha textech, začali vytvářet speciální štítky pro ně. Zjednodušuje formátování, protože pokud má každý typ obsahu vlastní sadu stylů, stačí zvýraznit část textu a určit, jaké informace obsahuje.. Značka pro přidání kódů počítače. Nepostradatelné při programování článků s příklady - příkazy se nevykonávají, ale zobrazují se jako prostý text.
    . Určeno pro vytváření citací - například klíčové výňatky z rozhovoru.
    . Přináší kus textu do samostatného bloku. Ve výchozím nastavení má zvýrazněný fragment větší levý okraj, ale v CSS můžete také změnit velikost, styl písma a barvu textu.
    . Další značka obsahující informace o autorech včetně odkazu.

    Oddělovací linka

    Jednoduchým znakem může být logické zakončení velké přepážky. neplatí pro rovnoměrné značky. To znamenákterý uzavírá formátovací prvek není potřeba.
    C šířka atribut separátor může být kratší, tím, že žádá správnou velikost v pixelech nebo procentech šířky okna. Tím, že se učíte, jak správně používat značky pro formátování textu v HTML, můžete nejen číst články snadno číst, ale také zvýšit efektivitu SEO.

    Související publikace