Teksto HTML žymos: derinimas, dydis, šriftas

Kompiuteriai

Atrodo, kodėl jums reikia žinoti teksto HTML žymes, jei dabar beveik bet kurioje admin srityje yra patogus vaizdo redaktorius, kuris juos automatiškai įkelia?

Faktas yra tai, kad svetainės turinio formatavimasvisiškai skiriasi nuo darbo biure. To nepakanka, kad tekstas atrodytų patrauklus, nes teisinga išvaizda priklauso ne tik nuo tinklalapio rodymo, bet ir nuo jo reklamos paieškos sistemose.

HTML žymos ir atributai: sintaksės pagrindai

Bet kokiame tekste yra paslėptas kodas, "paaiškinantis" kompiuteriui, koks ir kaip jis turėtų būti rodomas ekrane. Visa informacija registruojama naudojant universaliųjų elementų rinkinį.

Tiesą sakant, teksto HTML žymos yra komandos, kurios tam tikrus puslapius įtraukia į konkrečius blokus arba keičia jų išvaizdą. Teisingas įrašo formatas:

Teksto HTML žymes

Atkreipkite dėmesį, kad ne visos žymos yra suporuotos. Pavyzdžiui, <BR> (eilutės praleidimas) arba <HR> (pridedant horizontalią liniją) apskritai nereikia uždaryti.

Kodėl negalite kopijuoti straipsnių iš "Word" ir kitų programų į svetainės redaktorių

Nors šias programas naudoja modernios biuro programosTie patys HTML tekstai, 99% atvejų gimtoji kodas netinka tinklalapiams. Net jei dokumentas paprastai rodomas pačioje programoje, formatavimas gali nepavykti įterpti į svetainę. Be to, dėl didelio nereikalingų žymių ir atributų skaičiaus paieškos varikliai negali tinkamai analizuoti puslapio turinio. Tai savo ruožtu apsunkina jūsų išteklių propagavimą.

Norint gauti švarų ir tinkamą kodą, pirmiausia turite išvalyti tekstą iš HTML žymių, kurias sukūrė įprastas redaktorius. Yra keli būdai tai padaryti:

  1. "Vykdyti" straipsnį per "Notepad" ir tik po toši pasta į svetainę. Programa ištrina visus HTML, todėl po to turėsite dar kartą formatuoti tekstą (naudodami redaktoriaus įrankius arba rankiniu būdu).
  2. Rašykite ir paskelbkite straipsnius per "LiveWriter". Populiarus dienoraščio redaktorius iškart sukuria teisingą kodą. Atskirame skirtuke galite pamatyti, kaip atrodys svetainės tekstas.
  3. Naudokite "HTML Cleaner". Ši internetinė paslauga nesunaikina viso kodo, bet tik papildomų fragmentų. Naudodami filtrus, jūs pasirenkate, kurias žymas norite išsaugoti. Taip pat yra galingas vaizdo formato redaktorius, kuris prideda kodo optimizuotas komandas.

Visada patikrinkite HTML prieš paskelbdami naują įrašą. Jame neturėtų būti žymių, išskyrus tas, kurias mes dabar pažvelgsime.

Pastraipos

Šis elementas yra beveik visurstraipsniai. Kiekviena pastraipa turėtų būti tokioje talpykloje - tai supaprastina formatavimą ir leidžia išlaikyti vienodą stilių visuose svetainės puslapiuose. Patogumui žymė <p> visada rašoma iš naujos eilutės.

žymes html tekstas centre

Derinimas

Jau yra atskira HTML žymė "Išlyginti tekstą"ilgai nenaudojamas. Vietoje to buvo sukurtas universalus atributas ALIGN. Norėdami pakeisti teksto bloko poziciją puslapyje, turite pasirinkti vieną iš 3 reikšmių - CENTER, RIGHT arba LEFT. Panašiai galite nustatyti kitų elementų derinimą, pvz., Antraštes.

HTML teksto derinimo žymė

Kai kuriais atvejaiskiti HTML žymes. Pavyzdžiui, tekstas gali būti nustatytas naudojant elementą <CENTER> ... </ CENTER>. Kas yra tinkama atskirai žymei? Skirtingai nuo atributo, jis veikia su bet kokiu turiniu, įskaitant nuotraukas, vaizdo įrašus, blykstę ir tt

Pozicijos ir paantraštės

