Responsive Advertisement

Creating and Using Images in HTML

 Abuurista Sawirrada iyo Isticmaalkooda HTML




Qaybta >>> Abuurista Sawirrada


Markii hore ee nolosha Shabakadda Caalamiga ah (World Wide Web), sawirradu aad bay u yareyd. Xogta badankeedu waxay ku jirtay qoraal kaliya. Maanta, haddii boggaaga internetka uusan lahayn sawirro, waxa uu noqon doonaa mid aan soo jiidasho lahayn, maadaama sawirro ay yihiin qeyb muhiim ah oo ka mid ah website-yada casriga ah. Sawirradu waxay ka caawiyaan in boggaaga soo jiito booqdayaasha oo ay hayaan dareenkooda, taas oo ka dhigaysa boggaaga mid xiiso leh oo la fahmi karo.

Si kastaba ha ahaatee, waa muhiim inaad iska ilaaliso inaad website-kaaga ku shubto sawirro badan. Haddii boggaaga uu leeyahay sawirro badan oo culus, booqdayaashu waxay ka tagi karaan boggaaga sababtoo ah sawirradaas ayaa qaadanaya waqti dheer si ay u soo shubmaan. Sidaa darteed, waa muhiim in la helo dheelitirnaan dhexmara sawirrada iyo xogta qoraalka ah ee boggaaga.


---


Fahamka Faylasha Sawirrada


Waxaa jira laba qaab oo sawirrada ah oo aad ugu caansan browser-yada internetka:


1. **GIF (Graphics Interchange Format)**  

2. **JPG/JPEG (Joint Photographic Experts Group)**


Labada qaab waxay taageeraan kaydinta sawirrada. Qaabka ugu habboon ayaa ku xiran nooca sawirka aad kaydinayso.


**OGOW:** Qaab saddexaad oo loo yaqaan **PNG (Portable Network Graphics)** ayaa sidoo kale ku jira HTML. PNG waxaa loogu talagalay inuu bedelo GIF, isagoo awood dheeri ah u leh, laakiin taageeradiisa weli waa mid xaddidan maadaama uu yahay mid cusub oo kaliya lagu isticmaalo browser-yada casriga ah.


- **GIF:** GIF waa qaab sawir ah oo la sameeyay 1987, waana midka ugu da'da weyn ee sawirrada. Inkasta oo ay aad u caan tahay, GIF waxaa xaddidan tirada midabada ee ay taageerto. GIF waxa ay taageertaa ugu badnaan 256 midab oo keliya, taas oo ka dhigaysa mid aan ku habboonayn sawirro leh midabyo badan ama faahfaahin sare.


---


**Isticmaalka Sawirrada ee HTML**


Si aad sawir ugu darto boggaaga HTML, waxaad isticmaali kartaa calaamadda `<IMG>`. Calaamaddan waxay sawirka ku dhex dhigeysaa qoraalka isla markaana waxaa ku jira sifooyin kaa caawinaya inaad sawirka u habeyso sida aad rabto. Calaamadda `<IMG>` ma laha qayb dhamaadka ah, laakiin waxay leedahay sifooyin (attributes) kala duwan. Qaar ka mid ah sifooyinkaas ayaa ah:


- **SRC:** Goobta iyo magaca faylka sawirka. Haddii sawirku ku jiro isla galka (folder) uu boggaaga ku jiro, ma loo baahna in la tilmaamo waddada faylka. SRC waa sifo waajib ah.

- **ALT:** Qoraal uu soo bandhigo browser-ka haddii sawirka aan la muujin karin. Sidoo kale, ALT waxa uu ka muuqan karaa inta sawirku uu soo shubmayo ama wuxuu ka muuqan karaa "ToolTip" marka mouse-ka lagu dul saaro sawirka.

- **ALIGN:** Waxay qeexeysaa sida qoraalka uu ugu wareegayo sawirka. Qiimayaasha saxda ah ee loo isticmaali karo waxaa ka mid ah: *bottom* (default), *top*, *middle*, *left*, iyo *right*.

- **BORDER:** Waxay abuureysaa xariiq ka wareegsan sawirka.

