Apr 12

এইচটিএমএল ফরম উপাদানসমূহ (HTML Form Elements)

শরিফুল ইসলাম
Job category-Php Coder

<input>Element:

ফর্ম element এর মধ্যে সবচেয়ে গুরুত্বপূর্ণ element হল <input> element. এই element টি বিভিন্ন বিষয়ের উপর ভিক্তি করে বিভিন্ন রকম হয়ে থাকে।

<select> Element (drop-down-list):

উদাহরনঃ

 <select name="cars">
 <option value="volvo">Volvo</option>
 <option value="saab">Saab</option>
 <option value="fiat">Fiat</option>
 <option value="audi">Audi</option>
 </select>

 

 

ফলাফল

 

<option> element পছন্দ মতন কনটেন্ট সিলেক্ট অপশন থেকে নির্বাচন করার জন্য ব্যবহার করা হয়। তালিকাতে সাধারনত প্রথম অপশন টি সিলেক্ট করা থাকে।

উদাহরণ

<option value=”fiat” selected>Fiat</option>

 

 

ফলাফল

 

<textarea> Element

ইনপুট ফিল্ডের অনেকগুলো লাইন লিখার ক্ষেত্রে আমরা <textarea> ব্যবহার করে থাকি।

উদাহরণ

<textarea name=”message” rows=”10″ cols=”30″>
The cat was playing in the garden.
</textarea>

 

 

ফলাফল

 

<button> element

কোন বাটন কে ক্লিক করার জন্য আমরা এই element টি ব্যবহার করে থাকি।

উদাহরণ

<button type=”button” onclick=”alert(‘Hello World!’)”>Click Me!</button>

 

 

ফলাফল

 

এইচটিএমএল ৫ <datalist> element

Pre-defined অপশন্‌স এর তালিকা থেকে ইনপুট এর উপাদান এর জন্য দাতালিস্ত ব্যবহার করা হয়। ইউজার রা pre-defined অপশন্‌স এর একটি তালিকা দেখতে পাবে ডাটা ইনপুট দেওয়ার জন্য। এই জন্য <datalist> element এর ভিতর ID attribute নিশ্চিতভাবে ডিফাইন করে দিতে হবে।

উদাহরণ

<form action="action_page.php">
<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
</datalist>
</form>

 

ফলাফল



 

এইচটিএমএল ৫ <keygen> element

ইউজার রা নিরাপদ ভাবে বৈধতা ঘোষণা করার জন্য এই element ব্যবহার করা হয় । এই element এর মাধ্যমে একজোড়া ফিল্ড তৈরি হয় ফর্ম এর মধ্যে। যখন ফর্ম সাবমিট করা হয় দুই ধরনের key তৈরি হয়। একটি প্রাইভেট এবং পাবলিক। প্রাইভেট key লোকাল ভাবে জমা হয় এবং পাবলিক key সার্ভার এ পাঠানো হয়। client কে certify করার ক্ষেত্রে এই প্রাইভেট key ব্যবহার করা হয় যাতে ভবিষ্যতে এই ইউজার কে অথিনটিকেত করা যায়।

উদাহরণ

<form action=”action_page.php”>
Username: <input type=”text” name=”user”>
Encryption: <keygen name=”security”>
<input type=”submit”>
form>

 

 

ফলাফল

Username:Encryption:

 

এইচটিএমএল ৫ <output> element

কোন ক্যালকুলাসন করার জন্য এবং তার ফলাফল দেখানোর জন্য এই element ব্যবহার করা হয়

উদাহরণ

<form action="action_page.asp"
 oninput="x.value=parseInt(a.value)+parseInt(b.value)">
 0
 <input type="range"  id="a" name="a" value="50">
 100 +
 <input type="number" id="b" name="b" value="50">
 =
 <output name="x" for="a b"></output>
 <br><br>
 <input type="submit">
 </form>

 

 

ফলাফল

0

100 +

=

 

এইচটিএমএল ফর্ম elements

ট্যাগ বর্ণনা
<form> ইউজার দের ইনপুট দেওয়ার জন্য ফর্ম
<input> ইনপুট কে নিয়ন্ত্রণ করার জন্য
<textarea> একের অধিক লাইন কে ইনপুট দেওয়ার জন্য
<lable> একটি ইনপুট এর লেবেল ডিফাইন করার জন্য
<fieldset> একটি ফর্মের মধ্যে গ্রুপ সম্পর্কিত উপাদান ডিফাইন করার জন্য
<legend> <fieldset> element এর নাম দেওয়ার জন্য (caption)
<select> ড্রপ ডাউন তালিকা ডিফাইন করার জন্য
<optgroup> গ্রুপ সম্পর্কিত অপশন ড্রপ ডাউন তালিকা থেকে পাওয়ার জন্য
<option> ড্রপ ডাউন লিস্ট থেকে অপশন সিলেক্ট করার জন্য
<button> বাটন কে ক্লিক করার ক্ষেত্রে
<datalist> pre-defined অপশন্‌স এর একটি তালিকা যা থেকে ইনপুট কে নিয়ন্ত্রণ করা যাবে।
<keygen> ফর্মের একজোড়া key ফিল্ড তৈরি করার জন্য
<optput> calculation এর ফলাফল পাওয়ার জন্য।

 

