Sveikame <body> — sveika dvasia. Pirma dalis.

Žvilgsnis į šių metų lietuviškų tinklalapių kodą priminė man istoriją apie tai, kaip romėnų arklio užpakalio plotis įtakojo JAV kosmines technologijas.

Konkrečiai kalbu apie <body> atributus.

Va tipiškas pavyzdys:

  1. <BODY bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

Atkreipę dėmesį į faktus, kad:

  1. dabar XXI amžius;
  2. teoriškai visi moka naudotis CSS;
  3. praktiškai visi naudoja CSS, net jei nemoka, taigi, vienoks ar kitoks CSS failas jau yra.

darome išvadą — viskas, kas parašyta už BODY HTML’e yra reikalinga kaip kiaulei balnas.

Normaliai čia tereikia <body>, idealiai — <body lang="lt"> (jei tekstas nelietuviškas — tada teksto kalbos kodas)(žr. Vlado komentarą).

Su bgcolor susitvarkyti lengva:

  1. body{
  2. background-color: #fff;
  3. color: #000; /* tiesiog tvarkingiau yra nurodyti abi spalvas -- ir fono ir teksto */
  4. ... /* kitos jūsų taisyklės skirtos <body> */
  5. }

Dabar grįžkim prie mūsų avinų, t.y. romėnų arklio užpakalio, kurio vaidmenį atlieka leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" atributai.

Ką jie daro dauguma (tikuosi) žino — jie panaikina tuos bjaurius tarpus, kuriuos palieka naršyklės tam atvejui, jei autorius netyčia nepasirūpino paraštėmis. Be gudriųjų programų rūpesčio tekstas būtų prilipęs prie kraštų — labai nepatogu skaityti. Kodėl gi aš burnoju prieš tokį naudingą dalyką?

Pirmiausia, ne visi tokį kodą naudojantys yra matę naršykles, kurioms jis skirtas — taigi, technologija gerokai pasenusi. Antra, šių atributų niekada nebuvo jokiame HTML standarte, nekalbant jau apie XHTML. Validatorius, aptikęs tokį niekalą pagrįstai keiksis there is no attribute "…".

leftmargin="0" topmargin="0" (ir rečiau pasitaikantys rightmargin="0" bottommargin="0") yra skirti Internet Explorer 3-čiai versijai. IE4+ puikiai supranta atitinkamą CSS ir gali išgyventi be tokių šiukšlių.

marginwidth="0" marginheight="0" skirti Netscape Navigator 4.x, kuris seniai yra gražus lavonėlis. Zeldmanaspasiuntė velniop dar prieš ketverius metus. Ir gerai padarė, nes NN4 turėjo stebėtinai kreivą CSS palaikymą (prieš porą metų kažkur mačiau siūlymą NN4.x uždrausti įstatymu :).

Lengvu rankos judesiu, t.y. dviem papildomomis CSS taisyklėmis išvalome mūsų <body>:

  1. body{
  2. background-color: #fff;
  3. color: #000;
  4. margin:0;/* viso gero, paraštės! */
  5. padding:0; /* Opera turi savo būdą atsisveikinti su paraštėm */
  6. ...
  7. }

Pastaba dėl NN4.x: margin: 0; šiai naršyklei negalioja, bet margin: -10px; turėtų suveikti. Ar jau sakiau, kad ši naršyklė turi kreivą CSS palaikymą?

Vat taip, greitai ir nebrangiai mūsų gražiajam <body> nusiurbti riebalai. Nežinau, kaip visokie leftmargin,topmargin etc. dar randa kelią į HTML kodą; ar juos sukiša naudojama programinė įranga, ar čia stebime copy-paste stebuklą, ar maniakai-nekrofilai (tuoj kolekciją surinksiu — viename poste buvo paminėta zoofilija, dabar, prašau — nekrofilija. Iš paieškos sistemų pradės būriais eiti visokie iškrypėliai, o aš juos išmokysiu tvarkingo HTML’o…) įrašo rankomis. Įpratimas — antras prigimimas, bet prastų įpročių reikia atsikratyti.

Su senobiniu kodu susitvarkėme, dabar pora žodžių apie modernias atmainas. Tai šen tai ten pasitaiko <body style="margin:0px 0px 0px 0px"> (o vienos lietuviškos TVS vizitinė kortelė yra <body style="margin:0 0 0 0">). Geriau, nei nestandartiniai atributai, bet neidealu.

