web.hc.lv - vortāls tīmekļa veidotājiem: Pamācība https://web.hc.lv/kods/xhtml/pamaciba/?rss=1 HTML pamācība lv 2007-2024, web.hc.lv web.hc.lv 60 https://www.hc.lv/inc/baners/hclv_baner_small.gif web.hc.lv - vortāls tīmekļa veidotājiem https://web.hc.lv/ web.hc.lv - vortāls tīmekļa veidotājiem Wed, 08 May 2024 22:19:33 +0000 2 3 4 5 6 8. lekcija. Nodalījums galvai un ķermenim Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/8-lekcija/ https://web.hc.lv/kods/xhtml/pamaciba/8-lekcija/ Tue, 03 Jul 2007 13:40:00 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!


(Te ir pieejama iepriekšējā lekcija - Kravājam čemodānu nosūtīšanai)


Domāju ka šī lekcija jums šķitīs elementāra (tāpat kā visas nākamās), jo mēs ļoti daudz runāsim par elementiem. Atgādināšu, ka iepriekšējā lekcijā mēs sākām apskatīt šādu kodu:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>


Tikām līdz tam, ka apskatījām kodā elementu <html>, kurš ir kā čemodāns, kurš satur kopā pārējo lapas saturu.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html> elements (čemodāns) 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>

 

Kā jau teicu, vienā xHTML koda elementā starp tā atverošo un aizverošo tagu var ievietot vienu vai vairākus citus elementus. Tagad aplūkosim xHTML kodu, kurš atrodas mūsu čemodānā - ievietots xHTML koda elementā <html> un centīsimies saskatīt, kādus citus elementus tas satur.

 

<head>
  <title>Mana 1. lapa!</title>
</head>
<body>
</body>

 

Pirmo saskatām elementu <head> (angļu valodā "head" nozīmē "galva"), kurš sastāv no:

  • atverošā taga <head>,
  • vēl cita elementa <title>. Par elementu <title> mēs vēl parunāsim mazliet vēlāk,
  • aizverošā taga </head>.

Aiz elementa <head> seko vēl viens cits elements - <body> ("body" angļu valodā nozīmē "ķermenis"),  kurš sastāv no atverošā taga un aizverošā taga. Bet tas nenozīmē, ka mūsu čemodāns ir paredzēts sadalītu līķu pārvadāšanai, kā kāds var nejauši padomāt izlasot elementu nosaukumus! Nebūt ne!

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html> elements (čemodāns) 
<html xmlns="http://www.w3.org/1999/xhtml">
<head> elements (1. nodalījums pavadzīmēm) 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head>
<body> elements (2. nodalījums) 
  <body> 
  </body> 
</html>

 

Secinājums: Čemodānam, kuru mēs kravājam pārlūkprogrammai, ir divi nodalījumi. 

 

<head>, <body>1. nodalījums (elements <head>) ir kā kabata, kurā var ievietot pavadzīmes un citus dokumentus. Šajā nodalījumā ievieto informāciju, kura ir domāta nevis attēlošanai mājaslapā, bet gan dažādus papildus datus, kurus mēs vēlamies nodot pārlūkprogrammai, lai pārlūkprogramma tos varētu izmantot. Kā jau minēju, pašlaik tur ir iekšā elements <title>, par kuru runāsim vēlāk, taču nākotnē ievietosim tur vēl dažus elementus.

 

2. nodalījums (elements <body>) ir paredzēts, citu xHTML elementu izvietošanai, kurus pārlūkprogrammai jāattēlo uz ekrāna. Redzat kāds pašlaik tur ir izvietots elements starp atverošo un aizverošo tagu? Es arī neredzu, jo pašlaik šis elements ir tukšs. Bet tas nekas, mēs to tā ilgi neatstāsim!

 

Nu ko, esam gandrīz izgājuši cauri visam dotajam xHTML kodam, izņemot to vienu rindiņu, kura satur <title> elementu. Esam tikuši līdz tam, ka mums ir:

  • uzlīme uz čemodāna,
  • čemodāns,
  • čemodānam nodalījums pavadzīmēm un citiem dokumentiem,
  • čemodāna otrs (parasti lielākais nodalījums), kurā var salikt daudz ko citu iekšā.

Jāatcerās, ka kodā šo elementu secību nedrīkst mainīt! Uzlīmei jābūt pa virsu čemodānam, un čemodāna nodalījumiem jābūt tieši tādā kārtībā: No sākuma pavadzīmju nodalījums (elements <head>) un pēc tam otrs nodalījums (elements <body>).

 

Un ceru, ka nevienam no jums neienāca prātā, piemēram, ievietot elementu <body> iekš elementa <head> šādi:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title>
    <body>
    </body>
  </head> 
</html>

 

Tas ir nepareizi! Vēl cita kļūda, kuru bieži pielaiž, ir dīvaini sakombinēt elementus, ka tie atrodas nevis viens otrā, bet gan kaut kā samuhļīti savā starpā. Piemēram, pamēģiniet noteikt, vai zemāk redzamajā kļūdainajā kodā elements <body> atrodas iekš elementa <head> vai arī elements <head> atrodas iekš elementa <body>?

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  <body>
  </head> 
  </body> 
</html>

 

Kā redzat, to nemaz nevar viennozīmīgi pateikt, tāpēc, ja jūs rakstīsiet šādu aplamu kodu, kā dotajā nepareizajā piemērā, tad nebrīnieties, ja pārlūkprogramma atveidos jūsu veidoto mājaslapu pavisam ne tā, kā jūs to gaidījāt!

 

