Awesome! টিউনস
সকল Awesome! টিউনস

ওয়েব ডিজাইন এর হাতেখড়ি [পর্ব-০২] :: টেক্সট ফরমেটিং, অ্যাড্রেস এবং অ্যাব্রিভিয়েশন ট্যাগ এর ব্যবহার

4,716 দেখা 10 টিউমেন্টস জোসস
টিউন বিভাগ এইচটিএমএল
প্রকাশিত
Level 0

10 টিউনস 6 টিউমেন্টস 0 ফলোয়ার

ওয়েব ডিজাইন এর হাতেখড়ি

কেমন আছেন সবাই। আশা করছি সবাই ভালো আছেন। গত পর্বে আমরা বিভিন্ন ট্যাগ এর ব্যবহার সম্পর্কে জানতে পেরেছি। আজ আমরা সেই সমস্ত ট্যাগ এর ব্যবহার দেখব। তাহলে চলুন শুরু করা যাক। প্রথমে দেখা যাক টেক্সট ফরমেটিং ট্যাগ গুলো কিভাবে কাজ করে। একটি নোটপ্যাড ওপেন করে হুবহু নিম্নের কোডটি টাইপ করুন-

<html>
<head>
<title> Text Formating</title></pre>
<head>

<body>

<p><b> This line is bold. </b></p>

<p><i> This line is italic. </i></p>

<p><strong> This line is strong. </strong></p>

<p><big> Text of this line is big. </big></p>

<p><em> This line is emphazied.</b></p>

</body>

</html>

এবার এটিকে যেকোন একটি নাম দিয়ে .html এক্সটেনশন দিয়ে সেভ করে ওপেন করুন। আশা করছি বিষয়টি আপনার কাছে পরিষ্কার হয়েছে। এখানে প্রত্যেকটি লাইনকে আলাদা ভাবে দেখানোর জন্য প্যারাগ্রাফ এর ব্যবহার করা হয়েছে। এবং টেক্সট গুলোতে ট্যাগ সম্পর্কে বলা হয়েছে।

এবার অন্য একটি ট্যাগ অতি প্রয়োজনীয় ট্যাগ এর ব্যবহার দেখা যাক। ধরুন আপনি আপনার এইচ টি এম এল ডকুমেন্টটিতে কোন ঠিকানা(address) যুক্ত করতে চাচ্ছেন স্বাভাবিক ভাবেই এর টেক্সট গুলোকে অন্য ভাবে প্রদর্শন করা প্রয়োজন যে কাজটি আমরা অতি সহজেই অ্যাড্রেস ট্যাগ ব্যবহারের মাধ্যমে করতে পারি। নিম্নের কোডটি দেখুন-


<html>

<head>

<title>Address</title>

<head>

<body>

<address>

ABH World<br>

Office: 24/4A (4th Floor Genius Shopping Center),<br>

Bashundhora R/A Main Road, Dhaka- 1229 <br>

Phone: 02 8417476, 01616 224 224 <br>

E-mail: [email protected]<br>

Web: www.abhworld.com

</address>

</body>

</html>

এখানে পুরো আড্রেসটিকে <address></address> ট্যাগ এর ভিতরে লেখা হয়েছে। এবং প্রতিটি লাইনের শেষে <br> ট্যাগ ব্যবহার করে লাইন ব্রেক তৈরি করা হয়েছে।

এবার আসুন দেখা যাক অ্যাব্রিভিয়েশন ট্যাগ এর ব্যবহার। অনেক সময় আমরা ওয়েবপেজ এ বিভিন্ন লেখার ভিতরে জায়গায় জায়গায় শব্দ সংক্ষেপ দেখতে পায়। যেগুলোর উপর মাউস পয়েন্টার নিয়ে গেলে আমরা সেটির পুরো অর্থ দেখতে পায়। এখন প্রশ্ন হলো এটা কিভাবে করে ? এটিকেও খুব সুহজেই করা সম্ভব <abbr></abbr> ট্যাগ ব্যবহারের মাধ্যমে। নিম্নের কোডটি দেখুন-


<html>

<head>

<title>Abbreviation </title>

<head>

<body>

<abbr title="World Wide Web">www</abbr>

</body>

</html>

আজ এ পর্যন্ত।

সবাইকে ধন্যবাদ।

-মুন্সী বরকত উল্লাহ (জনি)

Level 0

আমি মুন্সী বরকতুল্লাহ জনি। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 10 বছর 8 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 10 টি টিউন ও 6 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 0 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।

টিউনস

আরও টিউনস

টিউনারের আরও টিউনস

টিউমেন্টস

Level 0

এইচ টি এম এল কোড

Level 2