Pirmiausia blogai inline CSS. Nors pats esu naudojęs style="...čia-kažkoks-CSS,-kurį-tingėjau-įrašyti-į-atskirą-failą..." bet kuo toliau, tuo labiau galvoju, kad style= atributo visai nereikėjo įtraukti į standartus, jis prieštarauja pačiai CSS esmei — atskirti turinį nuo atvaizdavimo. Taip, pro validatorių praslysti lengviau, bet košė yra košė…

Antra, rašyti "margin:0px 0px 0px 0px"> visai nebūtina, pakanka "margin: 0"> — jei nurodoma viena reikšmė, tai ji taikoma ir viršui, ir apačiai, ir abiems šonams. Be to, nuliniams dydžiams nereikia nurodyti vienetų.

Ir trečia — neatsižvelgta į Operą, kuri paraštėms naudoja ne margin, o padding.

Viskas, galit eiti valyti kodo ir laukti antros ir trečios dalies.

6 Responses to “Sveikame <body> — sveika dvasia. Pirma dalis.”

  1. Aidas Kasparas says:

    Rimai,

    Įspūdingas tekstas! Bet aš, kaip visada, kabinėsiuos prie smuklmenų. Taigi, pakalbėkim apie nеkrofilus.

    Nebuvau įlindęs tavo galvon, tad nežinau, kokią misiją sau esi numatęs. Gal iš tiesų nori, kad pas tave pradėtų „būriais eiti visokie iškrypėliai, o aš juos išmokysiu tvarkingo HTML’o“, tik PR’o specialistai patarė kategoriškai tai neigti. Tačiau, jei tokio tikslo nėra, tai su paieškos sistemomis galima mažumėle pažaisti. Ir padėti šitam gali ne kas kitas, kaip tik šiuo metu ant bangos esantys homografų triukai. ;-) Taigi, fokusai!

    Tavo tekstas šiaip ar taip jau yra unicode, taigi dėl perėjimo prie jo tau nereikės kankintis. O dabar atkreipk dėmesį į tai, kaip parašytas tas žodis „nеkrofilus“ pirmoje (jei kreipinio nelaikyti atskira) pastraipoje. [Žinoma, jei mozilla, web serveriai ar dar kas nors nesugadino mano minties]. Jame antras simbolis yra paimtas iš kirilicos (mintį davė šis dokumentas).

    Na, o dabar prizas paieškos sistemoms! Pirmoji, kuri suras šį komentarą įvedus tik lotyniškus simbolius, gali tikėtis linko į ją mano puslapiuose. Prizui atsiimti kontaktų ieškokite… paieškos sistemose ;-).

    P.S. Kažkas ne taip yra su RSS. Mano thunderbirdas šią naujieną numetė prie pačių seniausių, sąraše rodo datą 1970.01.01 03:00, o headeriuose „Date: 17794.06.12 18:11“

  2. Andrius Mazeika says:

    gal reikejo is karto eiti prie CSS layout pagrindu ir privalumu ir nesiknisineti su atskiromis smulkmenomis? ;) Angliskai ta tema prirasyta tomu tomai, bet lietuviskai tai būtų naudinga (in case koks nors web designeris nekerta angliskai) ;)

  3. ImCat says:

    Prieisim ir iki CSS layout’ų, bet pradžiai gerai būtų HTML išmokti ;)

    Aidai, dėl RSS pažiūrėsiu, o nekrofilų kol kas nebaisu.

  4. Vladas says:

    Puikus rašinėlis, reikia tokių, kol CSS naudojamas dėl mados, be WWW architektūros supratimo. Smulki pastaba: <body lang=”lt”> nepatartinas, visam dokumentui geriau <html lang=”lt”>, nes lang siūlomas text processing, o ne primary language nurodymui (pirminei kalbai geriau tinka content-language) – žr. W3C.

  5. Pacifists says:

    Mintys be abejonės labai teisingos, tačiau man natūraliai kyla toks klausimas, negi taip jau laikantis standartų kiekvieną smulkmenėlę reikėtų rašyti į CSS?
    Tarkim būna gi situacijų, kai ta pati CSS klasė naudojama keliose vietose, tačiau vienoje iš tų vietų reikia kokios smulkmenos, kad ir margin-top: 3px; tai negi tokiu atveju nelogiška būtų aprašyti inline style ?

  6. Martinas says:

    Taip pat eilė dėdžių ant interneto (1, 2, 3) siūlo resetinti išvis visas margin bei padding reikšmes jau pačioje pradžioje:
    * { margin: 0; padding: 0; }