Apr 11

এইচটিএমএল ও এক্সএইচটিএমএল (HTML and XHTML)

XHTML কি

XHTML এর পূর্নরুপ হল EXtensible HyperText Markup Language। এটি অবিকল HTML এর মত তবে কিছুটা কঠোর। XHTML সব বড় বড় ব্রাউজারে সাপোর্ট করে।

 

কেন XHTML ব্যবহার করবো?

HTML কোডিং এ কোন ভুল থাকলেও অনেক সময় বিভিন্ন ব্রাউজ়ারে তা ধরা পড়েনা এবং ব্রাউজারে সুন্দর ভাবেই দেখা যায়। কিন্ত বর্তমানে বাজারে অনেক নতুন ব্রাউজার এসেছে। অনেকেই কম্পিউটার ছাড়াও মোবাইলে সাইট ভিজিট করছে। অনেক মোবাইল ব্রাউজার HTML এর ভুলগুলো সঠিকভাবে দেখাতে পারেনা। XHTML এ যেহেতু কোডিং সঠিকভাবে করতে হয় তাই XHTML ব্যবহার করাই শ্রেয়।

ডকুমেন্ট এর গঠন (Document Structure)

  • XHTML DOCTYPE আবশ্যক XHTML কোডিং এর ক্ষেত্রে।
  • এর মধ্যে xmlns attribute ও আবশ্যক।
  • <html>, <head>, <title>, <body> ও আবশ্যক।

 

নিম্নে একটি XHTML ডেমো কোড দেয়া হলঃ<

DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

xmlns=”http://www.w3.org/1999/xhtml”>

<head>
<title>Title of document</title>
</head>

<body>
some content
</body>

</html>

 

এক্সএইচটিএমএল এলিমেন্ট XHTML Elements

XHTML elements গুলো সঠিকভাবে বিন্যাস করতে হবে।
ভুলঃ <b><i>This text is bold and italic</b></i>

সঠিকঃ <b><i>This text is bold and italic</i></b>

  • XHTML elements গুলো অবশ্যই সঠিকভাবে শেষ করতে হবে।

ভুলঃ <p>This is a paragraph
<p>This is another paragraph

 

সঠিকঃ
<p>This is a paragraph</p>
<p>This is another paragraph</p>

 

  • XHTML elements গুলো lowercase বা ছোটহাতের হতে হবে।

 

ভুলঃ

<BODY>
<P>This is a paragraph</P>
</BODY>

 

সঠিকঃ
<body>
<p>This is a paragraph</p>
</body>

  • XHTML documents এর অন্তত একটা root element থাকতে হবে।

 

এক্সএইচটিএমএল এট্রিবিউট XHTML Attributes

  • Attribute names গুলো lowercase বা ছোটহাতের হতে হবে।

ভুলঃ <table WIDTH=”100%”>

সঠিকঃ <table width=”100%”>

  • Attribute values গুলোও quoted করা থাকতে হবে।

ভুলঃ <table width=100%>

সঠিকঃ <table width=”100%”>

  • Attribute সংক্ষিপ্ত করা যাবেনা।

ভুলঃ
<input type=”checkbox” name=”vehicle” value=”car” checked />

<input type=”text” name=”lastname” disabled />

 

সঠিকঃ

<input type=”checkbox” name=”vehicle” value=”car” checked=”checked” />

<input type=”text” name=”lastname” disabled=”disabled” />

 

কিভাবে HTML থেকে XHTML রুপান্তর করবো?

১। প্রতিটি পেজ এর প্রথম লাইনে XHTML <!DOCTYPE> যুক্ত করতে হবে।

২। প্রতিটি পেজ এর HTML elements এর মধ্যে xmlns attribute যুক্ত করতে হবে।

৩। প্রতিটি elements গুলো lowercase বা ছোটহাতের করতে হবে।

৪। প্রতিটি elements সঠিকভাবে বন্ধ করতে হবে।

৫। Attribute names গুলো lowercase বা ছোটহাতের করতে হবে।

৬। attribute values গুলো সঠিকভাবে Quote করতে হবে।

 

Apr 11

Searching Data with Apache Solr

Searching Data with Apache Solr

Apr 10

এইচটিএমএল ইউনিফর্ম রিসোর্স লোকেটর (HTML Uniform Resource Locators)

শরিফুল ইসলাম
Job category-Php Coder

 

ওয়েব ঠিকানার অন্য নাম হচ্ছে URL

