Oletko Blogger? Sitten on hyötyä siitä, että tiedät jonkin HTML-koodin

Hämmentynyt HTML-koodi? Et ole ainoa.


Myönnän sen. Kun aloin kirjoittaa verkkoon, tiesin zilchistä HTML-koodi. Ja tunnustan sen uudelleen. En vieläkään tiedä paljon.

Olen kuitenkin huomannut, että pieni HTML-tietämys voi tehdä asioista paljon helpompaa kirjoitettaessa verkkoon.

oppia hypertekstin merkintäkielen

Toki, en osaa rakentaa verkkosivustoa, mutta tiedän kuinka pieniä komponentteja säätää, ja kun kohtaan muokkausjärjestelmän, joka vaatii HTML-koodia – jonka todennäköisesti törmäät myös – tiedän tarpeeksi muotoilemaan tekstiä oikein.

Haluatko poistaa hämmennyksen ja oppia vähän HTML-koodauksesta? Aloitetaan.

Mikä on HTML-koodi?

Olet nähnyt sen ympärillä, mutta et todennäköisesti tiedä mitä kaikki tämä HTML-pilaantuminen tarkoittaa.

Se tarkoittaa Hypertekstin merkintäkieli. HTML on standardoitu järjestelmä, jota käytetään asiakirjojen muotoiluun. Käytetyt koodit, joita kutsutaan merkintätunnisteiksi, voivat muotoilla fontin, tekstin koon, värin, hyperlinkit, kappaleet ja muut.

Verkkoselaimet lukevat HTML: ää ja käyttävät tunnisteita sisällön näyttämiseen. Esimerkki tunnisteesta on se, joka luo lihavoidun tekstin, joka näyttää tältä:

Tämä on lihavoitu teksti.

Sivulta se näyttää tältä:

Tämä on lihavoitu teksti.

HTML-versioita on ollut monia vuosien varrella, mutta lokakuusta 2014 alkaen HTML5 on verkon standardoitu merkintäkieli.

Miksi Bloggaajien on hyvä tietää

Vaikka saatat saada aikaan tietämättä mitään HTML: tä bloggaajana ja tekemällä sen sijaan vähän huijausta – esimerkiksi käyttää ohjelmaa, joka muuntaa muotoilutesi HTML-kieleksi -, tietämällä pari perustunnistetta voi todella auttaa blogin kirjoittamisessa..

Tässä on joitain tilanteita, joissa olen henkilökohtaisesti pitänyt sitä hyödyllisenä:

  • Vierasblogien kirjoittamisessa jotkut sivustot haluavat kirjoittajasi kirjoittaman HTML-muotoon. Hieman tietäen voit lisätä linkkejä ja kursivointia tarvittaessa.
  •  Kun jokin näyttää siltä, ​​voit katsoa sivun HTML-koodia ja nähdä, mikä aiheuttaa ongelman.
  •  Verkkoyhteydessä voit käyttää HTML-tunnisteita muotoillaksesi blogikirjoituksia ja foorumin kommentteja.
  •  Jos opit tarpeeksi HTML: stä, voit alkaa oppia vähän CSS: stä ja tehdä pieniä muutoksia verkkosivustollesi palkkamatta suunnittelijaa.

Yleiset koodit, joita Bloggaajat käyttävät

Ennen kuin hyppäämme liian syvälle, tiedä, että HTML-tunnisteet ovat hakasulkeisiin merkittyjä avainsanoja. Nämä tunnisteet tulevat pareittain, ja aloitustagin ja lopputunnisteen välinen teksti on mikä vaikuttaa. Lopputunniste on kirjoitettu samalla tavalla kuin aloitustunniste, mutta siinä käytetään viivaa ennen tunnisteen nimeä.

Kuulostaa hämmentävältä? On helpompaa, jos annan pari esimerkkiä. Katsotaanpa joitain yleisiä HTML-tunnisteita, jotka sinun pitäisi tietää bloggaajana.

Luuston merkinnät

Ensin tulee luustotunnisteet. Näitä et välttämättä käytä, mutta se auttaa tuntemaan ne. Nämä tunnisteet luovat perustan asiakirjalle, tästä syystä termi ”luustotunnisteet”. Verkkosivu lukee ne, mutta niitä ei muuteta visuaalisiksi elementeiksi.

Silti on hyvä tietää. Oletko esimerkiksi työskennellyt esimerkiksi ohjelman kanssa, joka pyytää liittämään koodisi verkkosivustosi ”head” -osaan? Voit löytää tämän vähän HTML-tietämillä. Joten tässä on muutama luustotunniste, jotka sinun pitäisi tietää:

  • : Tässä osassa kuvataan HTML-dokumentti.
  •   : Tässä osassa on tietoja asiakirjasta.
  •   : Tämä antaa asiakirjan otsikon.
  •   : Tämä kuvaa visuaalisia sivuelementtejä. Sivun runko-osassa bloggaajat tekevät usein HTML-tarkistuksia tarvittaessa. Loput mainituista tunnisteista löytyvät asiakirjan rungosta.
  •  

    : Tämä tunniste kuvaa kappaleen.