Ja jūs nesapratāt par ko es runāju, tad pamēģiniet šajā piemērā apvilkt visu elementu <head> (ar atverošo un aizverošo tagu un visu kas ir starpā), un tad līdzīgi apvilkt visu elementu <body>. Jūs redzēsiet, ka to nav iespējams izdarīt tā, lai līnijas nekrustotos! Ja līnijas krustojas, tātad elementi nav ievietoti korekti viens otrā! Viens no xHTML kodēšanas pamatprincipiem ir, ka elementi ir jāievieto korekti viens otrā!


Šķiet, ka nākamreiz būs jādod praktiskais darbs...


Turpinājums sekos...]]> 7. lekcija. Kravājam čemodānu nosūtīšanai Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/7-lekcija-kravajam-cemodanu-nosutisanai/ https://web.hc.lv/kods/xhtml/pamaciba/7-lekcija-kravajam-cemodanu-nosutisanai/ Fri, 29 Jun 2007 21:31:49 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!

 

(Te ir pieejama iepriekšējā lekcija - Praktiskais darbs "Meklējam sakarības")

 

Šodien mēs beidzot ķersimies vērsim pie ragiem un sāksim veidot mājaslapu xHTML valodā.

Kodēšana xHTML valodā ir līdzīga čemodāna sakravāšanai, kurš tiks sūtīts pārlūkprogrammai, kura to savukārt izkravās uz ekrāna.

No sākuma es nodemonstrēšu mājaslapas xHTML kodu, un tad es centīšos apskaidrot katru rindiņu un izstāstīt kāds tam visam sakars ar čemodāna kravāšanu. Šis xHTML Strict kods ir pats minimums, bez kura nevar iztikt neviena mājaslapa, kas ir kodēta xHTML Strict valodā:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>


<html>Pirmās divas rindiņas (tās var sarakstīt arī vienā rindā) norāda pārlūkprogrammai, ka turpmākais kods ir jāapstrādā tieši kā xHTML Strict kods, nevis „kas-to-lai-zina-kas-tas-par-kodu-varbut-pameginasim-to-iebarot-tosterim”. Uztveriet to kā uzlīmi uz čemodāna ar uzrakstu "sakravāts atbilstoši W3C rekomendācijām", nevis "plīstoši trauki", "handle with care" vai „не кантовать”. Šīs ir rindiņas, kas brīdina pārlūkprogrammu, ka tai tiks nodots mūsdienu prasībām sagatavots čemodāns ar kodu, un pārlūkprogrammai nav jāuztraucas par to, ka no čemodāna varētu kas izbirt vai notikt kas cits nelāgs.

Ja šādas „uzlīmes” nav, tad pārlūkprogramma pārslēgsies uz „invalīdu” režīmu (saucas quirks mode), kur tā visu laiku čekos un pārbaudīs, vai no čemodāna kas nebirst ārā, un vai tas ir kārtīgi sapakots, un nepieciešamības gadījumā pacentīsies pielabot kļūdas pēc saviem ieskatiem – kā sanāks. Būtībā izturēsies pret čemodānu tā, it kā to būtu kravājis garīgi nepilnvērtīgs cilvēks. Attiecīgi arī šāda izkravāšana aizņemtu daudz vairāk laika, bet mūsdienās laiks taču ir nauda!

Nākamajā rindiņā sākas xHTML valodā rakstīts kods – mūsu čemodāns. Tas sākas ar tā saucamo tagu (angliski tag, kas latviski nozīmē birka) <html>, kurš norāda tikai uz to, ka HTML kods sākas tieši te. Šis tags ir mūsu čemodāna vāks. Ja ir grūti atcerēties šo burtu salikumu "html", tad atcerieties, ka tas nav saīsinājums no "How To Make Love"!

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>

 

Visi tagi sākas ar simbolu „<”, tad seko taga nosaukums, aiz tā, atdalīti ar atstarpi var būt (bet bieži var arī nebūt) viens vai vairāki tā saucamie taga atribūti ar norādītām vērtībām,  un beigās simbols „>”- tā pārlūkprogramma atšķir tagus no teksta, kas jāparāda lapas apmeklētājam. xHTML valodā tagu un atribūtu nosaukumi obligāti jāraksta ar maziem burtiem – nedrīkst rakstīt <HTML xmlns="http://www.w3.org/1999/xhtml"> vai <Html Xmlns="http://www.w3.org/1999/xhtml">, tas nav pareizi. 

Kā redzat, tad starp "<" un ">" ir rakstīts html, bet aiz tā atstarpe un tad  xmlns="http://www.w3.org/1999/xhtml" - tas nozīmē, ka <html> tagam ir atribūts xmlns, kura vērtība ir http://www.w3.org/1999/xhtml.

 

Kāda jēga ir no taga atribūtiem un to vērtībām, es pastāstīšu citreiz, tikai jāatceras, ka xHTML Strict kodā veidotai mājaslapai tagam <html> vienmēr jābūt klāt šim atribūtam xmlns, kuram jābūt norādītai vērtībai http://www.w3.org/1999/xhtml. Kodā tas vienmēr ir jānorāda tā, kā es to uzrakstīju:

 

<html xmlns="http://www.w3.org/1999/xhtml">



Ja palūkosieties uzmanīgi mūsu kodā, tad ievērosiet, ka katram tagam atbilst vēl viens tags ar tādu pašu nosaukumu, kuram pirms nosaukuma ir slīpā svītra „/”. Piemēram, sākumā ir <html> un beigās ir </html>. Šādus tagus ar slīpo svītru „/” sauc par aizverošajiem tagiem. Ja ir atverošais tags, tad ir jābūt arī aizverošajam tagam. Aizverošajiem tagiem atribūtus neraksta - pietiek, ja to izdara nepieciešamības gadījumā pie atverošajiem. Ja tags <html> ir kā čemodāna vāks, tad aizverošais tags </html> ir kā  čemodāns bez vāka. Čemodānu nevar atstāt bez čemodāna vāka, tāpat kā čemodāna vāku nevar atstāt bez čemodāna. Viss, kas ir starpā, ir mūsu čemodāna saturs, un mēs nevaram tam ļaut izbirt!

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>

 