একটি URL লেখার জন্য আমাদের টাইপ করতে হয় শব্দের সাহায্যে (http://bangla.salearningschool.com) বা ইন্টারনেট প্রটোকল এড্রেস (IP) টাইপ করে, যেমন (192.185.24.202)।

প্রায় সবাই এড্রেস বারে ডোমেইন নামকে টাইপ করে থাকে কারন নাম্বার এর থেকে নাম মনে রাখা সহজ।

 

URL- ইউনিফর্ম রিসোর্স লোকেটর

ওয়েব ব্রাউজার গুলি ওয়েব সার্ভার থেকে url ব্যবহার করার মাধ্যমে কোন পেজ কে গ্রহণ করে থাকে। এইচটিএমএল পেজ এর কোন লিঙ্ক কে ক্লিক করলে <a> ট্যাগ কোন ওয়েব এড্রেস কে নির্দেশ করে। ওয়েব এ কোন ডকুমেন্ট বা পেজ কে খুজে পাওয়ার জন্য URL ব্যবহার করা হয়।

একটি ওয়েব এড্রেস  http://bangla.salearningschool.com/about-us.php নিচের নিয়মগুলোকে অনুসরন করে।

scheme://host.domain:port/path/filename

বর্ণনা

Scheme-ইন্টারনেট সার্ভিস এর ধরন কে ডিফাইন করে। (সাধারনভাবে http হয়ে থাকে)

Host-ডোমেইন এর host ডিফাইন করে (http এর ক্ষেত্রে ডিফল্ট হলত www)

Domain-ইন্টারনেট ডোমেইন এর নাম ডিফাইন করে (salearningschool.com)

port-host এর পোর্ট নাম্বার (http হল 80)

path- সার্ভার এর পাথ ডিফাইন করে (site এর প্রধান directory)

filename-ডকুমেন্ট বা ডাটার নাম

 

সাধারণ URL পরিকল্পনাগুলি

http (HyperText Transfer Protocol)- সাধারনত ওয়েব পেজ এর জন্য ব্যবহার করা হয়।

https (secure HyperText Transfer protocol)-নিরাপদ ওয়েব পেজ এর জন্য ব্যবহার করা হয়।

ftp (File Transfer Protocol)-ফাইল কে আপলোড বা ডাউনলোড করার জন্য

file-কম্পিউটার এর কোন ফাইল

 

URL এনকোডিং

ASCII character set এর মাধ্যমে URL গুলোকে ইন্টারনেট এ পাঠানো হয়। URL এ সবসময় character থাকে এবং তা ASCII তে পরিবর্তন করতে হয়। URL এনকোডিং নন ASCII characters গুলোকে “%” এ প্রতিস্থাপন করা হয় hexadecimal ডিজিট এর মাধ্যমে। URL এ কোন ফাকা জাইগা থাকে না ফাকা জায়গা গুলো (+) চিহ্ন অথবা %20 দিয়ে পুরন করা হয়।

 

ASCII এনকোডিং উদাহরণ

এইচটিএমএল ৫ এর ডিফল্ট character set গুলো হল UTF-8

বর্ণ Windows-1252 থেকে
 UTF-8 থেকে
€ %80 %E2%82%AC
£ %A3 %C2%A3
© %A9 %C2%A9
® %AE %C2%AE
À %C0 %C3%80
Á %C1 %C3%81
 %C2 %C3%82
à %C3 %C3%83
Ä %C4 %C3%84
Å %C5 %C3%85

 

Apr 09

এইচটিএমএল প্রতিক (HTML Symbols)

শরিফুল ইসলাম

 

অনেক গানিতিক, প্রযুক্তিগত, মুদ্রার চিহ্ন নরমাল কীবোর্ড এ পাওয়া যায় না। এইচটিএমএল এর entity নাম ব্যবহার করে আমরা এই চিহ্ন গুলো নিয়ে আসতে পারি। যদি কোন entity নাম না থাকে তাহলে আমরা entity নাম্বার ব্যবহার করতে পারি decimal or hexadecimal রেফারেঞ্চ। যদি আমরা এইচটিএমএল পেজ কোন entity নাম বা কোন নাম্বার ব্যবহার করি তাহলে এই character গুলি সঠিক ফরম্যাট এ ডিসপ্লে করবে।

উদাহরণ

 <p>I will display &euro;</p>
 <p>I will display &#8364;</p>
 <p>I will display &#x20AC;</p>

 

 

এর ফলাফল পাওয়া যাবে

I will display €
I will display €
I will display €

 

 

কিছু গানিতিক চিহ্ন যা এইচটিএমএল সাপোর্ট করে

Char নাম্বার Entity বর্ণনা
∀ &#8704; &forall; FOR ALL
∂ &#8706; &part; PARTIAL  DIFFERENTIAL
∃ &#8707; &exist; THERE EXISTS
∅ &#8709; &empty; EMPTY SETS
∇ &#8711; &nabla; NABLA
∈ &#8712; &isin; ELEMENT OF
∉ &#8713; &notin; NOT AN ELEMENT OF
∋ &#8715; &ni; CONTAINS AS MEMBER
∏ &#8719; &prod; N-ARY PRODUCT
∑ &#8721; &sum; N-ARY SUMMATION

 

কিছু গ্রীক লেটার যা এইচটিএমএল সাপোর্ট করে

Char

নাম্বার

Entity

 বর্ণনা
Α &#913; &Alpha; গ্রীক ক্যাপিটাল লেটার আলফা
Β &#914; &Beta; গ্রীক ক্যাপিটাল লেটার বিটা
Γ &#915; &Gamma; গ্রীক ক্যাপিটাল লেটার গামা
Δ &#916; &Delta; গ্রীক ক্যাপিটাল লেটার ডেলটা
Ε &#917; &Epsilon; গ্রীক ক্যাপিটাল লেটার EPSILON
Ζ &#918; &Zeta; গ্রীক ক্যাপিটাল লেটার যেটা

 

অন্যান্য আরও অনেক entities যা এইচটিএমএল সাপোর্ট করে

Char

নাম্বার

Entity

বর্ণনা
© &#169; &copy; কপিরাইট চিহ্ন
® &#174; &reg; নিবন্ধন চিহ্ন
€ &#8364; &euro; EURO চিহ্ন
™ &#8482; &trade; ট্রেডমার্ক
← &#8592; &larr; বামদিকের নির্দেশ
↑ &#8593; &uarr; উপরের নির্দেশ
→ &#8594; &rarr; ডানদিকের নির্দেশ
↓ &#8595; &darr; নিচের দিকের নির্দেশ
♠ &#9824; &spades; BLACK SPADE SUIT
♣ &#9827; &clubs; BLACK CLUB SUIT
♥ &#9829; &hearts; BLACK HEART SUIT
♦ &#9830; &diams; BLACK DIAMOND SUIT

 

Apr 08

এইচটিএমএল ইনট্রিগুলো (HTML Entities)

শরিফুল ইসলাম
Job category-Php Coder

 

কিছু সংরক্ষিত অক্ষর অবশ্যই character entities দ্বারা পরিবর্তন করতে হয়।

এমনকি যেই অক্ষরগুলো কীবোর্ড এ নাই সেইগুলো পরিবর্তন করা সম্ভব

 

এইচটিএমএল Entities

কিছু অক্ষর এইচটিএমএল এ সংরক্ষিত করা আছে। যদি আমরা কোন টেক্সট এ ছোট চিহ্ন (<) এবং বড় চিহ্ন (>) ব্যবহার করি ব্রাউজার তাদের ট্যাগ দিয়ে মিক্স করে দিতে পারে।

character entities এইচটিএমএল এ কিছু সংরক্ষিত অক্ষর দেখাতে সাহায্য করে।

character entity গুলো নিচের মতন

&entity_name;
OR
&#entity_number;

 

যদি আমরা ছোট চিহ্ন ডিসপ্লে করতে চাই তাহলে লিখব  &lt; বা &#60;

নাম্বার এর পরিবর্তে নাম ব্যবহার করা বেশি উপকারী কারন এতে নামটা বেশি মনে থাকে। এর একটি অপকারিতা আছে কিছু কিছু ব্রাউজার entity নাম নাও পরতে পারে কিন্তু নাম্বার ঠিক পরতে পারে।

 

অবিচ্ছিন্ন স্থান (Non breaking space)

একই লাইন এ ফাকা জায়গা তৈরি করার জন্য &nbsp; ব্যবহার করা হয়। মনে রাখতে হবে ব্রাউজার সবসময় এইচটিএমএল পেজ এর অতিরিক্ত ফাকা জায়গা মুছে ফেলে কেবলমাত্র একটি ফাকা জায়গা রাখে। যদি আমি ১০ টি স্পেস দেই ব্রাউজার তার ৯ টাই মুছে ফেলে ১ টি লিখবে। যদি আমরা টেক্সট এ প্রকৃত ফাকা জায়গা পেতে চাই তাহলে ক্যারেক্টার ব্যবহার করতে হবে।

 

কিছু গুরুত্বপূর্ণ ক্যারেক্টার entities

ফলাফল বর্ণনা নাম প্রবেশকৃত নাম্বার
non-breaking space &nbsp; &#160;
< less than &lt; &#60;
> greater than &gt; &#62;
& ampersand &amp; &#38;
¢ cent &cent; &#162;
£ pound &pound; &#163;
¥ yen &yen; &#165;
€ euro &euro; &#8364;
© copyright &copy; &#169;
® registered trademark &reg; &#174;

 

কিছু বৈশিষ্ট্যসূচক চিহ্ন

একটি বৈশিষ্ট্যসূচক চিহ্ন “glyph” লেখার বর্ণে যোগ করা হয়েছে। আবার কিছু বৈশিষ্ট্যসূচক চিহ্ন: grave ( ̀) এবং acute ( ́) কে বলা হয় accents (কথা)।

বৈশিষ্ট্যসূচক চিহ্ন বর্ণের উপরে , নিচে, পাশে এবং দুটি লেটার এর মাঝে হতে পারে। আলফানিউমেরিক ক্যারেক্টার এর কম্বিনেশন এ এই বৈশিষ্ট্যসূচক চিহ্নগুলো ব্যবহার করা হয়ে থাকে।

কিছু উদাহরণ নিচে দেওয়া হল

চিহ্ন বর্ণ গঠন ফলাফল
  ̀ a a&#768; à
  ́ a a&#769; á
̂ a a&#770; â
  ̃ a a&#771; ã
  ̀ O O&#768; Ò
  ́ O O&#769; Ó
̂ O O&#770; Ô
  ̃ O O&#771; Õ

 

Apr 08

Get Started with Cascading on Hortonworks Data Platform 2.1

Get Started with Cascading on Hortonworks Data Platform 2.1

Apr 08

ম্যাকবুক প্রো এর ট্রাকপ্যাড এর ক্লিক কাজ না করলে এটিকে কিভাবে মেরামত করবেন (How to repair not clicking MacBook Pro trackpad)

যদি ম্যাকবুক প্রো এর ট্রাকপ্যাড (মাউস প্যাড) এ ক্লিক কাজ না করে তাহলে ট্রাবলশুটিং এবং সমস্যা সমাধানের জন্য কিছু নির্দেশনাবলী চেষ্টা করে দেখতে পারেন।

এগুলি নিচের বিষয়গুলোর সাথে সম্পর্কিত হতে পারে:

  1. ত্রুটিপূর্ণ (ফুলে যাওয়া) ব্যাটারি
  2. ট্রাকপ্যাড এর স্ক্রু ভুলভাবে লাগানো
  3. ত্রুটিপূর্ণ ট্রাকপ্যাড

সমস্যা সমাধানের কৌশল ধাপে ধাপে দেখা যাক

trackpad-repair-00

ধাপ 1 :

ব্যাটারি ঠিক আছে কিনা তা দেখার জন্য একে ল্যাপটপ থেকে বিচ্ছিন্ন করতে হবে।

সাধারণত দুই বা তিনটি স্ক্রু দিয়ে কেসিং এর সাথে আটকিয়ে ব্যাটারিকে সরক্ষিত রাখা হয়।

trackpad-repair-01

এই স্ক্রুগুলি Y আকৃতির। আপনি একটি বিশেষ ট্রাই-উইং (তিনটি কিনারাযুক্ত) স্ক্রু ড্রাইভার প্রয়োজন হবে।

আপনি ছোট চ্যাপটা মাথাওয়ালা (ফ্লাট) স্ক্রু ড্রাইবার দিয়ে চেষ্ট করে দেখতে পারেন।

আমি Wiha 1.5 × 40 স্ক্রু ড্রাইভার ব্যবহার করে এটি খুলতে পেরেছি। যদি তিনটির মধ্যে দুইটি ধার এর সাথে মিলে যায় তাহলে আমি উভয় স্ক্রু খুলতে পারবো।

trackpad-repair-03

লজিক বোর্ড থেকে প্লাস্টিকের লাঠি বা আঙুলের নখ দিয়ে ব্যাটারির সংযোগ বিচ্ছিন্ন করুন।

trackpad-repair-02

ব্যাটারি ল্যাপটপ থেকে বিচ্ছিন্ন করুন এবং একটি সমতল স্থানে রাখুন।

পরীক্ষা করে দেখুন যে ব্যাটারি যেমন দেখা উচিৎ তার থেকে চিকন দেখা যায় কিনা।

যখন MacBook Pro এর ব্যাটারি ত্রুটিপূর্ণ হয় তখন কিছু ক্ষেত্রে এটি মোটা দেখা যায়

যদি ফোলা ব্যাটারিটি ল্যাপটপের ভিতরে থাকে তাহলে এটি ট্রাকপ্যাড এর নিচের দিকে চাপ দেয় এবং এর ক্লিক ঠিকমত কাজ করা বন্ধ করে দেয়।

trackpad-repair-04

ফোলা ব্যাটারিটি বিচ্ছিন্ন করুন এবং দেখুন এরপর ট্রাকপ্যাডটি কাজ করে কিনা। যদি এটি কাজ করে তাহলে ব্যাটারিটি পরিবর্তন করুন।

ধাপ 2:

ব্যাটারি বিচ্ছিন্ন করার পরও যদি ট্রাকপ্যাড এর ক্লিক ঠিকমত কাজ না করে, তাহলে নিচের চিত্রের মতো করে স্ক্রুগুলি সমন্বয় করে দেখুন।

আপনার এজন্য T6 torx স্ক্রু ড্রাইভার প্রয়োজন হবে।

স্ক্রু বামাবর্তে ঘুরালে ট্রাকপ্যাড আলগা হয়ে যাবে।

ঘড়ির কাঁটার দিকে ঘুরালে ট্রাকপ্যাডটি আটসাট হয়ে লাগবে।

trackpad-repair-05

আপনার MacBook Pro টি একপাশ করে রাখুন এবং স্ক্রু সমন্বয় করার সময় ট্রাকপ্যাড এর উপর ক্লিক করতে থাকুন।

আপনার জন্য ভাল কাজ করে এমন অবস্থানে থামুন।

trackpad-repair-06

ধাপ 3:

ব্যাটারি বিচ্ছিন্ন করার পর এবং স্ক্রু সমন্বয় করার পরও যদি ট্রাকপ্যাড এর ক্লিক ঠিকমত কাজ না করে, সম্ভবত এটি ক্রুটিপূর্ণ হয়ে গেছে এবং একে পরিবর্তন করতে হবে।

আপনি নতুন যন্ত্রাংম এখানে পেতে পারেন:

MacBook Pro 13″ trackpads.

MacBook Pro 15″ trackpads.

MacBook Pro 17″ trackpads.

এখানে বিচ্ছিন্নকরণ এবং নতুন ট্রাকপ্যাড সংযুক্তকরণ প্রক্রিয়া দেখা হলো :

একটি প্লাস্টিকের লাঠি বা আঙুলের নখ ব্যবহার করে সতর্কভাবে ট্রাকপ্যাড ক্যাবল বিচ্ছিন্নকরুন।

trackpad-repair-07

চারটি সিলভারের স্ক্রু খুলুন।

আপনার একটি ছোট আকৃতির স্ক্রু ড্রাইভার প্রয়োজন হবে। এই স্ক্রুগুলি খুবিই ছোট এবং খোলা সহজ।

আমি Wiha এর স্ক্রু ড্রাইভার ব্যবহার করেছি।

trackpad-repair-08

স্ক্রু খোলার সময় ট্রাকপ্যাড এর নিচের দিকে আপনার আঙুলের সাহায্যে সাপোর্ট দিন।

trackpad-repair-11

সকল স্ক্রু খোলার পর, palm rest এ যেভাবে প্রতিক দ্বারা চিহ্নিত করা আছে সেভাবে ট্রাকপ্যাড এর নিচের দিকে স্লাইড করুন।

trackpad-repair-14

কেসিং থেকে খোলার জন্য তারটি ধরে টানুন।

MBP-trackpad-repair-16

ত্রুটিপূর্ণ ট্রাকপ্যাডটি অপসারণ করুন এবং নতুন একটি দিয়ে পরিবর্তন করুন।

Fail

ট্রাকপ্যাড ক্যাবল সংযুক্ত করার মাধ্যমে পুণসংযোগ কার্যক্রম শুরু করুন।

একটি ছোট চ্যাপ্টা স্ক্রু ড্রাইভারের সাহায্যে কানেকটরটি সংযুক্ত করতে পারেন।

Repair

ট্রাকপ্যাডটি আগের স্থানে স্থাপন করুন।

Repair Laptop

চারটি সিলভার স্ক্রু দিয়ে এটিকে নিরাপদ করুন কিন্তু এখনই এদেরকে আটসাটভাবে লাগাবেন না।

Laptop Re

MacBook Pro কে উপরের দিকে ঘুরান এবং ট্রাকপ্যাড এর পজিশন ঠিক করুন।

নিশ্চিত হয়ে নিন যে ট্রাকপ্যাড এবং Palm rest এর মধ্যকার দূরত্ব সমান থাকে।

ঠিকভাবে বসার পরে, আপনি চারটি সিলভার স্ক্রুকে টাইট করুন।

trackpad-repair-16

নতুন ট্রাকপ্যাড এর স্ক্রু আগে উল্লেখিত নিয়ম অনুযায়ী সমন্বয় করা প্রয়োজন হতে পারে।

trackpad-repair-06

Apr 08

ম্যাকবুক 13-ইঞ্চি হয়াইট ইউনিবডি এর স্ক্রীণ কিভাবে পরিবর্তন করবেন (How to replace screen on MacBook 13-inch white unibody)

replace-screen-00

কিভাবে ম্যাকবুক 13-ইঞ্চি ইউনিবডি ল্যাপটপ এর এলসিডি স্ক্রীণ পরিবর্তন করবেন এখানে সে সম্পর্কে আলোচনা করা হলো। এই নির্দেশাবলী আপনি ম্যাকবুক লেট-2009 এবং মিড-2010 মডেল এর ক্ষেত্রেও ব্যবহার করতে পারবেন।

ধাপ ১ :

আমার জোরালো পরামর্শ হলো ল্যাপটপ ডিসঅ্যাসেম্বলি (ল্যাপটপ থেকে যন্ত্রাংশ বিচ্ছিন্ন) করার সময় অবশ্যই ব্যাটারির সংযোগ বিচ্ছিন্ন করে নিবেন।

replace-lcd - 01

ধাপ 2 :

অবশ্যই ব্যাটারী ল্যাপটপ থেকে খুলে ফেলবেন।

এটি ছয়টি স্ক্রু দ্বারা সুরক্ষিত থাকে : তিনটি সাধারণ ফিলিপস স্ক্রু (হলুদ বৃত্ত চিহ্নিত) এবং তিনটি ট্রাই-উইং স্ক্রু (লাল বৃত্ত চিহ্নিত)।

যদি আপনার ট্রাই-উইং স্ক্রু ড্রাইভার না থাকে তাহলে ছোট সমতল মাথাযুক্ত স্ক্রু ড্রাইভারও ব্যবহার করতে পারেন।

replace-screen-02

ধাপ 3 :

ব্যাটারী খুলে নিন।

replace-screen-03

ধাপ 4 :

পর্দার ফ্রেমটি আঠালো টেপ দ্বারা ডিসপ্লে এর সাথে লাগানো থাকে।

যদি আপনি ফ্রেমটি প্রথমে একটু গরম করে নেন তাহলে এটি সহজেই অলাদা করে ফেলতে পারবেন।

গরম করার যন্ত্রটি (হিট গান) ব্যবহারের সময় সতর্ক থাকুন। যদি আপনি ফ্রেমটি অতিরিক্ত গরম করে ফেলেন তাহলে এটি স্থায়ীভাবে নষ্ট হয়ে যেতে পারে।

এক্ষেত্রে হেয়ার ড্রাইয়ার ব্যবহার করা সম্ভবত বেশি নিরাপদ। ফ্রেমটি যেন পুড়ে যাবে না। এটি যথেষ্ট পরিমাণে উষ্ণ করতে হবে যাতে আঠালো টেপটি নরম হয়ে যায়।

replace-lcd-screen-04

ধাপ 5 :

একটি ধারালো বস্তু ব্যবহার করে ফ্রেমটি পৃথক করা শুরু করুন।

replace-screen-05

ধাপ 6 :

আপনার আঙুলের সাহায্যে ফ্রেমটি পৃথক করতে থাকুন।

আঠালো টেপটি যতটা সম্ভব স্পর্শমুক্ত রাখুন যাতে এটি পুনরায় ব্যবহার করা যায়।

ফ্রেমটি পৃথক করার সময় এটি উষ্ণ রাখার জন্য গরম করার যন্ত্র (হিট গান) বা হেয়ার ড্রাইয়ার ব্যবহার করতে থাকুন।

replace-screen-06

ধাপ 7 :

যখন আপনি পর্দার নিচের প্রান্তে পৌছে যাবেন তখন ফ্রেমটি পৃথক করার জন্য প্লাস্টিকের লাঠি ব্যবহার করা বেশি সুবিধাজনক।

আপনি দেখতে পাচ্ছেন ফ্রেমটি খুবই নমনীয়।

replace-screen-07

ধাপ 8 :

পর্দার নিচের প্রান্ত থেকে ফ্রেমটি পৃথক করতে থাকুন।

এটি সম্ভবত সবচেয়ে কঠিন অংশ।

replace-screen-08

ধাপ 9 :

LCD পর্দা সুরক্ষার জন্য ব্যবহৃত ছয়টি স্ক্রু খুলুন।

আপনাকে ছোট চ্যাপটা মাথা বিশিষ্ট ফিলিপস স্ক্রু ড্রাইভার ব্যবহার করতে হবে।

replace-screen-09

ধাপ 10 :

ব্যাক কভার থেকে পর্দাটি আলাদা করুন।

replace-screen-10

ধাপ 11 :

পর্দাটিকে উচু করে ধরুন যাতে আপনি সংযুক্ত ক্যাবল এর কাছে যেতে পারেন।

সংযোগকারী ক্যাবল এর কাছে পৌছানোর খুব সীমিত জায়গাই পাবেন।

replace-screen-11

ধাপ 12 :

সংযোগ সুরক্ষিত করার জন্য ব্যবহৃত কালো টেপটি অপসারণ করুন।

replace-screen-12

ধাপ 13 :

সতর্কভাবে সংযোগটি বিচ্ছিন্ন করুন।

replace-screen-13

ধাপ 14 :

এখন আপনি ভিডিও ক্যাবলটি টেনে সরিয়ে নিতে পারবেন।

এখন ক্ষতিগ্রস্থ LCD পর্দাটি অপসারণ করুন এবং নতুন একটি সংযুক্ত করার জন্য প্রস্তুত হন।

replace-screen-14

ধাপ 15 :

নতুন পর্দাটির (স্ক্রীণ) নিয়ে এসে একে সঠিক অবস্থান এ রাখুন যাতে আপনি ভিডিও ক্যাবলটি সংযুক্ত করতে পারেন।

replace-screen-15

ধাপ 16 :

ক্যাবলটি সংযুক্ত করুন।

replace-screen-16

ধাপ 17 :

সংযোগ সুরক্ষিত করার জন্য ব্যবহৃত কালো টেপটি পুনরায় সংযোগকারী স্থানে লাগিয়ে দিন।

replace-screen-17

ধাপ 18 :

ছয়টি স্ক্রু লাগিয়ে LCD পর্দাটিকে সুরক্ষিত করুন।

ফ্রেমটি লাগানোর পুর্বে স্ক্রিণটি ঠিকভাবে কাজ করছে কিনা তা পরীক্ষা করে নেয়া ভাল।

replace-screen-18

ধাপ 19 :

আঠালো টেপটি এবং ফ্রেমটির পিছনের পার্শ্ব ভাল করে লক্ষ করুন।

যদি আঠালো টেপটি বাহিরের দিকে বের হয়ে থাকে তাহলে এটিকে সোজা করে দেয়া বা কেটে ফেলাই ভাল।

ফ্রেমটি ডিসপ্লে এর সাথে যতটা সম্ভব মসৃণভাবে বসতে হবে।

replace-screen-19

ধাপ 20 :

নতুন পর্দা থেকে প্রতিরক্ষামূলক ফিল্ম (পাতলা ছাল) সরান (যদি থেকে থাকে)।

replace-screen-20

ধাপ 21 :

সর্বশেষে, ফ্রেমটি জায়গামতো বসান এবং আঠালো বস্তুর সাথে পুনরায় লাগান।

replace-screen-21

 

Apr 07

HTML Head (এইচটিএমএল হেড)

Atik Hasan

Webpage design & developer

 

HTML Head (এইচটিএমএল হেড):

<head>…..</head> ট্যাগ দিয়ে head সেকশন গঠিত। head সেকশনে meta data অর্থাৎ ডকুমেন্ট সম্পর্কিত তথ্য থাকে।এই head সেকশন এ যা কিছু লেখা হয় তা ওয়েব পেইজ এ দেখা যায় না। head সেকশন এ সাধারণত নিম্মের ট্যাগগুলো থাকেঃ

Title, Meta, Link, Base, Style, Script

 

শিরোনাম ট্যাগ

এই ট্যাগের মাঝে যা লিখা হয় তা Browser এর টাইটেল বারে দেখা যায়। মূলত ওয়েব পেইজ content এর একটি সংক্ষিপ্ত টাইটেল এই ট্যাগের মাঝে লেখা হয়। যেমন আমি যদি ওয়েব পেইজ ডিজাইনের বিভিন্ন এলিমেন্ট নিয়ে একটি ওয়েব পেইজ বানাতে চাই তা হলে টাইটেল নিচের মত হলে ভাল হয়ঃ-

<title>web page design tutorial</title>

 

 

মেটা ট্যাগ

এই ট্যাগ ব্যাবহার করা হয় ডকুমেন্ট সম্পর্কিত সকল তথ্য সন্নিবেশ/বর্ণনা করার জন্য।মেটা ডাটা browser, search engine এবং অন্নান্য ওয়েব সারভিস দ্বারা বেবহৃত হয়।  সার্চ ইঞ্জিন ইনডেক্সিং এর জন্য এ ট্যাগের গুরুত্ত অপরিসীম।

সার্চ ইঞ্জিনের জন্য keywords নির্ধারণ করাঃ

<meta name=”keywords” content=”HTML, CSS, XML, XHTML, JavaScript”>

 

 

ওয়েব পেজ এর description নির্ধারণ করাঃ

<meta name=”description” content=”Free Web tutorials on HTML and CSS”>

 

 

ওয়েব পেজ এর author নির্ধারণ করাঃ

<meta name=”author” content=”Hege Refsnes”>

 

 

ওয়েব পেজ এর character set নির্ধারণ করাঃ

<meta charset=”UTF-8″>

 

 

৩০ সেকন্ড পরপর ওয়েব পেজ auto refresh করাঃ

<meta http-equiv=”refresh” content=”30″>

 

 

লিঙ্ক ট্যাগ

Link ট্যাগটি দ্বারা একটি পেইজকে অন্য পেইজের সাথে বা এলিমেন্টের সাথে সম্পর্ক ইস্থাপন করা হয়।এই ট্যাগ টি সাধারণত স্টাইল শীট যোগ করার জন্য ব্যাবহার করা হয়।

<link rel=”stylesheet” href=”mystyle.css”>

 

 

বেজ ট্যাগ

Base ট্যাগ টি দ্বারা ওয়েব সাইটের সকল লিঙ্ক জন্য এর একটি default অ্যাড্রেস বা default target  সেট করিয়ে দেয়া হয়।যেমনঃ-

<base href=”http://bangla.salearningschool.com” target=”_blank”>

 

 

যেহেতু আমরা base অ্যাড্রেসের target হিসেবে _blank দিয়েছি সেহেতু এই পেইজের কোন লিঙ্ক এ ক্লিক করলে নতুন একটি ট্যাব এ পেজটি ওপেন হবে।

 

স্টাইল ট্যাগ (Style Tag)

HTML ডকুমেন্টটিতে কি ধরণের ইস্টাইল ব্যাবহার হবে তা এই style ট্যাগ দ্বারা লেখা হয়। যেমনঃ-

<style>
body {background-color:yellow;}
</style>

 

 

স্ক্রিপ্ট ট্যাগ (Script Tag)

Script ট্যাগটি Java script লেখার জন্য ব্যাবহার করা হয়। যেমন আমরা ওয়েব পেজ এ Hello JavaScript এই লেখাটুকো দেখাব demo নামক id ব্যাবহার করে।

<script>
function myFunction {
document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script>