Muista, että sivusi teksti on koteloitu aloitus- ja lopetustunnisteisiin. Tässä on esimerkki:

Tämä on kappaleteksti.

Otsikkotunnisteet

Otsikkotunnisteita käytetään dokumenttien hierarkian näyttämiseen. Olet todennäköisesti jo käyttänyt otsikoita blogin muotoilussa, mutta otsakkeiden 1-6 välinen ero tarkoittaa enemmän kuin pelkkää tekstin kokoa ja fontin painoa. Ne välittävät myös hierarkian tunteen selaimille ja hakukoneiden robotille.

Otsikkoa 1 tulisi käyttää asiakirjan pääotsikossa, kuten blogitekstin otsikossa. Otsikon 2 tulisi olla toissijaisia ​​tietoja, kuten ensisijaiset alaotsikot. Käytä alaotsikoita otsikossa 3 ja niin edelleen otsikon 6 läpi. Nämä tunnisteet näyttävät tältä:

Tässä on esimerkki sen kääntämisestä:

Tämä on otsake 5

Tämä on otsake 5

Sisäiset tekstitunnisteet

Inline-tekstitunnisteet ovat niitä, joita käytät muotoilemaan tekstiä lohkotason tunnisteisiin, kuten

ja

. Tässä on esimerkkejä siitä, mitä käytät yleensä.
  • : Tämä määrittelee korostetun tekstin, joka useimmissa selaimissa kursivoidaan.
  •   : Tämä määrittelee voimakkaasti korostetun tekstin, jonka useimmat selaimet lihavoivat.
  •   : Tämä muodostaa tarjouksen.
  •   : Tämä näyttää poistetun tekstin, joka kääntyy usein tällaisena läpivientina.

Listatunnisteet

Kuten huomasit, olen käyttänyt useita luettelolistoja tässä blogiviestissä. Mutta kuinka tein sen? Tässä on tunnisteet, jotka sinun on tiedettävä:

  • : Tämä määrittelee luetteloelementin.
  •  
      : Tämä tunniste kulkee järjestämättömän luettelon ympäri, joka näytetään luettelona.
    •  
        : Tämä tunniste kiertää tilatun luettelon, joka näytetään numeroina.

    Tässä on esimerkki tilatun luettelon HTML-koodin näyttämisestä:

    1. Listakohta 1
    2. Luettelon kohta 2
    3. Listakohta 3

    Näin se näkyy sivulla:

    1. Listakohta 1
    2.  Luettelon kohta 2
    3.  Listakohta 3

    Kuva- ja linkkitunnisteet

    Katsotaanpa ennen kuin siirrymme eroon, kuinka lisätä kuvia ja linkkejä. Ehkä on helpompaa yksinkertaisesti tarkastella koodia ja täyttää tietosi sitten, kun käytät tunnisteita:

    Linkki

    ANKORI TEKSTI

    Älä poista lainausmerkkejä URL-osoitteesi ympäriltä. Lisää vain URL-osoite lainausmerkkien väliin. Ankkuriteksti on teksti, joka näkyy sivulla.

    Katsotaanpa esimerkkiä. Jos halusin linkittää aiempaan Hosting Kingdom -artikkeliin, koodi näyttää tältä:

    Pitäisikö sinun rekisteröidä verkkotunnus Web-isäntäsi kautta?

    Linkki näyttäisi tältä sivulta:

    Pitäisikö sinun rekisteröidä verkkotunnus Web-isäntäsi kautta?

    Kuva

    Kuvan koodi näyttää tältä:

    Huomaa, että tämä ei ole säilytystagi, joten siinä ei ole lopputunnistetta, mutta tarvitset src-määritteen. Voit lisätä tähän tunnisteeseen lisäominaisuuksia, kuten vaihtoehtoisen tekstin tai kokomäärittelyn. Se näyttää tältä:

    ”YOUR

    Varmista jälleen, että et poista lainausmerkkejä.

    merkintä: Saatat nähdä erilaisia ​​koodeja, joita voidaan käyttää samaan asiaan. Olen esimerkiksi nähnyt , , ja tunnisteita, joita käytetään lihavoimaan tekstiä, vaikka ne voivat näkyä eri tavoin eri selaimissa.

    HTML: n ei tarvitse olla niin hämmentävää kuin miltä se näyttää. Käytä HTML-käytäntöjä ja saat paremman tunteen siitä käyttämällä interaktiivisia sivustoja, kuten Code Academy, ja kerro meille miten se menee kommenttiosassa.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map