Ager link ta dile valo hoy

Level 9

প্রিয় টিউনার,

আপনি ভুল ভাবে আপনার চেইন টিউনের শিরোনাম গুলো দিচ্ছেন। আপনি পর্ব হিসেবে টিউনের শিরোনাম গুলো –

চেইন টিউনের নাম [পর্ব-০১] :: চেইন টিউনের ভিতরের বিষয়বস্তু …

চেইন টিউনের নাম [পর্ব-০২] :: চেইন টিউনের ভিতরের বিষয়বস্তু ….

চেইন টিউনের নাম [পর্ব-০৩] :: চেইন টিউনের ভিতরের বিষয়বস্তু

এর অর্থ প্রথমে চেইন টিউনের নাম, এরপর (স্পেস দিয়ে) স্কয়ার ব্রাকেটের ( [ ] ) মধ্যে পর্ব হাইফেন (-) দিয়ে দুই সংখ্যায় পর্বের নম্বর। স্কয়ার ব্রাকেটের ( [ ] ) ভিতরে কোন স্পেস দিবেন না। এরপর (স্পেস দিয়ে) ডাবল কোলন (::) এর পরে (স্পেস দিয়ে) চেইন টিউনের ভিতরের বিষয়বস্তু॥ এই ফরমেটে চেইন টিউনের শিরোনাম গুলো লিখুন।

এই চেইনের পূর্বের পর্ব গুলোর শিরোনাম গুলোও যদি ‘টেকটিউনস চেইন টিউনের’ শিরোনাম মোতাবেক করা না থাকে তবে সব গুলো এখনই সংশোধন করুন ও পরবর্তী সকল চেইন টিউনে সঠিক ভাবে চেইন টিউনের শিরোনাম দিন।

টিউনের শিরোনাম গুলো ‘টেকটিউনস চেইন টিউনের’ শিরোনাম মোতাবেক সঠিক ভাবে সংশোধন করে আপডেট করে এই টিউমেন্টটির প্রতুত্তর (রিপ্লাই) দিন। টেকটিউনস থেকে আপনার টিউন গুলো চেইন করে দেওয়া হবে।

চেইন টিউন কীভাবে প্রক্রিয়া হয় তা জানতে ‘টেকটিউনস সজিপ্র’ https://www.techtunes.io/faq এর ‘চেইন টিউন’ অংশ দেখুন। ধন্যবাদ।

Level 9

প্রিয় টিউনার,

আপনার টিউন যেহেতু প্রোগ্রামিং সংক্রান্ত টিউন ও টিউনে কোডের ব্যবহার রয়েছে তাই বিভিন্ন প্রোগ্রামিং ল্যাঙ্গুয়েজের কোড যেমন HTML, CSS, JS, PHP ইত্যাদি কোড সুন্দর ও সঠিক ভাবে দেখাতে টেকটিউনসের রয়েছে নিজেস্ব “কোড হাইলাইটার”। টেকটিউনসের “কোড হাইলাইটার” কিভাবে ব্যবহার করতে হয় তা জানতে এই টিউনটি দেখুন।

ধন্যবাদ।

Level 9

প্রিয় টিউনার,

আপনার টিউন গুলো খুবই ভাল হচ্ছে।

➡ তবে আপনি আপনার টিউনে প্রয়োজনীয় ছবি ও স্ক্রীনসট ব্যবহার করুন।

ছবি ও স্ক্রীনসট আপনার টিউনের মানকে ও টিউডার (টিউন রিডার) কে আকৃষ্ট করার মান আরও বাড়িয়ে তুলবে। কীভাবে টিউনে ছবি ও স্ক্রীনসট যোগ করবেন তা দেখার জন্য টেকটিউনসের ‘টিউন করা শিখে নিন’ ভিডিও টিউট গুলো https://www.youtube.com/iTechtunes দেখুন।

➡ আপনার টিউন আর সুন্দর করে ফরমেট করুন।

বিভিন্ন পয়েন্ট গুলো বুলেট আকারে দিন।
টিউনের প্রধান টপিত গুলো H2 করে দিন।
সাব হেডিং গুলো H3 করুন।
টিউনের কোন অংশে কখনও H1 হেডিং ব্যবহার করবেন না।
নিজের সাইট বা কোন লিংক টিউডারের কাছে আকৃষ্ট করার জন্য কখনও কোন লিংকে হেডিং (h1,h2,h3) বা বড় টেক্সট করে দিবেন না। আপনার সাইটের লিংক দেবার জন্য টিউনের নিচে ব্লককোট করে “সৌজন্যে:” লিখে সাইটের লিংক দিন। এই টিউনটি https://www.techtunes.io/internet/tune-id/188009 লক্ষ করুন টিউডার ও টিউজিটরদের কোন প্রকার অযাচিত আকৃষ্ট না করে টিউনের শেষে; নিচে কীভাবে ব্লককোট করে “সৌজনে:” লিখে লিংক দেয়া হয়েছে। এতে আপনার টিউনের টিউডার ও টিউজিটরা আপনার প্রতি পূর্ণ আস্থা ও বিশ্বাস স্থাপন করবে।
টিউনে কখনও বিভিন্ন টেক্সট ভিন্ন ভিন্ন কালার ব্যবহার করবেন না এতে টিউডার টিউনে পড়তে বিরক্তি বোধ করবে।