Tagi ir norāde pārlūkprogrammai par to informāciju, kura atrodas starp atverošo un aizverošo tagu. Atceraties, mēs 3. lekcijā runājām par dāvanām? Mēs vienojāmies, ka mājaslapas saturu satur kopā forma - xHTML valodas izskatā. Tad lūk tagi ir tie, kas "satur" kopā mājaslapas saturu, lai tas nebūtu vienā putrā. Un mūsu čemodāns, kurš sastāv no <html> un </html> tagiem "satur" kopā visu to, kas ir starp šiem tagiem.

 

Uzlīme 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Čemodāns 
<html xmlns="http://www.w3.org/1999/xhtml">
Čemodāna saturs 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body>
</html>


Atverošo tagu ar atribūtiem un to vērtībām, aizverošo tagu un visu, kas ir starpā sauc par elementu. Tātad mums ir viens liels <html> elements – čemodāns ar visu saturu. Gan jau esat pamanījuši ka mūsu "čemodānā" ir vēl citi tagi un elementi. 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html> elements 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head> 
    <title>Mana 1. lapa!</title> 
  </head> 
  <body> 
  </body> 
</html>

 

Es zinu, ka jūs nepacietībā gaidāt, kad es par tiem pastāstīšu, jo patiesībā visa "xHTML mācēšana" sastāv no zināšanām par dažādiem elementiem un kā tos pareizi izmantot un sakārtot, nu un, protams, pāris knifiem.


Bet, es arī redzu, ka jaunēklim pirmajā solā ļoti vajag pārdomāt visu, ko līdz šim stāstīju, vietā, kur neviens to netraucēs - tirinās man te pašā priekšā jau 5 minūtes! (Ja nemaldos Z.Visurmalža jaunskungs? Tas pats, kurš pēc iepriekšējās lekcijas demonstrēja, kā ir uztrenējis nicīgās sejas izteiksmes?) Pārtraukums!

 

Pēc pārtraukuma neizklīstiet! Turpināsim kravāt čemodānu!

]]> 6. lekcija. Praktiskais darbs "Meklējam sakarības" Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/6-lekcija-praktiskais-darbs-meklejam-sakaribas/ https://web.hc.lv/kods/xhtml/pamaciba/6-lekcija-praktiskais-darbs-meklejam-sakaribas/ Sun, 24 Jun 2007 23:51:56 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!
(Te ir pieejama iepriekšējā lekcija - SE, SEO, SERP un citi saīsinājumi)

Sveiki, sveiki atkal!

Šodien, kā jau solīju, mēs beidzot mazliet atpūtināsim savus uztveres orgānus no maniem tekstiem un pārmaiņas pēc pamocīsim savu smadzeni!

Uzdevums ir pavisam vienkāršs - zemāk ir sarakstītas dažas mājaslapu īpašības. Jums ir jāsavelk bultas, lai var redzēt kura īpašība no kuras ir atkarīga, kā arī jācenšas sagrupēt kopīgas īpašības. Rezultātu es nepārbaudīšu, arī "pareizās atbildes" nebūs. Vienkārši izdariet paši priekš sevis. Varbūt kāds iedomāsies pierakstīt vēl kādas papildus īpašības, kuras te pietrūkst. (To var arī komentāros darīt, citiem būs interesanti palasīt.)

Ar taustiņu Z var atcelt pēdējo darbību, ar taustiņu Q var padarīt līniju resnāku un ar taustiņu A - tievāku. Jāzīmē šoreiz būs ar peles palīdzību.

Ceru, ka tiksiet galā! Lai veicas!



Starp citu, nododiet bastotājiem, ka nākamā lekcija būs ļoti svarīga, kuru bastot nedrīkst (tāpat kā visas šīs lekcijas!) - mēs beidzot ķersimies vērsim pie ragiem un sāksim skatīt xHTML kodu!
]]> 5. lekcija. SE, SEO, SERP un citi saīsinājumi Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/5-lekcija-se-seo-serp-un-citi-saisinajumi/ https://web.hc.lv/kods/xhtml/pamaciba/5-lekcija-se-seo-serp-un-citi-saisinajumi/ Mon, 18 Jun 2007 19:27:47 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!
(Te ir pieejama iepriekšējā lekcija - Populārzinātniski par interneta darbību.)

Statistika liecina, ka apmēram 50% (+/- 30%) apmeklētāju mājaslapā nokļūst caur meklēšanas sistēmām, meklējot kādu informāciju. Tātad, ja jūsu mājaslapai ir vidēji 100 apmeklētāji dienā, neskaitot tos, kas nāk no meklēšanas sistēmām (turpmāk sauksim tās par SE – saīsinājums no search engines - meklēšanas sistēmas), tad jūs varat papildus iegūt apmēram 25 līdz 160 apmeklētājus no SE. Kā redzat, amplitūda ir diezgan plaša. Ir vērts mazliet piedomāt pie tā, lai dabūtu maksimālo apmeklētāju skaitu no meklēšanas sistēmām, vai ne?

