Säännöt HTML-dokumenttien rakentamiseen. Luokkien tunnisteet ja nimet. CSS-muotoilusäännöt

Mikä on HTML

Maailmanlaajuinen web World Laaja verkko(WWW) koostuu Web-sivuista, jotka on luotu käyttämällä niin kutsuttua merkintäkieltä HTML hyperteksti(Hypertekstin merkintäkieli). Vaikka monet ihmiset puhuvat ohjelmoinnista tällä kielellä, HTML ei ole ohjelmointikieli perinteisessä merkityksessä. HTML on asiakirjankuvauskieli. HTML-dokumenttia kehitettäessä tehdään merkintä tekstiasiakirja aivan kuten editori tekee punaisella kynällä. Nämä merkit osoittavat, missä muodossa asiakirjan sisältämät tiedot esitetään.

Erityisiä HTML-dokumenttien katseluohjelmia, joita usein kutsutaan selaimiksi, käytetään tulkitsemaan sääntöjen mukaan merkittyjä tiedostoja HTML-kieli, muotoilemalla ne Web-sivuiksi ja näyttämällä niiden sisällön käyttäjän tietokoneen näytöllä. Olemassa suuri määrä eri yritysten kehittämät selainohjelmat, mutta nykyään koko ohjelmien joukosta erottuu selvästi kaksi johtavaa ohjelmaa - Netscape Communicator ja Microsoft Internet Explorer.

Netscape Navigatorin on kehittänyt Netscape Communications Corporation. Kuten moni ohjelmistotuotteita, tästä ohjelmasta on useita versioita. Netscape Communicatorin uusin versio kirjoitushetkellä oli versio 4.7. Internet-ohjelma Explorerin on kehittänyt Microsoft. Uusin versio tämä ohjelma on 5.0.

Muut selaimet ovat suosiossa paljon jäljessä. Useita vuosia sitten Netscapen selain oli johtavassa asemassa selainten joukossa, ja yli kaksi kolmasosaa käyttäjistä käytti juuri tätä selainta. Kun vapautat selaimesi, Microsoft yritys on tehnyt suuria ponnisteluja valloittaakseen tämän osan markkinoista. Keinoin joukkotiedotusvälineet usein

Selainten välisestä sodasta on raportoitu käyttäjiä kohtaan. Nyt näiden kahden selaimen suosio on vertailukelpoinen. Microsoft-selaimen kasvavaa suosiota edesauttaa selaimen sisällyttäminen käyttöjärjestelmään Windows-järjestelmät 98, selaimen valinta on kuitenkin viime kädessä käyttäjän päätettävissä.

Nykyaikaisissa selaimissa on laajat mahdollisuudet, mutta heille tärkeintä on HTML-sääntöjen mukaan merkittyjen asiakirjojen tulkinta. Tämä kirja on omistettu pääasiassa näiden sääntöjen kuvaukselle. Ensimmäisessä osassa tarkastellaan vain HTML-dokumenttien rakentamisen perusperiaatteita.

Ymmärtääksemme, mikä merkintäkieli on, muistetaan vanhoja hyviä aikoja, jolloin monet työskentelivät WordStarin kaltaisten tekstieditorien kanssa. Niissä lauseen korostamiseksi, esimerkiksi lihavoituna, sen alkuun ja loppuun sijoitettiin erityisiä merkkejä (/B ja /b):

/B Tämä teksti näytetään lihavoituna/b

Tulostettaessa tällaista tekstiä tulostuslaitteeseen (ei puhuta vielä näytöistä, noina kaukaisina aikoina niitä joko ei ollut ollenkaan tai oli aakkosnumeerisia näyttöjä, jotka eivät sallineet fonttien vaihtamista), symbolit / in pakotettiin käyttämään lihavointia. fonttia, kunnes merkit /b kohtaavat.

HTML toimii täsmälleen samalla tavalla. Jos on tarpeen korostaa tekstiä näytöllä lihavoituna, tämä voidaan tehdä samalla tavalla:

Tämä teksti näkyy lihavoituna

Symbolit lihavoittuvat ja symbolit sammuttavat sen. Tällaisia ​​merkkejä, jotka ohjaavat tekstin näyttämistä ja joita ei itse näy näytöllä, kutsutaan yleensä HTML-kielellä tunnisteiksi (englannin sanasta tag - label, sign).

Kaikki HTML-kielitunnisteet on erotettu erotinmerkeillä (< и >), jonka väliin kirjoitetaan tagin tunniste (nimi) (esimerkissämme se on), ja mahdollisesti sen parametrit. Ainoa poikkeus tästä säännöstä on kommenttitunnisteet, joissa on monimutkaisemmat erottimet (). Tunnisteiden nimet sekä niiden parametrit voidaan kirjoittaa mihin tahansa rekisteriin. Johdonmukaisuuden vuoksi useimmat tämän kirjan tunnisteet on kirjoitettu isoilla kirjaimilla.

Suurin osa HTML-tunnisteet käytetään pareittain, eli tietylle tunnisteelle, sanotaanko sitä avaukseksi, dokumentissa on vastaava päättävä tagi. Tekijä: HTML-säännöt Lopputunniste kirjoitetaan samalla tavalla kuin aloitustunniste, mutta / (vinoviiva) tagin nimen eteen. Ainoa perustavanlaatuinen ero parillisten tunnisteiden välillä on se, että sulkevat tagit eivät käytä parametreja.

Tunnisteita, jotka vaativat vastaavat lopputunnisteet, kutsutaan säilötunnisteiksi. Kutsumme kaikkea, mikä on kirjoitettu vastaavien avaus- ja sulkemistunnisteiden väliin, konttitunnisteen sisällöksi. Joskus lopputunniste voidaan jättää pois. Esimerkiksi tagille, joka kuvaa taulukon solun tietoja , vastaava lopetustunniste Aina voi jättää väliin. Taulukon solun tietojen loppu tunnistetaan seuraavan tunnisteen ilmestymisestä tai taulukon rivin lopputunniste.