কীভাবে সুন্দর করে টিউন ফরমেট করবেন তা জানতে টেকটিউনসের টিউন করা শিখে নিন ভিডিও টিউট গুলো https://www.youtube.com/iTechtunes দেখুন।

➡ নিচে কিছু দারুন ও সুন্দর ভাবে ফরমেট করা টিউনের উদহরণ দেয়া হল। লক্ষ করুন

টিউন গুলোতে কিভাবে প্রাসঙ্গিক ছবি => https://www.techtunes.io/freelancing/tune-id/141620
প্রয়োজনীয় স্ক্রিনসটের ব্যবহার => https://www.techtunes.io/tips-and-tricks/tune-id/102544
ঠিক ভাবে হেডিং ও সাব হেডিং এর ব্যবহার => https://www.techtunes.io/reports/tune-id/111219
বিভিন্ন পয়েন্ট গুলোকে বুলেট পয়েন্ট করে দেখানো => https://www.techtunes.io/reports/tune-id/111219
টিউনের মাঝে নির্দিষ্ট প্যারা তৈরি করা => https://www.techtunes.io/tips-and-tricks/tune-id/129685
টিউনে স্ক্রিনসট সহ টিউটোরিয়ালের বিভিন্ন ধাপ দেখানো => https://www.techtunes.io/featured/tune-id/95448
টিউনে কোড থাকলে তা কোড হাইলাইটারের মাধ্যমে উপস্থাপন => https://www.techtunes.io/web-design/tune-id/77692/

ইত্যাদি করে সুন্দর ভাবে উপস্থাপন করা হয়েছে।

এই টিউনের ফরমেট গুলোকে আদর্শ হিসেবে নিয়ে সবসময় আপনার টিউন গুলোকে সুন্দর ফরমেটে উপস্থাপন করুন। এতে আপনার টিউনের পাঠযোগ্যতা টিউডার ও টিউজিটরের কাছে বহুগুণে বৃদ্ধি পাবে।

➡ আপনার টিউনে যদি প্রোগ্রামিং সংক্রান্ত টিউন হয় ও টিউনে কোডের ব্যবহার থাকে তাহলে বিভিন্ন প্রোগ্রামিং ল্যাঙ্গুয়েজের কোড যেমন HTML, CSS, JS, PHP ইত্যাদি কোড সুন্দর ও সঠিক ভাবে দেখাতে টেকটিউনসের রয়েছে নিজেস্ব “কোড হাইলাইটার”। টেকটিউনসের “কোড হাইলাইটার” কিভাবে ব্যবহার করতে হয় তা জানতে এই টিউনটি https://www.techtunes.io/web-design/tune-id/77692/ দেখুন।

➡ টিউন করার আগে কিছু সময় নিয়ে পরিকল্পনা করুন।

➡ টিউডার ও টিউজিটররা বিস্তারিত, যত্ন নিয়ে, প্রয়োজনীয় ছবি যোগ করা ও সাবলীল ভাষার টিউনারদের খুবই পছন্দ করে। তাই সময় নিয়ে সুন্দর ভাবে, পরিপাটি করে ভাষা গুছিয়ে, আপনার মেধার পূর্ণ প্রয়োগ করে বিস্তারিত টিউন করুন।

অসম্পূর্ণ, অগোছালো, সুনির্দিষ্ট নয়, নাম মাত্র টিউন বা কোন রকম টিউন – এ ধরনের টিউন না করে সময় নিয়ে, সুন্দর ভাষার সুষ্ঠু প্রয়োগ করে, মেধার পূর্ণ ব্যবহার করে বিস্তারিত ভাবে টিউন করুন।

➡ কিছুদিন পর পর বা বেশ সময় ব্যবধানে টিউন না করে নিয়মিত টিউন করে কমিউনিটিতে আপনার বিশ্বস্থতা ধরে রাখুন। নিয়মিত টিউনারদের টিউডাররা খুব পছন্দ করে ও আস্থা রাখে। টিউন করার জন্য সপ্তাহের দুটি দিন বেছে নিন। এতে আপনার নিয়মিত টিউন করার ধারাবাহিকতা থাকবে।