Pavadinimų sistema leidžia jums sukurti loginįturinio struktūra. Kai tekstas yra padalintas į semantinius blokus, skaitytojui daug lengviau susikaupti ir mokytis naujos informacijos. Paieškos sistemos taip pat analizuoja antraštes, kad suprastų, kokius prašymus reklamuoti puslapį. Štai kodėl SEO ekspertai rekomenduoja naudoti teminius raktus.

html text underline

HTML naudojami šešių subpozicijų lygiai - nuo <H1> iki <H6>. Šioje sistemoje yra aiški hierarchija:

  • <H1> ... </ H1>. Pagrindinis pavadinimas (straipsnio pavadinimas, prekės internetinėje parduotuvėje ir kt.). Tekste gali būti tik vienas <H1>. Kaip taisyklė, jame yra pagrindinis raktas.
  • <H2> ... </ H2>. Antrojo lygio paantraštės pertraukia tekstą į semantinius blokus. Pavyzdžiui, jei jūs vertinate užrašus, galite sukurti keletą <H2> su skirtingų modelių pavadinimais.
  • <H3> ... </ H3>. Trečias lygis yra reikalingas, jei tekstas yra tarpdu <H2> taip pat yra padalintas į mažus blokus. Mūsų pavyzdyje tai gali būti vertinimo kriterijai - "Veikimas", "Atmintis", "Vaizdo plokštė" ir tt kiekvienam modeliui.
  • <H4>, <H5>, <H6>. Praktiškai jie yra labai reti. Tačiau bendrasis principas yra tas pats - jie turi būti "įdėtos" į bloką su aukščiausio lygio subpozicija.

Stebėkite teisingą hierarchiją. Grįžęs prie mūsų pavyzdžio, tai reiškia, kad jūs negalite iškart įvesti modelių pavadinimus kaip <H3> arba <H5>. Dar daugiau, naudokite skirtingų lygių pavadinimus vienodoms prasmių rinkiniams (tarkim, paskirstyti nešiojamąjį kompiuterį, kuris užėmė paskutinę vietą reitinge, naudodami <H6>).

Čia yra schema, kuri padės jums iš karto suprasti ir prisiminti teisingą HTML antraščių struktūrą.

 aiškus tekstas iš html žymes

Sąrašai

Visi sąrašai ir instrukcijos yra geriau suformatuotos kaip sąrašai, kuriuose naudojami specialūs HTML teksto žymeliai (tipinė klaida yra tik keletas <p> pastraipų, prasidedančių simboliu ar skaitmeniu).

Tokių blokų struktūra yra labai paprasta. Pirma, mes nustatome sąrašo tipą, pažymėtą <UL> ... </ UL> arba numeriu <OL> ... </ OL>.

 žymas teksto formatavimui html

Visi elementai yra tarp atidarymo ir uždarymo žymų. Kiekvienas sąrašo elementas prasideda nauja eilute ir yra formatu <LI> ... </ LI>. Elementų skaičius neribojamas.

Šriftų parinkimas: <FONT> ir jo atributai

Ką galiu pakeisti naudojant šią HTML žymę? Teksto dydis, jo šriftas ir spalva - be CSS pridedant naujų klasių. Tai labai patogu, kai reikia pasirinkti tik vieną sakinį ar fragmentą.

html tag bold text

<FONT> turi keletą atributų:

  • Veidas. Leidžia pakeisti teksto šriftą. Galite nurodyti kelias parinktis, atskirtas kableliais (Tahoma, Verdana). Jei vartotojas nėra įdiegęs pirmojo šrifto, sistema tiesiog naudoja alternatyvą.
  • Dydis. Norėdami padidinti arba sumažinti tekstą, nurodykite į kabučių reikšmę nuo 1 iki 7.
  • Spalva. Priklausomai nuo dizaino, galite pasirinkti vieną iš standartinių atspalvių (raudona, žalia, mėlyna) arba įvesti bet kurį spalvų kodą, kurį norite pasirinkti.

Nenaudokite fragmentų su formatu <FONT> vietoj subpozicijų. Geriau nustatyti tuos pačius tinkamos žymos nustatymus.

Teksto pasirinkimo būdai

Monotoniškos teksto padangos, netgi suskirstytos pagalpastraipos. Norint pritraukti dėmesį ir sušildyti skaitytojo susidomėjimą, rekomenduojama išryškinti pagrindinius elementus grafiškai. Štai keletas komandų, kurios padėtų išspręsti šią užduotį.

