HTML-এ <area> ট্যাগ ইমেজ ম্যাপে একটি ক্লিকযোগ্য এলাকা (এরিয়া) সংজ্ঞায়িত করতে ব্যবহৃত হয়। এটি <map> এলিমেন্টের ভিতরে থাকে।
প্রধান অ্যাট্রিবিউটগুলো:
| অ্যাট্রিবিউট | মান | বিবরণ |
|---|---|---|
| alt | text | এরিয়ার জন্য বিকল্প টেক্সট (অ্যাক্সেসিবিলিটির জন্য বাধ্যতামূলক) |
| coords | shape অনুযায়ী কোঅর্ডিনেট | ইমেজ ম্যাপে এলাকা নির্ধারণ করার কোঅর্ডিনেট |
| download | filename | লিঙ্ক ক্লিক করলে ফাইল ডাউনলোড হবে |
| href | URL | লিঙ্ক করার পেজের URL |
| hreflang | language_code | টার্গেট URL-এর ভাষা |
| media | media query | টার্গেট URL কোন ডিভাইস/মিডিয়ার জন্য অপ্টিমাইজড |
| rel | nofollow, noopener, noreferrer, bookmark, tag ইত্যাদি | কারেন্ট ডকুমেন্ট ও টার্গেট URL-এর সম্পর্ক |
| shape | rect, circle, poly, default | এরিয়ার আকৃতি (আয়ত, বৃত্ত, বহুভুজ) |
| target | _blank, _self, _parent, _top | লিঙ্ক কোথায় খুলবে |
| type | mime_type | টার্গেট URL-এর MIME টাইপ |
coords ফরম্যাট:
rect:left, top, right, bottomcircle:centerx, centery, radiuspoly:x1, y1, x2, y2, ..., xn, yn
উদাহরণ
<!DOCTYPE html> <html> <body> <h2>শেখা</h2> <p>এই টেকনোলজিগুলো সহজে শিখুন....</p> <img src = "/images/usemap.gif" alt = "usemap" border = "0" usemap = "#tutorials"/> <map name = "tutorials"> <area shape = "poly" coords = "74,0,113,29,98,72,52,72,38,27" href = "/perl/index.htm" alt = "Perl Tutorial" target = "_blank" /> <area shape = "rect" coords = "22,83,126,125" alt = "HTML Tutorial" href = "/html/index.htm" target = "_blank" /> <area shape = "circle" coords = "73,168,32" alt = "PHP Tutorial" href = "/php/index.htm" target = "_blank" /> </map> </body> </html>
অ্যাক্সেসিবিলিটি: প্রতিটি <area>-এ alt অ্যাট্রিবিউট বাধ্যতামূলক যাতে স্ক্রিন রিডার ব্যবহারকারী বুঝতে পারেন লিংকটি কী জন্য।