Šo piepūli, lai iegūtu papildus apmeklētājus sauc par SEO (search engine optimisation – optimizācija meklēšanas sistēmām). Protams, ka apmeklētāju daudzums nav pašmērķis, taču, ja jau jūs esat izlēmuši veidot mājaslapu, tātad jums ir kaut kas, ko jūs vēlaties piedāvāt plašākai publikai, un ir vērts mazliet papūlēties, lai jūsu mājaslapas apmeklētāju skaits stipri palielinātos.

Mēs mazliet pakavēsimies pie SEO pamatiem, jo ņemot tos vērā, mēs ne tikai varam iegūt jaunus apmeklētājus mājaslapai, bet arī būtiski uzlabot mājaslapas kvalitāti. (Patiesībā, šie pamati ir jāzina lai nepieļautu kļūdas mājaslapas veidošanā un nezaudētu potenciālos apmeklētājus, nevis lai uzlabotu mājaslapu, jo kvalitatīvi veidota mājaslapa būs ļoti draudzīga meklētājsistēmām.)

Kā SE piemēru ņemsim www.google.lv. Google pagaidām ir vispopulārākā meklēšanas sistēma un apmēram 90% apmeklētāju, kuri nonāk mājaslapās caur meklēšanas sistēmām, nāk tieši no Google.

Google regulāri apmeklē visas viņai zināmās mājaslapas un saglabā informāciju par tām savā datubāzē. Šo procesu sauc par indeksēšanu. Pēc tam, kad kāds lietotājs meklē caur Google, piemēram, "marinētus gurķus", Google paskatās savā datubāzē, kurās lapās ir informācija vairāk par marinētiem gurķiem un parāda to sarakstu.

Mājaslapas šajā meklēšanas rezultātu sarakstā tiek sakārtotas noteiktā secībā. Tās lapas, kuras Google uzskata par svarīgākām un nozīmīgākajām, tiek parādītas pirmās un mazāk nozīmīgas tiek parādītas beigās. Šīs rezultātu lapas sauc par SERP (search engine results pages - meklēšanas sistēmu rezultātu lapas). Jo labākā pozīcjā jūsu mājaslapa būs SEPR, jo labāk jums - būs vairāk iespēju, ka informācijas meklētājs noklikšķinās uz saiti, kas ved uz jūsu mājaslapu, jo parasti informācijas meklētāji tālāk par pirmo rezultātu lapu nemaz neskatās, un tikai retais izskata pirmās 3 lapas.

Secinājums: jācenšas, lai mājaslapai būtu pēc iespējas austāka pozīcija SERP.

Problēma ir tāda, ka meklēšanas sistēmas neatklāj sīkumos SERP veidošanas algoritmu, bet tikai dod diezgan virspusējas vadlīnijas, kā ir jāveido mājaslapas, lai tās SERP atrastos austāk. Tas tiek darīts tāpēc, lai netiktu ļaunprātīgi izmantotas meklēšanas sistēmas un maldināti lietotāji, mākslīgi panākot mājaslapu pozīciju SERP.

Jūs taču nepriecātos, ja meklējot skaistas meitenes vai vīriešus, jums pašā priekšā parādītos saite uz mājaslapu par marinētiem gurķiem, jo viņa atrdoas augstāks SERP vai ne? Bet no otras puses paskatoties, ja meklējot gurķus atrastos meitenes, tas gan nebūtu slikti... (Kaut gan meklējot zaķus tas tā arī bieži notiek.) Aizdomājos par zaķiem un novirzījos no tēmas... Pie kā mēs palikām?

Tātad par SERP... Katrai lapai ir atšķirīga pozīcija SERP atkarībā no meklējamā vārda. Piemēram meklējot vārdu "kapi", lapai www.kapi.lv būs augstāka pozīcija SERP, kā lapai www.hot-babes.com. Savukārt, meklējot beibes, lapai www.hot-babes.com būs augstāka pozīcija SERP, kā www.kapi.lv.

No šejienes rodas secinājums, ka mums nav tik svarīgi, kāds ir mūsu mājaslapas par nieru transplantāciju pozīcija SERP, meklējot pēc atslēgvārda "burkāni", jo:
  • Pirmkārt reti kurš gribēs apmeklēt nieru transplantācijas lapu, ja viņš domās par burkāniem. (Un vispār, kam jums tāds apmeklētājs vajadzīgs, kurš domā par burkāniem, nevis nierēm!)
  • Otrkārt, panākt augstu pozīciju SERP atslēgvārdam "burkāni" būs praktiski neiespējami, ja jūsu lapā būs pieminētas tikai nieres. Turklāt parasti panākt augstu pozīciju SERP viena lapa var tikai attiecībā uz dažiem atslēgvārdiem vienlaicīgi, tāpēc drīzāk atmaksātos censties panākt augstu pozīciju SERP attiecībā uz "nieres" un "transplantācija", nekā uz "burkāniem".
Ceru, ka sapratāt, ka no SEO viedokļa nav izdevīgi nieru transplantācijas mājaslapā saukt nieres par burkāniem, lai panāktu augstu pozīciju SERP uz atslēgvārdu „burkāns”. Būtībā no cilvēciskā viedokļa arī - iedomājieties, ka jūs pasūtat interneta veikalā pāris kg burkānus, ko pagrauzt pie datora, bet jums tā vietā aizdomīga izskata vīrietis piegādā konteineri ar jēlām nierēm, pie tam palūdz samaksāt dažus tūkstošus par to!

Tātad SEO mērķis ir panākt augstu pozīciju SERP mājaslapai attiecībā uz dažiem atslēgvārdiem meklētājsistēmās, lai apmeklētāji uz mājaslapu plūstu straumēm.

