আশা করি সবাই ভাল আছেন। আজ থেকে শুরু করছি HTML, CSS, JavaScript ও php নিয়ে চেইন টিউন। ওয়েব ডিজাইন বর্তমান সময়ে খুব জনপ্রিয় হয়ে উঠেছে আর তাই সবাই এগুল শিখতে খুব আগ্রহ প্রকাশ করছে।
যাই হোক HTML, CSS, JavaScript ও php নিয়ে টিটি তে অনেক টিউন হয়েছে ইতো পূর্বে, কিন্তু যারা এখন নতুন তারা হইত বুজতে পারছে না কথাই থেকে শুরু করবে। তাই নতুন্দের নিয়ে HTML, CSS, JavaScript ও php নিয়ে ধারাবাহিক ভাবে চেইন টিউন করার সিধান্ত নিলাম। আপনার যদি প্রচেষ্টা আর ১০০% আগ্রহ থাকে তবে আশা করছি ৩-৪ মাসের মধেই HTML, CSS, JavaScript ও php এর বেসিক ধারনা শেষ করা যাবে।
এবার আসি কাজের কথাইঃ
ওয়েব ডিজাইন শিখতে তেমন কোন সফটওয়্যার এর প্রয়োজন হয় না, শুধু মাত্র notpad দিয়েই সমস্ত কাজ করা যাই।।
তবে আমরা যদি notepad++ ব্যাবহার করি তবে ভাল কিছু সুবিধা পেতে পারি।
আর আমাদের বেসিক ধারনা আসলে আমরা Adobe Dreamweave ব্যাবহার করতে পারি।
প্রথম অবস্তাই আমরা notepad++ ব্যাবহার করবো।
যাদের কাছে notpad++ নেই তারা এখান থেকে ডাউনলোড করে নিন।
এবার আসি আসল কথাইঃ-
এইচটিএমএল শিখতে যে শব্দগুলি ভালভাবে জানা দরকার-
সবার প্রথমে HTML লেখার শুরুতে HTML শব্দের প্রথমে এবং শেষে less than ও greater than ( < >) চিহ্ন দিতে হয়। যেমন: <html> । কোন কিছু লেখার পর শেষে </html> ট্যাগটি দিতে হবে। অর্থাৎ <html> Welcome to Bangladesh </html>। Welcome to Bangladesh এই লেখাটি Web page এ প্রদশিত হবে।আমরা খুব সহজে Notepad এ লিখে Web page তৈরী করতে পারি। এজন্য আমদের Notepad Open করতে হবে।
প্রথমে start মেনু All Programs > Accessories >Notepadঅথবা ডাউনলোড করা notpad++ ওপেন করতে হবেতারপর Notepad ওপেন হবার পর নিম্নের কোডটি লিখবো
<html> Welcome to Bangladesh </html>
এভাবে লেখার পর Notepad এর ফাইল মেনু হতে save এ ক্লিক করব তারপর index.html নামে save করব।
সেভ করা ফাইলটিকে Double click করে open করবো । দেখবো যে লেখাটি Browser এ open হয়েছে। খুব সহজে একটা web Page তৈরী হয়ে গেলো।
একটি ডকুমেন্ট head, ডকুমেন্ট সস্বন্ধে মৌলিক ধারনা দেয়। <head> elements যা পেজের header নির্দেশ করে। head elements এর মধ্যে রাখা ট্যাগ সরাসরি ব্রাউজারে প্রদর্শিত হয় না। আমরা টাইটেল এলিমেন্ট এর মাধ্যমে প্রকাশ করতে পারি।
<head> এলিমেন্ট এর মাঝে <title> এলিমেন্ট রাখতে হয়। যেই শব্দগুলো title elements এর opening (<title>)এবং closing(</title>) tag এর মধ্যে লেখা হয় তা browser এর টাইটেল বা শিরোনাম হিসাবে প্রদর্শিত হয়।
<html> <head> <title> My WebPage!</title> </head> </html>
body element যা web page এর প্রদর্শিত সকল বিষয় গুলো ধারন করে। যে সব বিষয় গুলো আমরা web page এ দেখাতে চাই তা body element ট্যাগ এর মধ্যে রাখতে হয়।
<html> <head> <title>My WebPage!</title> </head> <body> Hello World! All my content goes here! </body> </html>
এই কোডগুলি নোটপ্যাডে কপি পেস্ট করে .html extension দিয়ে সেভ করে যেকোন ব্রাউজারে খুলুন এবং নিজের তৈরী প্রথম ওয়েব পেজ দেখুন।
কি? কেমন লাগছে নিজের বানানো ওয়েব সাইট টি দেখতে?
এবার নিজে নিজে চেষ্টা করে দেখুন কতটুকু শিখতে পারলেন। আর কিছু বুঝতে প্রবলেম হলে জানাবেন। তাহলে আজ এতুকুই চেষ্টা করতে থাকুন আগামি টিউন এ এগুলর সাথে নতুন কিছু শিখবো।।
ভাল লাগলে কমেন্ট করতে ভুলবেন না।।
আমি kazi Kowshik। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 12 বছর 6 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 22 টি টিউন ও 281 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 1 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।
আর একটু প্রথম থেকে শুরু করলে ভালো করতেন। যেমন mysql server ইন্সষ্টল থেকে শুরু করতেন। কারন নতুনরা তা না হলে program run করতে পারবে না।
খুব সন্দর হয়েছে উপস্থাপনা। পাশে আছি। চালিয়ে যান। প্রিয়তে নিলাম। পর্যায়ক্রমে সবগুলোই প্রিয়তে যাবে। এটা শেখার খুব ইচ্ছা আমার।
ভাই, সামনে পরীক্ষা; তবুও শুধু আপনার টিউনের জন্য হলেও টেকটিউন এর পাতায় বসব। শেখার জন্য তো সময় দিতেই হবে। আপনার ধারাবাহিক টিউনের অপেক্ষায় থাকব প্রতিদিন। আপনাকে অনেক ধন্যবাদ।
@মোঃ কাউসার হুসাইন: সাধারন অবস্তাই notpad এই আমরা কাজ করি। পরবর্তীতে সার্ভার নিয়ে আলোচনা করবো।
vi এখান থেকে ডাউনলোড করুন এই লেখার মধ্যে কোন html use kor sen please ek to bolben
@এম এম কৌশিক: a href=”http://download.tuxfamily.org/notepadplus/6.1.5/npp.6.1.5.Installer.exe”>এখান থেকে ডাউনলোড</a
r jai “HTML, CSS, JavaScript ও php” lekha ta kivabe kor sen
r wordpress e ami kon jay gay ei html gula likle amer website e ashbe
amer html er knowlage onek kom mane nai bollei cho le to ama ke akto bojia bolben
যাক নতুনদের অনেক কাজে লাগবে……আমিও PHP শেখা শুরু করেসি মাস দু ইয়েক আগে বর্তমানে CSS করতেসি
ভাল লাগল, ৗয়ার্ড প্রেস সম্পর্কে কিছু বললে উপকৃত হতাম। এই সম্পর্কে আমার কোন ধারনা নাই।
আপনার সহজ সরল উপস্থাপনা আমাকে শিখার জন্য প্রলুব্ধ করেছে। শিখার জন্য মনস্থির করেছি, দেখি কতদিন চালিয়ে যেতে পারি।
ধন্যবাদ আপনাকে।
Boss, Web Designing ভাল পারি না কিন্তু ডিজাইনিং ভাল পারি। আমার Work Area হচ্ছে, Photoshop, Illustrator, Flash, After effect, 3D max………..
Program Language যেমন, HTML, CSS, Java script, PHP ,,, এগুলা শিখার ইচ্ছে ছিল কিন্তু কিভাবে শুরু করবো বুঝতে পারি নাই। এখন মনে হয় আপনার কাছে Training নেওয়া যাবে। অনেক ধন্যবাদ শেয়ার করার জন্য।
Bro, আপনার অনলাইন কন্টাক্ট ইনফর্মেশন দিলে ভাল হতো।
My Contact information
FB- http://www.facebook.com/creativehasan
FB page- http://www.facebook.com/creative871252
Skype-hasan871252
odesk- Amit Hasan
my chain Tunes- https://www.techtunes.io/chain-tunes/photoshop-cs6-bangla-super-video-tut
ভাইয়া ওয়েব ডিজাইন শেখার অনেক আশা!!!!দয়া করে টিউন করবেন…খুব খুব খুব ভালো লাগছে ।
Thank u very much.
![HTML, CSS, JS ও PHP ট্রেনিং সেন্টার [পর্ব-০৯] :: ডিভ (div) এর ব্যাবহার।।](https://dnc.techtunes.io/tDrive/tuner/mmkowshik2/151902/chaintune_html-css-js-and-php-tranning-center.jpg "HTML, CSS, JS ও PHP ট্রেনিং সেন্টার [পর্ব-০৯] :: ডিভ (div) এর ব্যাবহার।।")
![HTML, CSS, JS ও PHP ট্রেনিং সেন্টার [পর্ব-০৭] :: ওয়েব সাইটে আই ফ্রেম এর ব্যাবহার](https://dnc.techtunes.io/tDrive/tuner/mmkowshik2/149350/chaintune_html-css-js-and-php-tranning-center.jpg "HTML, CSS, JS ও PHP ট্রেনিং সেন্টার [পর্ব-০৭] :: ওয়েব সাইটে আই ফ্রেম এর ব্যাবহার")
খুব ভালো লাগল । সহজ উপস্থাপনা । শেখার ইচ্ছে জাগল। 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂 🙂