- **HEIGHT:** Waxay qeexeysaa dhererka sawirka. Haddii aad dhigto dherer ka badan ama ka yar kii sawirku lahaa asal ahaan, sawirka wuu fidin doonaa ama wuxuu isku yaraan doonaa.

- **WIDTH:** Waxay qeexeysaa ballaca sawirka. Sida dhererka, haddii aad bedesho ballaca, sawirku wuu fidin doonaa ama wuxuu isku yaraan doonaa.

- **HSPACE iyo VSPACE:** Waxay ku daraan meel bannaan (space) sawirka iyo qoraalka ama sawirrada kale ee ku ag yaal bogga. HSPACE wuxuu ku daraa bannaan horizontal, halka VSPACE uu ku daraa bannaan vertical.

- **USEMAP:** Waxay sawirka u qeexaysaa inuu noqdo khariidad (image map).


---


Tusaale Isticmaalka Sawir ee HTML:


```html

<BODY>

  <CENTER><B>Jaamacadda Bariga Afrika</B></CENTER><br>

  <IMG src="Images/eauedu.jpg" alt="Jaamacadda Bariga Afrika" align="left" border="1">

  Jaamacadda Bariga Afrika waxay ku taallaa magaalada Boosaaso ee Soomaaliya, qaybta waqooyi bari ee dalka. Soomaaliya waxay ku taallaa geeska bari ee Afrika, oo loo yaqaan Geeska Afrika.<BR><BR>

  Kampaska jaamacadda wuxuu leeyahay 49.19 hektar oo dhul ah waxaana uu ku yaalaa 5 km uga fog bartamaha magaalada. Boosaaso ayaa loo doortay inuu noqdo goobta jaamacadda iyadoo la tixgelinayo dadkeeda badan, iskuulo badan oo hoose iyo muhiimadda ganacsi ee magaalada.<BR>

  Jaamacadda Bariga Afrika waa jaamacadda ugu weyn uguna dhameystiran ee ka jirta gobollada bariga Soomaaliya (Puntland), si loo buuxiyo baahida waxbarasho ee bulshada.

</BODY>

```


---


Gabagabo:


Sawirrada waa qayb muhiim ah oo ka mid ah bogagga internetka casriga ah, laakiin waa muhiim inaad ka taxadarto in sawirrada aysan ka badnayn ama ka culusayn, si aysan boggaaga uga dhigin mid aad u gaabis ah oo booqdayaashu ka tagaan. Hubi in aad isticmaasho sawirrada ku habboon, qaababka saxda ah, iyo inaad si fiican u isticmaasho sifooyinka HTML si aad sawirrada ugu habeyso boggaaga.  


Haddii aad u baahan tahay tusaalooyin dheeri ah ama sharraxaad intaas ka badan, waan diyaar ahay inaan kaa caawiyo!






Isku-duwidda Sawirka iyo Qoraalka:


Marka aad rabto inaad sawir ku xiriiriso qoraal, waxaad isticmaali kartaa sifooyinka **ALIGN** ee ku jira calaamadda `<IMG>`. Sifooyinkan waxay kuu oggolaanayaan inaad si habboon ugu meel mariyo sawirka qoraalka ku xiga. Sifooyinka ALIGN waxay taageeraan shan qiime oo kala duwan:


1. **TOP:** Sawirka waxa uu ku yaalaa bidixda, qoraalka koowaadna waxa uu ku dhigan yahay kor saamaha sawirka.

2. **MIDDLE:** Sawirka waxa uu ku yaalaa bidixda, qoraalka koowaadna waxa uu ku dhigan yahay bartamaha sawirka.

3. **BOTTOM:** Sawirka waxa uu ku yaalaa bidixda, qoraalka koowaadna waxa uu ku dhigan yahay hoos saamaha sawirka. Tani waa qiimaha **default** ah.

4. **LEFT:** Sawirka waxa uu ku yaalaa bidixda, qoraalkuna waxa uu ku soconayaa midigta sawirka.

5. **RIGHT:** Sawirka waxa uu ku yaalaa midigta, qoraalkuna waxa uu ku soconayaa bidixda sawirka.