Saguru no teorijas, varbūt nākamajā lekcijā mazliet pazīmēsim.
]]> 4. Lekcija. Populārzinātniski par interneta darbību Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/4-lekcija-popularzinatniski-par-interneta-darbibu/ https://web.hc.lv/kods/xhtml/pamaciba/4-lekcija-popularzinatniski-par-interneta-darbibu/ Wed, 13 Jun 2007 22:47:51 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!
Sveiki šajā jaukajā dienā!

Pirms sākam veidot mājaslapu, mums ir jāizprot kā praktiski darbojas internets.

(Te ir pieejama iepriekšējā lekcija - Dāvana, 3 vaļi un karalis)

To, ka ierakstot pārlūkprogrammā „www.hc.lv” vai noklikšķinot uz kādas saites, parādās uz ekrāna mājaslapa, mēs zinām pārsvarā visi. Bet nu tā stunda ir situsi, kad mums ir jāuzzina, kas notiek "aiz kulisēm".

Pati mājaslapa parasti HTML kodā rakstītu failu veidā atrodas uz kāda datora. Parasti šo datoru sauc par www serveri (no angļu valodas vārda to serve - apkalpot). Šim serverim ir piesaistīts viens vai vairāki nosaukumi, kurus sauc par domēna vārdiem. Piemēram, „www.tosteris.lv”.

Kad mēs ierakstam pārlūkprogrammā domēna vārdu (servera nosaukumu), nepieciešamības gadījumā mapes nosaukumu un HTML faila nosaukumu, kas atrodas šajā mapē „www.domens.lv/mape/fails.htm”, tad pārlūkprogramma sūta pieprasījumu www serverim, kuram ir piesaistīts domēna vārds „www.domens.lv”, pēc faila ar nosaukumu „fails.htm”. (Ja nenorāda faila nosaukumu, tad parasti serveris saprot, ka tiek pieprasīts fails ar standartnosaukumu index.htm, index.html, index.php vai kādu līdzīgu) Serveris saņem pieprasījumu un, ja tāds fails atrodas uz servera attiecīgajā mapē, sūta šo failu pārlūkprogrammai. (Ja fails neatrodas, tad serveris nosūta kļūdas paziņojumu ar numuru 404, ka fails nav atrasts.) Pārlūkprogramma savukārt saņem šo failu un, vadoties pēc HTML koda failā, attēlo šī faila saturu uz ekrāna.

Pēdējais teikums ir ļoti svarīgs, tāpēc izlasiet to vēlreiz!

Tieši pārlūkprogramma ir tā, kas izlemj kā tieši attēlot mājaslapu uz ekrāna! Protams, ka viņa to dara vadoties pēc koda, kas ir HTML failā, taču katra pārlūkprogramma vienu un to pašu HTML failu var attēlot dažādi! Pat vienas pārlūkprogrammas dažādas versijas var attēlot dažādi vienu un to pašu HTML failu.

Vai esat redzējuši lapas, kurās ir uzraksti, ka tās vislabāk skatīties ir ar Internet Explorer, Mozilla, FireFox vai NevienamNezināmuPārlūku? Galīgi garām vai ne? Lapas taču ir domātas cilvēkiem, nevis pārlūkprogrammām! Iedomājieties gleznu, uz kuras būtu rakstīts, ka vislabāk to būtu aplūkot melnā uzvalkā! Tieši tāds pats stulbums manuprāt ir lapas, kuras nevar aplūkot vismaz ar dažiem populārākajiem pārlūkiem.

Tātad, ja vairāki cilvēki skatās vienu un to pašu mājaslapu, tad praktiski viņi saņem vienādas HTML faila kopijas (ja vien serveris neģenerē katram lietotājam atšķirīgu HTML failu automātiski – to sauc par dinamiski ģenerētu failu). Tāpēc jau arī serveri sauc par serveri, ka tas "apkalpo" citus datorus, nosūtot tiem pieprasīto HTML failu.

Veidojot mājaslapu ir jāatceras, ka mājaslapu mēs veidojam vienu, taču tā tiks skatīta uz dažādiem datoriem un ar dažādām pārlūkprogrammām. Tāpēc mājaslapa jākodē tā, lai tā labi izskatītos un funkcionētu gan uz jūsu datora ar MS Windows operētājsistēmu, Internet Explorer pārlūkprogrammā uz 17 collu pa diagonāli monitora (uzminēju?), gan uz Mārča Linux darbastacijas ar 21 collīgu monitoru un Konqueror pārlūka, gan uz mana plaukstdatora ar PalmOS operētājsistēmu un 3 collas pa diagonāli skārienjūtīgā ekrāna.

Secinājums: tas ka lapa izskatās labi uz jūsu datora, vēl nenozīmē, ka tā izskatīsies labi arī uz mana vai kāda cita datora.

Ja jūs savā mājaslapas kodā pieļausiet kļūdu, tad visdrīzāk pārlūkprogramma, kas attēlos jūsu veidoto mājaslapu pamanīs šo kļūdu un pacentīsies to izlabot pēc saviem ieskatiem. Problēma ir tikai tāda, ka katra pārlūkprogramma var labot jūsu kļūdas atšķirīgi pēc saviem ieskatiem. Tātad citā pārlūkprogrammā kļūdainā mājaslapa attēlosies pavisam atšķirīgi. Un šādu kļūdainu mājaslapu Internetā diemžēl ir ļoti daudz.

Ir izstrādāti standarti, kādai ir jābūt HTML lapai (viens no visstriktākajiem standartiem ir tieši xHTML Strict), tāpēc lielākā daļa pēc standartiem kodētu mājaslapu attēlosies daudz maz vienādi. Nav izstrādāti standarti, kas pārlūkprogrammām būtu jādara ar kļūdainām vai ne pēc standartiem veidotām lapām, tāpēc arī tās katra pārlūkprogramma attēlo dažādi.