HTML teksto dydžio žyma

<B> ... </ B>. Labai populiari HTML žyma. Blogas tekstas tuoj pat įstrigo jūsų akimis, todėl naudodamiesi jo pagalba patogu pabrėžti svarbias tezes ir faktus.

Daugelis klaidina <B> ir <strong> žymes. Vizualiai nėra jokio skirtumo, tačiau jie veikia skirtingais būdais. Pirmasis tiesiog pakeičia teksto išvaizdą, antrasis atlieka "rodyklės" funkciją ir pabrėžia svarbiausius fragmentus (teminius raktinius žodžius ir frazes "SEO").

<I> ... </ I>. Idealiai tinka elegantiškas ir griežtas kursyvasmokslo terminų formulavimas, užsienio žodžiai ir įvairios citatos. Rimtuose leidiniuose taip pat išskiriami meno kūrinių pavadinimai.

<U> ... </ U>. Galbūt daugybė ginčų to nepadarėHTML žyma. Teksto pabraukimas retai naudojamas, nes šis paskirstymo metodas istoriškai buvo priskirtas hipersaitus. Jei naudojate <U> straipsniuose, atkreipkite dėmesį, kad tai tinka tik trumpiems fragmentams - ne daugiau kaip 1 eilutė.

<S> ... </ S>. Įdomi žyma, leidžianti dalį teksto padaryti negaliojančia. Labai aktualu reklamoje - pavyzdžiui, pabrėžti kontrastą tarp senų ir naujų kainų.

<BIG> ... </ BIG>. Lengviausias būdas padidinti šrifto dydį be jokių papildomų parametrų.

<SMALL> ... </ SMALL>. Veikia tuo pačiu principu kaip ir ankstesnė žyma. Tekstas viduje yra mažesnis, palyginti su pagrindiniu tekstu.

<SUP> ... </ SUP>. Teisingas šio formato pavadinimas yra viršutinė. Iš esmės ši žyma skirta matematiniams laipsniams ir išnašoms. Tai sumažina šrifto dydį ir pakeičia pasirinktą tekstą.

<SUB> ... </ SUB>. Indeksas dažnai būna įvairių formulių. Pasirinktas fragmentas yra po pagrindiniu tekstu.

Semantiniai konteineriai

Kadangi kai kurie blokai buvo rasti daugelyjetekstai, jie pradėjo kurti specialias žymas. Tai supaprastina formatavimą, nes jei kiekvienam turinio tipui būdingas atskiras stilių rinkinys, pakanka pasirinkti teksto fragmentą ir nurodyti, kokią informaciją ji turi.

<CODE> ... </ CODE>. Žymė pridėti kompiuterio kodus. Tai yra nepakeičiama straipsniuose apie programavimą su pavyzdžiais - komandos nevykdomos, bet rodomos kaip paprastas tekstas.

HTML kodo žyma

<CITE> ... </ CITE>. Ji skirta citatos formulavimui - pavyzdžiui, pagrindiniai ištraukos iš pokalbio.

HTML citata žyma

<BLOCKQUOTE> ... </ BLOCKQUOTE>. Teksto dalis įtraukiama į atskirą bloką. Pagal numatytuosius nustatymus pasirinkimas turi didesnę paraštę kairėje, bet CSS taip pat galite keisti teksto dydį, stilių ir spalvą.

HTML tag BLOCKQUOTE

<ADDRESS> ... </ ADDRESS>. Papildoma žyma, kurioje pateikiama informacija apie autorių, įskaitant nuorodas.

HTML tag ADDRESS

Atskyrimo linija <HR>

Naudojant paprastą juostą, galite pažymėti didelį skyrių loginį pabaigą. <HR> netaikomas suporuotoms žymoms. Tai reiškia, kad formato uždarymo elementas </ ...> nėra būtinas.

Žodis HTML HR (horizontali juosta)

Naudojant atributą WIDTH, galite nustatyti atskyriklio trumpesnį, nurodydami tinkamą dydį pikseliais arba lango pločio procentais.

Mokydamiesi tinkamai naudoti žymas norėdami HTML formatu sudaryti tekstą, jūs ne tik lengviau skaitote savo straipsnius, bet ir padidinsite SEO efektyvumą.