Marka la adeegsanayo sifooyinka ALIGN, waxaa suurtagal ah in sawirka iyo qoraalka si wanaagsan loo habeeyo si ay u noqdaan kuwo isku dheelitiran, ugana dhigaan boggaaga mid akhris fiican leh.


---



Cabbirka iyo Xuduudaha Sawirka:


Labada sawir ee GIF iyo JPEG waxay leeyihiin ballac iyo dherer ku dhex jira sawirka, waxaana badanaa lagu qeexaa pixels. Qalabka tafatirka sawirrada ayaa ku siin kara qiimaha pixel-ka ee sawir kasta. Sifooyinka **HEIGHT** iyo **WIDTH** ee calaamadda `<IMG>` waxay kuu oggolaanayaan inaad bedesho cabbirka sawirka, taas oo keeni karta in sawirku uu fidiyo ama yaraan doono. Waxaad qeexi kartaa cabbirrada sawirka adigoo isticmaalaya pixels ama boqolkiiba (percentage).


- **HEIGHT:** Waxay qeexeysaa dhererka sawirka. Haddii aad dhigto dherer ka badan ama ka yar kii sawirku lahaa asal ahaan, sawirka wuu fidin doonaa ama wuxuu isku yaraan doonaa.

- **WIDTH:** Waxay qeexeysaa ballaca sawirka. Sida dhererka, haddii aad bedesho ballaca, sawirku wuu fidin doonaa ama wuxuu isku yaraan doonaa.


---


**Isticmaalka Sawirka sida Background:**


Waxaa sidoo kale suurtogal ah in sawir lagu isticmaalo sida "background" (asalka) ee boggaaga. Si taas loo sameeyo, waxaad isticmaali kartaa sifooyinka **BACKGROUND** ee calaamadda `<BODY>`. Haddii sawirka aad dooratay uu leeyahay cabbirro yaryar, waxaad ku dhigi kartaa sawirka inuu soo muuqdo inta badan bogga, taasoo sawirka ku tartami karta bogga oo dhan.


Marka aad dooranayso sawir asalka ah, waxaa muhiim ah laba arrimood:


1. **Cabbirka Faylka:** Waa inaad hubisaa in sawirka uu yahay mid aan weynayn. Sawirrada yaryar waxay si dhaqso ah ugu soo bixi doonaan dadka leh xiriir internet oo gaabis ah.

2. **Isku-dhafka Midabka Sawirka iyo Qoraalka:** Hubi in isku dhafka midabka sawirka iyo qoraalka uu yahay mid muuqda oo akhris wanaagsan u leh booqdayaasha. Haddii sawirku uu noqdo mid aad u muuqda ama midabkiisu uu ku qarinayo qoraalka, booqdayaashu waxay dhibtoon doonaan in ay akhriyaan qoraalka, taas oo ka dhigaysa boggaaga mid aan soo jiidasho lahayn.


---


Tusaale Isticmaalka Sawir Asal (Background):


```html

<BODY background="Images/eau.jpg">

```


---


Watermarks


Watermarks waa sawirro ku saleysan asalka oo aan dhaqaaqin marka booqdaha uu bogga u kala socdo kor iyo hoos. Haddii sawirkaaga asal (background) uusan ahayn watermark, marka booqdaha uu bogga u rog-rogo, sawirku wuxuu raaci doonaa bogga. Si loo abuuro watermark, waxaad isticmaali kartaa sifooyinka **BGPROPERTIES** ee calaamadda `<BODY>`, taasoo sawirka ka dhigaysa mid aan dhaqaaqin.


Tusaale Isticmaalka Watermark:


```html

<BODY background="Images/eau.jpg" bgproperties="fixed">

```


---


Gabagabo:


Sawirrada iyo qoraallada waa inay si wanaagsan ugu habboon yihiin boggaaga si loo hubiyo in booqdayaasha ay si fudud u fahmaan waxa ku qoran isla markaana ay ku raaxaystaan isticmaalka boggaaga. Isku dhafka saxda ah ee sawirka iyo qoraalka, cabbirka sawirrada, iyo isticmaala sawirada asalka ah ama watermark-ka ayaa muhiim u ah naqshadeynta bog internet oo soo jiidasho leh oo si fiican u shaqeeya.

Post a Comment

0 Comments