Tā kā jūs nespēsiet notestēt, kā izskatās jūsu veidotā lapa un vai tā darbojas uz visu potenciālo lapas apmeklētāju datoriem, tad jums ir tikai viena iespēja - veidot savas mājaslapas pēc visstingrākajiem standartiem (viens no kuriem, kā jau es iepriekš minēju, ir xHTML Strict). Tikai tādā veidā jums vēl ir cerība panākt, lai mājaslapa izskatītos labi un darbotos korekti pēc iespējas vairāk tās apmeklētājiem.

Ceru, ka jums radās kaut neliela skaidrība par to, kāpēc būtu jāpieturās pie dažiem standartiem. Nākamā lekcija būs par dažādiem burtiem un to kombinācijām.
]]> 3. lekcija. Dāvana, 3 vaļi un karalis Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/3-lekcija-davana-3-vali-un-karalis/ https://web.hc.lv/kods/xhtml/pamaciba/3-lekcija-davana-3-vali-un-karalis/ Mon, 11 Jun 2007 20:13:00 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!

(Te ir pieejama iepriekšējā lekcija - Praktiskais darbs „Atpazīstam xHTML Strict”)

Labs nosaukums sanāca, vai ne? Pilnīgi kā pasakai! Pašam prieks! Ok, ķersimies vērsim pie ragiem, jo šodien man nav īpaša noskaņojuma daudz jokot – piedodiet, šodien esmu nopietnais!

Atcerieties, ka mājaslapa lietotājam ir līdzīga dāvanai jubilāram. Un dāvanu raksturo saturs, forma un noformējums.

Dāvanai ir jābūt labam saturam - vēlams, lai tas būtu kas unikāls, interesants un, protams, garšīgs. Arī mājaslapas saturam ir jābūt līdzīgam.

Dāvanas saturu satur kopā kaut kāda forma. Ja dāvanā ir garšīgā torte, tad visdrīzāk, ka mēs to ievietosim izturīgā kartona kārbā, lai pa ceļam līdz jubilāram nesanāk šmuce. Līdzīgi arī mājaslapas saturs ir jāievieto atbilstošā un "izturīgā" formā, lai nesanāk šmuce. Mēs šo formu veidosim xHTML Strict valodā un praktiski tieši šīs formas veidošana ir tas, ko mēs tagad apgūstam.

Protams, ka dāvana ir arī skaisti jānoformē - jāiesaiņo skaistā papīrā, jāuzsien kāda bantīte. Arī mājaslapa ir skaisti jānoformē, jāuzliek kāda bildīte, nu un tādā garā. Tas jau ir gaumes un dizaina jautājums.

Taču noformējumam ir saistība arī ar mājaslapas kodēšanu un, lai cik tas dīvaini neliktos, jo mazāka ir šī saistība, jo labāk. Tā tas ir tāpēc, lai lapas noformējums pēc iespējas mazāk ietekmētu lapas formu un otrādi, jeb, citiem vārdiem sakot, lai mājaslapas dizaineram būtu pēc iespējas mazāk jājaucas lapas kodētāja darīšanās un otrādi. Un tieši xHTML ir tas, kas nodrošina šo dizaina un formas saistību pēc iespējas mazāku, nezaudējot efektivitāti, salīdzinot ar HTML.

Parasti xHTML vai HTML kods šim mērķim tiek sasaistīts ar tā saucamo CSS (Cascading Style Sheets). Kā redzat pēc nosaukuma, tas ir saistībā ar stilu – un tas ir stilīgi. Šī mācību kursa mērķis, diemžēl, nav izglītot jūs par stilīgiem, bet gan vienkārši krutiem, tāpēc mēs CSS nemācīsimies, taču kādu piemēru gan jau es vēlāk iedošu, lai jums rastos kaut kāds priekšstats par to, kas ir CSS. Pagaidām atcerieties, ka ar CSS palīdzību ir iespējams mājaslapas noformēt stilīgi - CSS ir tas, kas atbild par to, kā jūsu mājaslapā izskatīsies katrs burts - trekns vai slīps, liels vai mazs.

Tātad atcerieties, ka ir 3 vaļi uz kuriem balstās interesantas, labas un stilīgas mājaslapas: saturs, forma, kas saturu satur kopā un noformējums. Un tieši šīs ir tās 3 lietas, kuras jūs varat pilnībā ietekmēt un mainīt savā mājaslapā.

Kurš no šiem 3 vaļiem ir visnozīmīgākais? Tāpat kā dāvanai - garšīgais saturs! Mājaslapu veidotāji šo domu izsaka ar vārdiem: "Content is the King!" - "Saturs ir karalis!"

Nākamā lekcija - par interneta darbību.
]]> 2. lekcija. Praktiskais darbs „Atpazīstam xHTML Strict” Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/2-lekcija-atpazistam-xhtml-strict/ https://web.hc.lv/kods/xhtml/pamaciba/2-lekcija-atpazistam-xhtml-strict/ Fri, 08 Jun 2007 21:02:55 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!

(Te ir pieejama iepriekšējā lekcija - Ievads)

Iepazīsimies sākumā ar xHTML valodu. Tātad apsēžamies pie datora, atveram pārlūku Internet Explorer un atveram tādu fascinējošu interneta adresi kā www.pods.lv. Izdevās? Tie, kam neizdevās, droši pametiet šo auditoriju un ejiet labāk nodarboties ar mākslu - jūs esat bezcerīgi manās acīs! Un iebakstiet tam džekam pēdējā solā, lai nekrāc tik skaļi! Redzu, ka divas trešdaļas ir pametušas auditoriju - beidzot varēs normāli strādāt ar sakarīgiem cilvēkiem!

