ওয়েব ডিজাইনিং এর শুরু থেকে শুরু (Special Tips for html markup)

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

এই পদ্ধতিটির নাম হল Zen Coding। এটি হল এইচটিএমএল এর কোড গুলো কে যাতে একজন ডিজাইনার কম সময়ের মধ্যে লিখতে পারে তার একটি ছোট প্লাগিন। এটি দিয়ে আপনি তাড়াতাড়ি কোডিং করতে পারবেন, মানে লিখতে পারবেন।

আপনি যদি এইচটিএমএল শেষ করে থাকেন তাহলে আপনাকে আর বলতে হচ্ছে না যে এইচটিএমএল কোড গুলো লিখতে কতটা সময় লাগে এবং কতটা বিরক্ত লাগে। আপনি এই প্লাগিনটা দিয়ে আপনার মুলবান সময়টা বাচাতে পারবেন এবং তাড়াতাড়ি কোড লিখতে পারার কারনে আপনার বিরক্তও লাগবে না। আর হ্যাঁ এর বড় সুবিধা হল আপনার কোড লিখাতে ভুলও অনেক কম হবে। কারন আমরা যখন কোড লিখি তখন বানান ভুল, ট্যাগ শেষ না করা ইত্যাদি ভুল হয়ে থাকে, এটি তা দূর করবে। তো আসুন জেনে নেই এটি কিভাবে নোটপ্যাড++ যুক্ত করবেন এবং ব্যবহার করবেন।

 

সর্ব প্রথমে আপনাকে নিচের লিঙ্ক থেকে zip file টি ডাউনলোড করে নিতে হবে।

Zen Coding

 

ডাউনলোড করার পর ফাইলটি খুলুন এবং এখানে আপনার জন্য দুটো ফাইল থাকবে। একটি ফোল্ডার এবং অন্নটি একটি dll ফাইল। এই দুটি ফাইল আপনি কপি করে নিন এবং যেখানে আপনার Notepad++ software টি install করা আছে সেখানে গিয়ে Notepad++ ফোল্ডার এ ঢুকুন এবং তার মধ্যে থাকা plugin ফোল্ডারটিতে জান। ফোল্ডার-এ গিয়ে আপনার কপি করা ফাইল গুলো পেস্ট করুন। ব্যাস, আপনার কাজ শেষ। এখন আপনার নোডপ্যাডটি যদি আগে থেকে খোলা থাকে তাহলে বন্ধ করে আবার চালু করুন। দেখবেন মেনুতে একটি নতুন ট্যাব যুক্ত হয়েছে Zen coding নামে।
এবার আপনি এটি ব্যবহার করার জন্য একেবারে প্রস্তুত। কিন্তু লিখবে কি ভাবে। এটির সর্টকার্ট এর মাধ্যমে ব্যবহার করা হয়ে থাকে। এর সর্টকার্ট-টি হল Ctrl + E। এই দুটো বাটন এক সাথে প্রেস করলে zen coding কাজ করবে।
যেমনঃ আপনি center লিখে Ctrl+E চাপেন তাহলে আপনার কোডটি এমন দেখাবে <center></center>।
Zen coding এর short cut গুলোর একটি পিডিফ ফাইলও আপনাদের দিয়ে দিলাম। নিচের লিঙ্ক থেকে ডাউনলোড করে নিতে পারেন।

Zen coding PDF

[বি.দ্রঃ এটি যারা একদমই নতুন তারা ব্যবহার করবেন না। কারণ আপনারা যদি প্রথম থেকে এটি ব্যবহার করেন তাহলে আপনারা কোডিং ভালো করে বুজবেন না। তাই যারা নতুন তারা এটি ব্যবহার থেকে দূরে থাকুন, এটি শুধু মাত্র যারা এইচটিএমএল কোডিং সম্পর্কে ভালো ধারনা নিয়ে ফেলছেন এবং এইচটিএমএল কোডিং এ আর কোন ধরনের সমস্যা নাই তাদের জন্য। আর হ্যাঁ আমি আবারও বলছি যারা জানেন তারাতো জানেন, যারা জানেন না এইটি তাদের জানানোর জন্য লিখা হয়েছে।]

 

নিচে Zen coding install করার ভিডিও টিউটোরিয়াল দেওয়া হল।

Installing Video

 

আপনাদের সকলকে ঈদের শুভেচ্ছা জানিয়ে এখানেই শেষ করলাম। আল্লাহ হাফেজ, সকলে ভালো থাকবেন এবং ঈদে অনেক মজা করবেন, কিন্তু চেষ্টা করবেন আপনাদের আশে পাশের পরিবেশ পরিস্কার রাখার।

 

ফেসবুক গ্রুপঃ ওয়েব ডিজাইনিং গ্রুপ

এইটা আমার ব্লগ সাইটঃ আপনারা আমার ওয়েব ডিজাইনিং এর শুরু থেকে শুরুর সকল টিউন এখানে পেয়ে যাবেন।

বেস্ট টিপস বিডি

Level 2

আমি মোহাম্মদ রিয়াদ। Front-end Designer and WP Developer, Soft Bucket, Chattogram। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 9 বছর 6 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 23 টি টিউন ও 14 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 1 ফলোয়ার আছে এবং আমি টেকটিউনসে 4 টিউনারকে ফলো করি।


টিউনস


আরও টিউনস


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


টিউমেন্টস

আপনাকেও ঈদের শুভেচ্ছা

অনেক ভাল টিউন ,কাজে লাগবে ।