Useimmat asiakirjan tekijät jättävät pois useiden tunnisteiden lopputunnisteet. Esimerkki olisi luettelokohteen tunniste

  • tai kappaletunniste

    Nykyaikaiset selaimet muotoilevat asiakirjat monissa tapauksissa oikein, jos jotkin lopputunnisteet jätetään pois, mutta tätä käytäntöä ei voi suositella.

    Jotkut tagit eivät vaadi lopputunnisteita ollenkaan. Esimerkkejä ovat kuvan lisäystunniste , pakotettu rivinsyöttö
    , perusfontin merkintä jne. Usein tunnisteen tarkoituksen perusteella voit arvata, tarvitseeko se lopullisen fontin.

    On olemassa yleisiä sääntöjä, joilla selaimet tulkitsevat tunnisteita. Toisin kuin ohjelmointikielissä, joissa virheelliset lausunnot johtavat vastaavien sanomien antamiseen ohjelman käännösvaiheessa ja vaativat muokkausta, HTML:ssä ei ole tapana reagoida virheellisiin tunnistemerkintöihin. Väärin kirjoitettu tunniste tai sen parametri tulisi yksinkertaisesti jättää selaimen huomiotta. Tämä on yleinen sääntö kaikille selaimille, ja se ei koske vain virheellisesti kirjoitettuja tunnisteita, vaan myös tunnisteita, joita tämä selaimen versio ei tunnista. Esimerkkinä voisivat olla tunnisteet, jotka on ehdotettu ja otettu käyttöön tietylle selaimelle ja tuntemattomia toiselle. Esimerkiksi säilötunniste, jonka tehtävänä on tarjota vaihtoehtoista tietoa Selaimet, jotka eivät tue kehysrakenteita, eivät tunnista selainta. Kehyksiä tukeva selain ohittaa kaikki sen sisältämät tiedot, kun se kohtaa tunnisteen. Ja selain, joka ei tunne kehyksiä, ei luonnollisesti ymmärrä tunnistetta. Yllä olevan säännön mukaan tämä tunniste kuitenkin yksinkertaisesti ohitetaan, mutta kaikki myöhemmät tiedot näytetään.

    Tunnisteet voidaan kirjoittaa parametrien tai attribuuttien avulla (englanniksi attribuutti). Tässä kirjassa käytämme useimmiten termiä parametri. Sarjat hyväksyttävät parametrit ovat yksilöllisiä jokaiselle tunnisteelle. Yleiset säännöt Parametrien merkinnät ovat seuraavat. Tunnisteen nimen perässä voi olla parametreja välilyönnillä erotettuna. Tunnisteparametrien järjestys on mielivaltainen. Monet parametrit vaativat arvojen määrittämistä, mutta joillakin parametreilla ei ole arvoja tai ne voidaan kirjoittaa ilman niitä, ottamalla oletusarvot. Jos parametri vaatii arvon, se ilmoitetaan parametrin nimen jälkeen yhtäläisyysmerkillä. Parametrin arvo voidaan kirjoittaa lainausmerkkeihin tai ilman niitä. Ainoa tapaus, jossa et tule toimeen ilman lainausmerkkejä, on silloin, kun parametrin arvossa on välilyöntejä. Parametriarvoissa (toisin kuin tunnisteiden nimissä ja parametreissa) kirjainkoko on joskus tärkeä. Tässä on esimerkki tunnistemerkinnästä, jossa on parametrit:

    Tässä tagia varten

    kaksi parametria on määritetty. Ensimmäinen BORDER-parametri määritetty ilman arvoa. Jäljelle jää toinen ALIGN-parametri.

    Kirjan ensimmäisen osan seuraavissa luvuissa kuvataan HTML-kielitunnisteiden tarkoitus ja parametrit. Yleensä tunnisteilla voi olla erilaisia ​​parametreja, on kuitenkin useita parametreja, jotka ovat samat lähes kaikille tunnisteille. Mainitaan tässä Yleiset parametrit-tunnisteet, jotta niistä ei enää puhuta kutakin tunnistetta kuvattaessa.

    Kaikilla tunnisteilla, joita voidaan käyttää HTML-dokumentin osiossa, voivat olla parametrit LUOKKA, ID, LANG, LANGUAGE, STYLE ja TITLE. Näiden parametrien käyttäminen on hyödyllistä ensisijaisesti silloin, kun tyylinen suunnittelu asiakirjoja, joista keskustellaan kirjan toisessa osassa.

    CLASS-, ID-, STYLE-parametreja tukee Internet Explorer versiosta 3.0 alkaen ja Netscape versiosta 4.0 alkaen. Näitä parametreja tarvitaan tyylejä käytettäessä.

    Parametreja LANG, LANGUAGE, TITLE tukee vain Internet Explorer versiosta 4.0 alkaen. Nämä parametrit osoittavat vastaavasti käytetyn kielen (esimerkiksi Venäjälle: LANG=ru), skriptien kirjoituskielen (esimerkiksi LANGUAGE=JavaScript) sekä työkaluvihjeen tekstin, joka näytetään, kun viet hiiren osoitinta. yli tämä elementti(TITLE).

    Nykyaikaisessa HTML:ssä HTML-lähdekoodiin kirjoitetaan kielitunnisteiden ja niiden sisällön lisäksi myös komentosarjakoodeja (javascript tai VBScript). Kirjan ensimmäisessä osassa tätä tuskin mainitaan missään, mutta toinen osa on kokonaan omistettu käsikirjoitusten käytölle.

    Täydennetään yleinen arvostelu HTML, huomaa, että yksinkertaisimmat HTML-asiakirjat ovat tavallisia tekstitiedostoja, tarkastella ja muokata, jota voit käyttää mitä tahansa tekstieditori. Näillä tiedostoilla on yleensä tunniste HTM tai HTML.

    HTML-määritykset

    HTML-kieli nousi suosioon 90-luvun puolivälissä Internetin räjähdysmäisen kasvun ansiosta. Tähän mennessä kieli oli tarpeen standardoida, koska useat Internet-yhteyttä varten ohjelmistoja kehittäneet yritykset tarjosivat omaa

    vaihtoehtoja HTML-ohjeet, joiden määrä kasvoi ja kasvoi. On tullut aika päästä jonkinlaiseen yhtenäiseen sopimukseen HTML-kielitunnisteiden käytöstä.

    HTML-määrittelyn luomista vastasi organisaatio nimeltä World Wide Web Consortium (lyhennetty W3C). Hänen tehtävänsä oli laatia heijastava erittely moderni taso kielivalmiuksien kehittäminen ottaen huomioon selainkehitysyritysten erilaiset ehdotukset. Niinpä marraskuussa 1995 ilmestyi HTML 2.0 -spesifikaatio, jonka tarkoituksena oli virallistaa vuoden 1994 loppuun mennessä kehitetty HTML:n käyttökäytäntö.

    Eritelmien hyväksymisjärjestelmä on seuraava. W3C-konsortio julkaisee spesifikaatioluonnoksen, josta keskusteltuaan julkaisee niin sanotun luonnosversion spesifikaatiosta ja tarjoaa sen keskusteluun osoitteessa tietty ajanjakso. Tietyn keskustelun jälkeen spesifikaation työversiosta voi tulla suositus eli virallisesti hyväksytty versio HTML-spesifikaatiosta.

    Pian sen jälkeen, kun 2.0-spesifikaatio julkaistiin toimiva versio spesifikaatio 3.0, jonka kommentointiaika päättyi syyskuussa 1995. Tätä eritelmää ei koskaan hyväksytty virallisena suosituksena. Se suunniteltiin sisältävän laajan valikoiman tunnisteita ja ominaisuuksia yksittäisiä selaimia W3C Consortium ei kuitenkaan ole löytänyt tapaa kehittää hyvää spesifikaatiota sellaiselle suuri numero ohjeet.

    Pitkän harkinnan jälkeen HTML 3.2 julkaistiin toukokuussa 1996. Projekti perustui joihinkin versiossa 3.0 saatavilla oleviin tageihin, jotka osoittivat toiminnan vakautta. Useita kuukausia kestäneen keskustelun jälkeen versiosta 3.2 tuli ehdotettu spesifikaatio syyskuussa 1996 ja virallinen suositus tammikuussa 1997.

    Heinäkuussa 1997 julkaistiin ehdotettu HTML 4.0 -spesifikaatio, josta tuli virallinen suositus joulukuussa 1997. Tämä on viimeisin hyväksytty spesifikaatio tähän mennessä.

    Seuraavassa lyhyt yleiskatsaus HTML-kielen kehityshistoriaa tuskin kannattaa kuvailla yksityiskohtaisesti erilaisten spesifikaatioiden piirteitä, varsinkin kun tosielämässä kehittäjät eivät aina noudata konsortion suosituksia. Pannaan merkille vain joitain ideoita, jotka ovat viimeisimmän spesifikaation taustalla.

    HTML 4.0 -spesifikaatiossa keskeisenä ajatuksena oli erottaa dokumentin rakenteen kuvaus sen esittelyn kuvauksesta näyttöruudulla. Kokemus on osoittanut, että dokumenttien rakenteen ja esityksen erottaminen alentaa erilaisten alustojen, ympäristöjen jne. tukemisen kustannuksia ja helpottaa myös asiakirjojen tarkistamista. Tämän ajatuksen mukaisesti esitysten kuvausmenetelmiä tulisi käyttää laajemmin.

    asiakirjan tyylisivuilla sen sijaan, että määrittäisivät tiettyjä esitystietoja asiakirjan sisällön välissä. Tämän idean toteuttamiseksi HTML 4.0 -spesifikaatiossa on poistettu useita tunnisteita, joilla määritetään suoraan HTML-elementtien esitysmuoto. Tästä syystä peruutettuja tunnisteita ovat , , , , , . Muiden peruutettujen tunnisteiden joukossa huomaamme , , , . Peruutettujen tunnisteiden sijaan niitä tarjotaan vaihtoehtoisia vaihtoehtoja sopivien mahdollisuuksien toteuttaminen, joihin kiinnitämme tässä kirjassa erityistä huomiota.

    Vanhentuneen tunnisteen käsite on seuraava. Jos tunniste on vanhentunut tässä kielimäärityksessä, se tarkoittaa, että selainten tulisi jatkaa tällaisten tunnisteiden tukemista toistaiseksi, mutta niiden käyttöä ei suositella. Tulevissa määrityksissä nämä tunnisteet saattavat vanhentua. Selaimet eivät ehkä enää tue vanhentuneita tageja. HTML 4.0 -määrityksessä vain kolme tunnistetta on poistettu käytöstä: , JA . Tietoja siitä, mitkä tunnisteet sisältyvät eritelmään, on saatavissa liitteessä A1 olevasta taulukosta.

    Virallista tietoa HTML-spesifikaatiosta voi aina saada W3C:n web-sivustolta osoitteesta http://www.w3.org/TR/. Specification 4.0 löytyy osoitteesta http://www.w3.org/TR/REC-htmI40-971218.

    Huomaa, että loogisesti virallisten määritelmien tulisi toimia ohjaavana ja ohjaavana voimana varmistaen, että tiedot esitetään samalla tavalla eri selaimissa. Tämä on ihanteellinen vaihtoehto tavoitella. Todellisuudessa asiat eivät ole niin hyvin. Jatkuvasti esiintyvä uusia ideoita, jonka kehitysyhtiöt ovat ottaneet käyttöön selaimissaan ja joita he mainostavat. Onnistuneet ideat juurtuvat, ja sitten muut kehittäjät ottavat ne käyttöön. Jotkut ominaisuudet pysyvät yksittäisen selaimen mukaan. Onnistuneet mallit päätyvät lopulta spesifikaatioon ja niistä tulee yleisesti hyväksyttyjä. Siten selaimen ominaisuuksien parantaminen ja spesifikaatioiden selkeyttäminen on käynnissä ja vaikuttavat toisiinsa.

    Asiakirjan rakenne

    Ensimmäinen tunniste, joka alkaa kuvailla HTML-dokumentteja, on . Hänen on aina aloitettava asiakirjan kuvaus, ja tunnisteen tulee täydentää asiakirjan kuvausta. Nämä tagit osoittavat että niiden väliset viivat edustavat yhtä HTML-asiakirjaa. Itse asiakirja on tavallinen ASCII-tekstitiedosto. Ilman näitä tunnisteita selain tai muu katseluohjelma ei välttämättä pysty tunnistamaan asiakirjan muotoa ja tulkitsemaan sitä oikein.

    Useimmiten tunnistetta käytetään ilman parametreja. SISÄÄN aiemmat versiot VERSION-parametria käytettiin, ja se on vanhentunut HTML 4.0 -määrityksen mukaan. Tämä parametri on korvattu tagilla.

    Suurin osa nykyaikaiset selaimet osaa tunnistaa asiakirjan, joka ei sisällä tunnisteita, mutta silti niiden käyttö on erittäin toivottavaa.

    Itse asiakirja sijaitsee tunnisteiden välissä. Asiakirja voi koostua kahdesta osasta - otsikko-osasta (alkaa tunnisteella) ja asiakirjan sisältöosasta (alkaa tunnisteella). Kehysrakenteita kuvaavissa asiakirjoissa käytetään FRAMESET-osiota (tunnisteella) BODY-osan sijaan. Seuraavaksi tarkastelemme asiakirjan HEAD- ja BODY-osien laatimissääntöjä. Kehyksiä sisältävien asiakirjojen rakentamista käsitellään luvussa 5.

    HEAD-asiakirjaosio

    Asiakirjan HEAD-osio määrittää sen otsikon, eikä se ole pakollinen tunniste, mutta hyvin kirjoitettu otsikko voi olla varsin hyödyllinen. Otsikon tarkoitus on esitellä tarvittavat tiedot ohjelmalle, joka tulkitsee asiakirjan. HEAD-osion sisällä olevia tunnisteita (paitsi tunnisteen kuvaamaa asiakirjan otsikkoa) ei näytetä näytöllä.

    Otsikkoosio avautuu tunnisteella . Tyypillisesti tämä tagi tulee välittömästi -merkin jälkeen. Lopputunniste osoittaa tämän osion lopun. Mainittujen tunnisteiden välissä ovat otsikkoosion muut tagit.

    Asiakirjan nimi

    Säilön tunniste on ainoa vaadittu päätunniste, ja se antaa asiakirjalle otsikon. Se näkyy yleensä selainikkunan otsikkorivillä. Tunnistetta ei pidä sekoittaa asiakirjan tiedostonimeen; päinvastoin, se edustaa tekstimerkkijono, täysin riippumaton tiedoston nimestä ja sijainnista, mikä tekee siitä varsin hyödyllisen. Tiedoston nimi on tarkasti määritelty käyttöjärjestelmä tietokone, johon se on tallennettu. Sinun tulee myös erottaa asiakirjan otsikko (tunnisteella) asiakirjan otsikoista, jotka on yleensä merkitty tunnisteilla.

    Huomautus

    Asiakirjan pakollinen otsikko on yleisesti ottaen vahvan suosituksen luonne. Selaimet näyttävät myös asiakirjan ilman tunnistetta. Jossa erilaisia ​​selaimia näkyy ikkunan otsikona erilaisia ​​tietoja. Niin varhaiset versiot Netscape-selain näytti rivin "Ei otsikkoa". Muut selaimet joko eivät näytä mitään tai näyttävät ladatun tiedoston osoitteen toistaen selaimen Sijainti-paneelin tiedot.

    Asiakirjan otsikko kirjoitetaan tunnisteiden väliin ja on tekstirivi. Periaatteessa nimi voi olla rajoittamaton ja sisältää mitä tahansa merkkejä lukuun ottamatta joitain varattuja merkkejä. Käytännössä kannattaa rajoittua yhdelle riville pitäen mielessä, että nimi näkyy selainikkunan otsikkorivillä. Sinun tulee myös muistaa, mitä asiakirjan otsikosta jää jäljelle, kun pienennät selainikkunaa. Asiakirjan otsikon pituus on suositeltavaa rajoittaa 60 merkkiin. Voit nähdä, kuinka otsikko näkyy selainikkunassa missä tahansa tämän kirjan kuvassa, joka antaa esimerkin asiakirjan esittämisestä.

    Oletuksena teksti, joka sisältyy asiakirjan otsikko, jota käytetään luotaessa asiakirjalle kirjanmerkki. Siksi, jos haluat enemmän tietoa, vältä kasvottomia nimiä (kotisivu, hakemisto jne.). Sellaiset kirjanmerkkien nimissä käytetyt sanat ovat yleensä täysin hyödyttömiä. Asiakirjan otsikon tulee kuvata lyhyesti sen sisältöä. Huomaa, että kun näytät asiakirjoja runkorakenne, kun jokaiseen kehykseen ladataan erillinen dokumentti omalla nimellä, vain pääasiakirjan nimi näkyy näytöllä. Aseta kuitenkin nimi yksittäisiä asiakirjoja, joka on suunniteltu ladattavaksi kehyksiin, on myös erittäin suositeltavaa. Tätä asiaa käsitellään tarkemmin luvussa 5.

    Asiakirjan otsikon tärkeys määräytyy seuraavan tosiasian perusteella. Koska tunniste sijaitsee melkein HTML-tiedoston alussa, se näkyy ensimmäisenä, kun asiakirja alkaa latautua. Seuraavaksi asiakirjan pääsisältö ladataan ja selain aloittaa asiakirjan muotoilun ikkunassa. Tämä prosessi voi yleisesti ottaen kestää kauan dokumentin sisällöstä ja rakenteesta sekä yhteyden nopeudesta riippuen. Käyttäjä pohtii melko pitkään tyhjää näyttöä, jonka ainoa informatiivinen rivi on asiakirjan otsikko. Melko usein (jos yhteys katkeaa tai jos käyttäjä ei halua odottaa dokumentin latautumista) kaikki asiakirjaa koskevat tiedot päättyvät siihen.

    Suhde muihin asiakirjoihin

    Usein HTML-dokumentit ovat yhteydessä toisiinsa, eli niillä on linkkejä toisiinsa. Linkit voivat olla absoluuttisia tai suhteellisia. Molemmissa on haittoja. Absoluuttiset linkit voi olla liian hankalaa ja lakata toimimasta, jos hierarkiassa alempi asiakirja siirretään. Suhteellisia linkkejä on helpompi syöttää ja päivittää, mutta myös tämä linkki katkeaa, jos hierarkiassa ylempänä oleva dokumentti siirretään. Molemmat yhteydet voivat katketa ​​siirrettäessä asiakirjaa tietokoneesta toiseen.

    Usein käy niin, että käyttäjä on ladannut suuren asiakirjan koneelleen ja katkaissut yhteyden verkkoon tutkiakseen sitä yksityiskohtaisesti. Kaikki asiakirjan paikallisen kopion linkit lakkaavat toimimasta. Jos haluat "elävöittää" ne, sinun on palattava alkuperäiseen asiakirjaan, joka sijaitsee etätietokoneessa.

    Onneksi HTML-kehittäjät ennakoivat tämän ongelman ja lisäsivät kaksi tunnistetta ja , jotka sisältyvät otsikkoon varmistaakseen, ettei asiakirjojen välinen yhteys katkea.

    Tag

    Tunnistetta käytetään osoittamaan asiakirjan koko perus-URL-osoite. Hänen avullaan suhteellinen linkki jatkaa toimintaansa, jos asiakirja siirretään toiseen hakemistoon tai jopa toiseen tietokoneeseen. Tunniste toimii samalla tavalla kuin MS-DOS-polkukomento, jonka avulla katsoja voi määrittää linkin etsimääsi asiakirjaan, vaikka se olisi hierarkiassa ylempänä olevassa dokumentissa, joka sijaitsee toisella tietokoneella.

    Tunnisteella on yksi pakollinen HREF-parametri, jota seuraa asiakirjan koko URL-osoite. Alla on esimerkki tagin käytöstä.

    Huomautus perusosoite

    Tunniste kertoo selaimelle, mistä tiedostoa etsitään. Jos käyttäjä työskentelee tiedoston paikallisen kopion parissa eikä hänen koneensa ole irrotettu verkosta, Uutiskuvake löytyy ja näytetään selainikkunassa.

    Tag

    Vaikka tunnisteen avulla voit löytää tiedoston, kysymys asiakirjojen välisestä suhteesta jää avoimeksi. Näiden suhteiden merkitys kasvaa asiakirjojen monimutkaisuuden kasvaessa. Jotta looginen yhteys säilyisi niiden välillä, tunniste lisätään HTML:ään.

    Tunniste ilmaisee tunnisteen sisältävän asiakirjan ja toisen asiakirjan tai objektin välisen suhteen. Se koostuu URL-osoitteesta ja parametreista, jotka määrittävät asiakirjasuhteet. Asiakirjan otsikko voi sisältää minkä tahansa määrän tunnisteita. Pöytä 1.1 kuvaa tagiparametrit ja niiden toiminnot.

    Taulukko 1.1. Tunnistevaihtoehdot

    Tässä on esimerkkejä tunnisteista, joissa on parametrit:

    Ensimmäinen rivi osoittaa linkin asiakirjan sisällysluettelotiedostoon (toc.html - sisällysluettelo), jolla on suora sisältösuhde. Toinen rivi kuvaa suhdetta asiakirjan tekijän URL-osoitteeseen (käänteisellä suhteella).

    Asiakirjojen välillä voi olla monia erilaisia ​​suhteita. Esimerkkejä muista REL-parametriarvoista: kirjanmerkki, tekijänoikeus, sanasto, ohje, etusivu, hakemisto, toc, seuraava, edellinen. REV-parametrilla voi olla myös seuraavat arvot: tekijä, toimittaja, julkaisija, omistaja.

    Tag

    Uusien hypertekstikuvauskielimäärittelyjen kehittäminen kestää kauan, ja tänä aikana selainyritykset onnistuvat julkaisemaan useita versioita tuotteistaan. Tästä syystä head-osioon voidaan lisätä toinen tunniste, jotta asiakirjan tekijät voivat tunnistaa ei-HTML-tiedot.

    Selain käyttää näitä tietoja toimiin, joita nykyinen HTML-määritys ei kata. Et tarvitse tunnistetta ensimmäisten HTML-asiakirjojen luomiseen, mutta todennäköisesti tarvitset sitä, kun sivuistasi tulee monimutkaisempia.

    Esimerkki:

    Netscape Navigator- ja Internet Explorer -selaimet tulkitsevat tämän merkinnän ohjeeksi odottaa 60 sekuntia ja ladata sitten uusi asiakirja. Tätä ohjetta käytetään usein asiakirjojen sijaintia muuttaessa. Pieni asiakirja, jossa on annettu merkkijono, voidaan jättää dokumentin vanhaan paikkaan linkittääkseen automaattisesti sen uuteen sijaintiin.

    Seuraava rivi:

    kehottaa selainta lataamaan sivun uudelleen 60 sekunnin välein. Tästä voi olla hyötyä, jos sivun tietoja päivitetään usein, esimerkiksi kun seurataan osakekursseja.

    Elementin käytöstä joidenkin tyypillisten ongelmien ratkaisemiseen on tullut erittäin suosittua. Esimerkkinä voisi olla hakukoneiden käyttämien avainsanojen määrittäminen. Tämän menetelmän avulla voit sisällyttää asiakirjahakemistoon muita sanoja, joita ei välttämättä sisälly nimenomaisesti sen sisältöön. Tätä varten tunnisteessa määritetään tietyn ominaisuuden nimi parametrin NAME arvoksi. Ja käyttämällä CONTENT-parametria tämän ominaisuuden arvo määritetään, esimerkiksi:

    HTML-spesifikaatio ei määritä mitään erityisiä nimiä kirjoitetuille ominaisuuksille. On kuitenkin olemassa useita yleisesti käytettyjä ominaisuuksia, kuten kuvaus, avainsanat, kirjoittaja, robotit jne.:

    Annetut tunnisteet voitaisiin hyvin osoittaa esimerkiksi tämän kirjan sähköiselle versiolle.

    Tunnisteella voi olla taulukossa määritetyt parametrit. 1.2.

    Taulukko 1.2. Tunnistevaihtoehdot

    Toinen tunnisteen tärkeä tarkoitus on osoittaa tekstin koodaus. Joten venäjänkieliselle tekstille Windows-koodauksessa sinun on kirjoitettava seuraava rivi:

    Muut otsikkoelementit

    Asiakirjan otsikkoosassa voi olla vielä kaksi tunnistetta - ja . Niiden tarkoitus liittyy tyylisivujen käyttöön dokumentissa ja skriptien kirjoittamiseen. Näitä kysymyksiä käsitellään yksityiskohtaisesti kirjan toisessa osassa.

    Asiakirjan osa BODY

    Tämä asiakirjan osa sisältää sen sisällön. Suurin osa myöhemmin tässä luvussa käsitellyistä tunnisteista ja myöhemmistä tunnisteista tulee sijaita tässä asiakirjan osassa. Tässä tarkastellaan vain joitain yleisiä kysymyksiä.

    Asiakirjan BODY-osion tulee alkaa tunnisteella ja päättyä tagiin, jonka väliin tämän osion koko sisältö sijaitsee. Tarkkaan ottaen näiden tunnisteiden läsnäoloa ei vaadita, koska selaimet voivat määrittää asiakirjan sisällön alun kontekstin perusteella. Niiden käyttö on kuitenkin suositeltavaa.

    Tunnisteella on useita parametreja, joista mitään ei vaadita. Parametriluettelo on esitetty taulukossa. 1.3.

    Taulukko 1.3. Luettelo tunnisteparametreista

    Parametri

    Tarkoitus

    LINKKI

    TAUSTA

    Osoittaa taustana käytetyn kuvan URL-osoitteeseen

    ALAMAARJA

    Asettaa asiakirjan alamarginaalin reunuksen pikseleinä.

    BGCOLOR

    Määrittää asiakirjan taustavärin

    BGPROPERTIES

    Kun asetuksena on FIXED, taustakuvaa ei rullata

    VASEN MARGINAALI

    Asettaa asiakirjan vasemman marginaalin pikseleinä.

    LINKKI

    Määrittää linkin värin, jota ei ole vielä katsottu

    OIKEA MARGIN

    Asettaa asiakirjan oikean reunuksen pikseleinä.

    SCROLL

    Asettaa vierityspalkkien läsnäolon tai puuttumisen selainikkunassa

    TEKSTI

    Määrittää tekstin värin

    TOPMARGIN

    Asettaa asiakirjan ylämarginaalin reunuksen pikseleinä.

    VLINK

    Määrittää jo katsotun linkin värin

    Asiakirjan taustan määrittävien BACKGROUND- ja BGCOLOR-parametrien käyttöä käsitellään yksityiskohtaisesti kohdassa.

    Vain selain tukee BGPROPERTIES-parametria, joka hyväksyy yhden arvon FIXED Microsoft Internet Tutkimusmatkailija.

    Vain Microsoft Internet Explorerin versio 4.0 ja uudemmat tunnistavat parametrit BOTTOMMARGIN, LEFTMARGIN, RIGHTMARGIN ja TOPMARGIN, jotka määrittävät tekstin reunojen ja vastaavien ikkunan reunojen välisen etäisyyden pikseleinä, sekä SCROLL-parametrin.

    ALINK-, LINK-, TEXT- ja VLINK-parametrit määrittävät linkkien ja asiakirjatekstin värit.

    HTML:ssä värit määritellään heksadesimaaliluvuilla. Värijärjestelmä perustuu kolmeen pääväriin - punaiseen, vihreään ja siniseen - ja on nimetty RGB:ksi. Jokaiselle värille annetaan heksadesimaaliarvo, joka vaihtelee välillä 00 - FF, joka vastaa desimaalialuetta 0-255. Nämä arvot yhdistetään sitten yhdeksi numeroksi, jota edeltää #-symboli. Esimerkiksi numero #800080 edustaa violettia väriä. Jotta et muista lukujoukkoja, voit käyttää värien nimiä, jotka on annettu liitteessä P2. Selainten varhaiset versiot tunnistivat vain 16 vakiovärin nimet, jotka on merkitty sovelluksessa tähdellä. Selainten nykyaikaiset versiot tunnistavat kaikki 140 värinimeä.

    Tekstin muotoilu

    Tässä osiossa tarkastellaan mahdollisuuksia muotoilla yksittäisiä merkkejä asiakirjan tekstissä.

    Lohkotason tagit ja peräkkäiset tunnisteet

    Joitakin BODY-osiossa mahdollisesti esiintyviä HTML-tageja kutsutaan lohkotason tageiksi, kun taas toisia kutsutaan tekstitason tageiksi, vaikka tämä tagien jako tasot ovat jossain määrin mielivaltaisia.

    Erona HTML-tunnisteiden tasojen välillä on se, että lohkotason tagit voivat sisältää peräkkäisiä tageja ja muita lohkotason tageja, kun taas peräkkäiset tagit sisältävät vain dataa ja muita peräkkäisiä tunnisteita. Lohkotunnisteet kuvaavat suurempia asiakirjarakenteita kuin peräkkäiset tunnisteet.

    Oletuksena tämäntyyppiset tunnisteet sijoitetaan eri tavalla kuvaustekstiin: lohkotason tagit alkavat uudelta riviltä, ​​kun taas peräkkäiset tagit eivät.

    Looginen ja fyysinen muotoilu

    HTML-dokumenttien tekstin muotoilua varten tarjotaan koko joukko tunnisteita, jotka voidaan jakaa loogisiin ja fyysisiin muotoilutageihin.

    Loogiset muotoilutunnisteet ilmaisevat (nimistillään) niiden tekstiosien rakennetyypit, kuten ohjelmakoodi (tunniste), lainaus (tag), lyhenne (tunniste) jne. (katso näiden ja muiden vastaavien tunnisteiden kuvaukset seuraavassa osiossa ). Tunnisteiden ja avulla voit esimerkiksi merkitä yksittäisiä fragmentteja korostetuiksi tai voimakkaasti korostetuiksi. Huomaa, että puhumme rakenteellisesta merkinnästä, joka ei vaikuta selaimen fragmentin näyttöön. Siksi tällaista merkintää kutsutaan loogiseksi. Selaimet näyttävät oletusarvoisesti loogisia muotoiltuja katkelmia näytöllä tietyllä tavalla. Näyttötyypillä ei ole mitään tekemistä fragmentin rakennetyypin (eli loogisen muotoilutunnisteen nimen) kanssa, mutta se voidaan helposti ohittaa.

    Fyysiset muotoilutunnisteet määrittävät muodon, jolla niissä määritellyt tekstifragmentit näytetään selainikkunassa (asiakirjan tekijän mieltymysten mukaan). Jos haluat esimerkiksi näyttää katkelman kursiivilla, voit käyttää kursivoitutunnistetta . Tämä ja muut yleisesti käytetyt fyysiset muotoilutunnisteet kuvataan myöhemmin tämän luvun "Fyysisen tekstin muotoilutunnisteet" -osiossa.

    HTML-dokumenttien kehittäjien välillä on jo pitkään käyty keskustelua yhden tai toisen lähestymistavan eduista ja haitoista. HTML 4.0 -määrityksen julkaisun myötä tämä keskustelu päättyi loogisen muotoilun käytölle, kun julistettiin periaate asiakirjan rakenteen erottamisesta sen esittämisestä. Todellakin, vain loogisen muotoilun pohjalta voidaan joustavasti ohjata dokumentin esitystapaa nykyaikaisilla menetelmillä (tyylisivujen, dynaamisesti muuttuvien asiakirjojen jne. perusteella).

    Fyysistä muotoilua voidaan kuitenkin tällä hetkellä käyttää vapaasti. HTML 4.0 -spesifikaatio poisti käytöstä joitakin fyysisiä muotoilutunnisteita, mutta kaikki selaimet tukevat niitä edelleen. Huomaa, että kaikki selaimet eivät tunnista kaikkia loogisia muotoilutunnisteita, jotka on suunniteltu korvaamaan yksittäisiä fyysisiä muotoilutunnisteita, mikä tekee niiden käytöstä erittäin hankalaa. Esimerkkinä on looginen tunniste, jota suositellaan käytettäväksi fyysisen tunnisteen sijaan.

    Alla käsitellyt tunnisteet liittyvät tekstitason tunnisteisiin, eli ne on suunniteltu pääasiassa merkitsemään pieniä merkkiryhmiä. Jotkut tagit voivat myös määrittää merkinnän lohkotasolla.

    Loogiset tekstin muotoilutunnisteet

    Tag

    Tunniste merkitsee tekstinsä lyhenteenä (ABBReviation). Vaikka tämä tunniste sisältyy HTML 4.0 -määritykseen, mikään selain ei tue sitä tällä hetkellä.

    Tag

    Tag. Aivan kuten tunnistetta, sitä käytetään merkitsemään lyhenteitä. Tätä tagia suositellaan käytettäväksi niin sanottujen lyhenteiden eli lyhenteistä koostuvien puhuttujen sanojen merkitsemiseen. Tunnistetta voidaan jatkossa käyttää elementtien ei-visuaaliseen esittämiseen, esimerkiksi puhesynteesissä.

    Tätä tunnistetta on kätevä käyttää yhdessä TITLE-parametrin kanssa, jonka arvoksi voit määrittää lyhenteen täyden muodon. Sitten visuaaliset selaimet näyttävät koko nimen työkaluvihjeenä, kun viet hiiren osoittimen tunnisteella merkityn tekstin päälle.

    Huomaa, että vain Microsoft Internet Explorer -selain tunnistaa tunnisteen. Esimerkki:

    SPbGITMO - yksi Pietarin johtavista teknisistä yliopistoista

    Tag

    Tunnisteella merkitään lainaukset tai kirjojen ja artikkeleiden otsikot, linkit muihin lähteisiin jne. Selaimet näyttävät tällaisen tekstin yleensä kursiivilla. Esimerkki:

    Nevskoe Vremya on yksi Pietarin suosituimmista kaupunkilehdistä

    Tag

    Tunniste merkitsee tekstinsä pieneksi osaksi ohjelmakoodia. Näytetään yleensä monospace-fontilla. Tätä tunnistetta ei pidä sekoittaa lohkotason elementtitunnisteeseen, jota tulisi käyttää suurten koodipalojen (listausten) merkitsemiseen.

    Esimerkiksi:

    Esimerkki C-ohjelmointikielen yksinkertaisimmasta operaattorista:

    puts("Hei, maailma!");

    Tunnisteiden käytössä on toinen ero ja Ohjelmakoodissa useiden peräkkäisten välilyöntien läsnäolo on usein tärkeää. Niiden näyttö tallennetaan vain tunnistetta käytettäessä.

    Tag

    Tunniste merkitsee tekstinsä poistetuksi. Tämä elementti on hyödyllinen dokumenttiin versiosta toiseen tehtyjen muutosten merkitsemiseen. Tunnistetta voidaan käyttää tekstitason elementtinä ja lohkotason elementtinä.

    Tunnisteella on kaksi valinnaista parametria: CITE ja DATETIME. CITE-parametrin arvon on oltava URL-osoite asiakirjaan, joka selittää, miksi fragmentti poistettiin.

    Parametri DATETIME määrittää poistopäivämäärän muodossa: VVVV-KK-PPThh:mm:ssTZD, joka määrittää poiston vuoden, kuukauden, päivän, tunnit, minuutit ja sekunnit sekä aikavyöhykkeen (aikavyöhyke). Esimerkiksi:

    Viimeisin hyväksytty HTML-kuvauskielen määritys on versio 3.2 4.0

    Merkitty teksti näytetään yleensä yliviivattuna tekstinä. HTML 4.0 -spesifikaatio antaa tälle tunnisteen etusijalle fyysisen muotoilutunnisteen tai tunnisteen sijaan, joka tarkoittaa yliviivattua tekstiä. Kuitenkin tag

    Tag

    Tunniste merkitsee tekstifragmenttinsa määritelmäksi (DeFinitionN). Tällä tunnisteella voidaan esimerkiksi merkitä termi, kun se esiintyy tekstissä ensimmäistä kertaa. Esimerkki:

    Internet Explorer on suosittu verkkoselain

    Tunnistetta tukee vain Microsoft Internet Explorer. Näytetään oletuksena kursiivilla.

    Tag

    Tunniste merkitsee tekstinsä lisäyksellä (INSertion). Tämä elementti on hyödyllinen dokumenttiin versiosta toiseen tehtyjen muutosten merkitsemiseen. Tunnistetta voidaan käyttää tekstitason elementtinä ja lohkotason elementtinä.

    Tunnisteella on kaksi valinnaista parametria: CITE ja DATETIME. CITE-parametrin arvon tulee olla URL-osoite asiakirjaan, joka selittää lisäysten yksityiskohdat.

    Parametri DATETIME määrittää lisäyspäivämäärän muodossa: VVVV-KK-PPThh:mm:ssTZD, joka määrittää lisäyksen vuoden, kuukauden, päivän, tunnin, minuutit ja sekunnit sekä aikavyöhykkeen (aikavyöhyke).

    Teksti, jossa on merkintä, näytetään yleensä alleviivattuna tekstinä. Tällä hetkellä vain Microsoft Internet Explorer tunnistaa tunnisteen.

    Tag

    Tunnisteella (EMphasis - korostus, alleviivaus) korostetaan tärkeitä tekstinpätkiä. Selaimet näyttävät tämän tekstin yleensä kursiivilla. Esimerkki:

    Esimerkki yksittäisten tekstin sanojen korostamisesta

    .

    Tag

    Tunniste merkitsee tekstin käyttäjän syöttämäksi näppäimistöltä. Näytetään tyypillisesti monospace-fontilla, esimerkiksi:

    Käynnistä tekstieditori kirjoittamalla: notepad

    Tämän tunnisteen käyttö on parempi kuin fyysisen muotoilutunnisteen käyttö.

    Tag

    Tunniste merkitsee lyhyitä lainausmerkkejä tekstirivillä. Toisin kuin lohkotason tunniste, näyttö ei erota merkittyä tekstiä tyhjillä riveillä. Näytetään yleensä kursiivilla. Tunnisteen (toisin kuin ) tunnistaa tällä hetkellä vain Microsoft Internet Explorer.

    Tagissa on CITE-parametri, jonka arvo voi olla lainauksen lähde.

    Tag

    Tunniste merkitsee tekstin näytteeksi (SAMPle). Tämän tunnisteen yleinen käyttö on ohjelmien tekstitulosteen merkitseminen (näytetuloste). Sitä käytetään myös korostamaan useita merkkejä monospace-fontissa.

    Tämän tunnisteen käyttö on parempi kuin fyysisen muotoilutunnisteen käyttö. Esimerkiksi:

    Ohjelman toiminnan seurauksena tulostetaan seuraavaa: Hei, maailma! .

    Tag

    Tunnisteella korostetaan yleensä tärkeitä tekstinpätkiä. Selaimet näyttävät tämän tekstin yleensä lihavoituna. Esimerkki:

    Pietari sijaitsee Suomenlahden itäisimmässä kärjessä Nevajoen suulla< /STRONG>

    Tämän tunnisteen käyttö on parempi kuin fyysisen muotoilutunnisteen käyttö. Tunniste merkitsee yleensä tärkeämpiä tekstinpätkiä kuin tunnisteella merkityt.

    Tag

    Tunniste merkitsee ohjelman muuttujien nimet. Yleensä tämä teksti näytetään kursiivilla. Esimerkki:

    Aseta muuttujan N arvo

    Kuvassa on näyttö joistakin esimerkeistä, jotka on annettu kuvattaessa loogisia tekstin muotoilutunnisteita. 1.1. Kuvassa näkyy, kuinka kun viet hiiren osoittimen tunnisteella merkityn tekstin päälle, näkyviin tulee työkaluvihje.

    Riisi. 1.1. Esimerkkejä tekstin muotoilusta

    Olet luultavasti huomannut, että jotkut elementit antavat saman tuloksen. Lisäksi jotkin elementit eivät välttämättä muuta tekstin esitystapaa näytöllä millään tavalla. Voi herää oikeutettu kysymys: miksi niin monenlaisia ​​muotoiluelementtejä luotiin?

    Vastaus on tämän elementtiryhmän nimessä. Ne on suunniteltu asettamaan loogisia painotuksia, korostamaan loogisia osia ja korostamaan väitteiden olemusta. Niiden käyttö on erittäin merkityksellistä, koska luultavasti lähitulevaisuudessa selainten ominaisuudet lisääntyvät, esimerkiksi on mahdollista etsiä viittauksia verkosta, ja ehkä seuraavan sukupolven selaimet oppivat lukemaan asiakirjoja ääneen. Lisäksi mikään ei estä nykyään tyylisivuja käyttäviä asiakirjojen tekijöitä asettamasta haluttua näyttöä millekään tunnisteelle ohittaen oletusarvot.

    Fyysiset tekstin muotoilutunnisteet

    Tässä on kuvaus fyysisen muotoilun tunnisteista. Joitakin niistä ei suositella käytettäväksi HTML 4.0 -määrityksen mukaan edellä mainituista syistä. HTML 4.0 -spesifikaatio on poistanut jotkin tunnisteet käytöstä, mutta selaimet tukevat niitä edelleen.

    Tag

    Tunniste näyttää tekstin lihavoituna. Useimmissa tapauksissa on suositeltavaa käyttää loogista muotoilutagia tagin sijaan. Esimerkiksi:

    Tämä on lihavoitu fontti.

    Riisi. 1.2. Esimerkkejä fyysisestä tekstin muotoilusta (Netscape-selain)

    Tag

    Tag näyttää tekstin kursiivilla. Useimmissa tapauksissa on suositeltavaa käyttää , tai -tunnisteita tämän tunnisteen sijaan, koska jälkimmäinen kuvastaa paremmin valitun tekstin tarkoitusta. Esimerkiksi:

    Valinta kursivoitu

    Tag

    Tunniste näyttää tekstin monospace-fontilla. Useimmissa tapauksissa on parempi käyttää , tai -tunnisteita tämän tunnisteen sijaan. Esimerkki:

    Tämä on monospace-fontti.

    Tag

    Tag näyttää tekstin alleviivattuna. Peruutettu tunniste. Sen sijaan on suositeltavaa käyttää tai -tageja. Esimerkiksi:

    Esimerkki alaviivat teksti

    Tunnisteet ja

    Tunnisteet näyttävät tekstin vaakaviivalla sen läpi. Peruutettu tunniste. Tunnistetta tulee käyttää sen sijaan. Esimerkiksi:

    Esimerkki yliviivatusta tekstistä.

    Tällä hetkellä kaikki selaimet eivät tue tunnistetta, joten toistaiseksi on suositeltavaa käyttää sitä yhdessä tagin kanssa. Nimittäin säilötunnisteen sisään voi laittaa pari tagia

    ... .

    Tag

    Tunniste näyttää tekstin suuremmalla fontilla (kuin koodaamaton osa tekstistä). Tämän elementin sijasta on parempi käyttää otsikkotunnisteita, esim.

    Suurempi fonttikoko.

    Tag

    Tunniste näyttää tekstin pienemmällä kirjasinkoolla. Koska HTML:ssä ei ole tunnistetta, joka olisi päinvastainen kuin tagi, tunnistetta voidaan käyttää näihin tarkoituksiin. Useimmat selaimet tukevat sisäkkäisiä tunnisteita, mutta tätä lähestymistapaa ei suositella. Esimerkiksi:

    Pienempi fonttikoko.

    Tag

    Tunniste siirtää tekstiä rivitason alapuolelle ja näyttää sen (jos mahdollista) pienemmällä kirjasinkoolla. Kätevä käyttää matemaattisille indekseille. Esimerkiksi:

    Esimerkki fontista alaindeksille.

    Tag

    Tunniste siirtää tekstin rivitason yläpuolelle ja näyttää sen (jos mahdollista) pienemmällä kirjasinkoolla. Kätevä käyttää numeroiden potenssien määrittämiseen matematiikassa. Esimerkiksi:

    Esimerkki fontista yläindeksille.

    Tag

    Tunniste näyttää vilkkuvaa tekstiä. Tämä tunniste ei ole osa HTML-spesifikaatiota, ja sitä tukee vain Netscape-selain. Kokeneet kehittäjät käyttävät harvoin tätä tunnistetta, koska vilkkuvien merkkien esiintyminen sivulla ärsyttää monia käyttäjiä.

    Tag

    Säilötunniste on analoginen lohkotason tagin kanssa. Voidaan käyttää, kun haluat merkitä tekstin sen ominaisuuksien määrittämiseksi, eikä muita rakenteellisia muotoilutunnisteita voi käyttää.

    Microsoft Internet Explorer -selain mahdollistaa lisäksi seuraavien tunnisteparametrien käytön: DIR, DATAFLD, DATAFORMATAS, DATASRC. Parametrien kuvaus löytyy kirjan toisesta osasta.

    Riisi. 1.3. Sisäkkäisten tekstin muotoilutunnisteiden käyttö

    Muotoilutunnisteet voidaan upottaa toistensa sisään. Tässä tapauksessa sinun on varmistettava huolellisesti, että yksi säiliö sijaitsee kokonaan toisessa astiassa. Kuvassa Kuvassa 1.3 on esimerkki kursivoitun elementin sijoittamisesta lihavoituun elementtiin. Käytössä on seuraava HTML-koodin fragmentti:

    Tämä on lihavoitu fontti.

    Tämä kursivoitu.

    Ja tässä on teksti lihavoitu ja kursivoitu

    Tag

    Tunniste määrittää fonttiparametrit. Se viittaa tekstitason fyysisiin muotoilutunnisteisiin.

    Fonttiparametrien määrittäminen suoraan dokumenttitekstissä rikkoo perusajatusta dokumentin sisällön erottamisesta ja dokumentin esitysmuodon kuvauksesta. Siksi HTML 4.0 -määrittelyssä tämä tunniste, samoin kuin tagi, luokitellaan peruutetuiksi. Niiden jatkokäyttöä ei suositella.

    Näistä hirveistä varoituksista huolimatta näyttää siltä, ​​että fyysistä muotoilua voidaan pitää hyväksyttävänä yksinkertaisimmille asiakirjoille. Lisäksi helpoin tapa aloittaa muotoilun perusteiden oppiminen on elementtimuotojen suoran määrittämisen säännöillä. Aloittelevan kehittäjän on vielä kasvattava tyylisuunnitteluun.

    Tunniste viittaa peräkkäisiin elementteihin, eikä se siksi voi sisältää lohkotason elementtejä, esim.

    Tai

    .

    Tagille voidaan asettaa seuraavat parametrit: FACE, SIZE ja COLOR. Huomaa, että Netscape-selain sallii myös kahden lisäparametrin käytön: POINT-SIZE ja WEIGHT, joiden kuvaus on jätetty pois.

      KASVOT

      FACE-parametria käytetään määrittämään fontin tyyppi, jolla käyttäjän katseluohjelma näyttää tekstiä (jos tällainen fontti on saatavilla tietokoneessa). Tämän parametrin arvo on fontin nimi, jonka on oltava täsmälleen sama kuin käyttäjällä olevan fontin nimi. Jos tällaista fonttia ei löydy, tämä ohje ohitetaan ja käytetään oletusfonttia.

      Voit määrittää yhden tai useamman kirjasimen nimen erottamalla ne pilkuilla. Tämä on erittäin hyödyllinen ominaisuus, koska eri järjestelmissä voi olla lähes identtisiä fontteja eri nimillä. Toinen tärkeä ominaisuus on määrittää fonttien käyttöasetukset. Fonttiluettelo skannataan vasemmalta oikealle. Jos käyttäjän tietokoneessa ei ole luettelon ensimmäistä fonttia, yritetään löytää seuraava fontti ja niin edelleen.

      Tässä on esimerkki FACE-parametrin käytöstä:

      Fonttien tarkoitus


      Esimerkki fontin nimen määrittämisestä.

      Kuvassa Kuva 1.4 näyttää kuinka Netscape-selain näyttää esimerkin. Esimerkissä Verdana-fontti on merkitty ensisijaiseksi fontiksi, jos sitä ei ole, käytetään Arial-fonttia jne.

    Riisi. 1.4. Netscape-selaimen esimerkkinäyttö

      KOKO

      Tätä parametria käytetään kirjasinkokojen määrittämiseen mielivaltaisina yksiköinä 1–7. Tietty fonttikoko riippuu käyttämästäsi katseluohjelmasta. On yleisesti hyväksyttyä, että "normaali" fonttikoko vastaa arvoa 3.

    Oletusfonttikoon asetukset sekä absoluuttisen kirjasinkoon muutoksen määrä vaihtelevat selaimen välillä. Kuvassa Kuva 1.5 näyttää Netscape-selainasetusikkunan, jossa asetetaan oletusfontit.

    Fonttikoko ilmoitetaan sekä absoluuttisena arvona (SIZE=2) että suhteellisena arvona (SIZE=+1). Jälkimmäistä menetelmää käytetään usein yhdessä perusfonttikoon asettamisen kanssa käyttämällä .

    Huomautus

    Fonttikokoja määritettäessä merkinnät, kuten "2" ja "+2" (toisin kuin useimmat ohjelmointikielet, joissa yksipuolinen "+"-merkki voidaan jättää pois) antavat olennaisesti erilaisia ​​tuloksia.

    Tässä on esimerkki, joka käyttää erilaisia ​​menetelmiä kirjasinkokojen määrittämiseen. Esimerkkinäyttö näkyy kuvassa. 1.6.


    Riisi. 1.5. Netscape-selaimen fonttiasetusikkuna


    Riisi. 1.6. Kirjasinkokojen määrittäminen

    Kirjasinkokojen määrittäminen

    Fonttikoko 1

    Fonttikoko 2

    Fonttikoko 3

    Fonttikoko 4

    Fonttikoko 5

    Fonttikoko 6

    Fonttikoko 7

      VÄRI

      Tämä asetus määrittää fontin värin, joka voidaan määrittää käyttämällä vakionimiä tai #RRGGBB-muodossa. Tässä on esimerkki asiakirjasta, jossa on moniväristä tekstiä.

      Fontin värin valinta

      Vihreä teksti

      Punainen teksti

    Tag

    Tunnistetta käytetään osoittamaan asiakirjassa käytetyn oletusfontin koko, tyyppi ja väri. Nämä arvot vaaditaan koko asiakirjalle, mutta ne voidaan ohittaa tarpeellisissa paikoissa tunnisteen avulla. Sulkevan tagin jälkeen tagin vaikutus palautetaan. Oletusfonttiasetukset voidaan ohittaa useita kertoja asiakirjassa, mikä tarkoittaa, että tunniste voi esiintyä asiakirjassa kuinka monta kertaa tahansa.

    Huomautus

    Tunniste voi näkyä myös asiakirjan osassa.

    Huomaa, että tagilla ei ole sulkevaa tunnistetta.

    Parametrit voivat olla täsmälleen samat kuin tagilla, nimittäin: FACE, SIZE ja COLOR. Parametrien kirjoittamisen tarkoitus ja säännöt ovat samanlaiset.

    Huomautus

    Netscape-selain ei salli FACE tag -parametria.

    Otetaan esimerkki tagin käytöstä.

    Kirjasinkokojen määrittäminen

    Oletusfontilla kirjoitettu teksti.

    Fonttikoko 2.

    Fonttikoko 4.

    Teksti taulukon solun sisällä

    Teksti taulukon perään

    Yllä oleva esimerkki ohittaa oletuskirjasinkoon kahdesti. Aluksi se on 3 (oletus). Sitten se asetetaan arvoon 2, sitten 4. Kiinnitä huomiota tämän esimerkin näyttöön (kuva 1.7). Voidaan nähdä, että tunnisteen määritys ei toimi taulukoissa. Tämä on tyypillistä monille selaimille, vaikka se rikkoo muodollisesti tunnisteen käyttöä.


    Riisi. 1.7. Näytetään esimerkki TAG:lla (Netscape-selain)

    HTML-asiakirjan muotoilu

    Jakaminen kappaleisiin

    Kaikella tekstillä, olipa se sitten koulun essee, huomautus sanomalehdessä tai tekninen kuvaus laitteesta, on tietty rakenne. Tällaisen rakenteen elementtejä ovat otsikot, alaotsikot, taulukot, kappaleet jne.

    Yksi ensimmäisistä säännöistä melkein minkä tahansa asiakirjan laatimisessa on jakaa sen teksti erillisiin kappaleisiin, jotka ilmaisevat täydellisen ajatuksen. HTML-dokumentit eivät ole poikkeus tästä säännöstä. Kun luot asiakirjoja tekstieditoreilla, jako kappaleisiin tapahtuu syöttämällä rivinvaihtomerkki. Useimmat editorit toteuttavat tämän, kun painat näppäintä. HTML-dokumenteissa rivinvaihto ei luo uutta kappaletta.

    HTML olettaa, että dokumentin kirjoittaja ei tiedä mitään lukijan tietokoneesta. Lukijalla on oikeus asettaa minkä tahansa ikkunan koko ja käyttää mitä tahansa käytettävissään olevia fontteja. Tämä tarkoittaa, että se, missä riviviiva esiintyy, määräytyy yksinomaan katsojan ja loppukäyttäjän asetuksista. Koska alkuperäisen asiakirjan rivinsiirrot ohitetaan, teksti, joka näyttää hyvältä asiakirjan tekijän muokkausikkunassa, voi muuttua kiinteäksi, lukukelvottomaksi tekstiksi katseluikkunassa.

    Voit välttää tämän ongelman käyttämällä erityistä kappalejakotunnistetta.

    Ennen jokaisen tekstikappaleen alkua sinun tulee sijoittaa tunniste

    Sulkeva tagi

    ei vaadittu. Selaimet erottavat kappaleet yleensä tyhjällä rivillä.

    Huomautus

    Selaimet tulkitsevat yleensä useita kappaletunnisteita peräkkäin

    Yhtenä. Sama koskee rivinvaihtotunnistetta
    . Siksi ei ole mahdollista luoda useita tyhjiä rivejä käyttämällä näitä tunnisteita.

    Tag

    Voidaan määrittää vaakakohdistusparametrilla ALIGN. Mahdolliset parametriarvot on annettu taulukossa. 1.4. Oletusasetus on kohdistus vasemmalle.

    Taulukko 1.4. ALIGN Parametrien arvot

    ALIGN-parametrin arvo

    Toiminta

    VASEN

    Tasaa teksti selainikkunan vasempaan reunaan

    KESKUSTA

    Kohdista selainikkunan keskelle

    OIKEIN

    Kohdista selainikkunan oikeaan reunaan

    PERUSTELLA

    Perustelut (molemmilla puolilla)

    Huomaa, että selaimet eivät ole tukeneet tasausta (ALIGN = JUSTIFY) pitkään aikaan. Monet HTML-kielikuvaukset määrittelevät vain kolme vaihtoehtoa kohdistusparametriarvoille (VASEN, KESKUS ja OIKEA). Tällä hetkellä kaikki suositut selaimet voivat suorittaa leveyden kohdistuksen. Joitakin perusteltujen asiakirjojen luomiseen liittyviä ongelmia käsitellään myös luvussa 8.

    Huomautus

    Perusteen puute tuntuu tällä hetkellä yllättävältä. Tätä tilaa käytetään hyvin usein painetuissa julkaisuissa. Riittää, kun nostat minkä tahansa sanomalehden tai katsot tarkasti tämän kirjan kappaleita - ne ovat kaikki kohdakkain leveyssuunnassa. Viime aikoihin asti HTML-dokumenttien perustelut eivät kuitenkaan olleet sallittuja. Vain pari vuotta sitten missään selaimessa ei ollut tällaista tilaa. Näin ollen lukijat, jotka edelleen käyttävät Netscape-selaimen versiota 3.x, eivät näe suoria viivoja dokumentissa. Voit yrittää ennustaa, mitä muita ominaisuuksia selaimilla on tulevaisuudessa, vertaamalla tehokkaiden tekstieditorien ja nykyaikaisten selainten ominaisuuksia. Esimerkki ominaisuuksista, joita ei ole vielä otettu käyttöön, olisi automaattinen tavutus jne.

    Rivikäännös

    Kun tekstidokumentteja näytetään selaimessa, rivinvaihtojen sijainti kappaleessa määritetään automaattisesti fonttien koon ja katseluikkunan koon mukaan. Rivinvaihdot voidaan tehdä vain käyttämällä sanaerotinmerkkejä (esimerkiksi välilyöntejä). Joskus asiakirjoissa on asetettava pakotettu rivinsyöttö, joka toteutetaan selaimen asetuksista riippumatta. Tämä tehdään pakotetun rivinsyöttötunnisteen avulla.
    , jolla ei ole vastaavaa lopputunnistetta. Tunnisteen käyttöönotto
    asiakirjan tekstiin varmistaa, että seuraava teksti sijoitetaan uuden rivin alkuun. Tätä lähestymistapaa voidaan käyttää esimerkiksi luettelotyyppisten rakenteiden luomiseen ilman erityisiä luettelomerkintätageja. Tai esimerkiksi tällä tunnisteella ei voi näyttää runoja jne.

    Tässä on esimerkki pakotetun rivinsiirron käytöstä (kuva 1.8):

    Pakotetun rivinsiirron käyttö

    Pimeän Petrogradin yli

    Marraskuu hengitti syksyn kylmyyttä.

    Roiskuminen meluisa aalto

    Hoikkasi aitasi reunoihin,

    Neva heitteli ympäriinsä kuin sairas ihminen

    Levoton sängyssäni.

    A.S. Pushkin. Pronssi ratsastaja


    Riisi. 1.8. Tag
    voidaan käyttää rivinsiirron pakottamiseen

    Toisin kuin kappaletunniste

    Tunnistetta käytettäessä
    tyhjää merkkijonoa ei luoda.

    Tunnisteen käyttäminen
    vaatii varovaisuutta - on mahdollista, että selain on jo tehnyt rivinvaihdon yhden tai kaksi sanaa ennen kuin se kohtasi tagisi
    . Näin tapahtuu, jos lukijan katseluikkunan leveys on pienempi kuin sen ohjelman asetus, jolla testasit asiakirjaa. Tässä tapauksessa voi käydä niin, että vain yksi sana jää riville keskellä kappaletta, mikä pilaa asiakirjan asettelun kauneuden.

    Huomautus

    Tunnistetta käytettäessä
    Jos haluat katkaista tekstin kuvan tai taulukon ympärille, voit asettaa CLEAR-parametrin lopettamaan tekstin rivityksen. Voit lukea tästä luvuista 3 ja 4.

    Tunnisteet u

    On tilanteita, joissa sinun on suoritettava päinvastainen toimenpide - poista rivinsyöttö käytöstä. Tätä varten on konttitunniste. Tällä tunnisteella merkitty teksti on taatusti yhdellä rivillä sen pituudesta riippumatta. Jos tuloksena oleva viiva ulottuu selaimen katseluikkunan ulkopuolelle, näkyviin tulee vaakasuuntainen vierityspalkki.

    Huomautus

    Taulukon soluissa olevan tekstin jatkuvuuden varmistamiseksi on olemassa erityinen NOWRAP-tunnisteen parametri . Saat lisätietoja tästä luvusta 4.

    Merkitsemällä tekstiä katkeamattoman rivin tunnisteella saat erittäin pitkiä rivejä. Tämän välttämiseksi voit ilmoittaa lukijan selaimelle mahdollisen rivinsiirron sijainnin, joka suoritetaan vain tarvittaessa (ns. "pehmeä" rivinsyöttö). Tämä voidaan tehdä asettamalla tunniste (Word BReak) oikeaan paikkaan tekstissä, joka on sama kuin tagi
    , ei tarvitse sulkevaa tunnistetta.

    Huomautus

    Netscape-selain ei tue tunnistetta ollenkaan. Microsoft Internet Explorer -selain tunnistaa tämän tunnisteen vain tunnisteilla merkityssä tekstissä.

    Otsikot HTML-dokumentin sisällä

    Web-sivu voi käyttää koko asiakirjan otsikon lisäksi otsikoita asiakirjan yksittäisille osille. Näillä otsikoilla voi olla kuusi eri tasoa (kokoa), ja ne ovat tekstinpätkiä, jotka erottuvat näytöstä, kun selain näyttää sivun.

    Tunnisteita , , , ja käytetään otsikoiden merkitsemiseen. Nämä tunnisteet vaativat vastaavan sulkevan tagin. Otsikko 1 on suurin (ylitason otsikko) ja otsikko 6 on pienin. Otsikkotunnisteet ovat lohkotason elementtejä, joten niitä ei voida käyttää yksittäisten tekstin sanojen merkitsemiseen niiden koon kasvattamiseksi. Otsikkotunnisteet lisäävät tyhjän rivin ennen ja jälkeen otsikon, joten kappaleita tai rivinvaihtotunnisteita ei tarvita.

    Otsikkotunnisteet voidaan määrittää vaakakohdistusparametrilla ALIGN. Parametrin mahdolliset arvot ovat samat kuin kappaletunnisteen tasausparametrit

    (katso taulukko 1.4).

    Esimerkki eritasoisten otsikoiden käytöstä eri kohdistuksilla (kuva 1.9):

    Esimerkkejä otsikoista

    Otsikon koko 1

    Otsikon koko 2

    Otsikon koko 3

    Otsikon koko 4

    Otsikon koko 5

    Otsikon koko 6

    Asiakirjan runko


    Riisi. 1.9. Näytä otsikot eri kokoisina

    Vaakasuuntaiset linjat

    Toinen tapa jakaa asiakirja osiin on piirtää vaakasuoria viivoja. Ne korostavat visuaalisesti sivun tietyn alueen täydellisyyttä. Nykyään käytetään usein kohotettua, puristettua viivaa osoittamaan asiakirjan "volubility".

    Tunnisteen avulla voit piirtää kohotetun vaakaviivan useimpien katseluohjelmien ikkunaan. Tämä tagi ei ole säilö, joten se ei vaadi sulkevaa tunnistetta. Tyhjä rivi lisätään automaattisesti rivin eteen ja jälkeen. Tunnisteparametrit on esitetty taulukossa. 1.5.

    Taulukko 1.5. Tunnistevaihtoehdot

    Esimerkki:

    Tämä esimerkki asettaa vaakaviivan, joka vie puolet näkymän leveydestä ja on sijoitettu ikkunan keskelle. Huomaa, että kohdistusvaihtoehdot ovat järkeviä vain, kun viiva ei peitä ikkunan koko leveyttä.

    Huomautus

    Netscape-selain ei salli COLOR-tunnisteparametria.

    Käytä esimuotoiltua tekstiä

    Kuten yllä olevista osioista näet, erityisiä tunnisteita tulisi käyttää tekstin jakamiseen kappaleiksi ja rivinvaihdon pakottamiseksi. Joskus on kuitenkin tarpeen sisällyttää tekstiä HTML-dokumenttiin, joka on jo muotoiltu perinteisellä tavalla rivienvaihdolla, tarvittavalla määrällä välilyöntejä, sarkainmerkkejä jne. Tällaisten ongelmien ratkaisemiseksi tarjotaan erityinen säilötunniste. Esimuotoillun (n uudelleen muotoillun) tekstin määrittäminen.

    Tunnisteella merkitty teksti näytetään sellaisena kuin se näyttää tavallisessa tekstieditorissa. Näytössä käytetään aina yksivälistä fonttia. Tämä antaa sinulle enemmän hallintaa asiakirjan katseluohjelman tulostukseen, vaikkakin joustavuuden kustannuksella.

    Yksi tämän tagin käyttövaihtoehdoista on taulukot, jotka on rakennettu ilman erityisiä taulukon merkintätageja. Muut tärkeät

    Sovelluksen tarkoituksena on näyttää suuria ohjelmakoodilohkoja (Java, C++ jne.) näytöllä, mikä estää selainta alustamasta niitä uudelleen.

    Säilön sisällä oleva teksti Voi sisältää tekstitason muotoilua lukuun ottamatta seuraavia: , , , , , , , , . Ei ole hyväksyttävää sisällyttää esimuotoiltuun tekstiin lohkotason muotoiluelementtejä, kuten otsikkotunnisteita. Kappaletunnisteen ei loogisesti pitäisi myöskään esiintyä esimuotoillun tekstin sisällä, mutta jos esiintyy, se toteuttaa uuden rivin siirtymisen (luomatta tyhjää).

    Huomautus

    Tunnisteella on valinnainen WIDTH-parametri, jonka tarkoituksena on kertoa selaimelle valmiiksi muotoillun tekstirivin enimmäispituus. Tästä arvosta riippuen selain voi valita halutun fontin ja/tai sisennyksen esimuotoillun tekstin näyttämiseksi optimaalisesti. Oletusarvoksi on ehdotettu 80. Muita suositeltuja arvoja ovat 40 ja 132. Huomaa, että lukijoille, joilla on paljon kokemusta tietokoneista, nämä luvut puhuvat paljon. Itse asiassa nykyaikaiset selaimet jättävät huomioimatta WIDTH-parametrin.

    On olemassa useita muita tunnisteita, jotka ratkaisevat samanlaisen ongelman. Näitä ovat , AND -tunnisteet. Kaikki nämä kolme tunnistetta on merkitty vanhentuneiksi HTML 4.0 -määrityksessä. Tämä tarkoittaa, että selaimet eivät enää tue niitä tulevissa versioissa. On suositeltavaa käyttää tunnistetta näiden tunnisteiden sijasta.

    Tag

    Säilötunniste on lohkotason elementti, joka korostaa osan dokumentista. Tämän valinnan tarkoituksena on hallita tämän fragmentin parametreja, mikä yleensä tehdään määrittämällä tyylejä. Tässä on esimerkki:

    (Asiakirjan fragmentti)

    Tässä esimerkissä HTML-dokumentin fragmentti kehystetään tunnisteilla joidenkin sen ominaisuuksien määrittämiseksi. Tässä tapauksessa kaikki valitun fragmentin tekstielementit näkyvät vihreinä. Tekstitason tagin analogi on elementti.

    Huomaa, että erillisen fragmentin tyyliominaisuuksien suoraa osoittamista ei kannata käyttää, kuten esimerkissä tehdään dokumentin rakenteen ja sen esityksen erottamisen käsitteen mukaisesti. Sinun tulee käyttää tyylisivuja, joista keskustellaan kirjan toisessa osassa.

    Tag

    Säilötunniste on suunniteltu kohdistamaan kaikki elementit vaakasuoraan selaimen näkymän keskelle. Se on lohkotasoinen ja on hyödyllinen elementtien, kuten taulukoiden, keskittämiseen, koska niitä ei voi keskittää kohdistamalla

    ALIGN=CENTER-tunniste

    .

    Pohjimmiltaan tunniste on seuraavan merkinnän lyhyt muoto: . Tunnisteen jatkokäyttö ei ole myöskään toivottavaa edellisessä osiossa mainituista syistä.

    Kommenttien sisällyttäminen asiakirjaan

    Voit sisällyttää HTML-dokumenttiin kommentteja, jotka eivät näy lukijalle. Ne voivat koostua mistä tahansa määrästä rivejä, ja niiden on alettava tunnisteella. Mitään näiden tunnisteiden sisältämää ei näytetä näytöllä sivua katseltaessa.

    Kuten näette, ajan myötä vakiintuneet säännöt ja stereotypiat eivät muutu, vaan korujen käyttösäännöt ja vielä varsinkin muodikkaan korujen etiketin säännöt muuttuvat merkittävästi. Muoti, kuten tiedät, ei ole jatkuvaa, taipuvainen muuttuviin mieltymyksiin ja sääntöihin, ja mitä tulee korujen käyttöä koskeviin ohjeisiin, tässä ei ole mitään sanottavaa - muotisuunnittelijat "hallitsevat yötä" paitsi muodikkaiden kenkien, myös korujen suhteen!

    korujen käyttöä koskevat säännöt

    No esimerkiksi tämä - mitä tulee riipuksien määrään, joita nuori nainen voi käyttää samanaikaisesti, ei myöskään ole enää kiistoja - esimerkiksi kaulakorun yhdistäminen chokeriin (kaulakoru, joka sopii tiukasti kaulan ympärille) , tai kaulakorulla, riipuksella ja riipuksella ei pidetä huonoja tapoja – tätä yhdistelmää pidetään muodikkaana ja modernina. Ainoa asia on, että sinun tulee koristella kaulasi päiväsaikaan vähemmän näyttävillä yhdistelmillä - esimerkiksi chokerin sijaan - myös erittäin omaperäisillä! 🙂

    Monet naiset ja nuoret naiset pitävät heistä, mutta aiemmin korujen etiketti kieltää isojen korvakorujen käyttämisen päivällä, ja silloinkin vaadittiin erityistä tilaisuutta! Aikakautemme massiivisille koruille on annettu laaja laituri muotisuunnittelijoiden ansiosta, jotka ottavat huomioon monien planeetan reilun puolen edustajien toiveet. Tietenkin nainen, jolla on intuitiota ja makua, ei suosi barokkikorvakoruja päiväsaikaan - huolimatta muodikkaan koruetiketin uskollisuudesta, se on silti huonoja tapoja - korujen käyttösäännöt.

    Tämä pätee erityisesti Dolce & Gabbana -brändin hienostuneisiin, liian koristeltuihin korvakoruihin, mutta suuret korvalehtien korut voivat olla tyylikkäitä tai vähemmän vaikuttavia, yksinkertaisella siluetilla, miksi et käyttäisi niitä päivällä?! Kyllä, se on helppoa, jos sinulla on niin intohimo vaikuttavan kokoisiin koruihin. Ja toinen kiistanalainen kysymys on, saako niitä sekoittaa, vai onko se ehdottomasti kiellettyä... Jos seuraat muotisuunnittelijoiden mielipiteitä, niin tällainen sekoittaminen on suositeltavaa. Nuoret naiset ja naiset voivat käyttää korvakoruja yhdestä sarjasta sekä toisen sormuksia tai rannekoruja. Päävaatimus on samankaltaisuus korujen suunnittelussa tai värimaailmassa.

    Monet ihmiset tietävät myös, että edellisen ja nykyisen kauden trendissä koruissa on sallittua jonkin verran epäsymmetriaa, eli on melko hyväksyttävää jopa koristella itsesi korvakoruilla tai sormuksilla täysin erilaisista sarjoista. muotinäytöksissä he osoittavat tämän menestyksekkäästi, joten miksi eivät fashionistat seuraa heidän esimerkkiään - sinun on vain tutkittava huolellisesti suosikkikorulaatikkosi - korujen käyttösäännöt! 🙂

    Toinen epäilys on, kannattaako koristella itsesi pukukoruilla arvokkaiden korujen rinnalla. Osoittautuu, ja tämä on melko hyväksyttävää, se on vain, että suunnittelijat eivät aina muistaneet muodikkaita, unohtumattomia ideoita, joiden avulla voit yhdistää jalokiviä puolijalokiveihin. Kiitos julkkiksille, jotka kävelevät usein punaisella matolla ja luonnollisesti eivät menetä mahdollisuutta esitellä timanttejaan smaragdeilla ja rubiineilla, joita he yhdistävät sormuksiin, kaulakoruihin ja muihin puolijalokiveistä valmistettuihin koruihin - vuorikristalli, turkoosi, kvartsi .

    Kuuluisa laulaja tai näyttelijä voi esitellä kaulakoruja ja korvakoruja, joissa on upeita safiireja ja sormia, maalattuja sormuksia kuutiozirkonialla tai jopa strasseja. Tiedetään myös, että on olemassa koruja, jotka eivät ole halvempia kuin arvokkaat korut, mutta tämä on meidän, tyttöjen, välillä! 🙂 Voimme kokeilla hieman vaatimattomammin - jos meillä on sormus timantilla tai smaragdilla, yhdistämme sen kumiseen tai keraamiseen rannekoruun, mikä on myös varsin hyväksyttävää - säännöt korujen käyttöön!

    Aina kun mahdollista, selitä koodisi tarvittaessa.

    Käytä kommentteja selittääksesi koodisi: mitä se tekee, mitä se tekee ja miksi valitsemaasi ratkaisua käytetään.

    (Tämä kohta on valinnainen, koska on turha odottaa, että koodi on aina hyvin dokumentoitu. Kommentoinnin hyödyllisyys riippuu projektin monimutkaisuudesta ja voi vaihdella HTML- ja CSS-koodin osalta.)

    Tehtävät Tarkista tehtäväluettelosi tehtävät TODO-toiminnolla.

    Merkitse tehtävät avainsanalla TODO. Älä käytä muita yleisesti käytettyjä muotoja, kuten @@ .

    Liitä yhteystiedot (käyttäjänimi tai postituslista) sulkeisiin: TODO(yhteystieto) .

    Kuvaile tehtävää kaksoispisteen jälkeen, esimerkiksi: TODO: Tehtävä.

    Suositus: (# TODO(Ivan Ivanov): Käsittele kohdistus #) Testi
    Suositus:

    • kurkut
    • Tomaatit

    HTML-muotoilusäännöt Asiakirjatyyppi Käytä HTML5:tä.

    (On suositeltavaa käyttää HTML:ää teksti/html-sisältötyypin kanssa. Älä käytä XHTML:ää, sillä sovelluksella/xhtml+xml:llä on heikko selaintuki ja se rajoittaa optimointimahdollisuuksia.)

    HTML-kelpoisuus Käytä kelvollista HTML-koodia aina kun mahdollista.

    Käytä kelvollista HTML-koodia, paitsi jos käyttö ei anna sinun saavuttaa halutun suorituskyvyn edellyttämää tiedostokokoa.

    W3C HTML-validaattori (englanniksi) tarkistaaksesi koodin kelvollisuuden.

    Validiteetti on tärkeä ja mitattavissa oleva koodin laatu. Kelvollisen HTML:n kirjoittaminen edistää teknisten vaatimusten ja rajoitusten oppimista ja varmistaa HTML:n oikean käytön.

    Ei suositella: Tarkista Tarkista vain
    Suositus: Tarkista Vain sekki.

    Semantiikka Käytä HTML:ää tarkoitetulla tavalla.

    Käytä elementtejä (joita joskus kutsutaan virheellisesti "tageiksi") aiottuun tarkoitukseen: otsikot otsikoille, p kappaleille, a linkeille jne.

    Tämä helpottaa koodin lukemista, muokkaamista ja ylläpitoa.

    Vaihtoehtoinen media Tarjoa aina vaihtoehtoista mediasisältöä.

    Yritä tarjota vaihtoehtoista sisältöä medialle, kuten kuvia, videoita tai animaatioita, jotka on määritetty kankaalla. Kuville tämä on mielekästä vaihtoehtotekstiä (alt), ja videolle ja äänelle transkriptio tekstistä ja kuvateksti, jos mahdollista.

    Vaihtoehtoinen sisältö voi auttaa vammaisia. Esimerkiksi heikkonäköisen ihmisen on vaikea ymmärtää mitä kuvassa on, jos @alt ei ole asetettu sille. Muilla ihmisillä voi olla vaikeuksia ymmärtää, mitä video- tai äänitallenteessa sanotaan.

    (Jos kuvan alt on tarpeeton tai sitä käytetään vain koristeluun paikoissa, joissa CSS:ää ei voi käyttää, käytä tyhjää alt-tekstiä alt="" )

    Vastuunjako Erillinen rakenne, suunnittelu ja käyttäytyminen.

    Pidä rakenne (merkintä), ulkonäkö (tyylit) ja käyttäytyminen (skriptit) erillään ja yritä pitää niiden välinen vuorovaikutus mahdollisimman vähäisenä.

    Varmista, että asiakirjat ja mallit sisältävät vain HTML-koodia ja että HTML-koodia käytetään vain asiakirjan rakenteen määrittelemiseen. Siirrä kaikki suunnittelusta vastaava koodi tyylitiedostoihin ja käyttäytymisestä vastaava koodi komentosarjoihin.

    Yritä vähentää niiden risteyksiä minimiin sisällyttämällä malliisi vähimmäismäärä tyylitiedostoja ja komentosarjoja.

    Rakenteen erottaminen esityksestä ja käyttäytymisestä helpottaa koodin ylläpitoa. Mallien ja HTML-dokumenttien muuttaminen kestää aina kauemmin kuin tyylitiedostojen tai komentosarjojen muuttaminen.

    Ei suositella: HTML imee HTML imee

    Luin tästä jostain ennenkin, mutta nyt kaikki on aivan selvää: HTML on täyttä roskaa!!1 En voi uskoa, että muuttaaksesi suunnittelua, sinun täytyy tehdä kaikki uudelleen joka kerta.
    Suositus: Ensimmäinen vain CSS-uudelleensuunnitteluni Uusi CSS-suunnitteluni

    Luin tästä aiemmin, mutta lopulta tein sen itse: käytän huolenaiheiden erotteluperiaatetta enkä työnnä suunnittelua HTML:ään

    Kuinka siistiä!

    Muistolinkit Älä käytä muistolinkkejä.

    Ainoa poikkeus tähän sääntöön ovat HTML-palvelun merkit (esim< и & ) а так же вспомогательные и “невидимые” символы (например неразрывный пробел).

    Valinnaiset tunnisteet Älä käytä valinnaisia ​​tunnisteita. (ei välttämättä)

    Voit pienentää tiedostokokoa ja parantaa koodin luettavuutta jättämällä pois valinnaiset tunnisteet. HTML5-määrityksessä on luettelo valinnaisista tunnisteista.

    (Tämän lähestymistavan yleistyminen saattaa kestää jonkin aikaa, koska se eroaa hyvin paljon siitä, mitä verkkokehittäjille yleensä opetetaan. Johdonmukaisuuden, koodin ja yksinkertaisuuden kannalta on parasta jättää pois kaikki valinnaiset tunnisteet osan niistä).

    Ei suositella: tuhlaamme tavuja - tuhlaamme rahaa.
    Suositus: Tavut ovat rahaa!

    Jotta

    "type"-attribuutti Älä määritä type-attribuuttia, kun lisäät dokumenttiin tyylejä ja komentosarjoja.

    Älä käytä type-attribuuttia yhdistäessäsi tyylejä (paitsi käytettäessä jotain muuta kuin CSS:ää) ja komentosarjoja (paitsi käytettäessä jotain muuta kuin JavaScriptiä).

    Type-attribuutin määrittäminen ei tässä tapauksessa ole välttämätöntä, koska HTML5 käyttää oletusarvoisesti text/css:ää (englanniksi) ja text/javascriptiä (englanniksi). Tämä toimii myös vanhemmissa selaimissa.

    Ei suositeltu:
    Suositus:
    Ei suositeltu:
    Suositus:

    HTML-muotoilusäännötMuotoilu Luo uusi rivi jokaiselle lohkolle, taulukolle tai luetteloelementille ja sisennys jokaiselle alielementille.

    Riippumatta elementille määritetyistä tyyleistä (CSS:n avulla voit muuttaa elementin käyttäytymistä näyttöominaisuuden avulla), rivitä jokainen lohko tai taulukkoelementti uudelle riville.

    Sisennä myös kaikki lohko- tai taulukkoelementin sisällä olevat elementit.

    (Jos sinulla on ongelmia luetteloelementtien välissä olevien välilyöntien kanssa, voit laittaa kaikki li-elementit yhdelle riville. On suositeltavaa, että Lint antaa tässä tapauksessa varoituksen virheen sijaan.


    Suositus:
    • Masha
    • Glasha
    • Cheburash

    Suositus:
    Voiton verot
    $ 5.00 $ 4.50

    CSS-tyylisäännöt CSS-kelpoisuus Käytä kelvollista CSS-koodia aina kun mahdollista.

    Käytä kelvollista CSS-koodia paitsi tapauksissa, joissa vaaditaan selainriippuvaista koodia tai joissa on validointivirheitä.

    Käytä työkaluja, kuten W3C CSS Validator, vahvistaaksesi koodisi.

    Validiteetti on tärkeä ja mitattavissa oleva koodin laatu. Kelvollisen CSS:n kirjoittaminen auttaa poistamaan ylimääräisen koodin ja varmistaa tyylisivujen oikean käytön...

    Luokkien tunnisteet ja nimet Käytä jokerimerkkejä tai merkityksellisiä luokkanimiä ja tunnisteita.

    Sen sijaan, että käyttäisit koodeja tai kuvailet elementin ulkonäköä, yritä ilmaista sen luomisen merkitys luokan tai tunnisteen nimessä tai anna sille mallinimi...

    Jokerimerkkinimet ovat yksinkertaisesti muunnelmia elementeille, joilla ei ole erityistä tarkoitusta tai joita ei voida erottaa sisaruksistaan. Heitä yleensä tarvitaan "auttajina".

    Toiminnallisten tai mallinimien käyttäminen vähentää tarpeettomia muutoksia asiakirjaan tai malleihin.

    Vanhentunut: /* Vanhentunut: merkityksetön */ #yee-1901 () /* Vanhentunut: ulkoasun kuvaus */ .button-green() .clear()
    Suositus: /* Suositeltava: tarkka ja ytimekäs */ #gallery () #login () .video () /* Suositeltu: mallin nimi */ .aux () .alt ()

    Tunnisteiden ja luokkien nimet Käytä tunnisteissa ja luokissa nimiä, jotka ovat mahdollisimman pitkiä mutta mahdollisimman lyhyitä.

    Yritä muotoilla, mitä tämän elementin pitäisi tarkalleen tehdä, ja olla mahdollisimman lyhyt.

    Tämä luokkien ja tunnisteiden käyttö tekee koodista helpommin ymmärrettävän ja tehokkaamman.

    Tyyppivalitsimet Vältä luokkien nimien tai tunnisteiden käyttöä elementtityypin (tunnisteen) valitsimissa.

    Älä käytä elementin nimiä luokkanimien tai tunnisteiden kanssa, ellei se ole ehdottoman välttämätöntä (esimerkiksi auttajaluokissa).

    Ominaisuuksien pikakuvakkeet Käytä ominaisuuksien pikanäppäimiä aina kun mahdollista.

    CSS tarjoaa monia erilaisia ​​pikamuotoja (kuten font ), joita suositellaan käytettäväksi aina kun mahdollista, vaikka vain yksi arvoista olisi määritetty.

    Lyhyen ominaisuusmerkinnän käyttäminen on hyödyllistä tehokkuuden parantamiseksi ja koodin ymmärtämiseksi paremmin.

    Ei suositella: /* Ei suositella */ border-top-style: ei mitään; kirjasinperhe: palatino, georgia, serif; kirjasinkoko: 100%; linjan korkeus: 1,6; pehmuste-pohja: 2em; pehmuste-vasen: 1em; täyte-oikea: 1em; pehmuste-top: 0;
    Suositeltu: /* Suositeltu */ border-top: 0; fontti: 100 %/1,6 palatino, georgia, serif; pehmuste: 0 1em 2em;

    0 ja yksiköt Älä määritä yksiköitä nolla-arvoille

    Älä määritä yksiköitä nolla-arvoille, ellei siihen ole syytä.

    0 koko murto-osaan Älä laita ”0” murto-osien koko osaan.

    Älä sijoita 0:a kokonaislukuosaan arvojen -1 ja 1 välissä.

    Lainaukset linkeissä Älä käytä lainausmerkkejä linkeissä

    Älä käytä lainausmerkkejä ("" , "") kanssa url() .

    Heksadesimaalivärien nimet Käytä kolmimerkkistä heksadesimaalimerkintää aina kun mahdollista.

    Värien kolmen merkin heksadesimaalimerkintä on lyhyempi ja vie vähemmän tilaa.

    Etuliitteet Etuliitevalitsimet, joissa on nykyiselle sovellukselle ainutlaatuiset etuliitteet. (ei välttämättä)

    Käytä suurissa projekteissa sekä koodissa, jota käytetään muissa projekteissa tai muilla sivustoilla, käytä etuliitteitä (nimiavaruina) tunnisteille ja luokkanimille. Käytä lyhyitä, ainutlaatuisia otsikoita ja väliviivaa.

    Nimiavaruuksien käyttäminen auttaa estämään nimiristiriitoja ja helpottaa sivustosi ylläpitoa. Esimerkiksi etsiessä ja vaihtaessa.

    Erottimet luokissa ja tunnisteet Erottele sanat tunnisteissa ja luokkien nimissä yhdysviivalla.

    Vältä käyttämästä mitään muuta kuin yhdysviivaa sanojen ja lyhenteiden yhdistämiseen valitsimissa parantaaksesi koodin luettavuutta ja ymmärtämisen helpotusta.

    Ei suositella: /* Ei suositella: sanoja "demo" ja "image" ei eroteta */ .demoimage () /* Ei suositella: alaviivaa käytetään yhdysviivan sijaan */ .error_status ()
    Suositus: /* Suositeltu */ #video-id().ads-sample()

    Hakkerit Vältä selaimen versiotietojen tai CSS-hakkerointien käyttöä – kokeile ensin muita tapoja.

    Voi olla houkuttelevaa torjua selaimen eroja CSS-suodattimilla, hakkeroinneilla tai muilla kiertotavoilla. Kaikkia näitä lähestymistapoja tulisi harkita vain viimeisenä keinona, jos haluat tehokkaan ja helposti ylläpidettävän koodikannan. Yksinkertaisesti sanottuna hakkeroinnin ja selaimen havaitsemisen salliminen vahingoittaa projektia pitkällä aikavälillä, koska se tarkoittaa, että projekti kulkee vähiten vastustuskykyä. Tämä helpottaa hakkerien käyttöä ja mahdollistaa niiden käytön yhä useammin, mikä johtaa siihen, että niitä käytetään liian usein.

    CSS-muotoilusäännöt Mainosten järjestäminen Lajittele mainokset aakkosjärjestykseen.

    Määrittele ilmoitukset aakkosjärjestyksessä varmistaaksesi johdonmukaisen koodin, jonka kanssa on helppo työskennellä.

    Jätä selaimen etuliitteet huomioimatta lajittelussa. Lisäksi jos yhdelle omaisuudelle käytetään useita selaimen etuliitteitä, ne on myös lajiteltava (esim. -moz tulee olla ennen --webkit)

    Sisennykset lohkoissa. Sisennä aina eston sisältö.

    Sisennä aina kaikki lohkon sisältö, kuten sääntöjen sisällä olevat säännöt tai ilmoitukset, jotta hierarkia näkyy ja koodi on helpompi ymmärtää.

    Ilmoitusten jälkeen Laita puolipiste jokaisen ilmoituksen jälkeen.

    Käytä puolipistettä jokaisen ilmoituksen jälkeen koodin johdonmukaisuuden varmistamiseksi ja uusien ominaisuuksien lisäämisen helpottamiseksi.

    Ominaisuuksien nimien jälkeen Käytä ilmoituksissa välilyöntejä kaksoispisteiden jälkeen.

    Käytä aina yksi välilyönti kaksoispisteen jälkeen (mutta ei ennen) ilmoituksissa koodin järjestyksen saamiseksi.

    Valitsimien ja ilmoitusten erottaminen Erottele valitsimet ja ilmoitukset rivinvaihdolla.

    Aloita jokainen valitsin tai ilmoitus uudelta riviltä.

    Erotussäännöt Erottelevat säännöt rivinvaihdoilla.

    Aseta aina rivinvaihto sääntöjen väliin.

    Metasäännöt CSSRyhmittelysäännöt Ryhmäsäännöt ja osoittavat ryhmät kommentilla. (ei välttämättä)

    Aina kun mahdollista, ryhmäsäännöt yhdessä. Merkitse ryhmät kommenteilla ja erottele ne rivinvaihdoilla.

    Johtopäätös Ole johdonmukainen

    Jos muokkaat koodia, käytä muutama minuutti ymmärtääksesi, miten se on kirjoitettu. Jos matemaattiset operaattorit erotetaan välilyönnillä, tee samoin. Jos kommentit on ympäröity suluilla tai viivoilla, tee samoin kommenteissasi.

    Tämän oppaan ideana on luoda yhteinen sanasto, jonka avulla kehittäjät voivat keskittyä siihen, mitä he haluavat ilmaista, eikä miten.

    Tarjoamme yhtenäiset suunnittelusäännöt, joiden avulla voit kirjoittaa koodia samalla tyylillä, mutta myös projektissa käytetty koodityyli on tärkeä.

    Jos koodisi eroaa suuresti olemassa olevasta koodista, se voi häiritä lukijan rytmiä ja vaikeuttaa sen lukemista. Yritä välttää tätä.

    Kääntäjän huomautus Haluan myös huomauttaa, että Google keskittyy ensisijaisesti suuriin, paljon kuormitettuihin projekteihin, joissa jokainen tavu on kallis, joten kannattaa harkita, jos he suosittelevat aloittamaan jokaisen valitsimen uudelta riviltä tai käyttämään välilyöntejä sarkainten sijaan. , tämä tarkoittaa ensisijaisesti , että koodi välttämättä pienennetään ja pakataan ennen käyttöä sivustolla.

    Kiitos kaikille tähän asti lukeneille.

    Tunnisteet: Lisää tunnisteita

    Tällä hetkellä useimmat selaimet näyttävät sivustoja itsenäisesti tulkitsemalla ja korjaamalla verkkovastaavan virheet. Sinun on kuitenkin oltava varovainen kirjoittaessasi HTML-koodia - sinun on noudatettava kelvollisuussääntöjä, koska oikea asettelu on tärkeää sivuston optimoinnissa, ja se auttaa myös olemaan hulluksi käyttäjille, jotka avaavat sivustosi aiemmissa selainversioissa.

    Käyttää

    Elementti sijaitsee minkä tahansa HTML-sivun ensimmäisellä rivillä. Se määrittää sivulla käytetyn sivunkuvauskielen version. Tällä hetkellä on suositeltavaa käyttää lomakkeen doctypeä - se on universaali kaikille kielen versioille.

    Käytä oikeaa asiakirjarakennetta

    Tunnisteet , , tulee aina olla mukana koodissa. Tämä tekee sivusta standardien mukaisen ja varmistaa, että se näkyy oikein.

    Väärä



    Hei maailma!

    Hei maailma!


    Oikein



    Hei maailma!


    Hei maailma!



    Määritä sivun tekniset tiedot oikein

    Sisällönkuvauskentät ja tyylit tulee määrittää -kentässä, ei missään sivun tekstiosassa. On suositeltavaa sisällyttää komentosarjat sivun alareunaan ennen sulkevaa tunnistetta. Tämän lähestymistavan etuna on, että ennen sivun sisällön näyttämistä selain lataa vain tyylit ja se lataa komentosarjat viimeisenä, jolloin käyttäjä näkee sivun sisällön nopeammin.

    Väärä



    Hei maailma!




    Oikein



    Hei maailma!




    Noudata merkintästandardeja Käytä elementtejä niiden semantiikan mukaisesti. Tarkista HTML-koodin kelpoisuus Käytä kuvien vaihtoehtoista tekstiä

    Kuvissa on aina oltava alt-attribuutti. Selain luottaa tähän määritteeseen tarjotakseen kontekstin kuvalle. Alt-määritteen tulee sisältää tekstiä, joka näytetään, jos kuvaa ei ole ladattu.

    Väärä

    Oikein

    Älä käytä tyylejä HTML-merkinnöissä

    Tämä luo sivuja, joiden lataaminen kestää liian kauan ja joita on vaikea ylläpitää. Kirjoita kaikki tyylit erilliseen CSS-dokumenttiin. Yritä käyttää tunnistetta ja tyylimääritettä mahdollisimman vähän.

    Kirjoita kommentteja

    Kommentoi koodia, mutta älä liioittele sitä. Lyhyesti ja selkeästi kirjoitetut kommentit voivat olla suureksi avuksi muille kehittäjille sekä tärkeänä muistutuksena sinulle jonkin ajan kuluttua.

    Esimerkki:



    Sivu











    Käytä sopivia luokkanimiä

    Anna css-luokille nimet lohkon sisällön mukaan, esimerkiksi: header - header, alatunniste - alatunniste, menu - menu, content - content. Tämä tekee koodista paljon selkeämmän ja helpompi ylläpitää.

    Huono koodi


    • Valikkokohta 1

    • Valikkokohta 2

    • Valikkokohta 3

    Hyvä koodi

    Säännöt CSS:n kirjoittamiseen

    CSS:ssä on myös sääntöjä, joita voit noudattaa pitääksesi koodisi yksinkertaisena, helppolukuisena ja hyvin järjestettynä.

    Palauta selaimen tyylit oletusasetuksiin

    Ne voivat häiritä tyylejä, joita todella haluamme soveltaa. Voit ladata tiedoston vakioselaintyylien nollausta varten täältä - reset.css.

    Käytä lyhennettyjä ominaisuuksia ja arvoja

    Huono koodi

    pehmuste-top: 5px;
    täyte-oikea: 10px;
    pehmuste-ala: 15px;
    täyte-vasen: 20px;

    Hyvä koodi

    täyte: 5px 10px 15px 20px;

    Määritä valitsimet ja säännöt uudelle riville

    Huono koodi

    Elementti (näyttö:lohko;sijainti: suhteellinen;täyte:5px 10px 15px 20px;)

    Hyvä koodi

    Elementti (
    näyttö: lohko;
    asema: suhteellinen;
    täyte: 5px 10px 15px 20px;
    }

    Syötä nolla-arvot ilman yksiköitä

    Huono koodi

    täyte: 10px 0px;
    marginaali vasen: 0 %;

    Hyvä koodi

    täyte: 10px 0;
    marginaali vasen: 0;

    Kirjoita kommentteja

    Erottele päälohkot kommenteilla, tämä parantaa koodin luettavuutta.

    Esimerkki:

    /*HEADER*/
    header(
    }
    /*HEADER END*/

    /*PÄÄ*/
    main(
    }
    /*PÄÄPÄÄTÖ*/

    /*ALATUNNISTE*/
    alatunniste(
    }
    /*ALAKIRJA LOPPU*/

    Tarkista CSS-koodin oikeellisuus

    Nämä ohjeet ja säännöt ovat vain perusasiat, sillä HTML- ja CSS-kielet kehittyvät nopeammin ja uusia menetelmiä oikean koodin kirjoittamiseen kehitetään. Noudattamalla suosituksiamme varmistat, että koodisi on yksinkertainen, helppolukuinen ja optimoitu. Saat myös +100 karmaa ja kiitollisuutta kehittäjiltä, ​​jotka työskentelevät sivustolla sinun jälkeensi.

    Huolimatta erinomaisesta online-editorista, jota parannamme ja laajennamme jatkuvasti DashaMailissa, jotkut asiakkaistamme käyttävät mieluummin . Joskus tämä johtuu brändikirjan tiukoista säännöistä, joskus aikaisempien markkinoijien jättämästä perinnöstä.

    Joka tapauksessa kunnioitamme tätä oikeutta ja yritämme auttaa asiakkaitamme tekemään sähköpostikampanjoista responsiivisia ja näyttämään upeilta erilaisissa sähköpostiohjelmissa ja selaimissa. Loppujen lopuksi, kuten tiedät, sähköpostiohjelmia ja ohjelmia on monia:

    • sähköpostien verkkoversiot (Gmail, Yandex, Mail, Yahoo jne.)
    • työpöytäohjelmat (Outlook, Mail, Mozilla Thunderbird ja jopa Bat)
    • mobiilisähköpostiohjelmat (iphone, iPad, eri Android-versiot jne.)

    Valitettavasti kaikkien näiden sovellusten kehittäjät toimivat epäjohdonmukaisesti standardien moninkertaistamisen parhaiden perinteiden mukaisesti.

    Jotkut näistä asiakkaista ovat, jotkut eivät, joitain määritteitä ja tyylejä tukevat mobiiliasiakkaat, mutta eivät pöytätietokoneet. Lisäksi HTML- ja CSS-tuki voi vaihdella saman ohjelman versiosta toiseen. Web-versiot joskus yksinkertaisesti leikkaavat koodin tai lisäävät oman.

    Tämän bakkanaalian seurausten minimoimiseksi olemme kehittäneet 5 sääntöä, joita tulee noudattaa luotaessa omaa html-asettelua.

    1. Asettelu taulukoilla

    Jos haluat yksinkertaisen ja luotettavan ratkaisun, taulukot ovat ilmeisin valinta. Se säästää sinut varmasti vanhojen sähköpostiohjelmien ongelmilta. Älä unohda selaimia, jotka avaavat sähköpostiohjelmien verkkoversioita, jotkin niistä voivat olla IE7 tai jopa IE6.

    2. Tarkista HTML-tunnisteiden ja CSS-ominaisuuksien attribuuttituen yleisyys

    Me, jonka avulla voit nopeasti ja helposti tarkistaa eri attribuuttien ja ominaisuuksien tuen 10 suosituimmassa sähköpostiohjelmassa. Jos et ole varma jostain, älä epäröi ja tarkista olettamuksesi asettelun oikeellisuudesta.

    3. Unohda estää CSS

    CSS:n käyttö on ehdottomasti suositeltavaa. Tämä voi tietysti aiheuttaa kipua luotaessa html-koodia manuaalisesti, joten DashaMail tarjoaa tämän työkalun automaattisen käytön heti html-koodin lataamisen jälkeen uutiskirjeen luomisen toisessa vaiheessa.

    4. Kirjaimen leveys 600 pikseliä

    Monien työpöytäsähköpostiohjelmien suurin viestien katselualue on noin 600 pikseliä, minkä ansiosta voimme sovittaa kirjeen pienet marginaalit jättäen. 600 on myös 1-2-3-4-5-6:n kerrannainen, jonka avulla voit toteuttaa normaalin mukautuvan monisarakerakenteen ilman "paskaa ja tikkuja". Jos jaat 600 9:llä, saat paljon kuusia. Tämä ei periaatteessa sovellu millään tavalla, mutta se on vain siistiä. Yleensä, kuten sanotaan, "älä heijasta - levitä sitä".

    5. Media-kysely ei ole kovin siistiä.

    Mediakyselyiden tuki useimmissa sähköpostiohjelmissa on rajoitettu, esimerkiksi se on tyhmästi poistettu käytöstä Gmail-sähköpostiohjelmissa sekä selaimessa että mobiilisovelluksissa. Responsiivisuus on mahdollista saavuttaa ilman tätä CSS-komponenttia, vaikka se onkin hieman hankalaa. Mutta uskon teihin, nuoret padawanit.

    Näiden 5 säännön avulla voit luoda oikean html-koodin, joka näkyy yleisesti kaikissa sähköpostiohjelmissa ja selaimissa, mikä tarkoittaa, että kaikki tilaajasi kokevat syvimmän tyytyväisyyden pohtiessaan sitä postilaatikossaan.

    Olkoon niin! Rakkaudella, Dasha.