Labi, turpināsim. Tas, ka jūs maz saprotat, par ko šajā mājaslapā ir runa, tas pašlaik nav būtiski (es domāju pods.lv, nevis web.hc.lv). Ar laiku jūs sāksiet to visu saprast, un tas pat liksies interesanti. Ievērojiet, ka teikumi tiek veidoti daudz maz sakarīgi. (Ne jau manējie, bet pods.lv mājaslapā. Manējie, protams, arī.) Mums svarīgi ir noskaidrot, vai šī lapa ir veidota xHTML Strict. Kā to var zināt? Spiežam uz View>View page source, lai aplūkotu lapas kodu un pirmajās rindās meklējam tekstu "XHTML 1.0 Strict". Nekā tamlīdzīga neatrodam. Savelkam vīlušos sejas izteiksmi, jo pods.lv mājaslapa nav veidota xHTML Strict, bet gan xHTML Transitional.

Pievēršam uzmanību arī visam pārējam tekstam un ķeburiem. Kā redzat, te sakarīgs teksts mijās ar nesakarīgu. Tas arī ir kods xHTML valodā. Izskatās mega sarežģīti, vai ne? Tas ir tas, ko mēs iemācīsimies - rakstīt šādu sakarīgā un nesakarīgā teksta miksli, lai beigās no tā visa rastos sakarīga mājaslapa. Tātad aizveram sakarīgi/nesakarīgo tekstu.

Ok, atvērsim citu vienkāršās datoriķu tautas varoņa ar iesauku lācz lapu - laacz.lv un apskatamies sakarīgi/nesakarīgo xHTML tekstu (sauksim to par lapas kodu). Redzam pirmajās rindās maģiskos vārdus XHTML 1.0 Strict. Olēēē, olē, olē, olēēē! Latvijāāā, uzvarāāā! Tātad šī lapa ir veidota sarežģītajā xHTML Strict. Tagad visi sataisam gudras sejas un papētam arī nākamās rindas. Svarīgākais šajā procesā ir izskatīties tā, it kā mēs kaut ko saprastu. Attapīgākie var pat mēģināt saskatīt kādas līdzības ar iepriekš skatītās pods.lv lapas kodu. Daram to vismaz 1 minūti.

Tagad atveram www.draugiem.lv. Varat pat nelogoties iekšā. Apskatāmies lapas kodu. Redzam, ka neredzam pirmajās 3 rindās maģisko burtu salikumu XHTML 1.0 Strict. Visi kopā savelkam nicinošu sejas izteiksmi (atceraties taču, ka krutas lapas ir vienīgi xHTML Strict valodā rakstītas vai ne?), un, kamēr mēs vēl neesam uztvēruši visas tās HTML mulķības, kas tur ir rakstītas, ātri aizveram ciet lapas kodu un vispār atveram kādu ārzemju lapu - šoreiz www.alistapart.com un mēģiniet jau patstāvīgi noteikt, vai šī lapa atbilst xHTML Strict standartam vai nē. Pateikšu priekšā - skatoties šo lapu jums nav jāsavelk ļoti cieņas pilns un zinošs vieplis, it kā jūs šo lapas kodu apbrīnotu. Taču šīs lapas adresi atcerieties – tā ir viena no saturīgākajām lapām par mājaslapu veidošanu vispār.

Svarīgi iegaumēt, ka, ja lapas kodā pirmajās rindās nav redzams maģiskais burtu salikums XHTML, tad lapa visdrīzāk nav veidota xHTML, bet gan vienkārši HTML valodā, kas mūsdienās vairs nerullē.

Tātad šodienas praktiskajā darbā mēs:
  • Iemācījāmies atšķirt kruti kodētas (tās kuras ir xHTML Strict) no mazāk krutām (nav xHTML Strict) lapām.
  • Iepazināmies ar dažu tautas varoņu mājaslapām.
  • Zinām, kuros gadījumos jāsavelk nicinoša sejas izteiksme un kuros var savilkt sarežģīto sejas izteiksmi.
  • Iemācījāmies apskatīt lapas kodu, kurā ir redzams (x)HTML kods.
Diezgan ražīgi, vai ne? Vienīgais, jums vēl mājās vajadzētu patrenēties sašķobīt gudru seju, jo var manīt, ka jūs to nedarat bieži. Nekas, es no jums vēl izaudzināšu lietaskokus! Uz kursa beigām jūs man visi pēc Pavloviem un Einšteiniem izskatīsieties! Paldies par uzmanību! Uz nākamo lekciju, lai nekavētu!
]]> 1. lekcija. Ievads Kods xHTML Pamācība https://web.hc.lv/kods/xhtml/pamaciba/1-lekcija-ievads/ https://web.hc.lv/kods/xhtml/pamaciba/1-lekcija-ievads/ Mon, 04 Jun 2007 20:19:32 +0000 web.hc.lv - vortāls tīmekļa veidotājiem Ja tu gribi veidot krutas mājaslapas, un tev nav ne mazākās nojausmas, ko nozīmē "<img src="13.png" title="&quot;Amēba&quot;" height="23" width="16" />”, tad šī pamācība ir tieši tev!

Yo, beibes! Mācīsimies zubroties vai izklaidējoties? Ok, tas bija retorisks jautājums, jo es te pūlos ne tāpēc, lai jums kaut ko iemācītu, bet just to have fun. Tā ka gribat to vai nē, bet mēs izklaidēsimies, jo nav tak jēgas mācīties, ja tas nesagādā prieku!