টেকটিউনস বিজ্ঞান প্রযুক্তি চর্চার এক উন্মুক্ত সৌশাল নেটওয়ার্ক। টেকটিউনসে আপনার বিজ্ঞান ও প্রযুক্তির চিন্তা চেতনা মনন, অভিজ্ঞতার প্রকাশ ঘটান। আপনার বিজ্ঞান ও প্রযুক্তির জানা বিষয় গুলো প্রযুক্তির এই সুবিশাল নেটওয়ার্কে অন্যদের মাঝে ছড়িয়ে দিন। নিজেকে একজন মানসম্মত, দ্ক্ষ, কমিউনিটির অন্যদের সাথে বন্ধু ভাবাপন্ন টিউনার হিসেবে গড়ে তুলুন। হয়ে উঠুন একজন আদর্শ টেকটিউনার।

Level 0

টেকটিউনস কে ধন্যবাদ আমাকে সঠিক ভাবে টিউন করতে সাহায্য করার জন্য।

Level 0

প্রিয় টিউনার,

আপনার টিউন গুলো টেকটিউনসের চেইন টিউন হিসেবে অন্তর্ভুক্ত করার জন্য নির্বাচিত হয়েছে। তবে চেইন টিউনে অন্তর্ভুক্তের জন্য আপনার প্রোফাইলটির সঠিক identity প্রয়োজন। আপনি আপনার প্রোফাইলে আমার আসল নাম দিন এবং টিউনার পিকচার হিসেবে আপনার নিজের একটি ছবি যুক্ত করুন। চেইন টিউন করতে ছদ্ম টিউনার নেম এর বদলে আপনার আসল নাম ও টিউনার ইমেইজ ব্যবহার করুন। আপনার টিউনার প্যানেল থেকে আপনার আসল নাম ও টিউনার ইমেইজ পরিবর্তন করে নিন।

আপনার টিউনার প্রোফাইলটি সঠিক identity দিয়ে আপডেট হবার সাথে সাথেই টেকটিউনস থেকে আপনার টিউন গুলো চেইন এ অন্তর্ভুক্ত করা হবে।

টেকটিউনসে চেইন টিউন কীভাবে প্রক্রিয়া হয় তা জানতে টেকটিউনস সজিপ্র এর https://www.techtunes.io/faq “চেইন টিউন” অংশ দেখুন।

চেইন টিউনে যুক্ত হবার ফলে চেইনের প্রতিটি পর্ব একসাথে থাকবে। চেইনে নতুন পর্ব যুক্ত হলে তা টেকটিউনসের প্রথম পাতায় দেখা যাবে এবং “সকল চেইন টিউনস” https://www.techtunes.io/chain-tunes/ পাতায় চেইন টিউনটি যুক্ত হবে।

মেতে থাকুন প্রযুক্তির সুরে আর নিয়মিত করুন চেইন টিউন!

Level 0

প্রিয় টিউনার,

আপনার টিউনটি টেকটিউনস চেইন টিউন হিসেবে অন্তর্ভুক্ত করা হয়েছে। অভিনন্দন আপনাকে!

টেকটিউনসে চেইন টিউন কীভাবে প্রক্রিয়া হয় তা জানতে টেকটিউনস সজিপ্র এর https://www.techtunes.io/faq “চেইন টিউন” অংশ দেখুন।

নিয়মিত চেইন টিউন করুন। এখন থেকে আপনার নতুন করা চেইন টিউন গুলো টেকটিউনস থেকে চেইন এ যুক্ত করা হবে। চেইন টিউনে যুক্ত হবার ফলে চেইনের প্রতিটি পর্ব একসাথে থাকবে।

চেইনে নতুন পর্ব যুক্ত হলে তা টেকটিউনসের প্রথম পাতায় দেখা যাবে এবং “সকল চেইন টিউনস” https://www.techtunes.io/chain-tunes/ পাতায় চেইন টিউনটি যুক্ত হবে।

নিয়মিত চেইন টিউন করে নতুন নতুন টিউন আপনার চেইনে যুক্ত করুন এবং অসম্পূর্ণ না রেখে আপনার চেইন টিউনে নিয়মিত পূর্ণাঙ্গ রূপ দিন।

মেতে থাকুন প্রযুক্তির সুরে আর নিয়মিত করুন চেইন টিউন!

Level 0
<html lang='en-US' itemscope itemtype="http://schema.org/Product">

ei Attribute ter bistarito bolle valo hoto lang=””
itemtype=””