ওয়েব ডিজাইন-৩:লেখা সাজানো

আগের পোস্টে HTML এর কয়েকটি বেসিক জিনিস নিয়ে আলোচনা করেছিলাম। এই পোস্টে ওয়েব পেজ এ লেখা কেমন করে সাজাতে হয় তা নিয়ে আলোচনা করবো।
নিচের ট্যাগ গুলো ব্যবহার করে লেখা সাজানো যায়ঃ
১। একাধিক স্পেস দেয়াঃ আগের পোস্টে দেখানো হয়েছে, লেখার মাঝে একাধিক স্পেস দিলেও- তা কেবল একটি স্পেস হিসাবেই ওয়েব পেজ এ পাওয়া যায়। এখন যদি সত্যিই একাধিক স্পেস এর প্রয়োজন হয় তখন কি করবেন? এজন্য ছোট্ট একটা কোড &nbsp ব্যবহার করতে হবে। কোন লেখার মাঝে যতবার &nbsp লিখবেন ততটি স্পেস সৃষ্টি হবে । যেমনঃ Body অংশে নিচের কোড লিখলে(যেহেতু ওয়েব পেজে যা লিখবেন তা Body অংশেই লিখতে হবে ,তাই “Body অংশে লিখলে” কথাটি পরবর্তীতে পরিহার করব। )
I &nbsp am Mahfuzur &nbsp &nbsp &nbsp &nbsp Rahman.
ওয়েব পেজে নিচের ন্যায় দেখাবেঃ

I &nbsp am Mahfuzur &nbsp &nbsp &nbsp &nbsp Rahman.


২। নতুন লাইন তৈরীঃ আগের পোস্টে দেখানো হয়েছে, লেখা লেখার সময় কীবোর্ডের Enter কী ব্যবহার করে নতুন লাইনে গেলেও- ওয়েব পেজে লাইন দুটি কেবল একটি লাইনে পাওয়া যায়। এসমস্যা নিরাসনের জন্য একটি ট্যাগ ব্যবহার করা এবং তা হল
(line break বা লাইন ভাঙ্গার সংক্ষিপ্ত রূপ br)। যেমনঃ
I am Mahfuzur Rahman.
I am teaching you HTML.
ওয়েব পেজে নিচের ন্যায় দেখাবেঃ

I am Mahfuzur Rahman.
I am teaching you HTML.

উল্লেখ্য, যত বার
লিখবেন ততটি নতুন লাইনের সৃষ্টি হবে। যেমন আগের উদাহরণের ক্ষেত্রে
I am Mahfuzur Rahman.
I am teaching you HTML.
ওয়েব পেজে নিচের ন্যায় দেখাবেঃ

I am Mahfuzur Rahman.
I am teaching you HTML.


এখানে একটা বিষয় লক্ষ করুনঃ আমি আগের পোস্টে লিখেছি যে, একটি ট্যাগ লিখলে ঐ ট্যাগের কাজ শেষ হবার পর সমাপ্তিসূচক ট্যাগ লিখতে হবে। কিন্তু উপরের
ট্যাগ ব্যবহার করলেও এখানে কোন সমাপ্তিসূচক ট্যাগ লিখা হয় নি। তার পরিবর্তে শেষের > চিহ্নের আগে / চিহ্ন ব্যবহৃত হয়েছে। এটা ব্যতিক্রম। এছাড়া আরো দু-একটি ট্যাগ ( <img/>,<hr>, ) আছে যাতে সমাপ্তিসূচক ট্যাগ লিখতে হয় না। এই দু-একটি ব্যতিক্রম ছাড়া বাকী ট্যাগ গুলোতে সমাপ্তিসূচক ট্যাগ লিখতে হবে। যে যে ট্যাগের ক্ষেত্রে সমাপ্তিসূচক ট্যাগ লিখতে হয় না, তা সময় মত বলে দেয়া হবে। এখন ইহা নিয়ে এখন মাথা না ঘামালেও চলবে।
৩। প্যারাগ্রাফ তৈরীঃ বড় বড় লেখাগুলো সাধারণত একাধিক প্যারাগ্রাফে বিভক্ত করে লিখলে পাঠকের বুঝতে সুবিধা হয়। যেমন আমার এই পোস্টটি অনেক গুলো প্যারাগ্রাফ ব্যবহার করেছি। প্যারাগ্রাফ তৈরী করার জন্য
ট্যাগ ব্যবহার করা হয় ( প্যারাগ্রাফ(paragraph) এর প্রথম অক্ষর p ব্যবহার করে ট্যাগটি
)। যেমনঃ
<p>I am Mahfuzur Rahman. I am studying at Bheramara College BBS. I want to be an Web developer.</p>
<p>During my leisure,I try to write new post for my readers. Now I am teaching you all web design. But what I have seen is that most of you do not feel any interest in Learning Web design.</p>
ওয়েব পেজে নিচের ন্যায় দেখাবেঃ

I am Mahfuzur Rahman. I am studying at Bheramara College BBS. I want to be an Web developer.
During my leisure,I try to write new post for my readers. Now I am teaching you all web design. But what I have seen is that most of you do not feel any interest in Learning Web design.


৪। একের ভিতর সবঃ উপরে একাধিক স্পেস সৃষ্টি, নতুন লাইন তৈরী, প্যারাগ্রাফ তৈরী দেখানো হয়েছে। এসব ব্যবহার করা অনেক ক্ষেত্রে ঝামেলা দায়ক হতে মনে হতে পারে। যেমন ধরুন আপনার একাধিক স্পেস ব্যবহার করা প্রয়োজন – সেক্ষেত্রে একাধি বার &nbsp ব্যবহার করতে হয়, নতুন লাইন তৈরী করতে বার বার <br/> ট্যাগ ব্যবহার করতে হয়। এই ঝমেলা গুলো এড়াতে <pre> ট্যাগ ব্যবহার করতে পারেন। ট্যাগ ব্যবহার করে যেভাবে লেখাগুলো লিখবেন , ঠিক সেই ভাবেই ওয়েব পেজে প্রদর্শিত হবে (অর্থাৎ লেখাগুলোর মাঝে যত স্পেস দিবেন, যত নতুন লাইন তৈরী করবেন -ওয়েব পেজে ঠিক সেরকম প্রদর্শিত হবে) । যেমনঃ আগের পোস্টের উদাহারণটির ক্ষেত্রেঃ
<pre>I am Mahfuzur Rahman.
I am teaching you HTML</pre>
ওয়েব পেজে নিচের ন্যায় দেখাবেঃ

I am Mahfuzur Rahman. I am teaching you HTML


আজ এই পর্যন্তই । আগামী পোস্টে লেখা আকার আকৃতি বদলানো নিয়ে লিখব। কোন প্রশ্ন থাকলে,বুঝতে অসুবিধা হলে মন্তব্য করতে পারেন।
অনুশীলনঃ ওয়েব পেজে নিচের লেখাগুলো যেভাবে আছে সে ভাবে প্রদর্শণ করার জন্য কী কী লিখতে হবে?
I love my country
very much.
And I think that-
everyone should love his country.
(দুই উপায়ে করা যেতে পারে। একটা সহজ ও অন্যটা ঝামেলা দায়ক। দুটি উপায়েই চেষ্টা করবেন কিন্তু)