ნაბიჯი 10 - ვეცნობით სურათებს.
ალბათ ინტერნეტის ხშირი მომხმარებელი ხარ და ისიც კარგად იცი, რომ კარგი გვერდი გრაფიკული გაფორმების გარეშე თითქმის წარმოუდგენელია. თუ ჩვენ სრულყოფილი გვერდის გაკეთება გვინდა, სურათის გამოსახვაც უნდა ვისწავლოთ. ამისათვის კიდევ ერთ ახალ ტეგს - <img>-ს და ამ ტეგის უმთავრეს ატრიბუტს - scr-ს უნდა გავეცნოთ. img ბროუზერს აცნობებს, რომ საქმე სურათთან გვაქვს, ხოლო scr - ამ სურათის მისამართს(სწორედ ამიტომაა იგი უმთავრესი). საბოლოო სინტაქსს შემდეგი სახე აქვს:
<img src="my.jpg">
რა თქმა უნდა, აქ ნებისმიერი მისამართი შეგიძლიათ ჩაწეროთ, მაგრამ რამოდენიმე ნიუანსის ცოდნა არ გაწყენდათ.
- თუ თქვენი გვერდის საქაღალდეა ”D:\პირველი ნაბიჯები” და ამავე საქაღალდეში არსებული ”რამე.jpg”-ს გვერდზე ჩასმა გინდათ, მაშინ მისამართად ორივე, ”D:\პირველი ნაბიჯები\რამე.jpg” და ”რამე.jpg” გამოდგება, მაგრამ თუ საქმე სერვერს ეხება, მე მეორეს გამოყენებას გირჩევდით :)
- თუ გვერდის მისამართია ”D:\პირველი ნაბიჯები\index.html”, ხოლო სურათის ”D:\პირველი ნაბიჯები\რამე\რამე.jpg”, მაშინ scr ატრიბუტის მნიშვნელობა ”რამე\რამე.jpg” იქნება.
- თუ სურათი მოთავსებულია მისამართზე ”D:\პირველი ნაბიჯები”, ხოლო გვერდი ”D:\პირველი ნაბიჯები\რამე”, მაშინ scr="../რამე.jpg". ალბათ მიხვდით, რომ ”../” ერთი საქაღალდით ”ზევით” ასვლას ნიშნავს.
- თუ სურათი სხვა საიტზეა განთავსებული, მაშინ მისი სრული მისამართის მითითება მოგიწევთ. მაგ. ”http:\\www.სხვასაიტი.com\რამე\რამე.jpg"
ისე კი, გირჩევდით სურათები იმავე საქაღალდეში მოგეთავსებინათ, სადაც html ფაილს ინახავთ, ან თუ არეულობა არ გიყვართ, გამოუყავით სურათებს ცალკე საქაღალდე და ყველა სურათი იქ შეინახეთ.
მიაქციეთ ყურადღება! MY.jpg, my.JPG, my.jpg и MY.JPG – ეს სხვადასხვა ფაილების სახელებია. ყურადღებით იყავით სურათების მისამართების მითითებისას.
ჩვენს მაგალითში ტექსტის დასაწყისში სურათი მოვათავსეთ, მაგრამ ნახვის შემდეგ დამეთანხმებით, რომ საკმაოდ ულამაზოდ გამოიყურება. აჯობებდა, ტექსტი სურათის გვერდით იყოს და არა მის ქვეშ, თუმცა ამაზე ამ ნაბიჯში არ ვილაპარაკებთ.
| |
|
|
<html>
<head>
<title>პირველი ნაბიჯები</title>
</head>
<body text="#336699" bgcolor="#CFCFCF">
<div align="center">
<H3>მოგესალმებით!</H3><font color="#CC0000"> ეს ჩემი პირველი ვებ-გვერდია!</font>
</div>
<p align="justify">
<img src="primtocodephoto.jpg">ეს სტატია განკუთვნილია დამწყები მომხმარებლებისთვის, რომლებიც ვერ ერკვევიან პროცესორების დასახელებებში, მათ მწარმოებლებში და გამოყენების სფეროებში. პრაქტიკულად ასეთი სტატია დიდი ხნის წინ უნდა დაწერილიყო, მაგრამ გარკვეული მიზეზების გამო ინტერნეტში ქვეყნდება პირველად. <b>სამწუხაროდ არცერთი კომპიუტერული რესურსი საწყის ეტაპებს დიდ ყურადღებას არ უთმობს</b>, რის გამოც ბევრ მომხმარებელს საკუთარი ძალებით და მიხვედრილობით უწევს გზის გაკვლევა საკმაოდ რთულ და დაქსაქსულ კომპიუტერულ ცხოვრებაში. რა თქმა უნდა 1-2 წლის თავზე სირთულეები ქრება, გარკვეული ცოდნა გროვდება და ყველაფერი მარტივდება, მაგრამ ხშირად პირველი არასწორი ნაბიჯები ბევრისთვის დიდი ხნის სინანულის ბრალია.
</p>
</body>
</html> (ვნახოთ)
|
დაიმახსოვრეთ! ბრაუზერს დამატებითი პლაგინების გარეშე მხოლოდ jpg, gif და png ფორმატის სურათების გამოსახვა შეუძლია, სხვა შემთხვევაში ის სურათის ჩამოტვირთვას შემოგთავაზებთ.
ასევე საყურადღებოა სურათის ზომა. არ არის სავალდებულო, რომ გვერდზე განთავსებული სურათი ბრწყინვალე ხარისხის და რამდენიმე მბ მოცულობის იყოს. ამას უბრალოდ საშუალოზე ცოტათი კარგი ხარისხის, მაგრამ პატარა მოცულობის მქონე სურათი ჯობს. სხვა თუ არაფერი, გვერდის გახსნის ლოდინით გაბეზრებული მომხმარებელი მაინც აღარ გაგექცევათ.
რა თქმა უნდა, შეიძლება ორივენაირი სურათი ატვირთოთ და მომხმარებლის დაკავშირების სიჩქარის მიხედვით შესაბამისი სურათი აჩვენოთ, მაგრამ ამას უფრო ბევრი ცოდნა და მუშაობა სჭირდება. სამაგიეროდ, საკმაოდ მოქნილ სისტემას ვიღებთ, რომელიც თქვენს მომხმარებელს ნამდვილად მოხიბლავს.
|