Tagad par to, par ko mēs vispār mācīsimies. Mēs mācīsimies nevis vienkārši HTML (atšifrējas kā „HyperText Markup Language”, nevis „How To Make Love”) valodu, kurā tiek veidotas mājaslapas, bet mēs mācīsimies sarežģīti HTML valodu. Lai tas skanētu gudrāk un iespaidīgāk, es pat teiktu, ka mēs mācīsimies HTML valodas atīstītāku paveidu - xHTML (eXtensible HyperText Markup Language), kas patiesībā ir daudz mūsdienīgāk nekā vienkārši HTML.

Ceru, ka šausmīgi sapriecājāties izlasot šo priecīgo ziņu! Nedzirdu sajūsmas izsaucienus auditorijā! Tātad jums šī ziņa neko daudz neizteica. Pietiks, ja zināsiet, ka xHTML ir modernāk par HTML.

Ja kāds prasa kāpēc, tad atbildiet "tāpēc". Ja tas nepalīdz, tad sakiet:

xHTML valodā veidotas lapas mazāk noslogo datoru, lapas saturs ir vairāk nodalīts no formas, un xHTML valodā veidotai lapai ir lielāka iespēja, ka tā uz dažādiem pārlūkiem attēlosies vienādi, nekā HTML valodā veidotai lapai. Turklāt uz daudziem mobilajiem tālruņiem xHTML lapas var aplūkot, bet HTML lapas nevar.

Bet labāk palieciet tomēr pie pirmā atbildes varianta, jo tas ir stipri saprotamāks.

Tagad iepriecināšu ar nākamo priecīgo ziņu - xHTML standartam ir 3 paveidi. Mēs, protams, neesam nekādi plānā galdiņa urbēji un mācīsimies pašu krutāko no tiem - xHTML Strict. Tas ir tas, pēc kā tiecas visi webmasteri (vai vismaz viņiem būtu pēc tā jātiecas), taču diemžēl tikai retais no viņiem spēj šādu līmeni sasniegt... Vislielākā viņu problēma ir tāda, ka viņiem (ne jau visiem, protams) bērnībā tika pārāk daudz mulķības samācītas, un tad nu viņi bez tām vairs nemāk iztikt. xHTML Strict ir visierobežojošākais xHTML variants, un tāpēc tas ir patiešām hardcore izveidot sakarīgu lapu, kura atbilst xHTML Strict standartiem. Tas nav viegli, taču tas atmaksājas:

 

1) jūs varat justies kruts,
2) speciālisti jūs cienīs,
3) tā ir nākotnes tehnoloģija,
utt., utjp.
n) tāda lapa nekarinās augšā mobilos telefonus,
n+1) citi nebūtiski sīkumi, kuri normālam cilvēkam neko daudz neizteiks, bet datortārpi dēļ tiem ir gatavi iet nāvē.

Bet pats galvenais, protams, ir pirmais punkts (ka jūs varat justies kruts). Bet mums līdz tam vēl grūts un tāls ceļš ejams... (to es saku, lai pabaidītu, patiesībā mums tas būs kā divus pirkstus… Nu jūs jau sapratāt - palocīt).

Zināms, ka labs veids pierādīt, ka kaut kas ir kruts, ir totāli noliekot visu pārējo. To mēs tagad arī izdarīsim:
  • xHTML Strict: kā jau teicu - kruts!
  • xHTML Frameset: Domāts lapām ar freimiem. Kas ir freimi? Freimi - tas ir leimi! Freimus sāka un beidza izmantot pagājušajā gadsimtā, jo no lietojamības viedokļa tie bija galīgi garām. (Ja kāds jums atkal prasa kāpēc freimi ir leimi, tad pasakiet tam kādam, lai atšujās un iet labāk kaut ko derīgu padarīt.)
  • xHTML Transitional: kaut kas pa vidu starp HTML un xHTML Strict - īsāk sakot, ne šis un ne tas. Domāts tiem, kas nav spējīgi veidot xHTML Strict, taču vismaz ir apjēguši, ka HTML ir pagātne. Īsāk sakot tāds pārejas periods starp pagātni un nākotni.

Eu, iebakstiet kāds tam džekam pēdējā rindā, lai beidz grauzt nagus!

Tagad par to, kas mums būs nepieciešams mūsu „sūri grūtajās” mācībās. Esat redzējuši kādu filmu par krutajiem hakeriem? Ievērojāt, ka viņi visu spēj atlauzt bez jebkādām papildus programmām? Sliktākajā gadījumā palīgā nāk internets. Katram muļķim skaidrs (ok, katram nē), ka tas reālajā dzīvē ir praktiski neiespējami. Bet mēs taču esam megakruti vai ne? Tāpēc mēs iztiksim ar visiespaidīgāko hakeru programmu - notepad! Ja kāds man jautā, kādā programmā es esmu izveidojis kādu mājaslapu, es vienmēr atbildu - notepadā! Jāatzīstas, ka ikdienā es izmantoju mazliet ērtāku programmu UltraEdit32 (tas pats notepad vien ir, tikai UltraEdit vēl rindiņas numurē), taču, kad vajag pazīmēties citu priekšā, tad es vienmēr veru vaļā notepad, ko arī jums iesaku. Savs imidžs tak ir jāuztur!

Lai manu lekciju laikā jums nebūtu visu laiku jāsēž pie datora, vienosimies, ka lielāko daļu apmācības iztiksim bez datora. Pats pēc sevis zinu, cik neērti ir kaut ko lasīt grāmatā un vienlaicīgi darīt kaut ko uz datora.

Taču sāksim ar pašu grūtāko - praktisko darbu pie datora!

 

]]>