Home-theater-designers
ওয়েব ডিজাইন আগের থেকে অনেক বেশি অ্যাক্সেসযোগ্য, কিন্তু পেশাদার দেখানোর ফলাফল তৈরি করতে এখনও অনেক কাজ লাগে - এবং প্রচুর দক্ষতা লাগে।
সৌভাগ্যবশত, আপনাকে প্রতিবার স্ক্র্যাচ থেকে শুরু করার দরকার নেই। অনলাইনে হাজার হাজার বিনামূল্যে CSS টেমপ্লেট পাওয়া যায়, যা আধুনিক ডিজাইনের প্রবণতা এবং প্রযুক্তিগুলিকে গ্রহণ করে। আপনি এগুলিকে তাদের আসল আকারে ব্যবহার করতে পারেন, বা সেগুলি আপনার নিজের করে নিতে কাস্টমাইজ করতে পারেন।
এই গাইডে আমরা সিএসএস টেমপ্লেটগুলি এবং সেগুলি কোথায় খুঁজে পেতে পারি তা আরও ঘনিষ্ঠভাবে দেখব।
একটি CSS টেমপ্লেট কি?
একটি CSS টেমপ্লেটে শুধু CSS থাকে না: এটি আপনাকে সম্পূর্ণরূপে কার্যকরী ওয়েবসাইট তৈরির জন্য প্রয়োজনীয় সবকিছু দেয়। যখন আপনি একটি ডাউনলোড করেন, আপনি সাধারণত নিম্নলিখিত একটি ফোল্ডার পাবেন:
- HTML ফাইল - আপনি ওয়েবসাইটের প্রতিটি পৃষ্ঠার জন্য একটি HTML ফাইল পাবেন। এতে নমুনা পাঠ্য এবং চিত্র থাকবে যা আপনাকে আপনার নিজের সামগ্রী দিয়ে প্রতিস্থাপন করতে হবে। সাইট বিবরণের মতো বিষয়গুলির সাথে সম্পর্কিত আপনাকে মেটা ডেটা সামঞ্জস্য করতে সক্ষম হতে হবে।
- CSS ফাইল - আপনি সাধারণত একটি প্রধান সিএসএস ফাইল পান যা সাইটের জন্য সমস্ত স্টাইলিং, প্লাস রিসেট স্টাইলশীটের মতো অতিরিক্ত, অথবা ওয়েব ফন্টের জন্য একটি।
- জাভাস্ক্রিপ্ট ফাইল - যদি সাইটে জাভাস্ক্রিপ্ট ফাংশন থাকে তবে তাদের HTML ডক্সে অন্তর্ভুক্ত না করে আদর্শভাবে তাদের নিজস্ব ফাইলে অন্তর্ভুক্ত করা উচিত।
- ছবি, ফন্ট এবং আইকন - টেমপ্লেটে ব্যবহৃত যেকোনো ছবিও অন্তর্ভুক্ত করা উচিত। আপনি আইকন এবং ব্যাকগ্রাউন্ডের মত জিনিস রাখতে চাইতে পারেন, কিন্তু আপনার নিজের সাথে অন্য প্লেসহোল্ডার ইমেজ প্রতিস্থাপন করতে হবে। কিছু কাস্টম ফন্টও অন্তর্ভুক্ত করা যেতে পারে।
অন্যান্য ধরণের টেমপ্লেটের বিপরীতে আপনি সম্মুখীন হবেন - এটি ওয়ার্ডপ্রেস, এক্সেল, অথবা InDesign টেমপ্লেট - CSS টেমপ্লেটগুলির জন্য একটি নির্দিষ্ট পরিমাণ প্রযুক্তিগত জ্ঞান প্রয়োজন।
এগুলি সম্পাদনা করার জন্য কোনও বন্ধুত্বপূর্ণ ইন্টারফেস নেই, তাই আপনার নিজের সামগ্রী যুক্ত করার জন্য আপনাকে অন্তত একটি HTML নথির চারপাশে কীভাবে পথ খুঁজে পেতে হবে তা জানতে হবে। আপনার নিজস্ব কাস্টমাইজেশন করতে আপনার CSS এর একটি ভাল জ্ঞান প্রয়োজন।
গুগল ড্রাইভকে অন্য অ্যাকাউন্টে স্থানান্তর করা হচ্ছে
একটি CSS টেমপ্লেটে কি দেখতে হবে
বেছে নেওয়ার জন্য অনেকগুলি বিনামূল্যে CSS টেমপ্লেট রয়েছে। তাহলে আপনি কিভাবে বুঝবেন কোনটি আপনার জন্য সঠিক? এখানে কয়েকটি জিনিসের সন্ধান করা হল:
- নকশা - স্পষ্টতই, আপনি এমন একটি সাইট চান যা সুন্দর দেখায় এবং আপনি যে চিত্রটি চিত্রিত করতে চান তা প্রতিফলিত করে। কিন্তু এটাও বিবেচনা করুন যে টেমপ্লেটটি এখন এবং ভবিষ্যতে আপনার প্রয়োজনের জন্য সঠিক কিনা। অনেকগুলো এক পৃষ্ঠার ওয়েবসাইটের জন্য; কিছু একাধিক পৃষ্ঠার জন্য ডিজাইন করা হয়েছে। যদি আপনার পরেরটি প্রয়োজন হয়, তাহলে বিবেচনা করুন যে আপনি ওয়ার্ডপ্রেস এর মত একটি সিএমএস ব্যবহার করে ভাল হতে পারেন।
- মোবাইল-অপ্টিমাইজড - মোবাইল ওয়েব ব্যবহার এখন ডেস্কটপের চেয়ে বেশি, তাই আপনার সাইটটি স্মার্টফোনে সঠিকভাবে কাজ করা অপরিহার্য। যে কোনও শালীন CSS টেমপ্লেট প্রতিক্রিয়াশীল নকশা ব্যবহার করা উচিত যাতে সাইটটি যে কোনও আকারের স্ক্রিনে পুরোপুরি কাজ করে। যদি আপনার নির্বাচিতটি না হয়, তবে যেটি করে তা পরিবর্তন করুন।
- ভালভাবে লিখিত - টেমপ্লেটটি ডাউনলোড করুন এবং এটি ব্যবহার করার জন্য প্রতিশ্রুতি দেওয়ার আগে কোডটি দেখুন। এটি পরিষ্কার, সুগঠিত এবং সম্পাদনা করা সহজ হওয়া উচিত। এটি শিরোনাম এবং শিরোনাম ট্যাগগুলির সঠিক ব্যবহার সহ এসইও-সচেতন হওয়া উচিত।
- লাইসেন্স - আপনার নির্বাচিত CSS টেমপ্লেটের লাইসেন্স চেক করতে ভুলবেন না। অনেক পাওয়া যায় ক্রিয়েটিভ কমন্স লাইসেন্সের অধীনে , কিন্তু এই লাইসেন্সের বিভিন্ন সংস্করণ নির্ধারণ করে যে আপনি টেমপ্লেটটি সম্পাদনা করতে পারবেন কিনা, আপনি এটি বাণিজ্যিকভাবে ব্যবহার করতে পারবেন কিনা, এবং আপনাকে মূল ডিজাইনারকে ক্রেডিট দিতে হবে কিনা।
- অ্যাডঅন - কিছু সিএসএস টেমপ্লেট ডেভেলপার 'ফ্রিমিয়াম' ভিত্তিতে তাদের কাজ অফার করে। আপনি বিনামূল্যে টেমপ্লেটটি পান, তবে আপনার সাইটে এটিকে অনন্য করার জন্য অতিরিক্ত কাস্টমাইজেশনের জন্য অর্থ প্রদানের বিকল্প রয়েছে।
যে সমস্ত ব্যাখ্যা করা হয়েছে, আসুন বিনামূল্যে CSS টেমপ্লেটগুলি খুঁজে পেতে সেরা জায়গাগুলি দেখুন।
ঘ। Templated.co
800 টিরও বেশি CSS টেমপ্লেটের এই অত্যাশ্চর্য সংগ্রহে ওয়েবসাইটের প্রতিটি শ্রেণীর জন্য স্টাইল রয়েছে। এগুলি সবই বিশেষ করে সাইটের জন্য তৈরি করা হয়েছে, তাই আপনি তাদের অন্য কোথাও ফসল কাটা দেখতে পাবেন না।
সমস্ত টেমপ্লেটগুলি প্রতিক্রিয়াশীল এবং HTML5 দিয়ে নির্মিত। এগুলি ছোট এবং লাইটওয়েট, অতিরিক্ত জাভাস্ক্রিপ্ট বৈশিষ্ট্যগুলির সাথে, যেমন একটি ভিডিও লাইটবক্স বা স্ক্রোল প্রভাব, কেবলমাত্র সেই জায়গায় ব্যবহার করা হয় যেখানে তারা অভিজ্ঞতার বাস্তব মূল্য যোগ করে।
2। Styleshout.com
স্টাইলশাউট বিনামূল্যে এবং প্রিমিয়াম উভয় টেমপ্লেটগুলির একটি বড় পরিসর সরবরাহ করে, যা ক্রিয়েটিভ কমন্স লাইসেন্সের অধীনে প্রকাশিত হয়েছিল।
বিনামূল্যে টেমপ্লেটগুলি সম্পূর্ণ ওয়েবসাইট থেকে শুরু করে শীঘ্রই পৃষ্ঠাগুলি, এবং এমনকি প্রায়শই উপেক্ষিত 404 ত্রুটি পৃষ্ঠা পর্যন্ত বিস্তৃত শ্রেণীর অন্তর্ভুক্ত। আপনি সেগুলিকে নিজেই কাস্টমাইজ করতে পারেন এবং সেগুলি আপনার বিদ্যমান সাইটের স্টাইলের সাথে খাপ খাইয়ে নিতে পারেন, অথবা স্টাইলশাউটকে আপনার জন্য এটি করার জন্য অর্থ প্রদান করতে পারেন।
3। HTML5Up.net
টেমপ্লেটগুলির এই সুপার-স্টাইলিশ সংগ্রহটিও খুব জনপ্রিয়। অধিকাংশ শত শত হাজার বার ডাউনলোড করা হয়েছে, এবং কেন এটি দেখতে সহজ।
ব্লগ এবং পণ্য পৃষ্ঠার মতো সাইটের সবগুলি সাধারণ বিভাগগুলি পূরণ করা হয় এবং ফটোগ্রাফারদের তাদের কাজ দেখানোর জন্য কিছু বিশেষ নকশা রয়েছে। মৌলিক গ্রিড-শৈলী টেমপ্লেটগুলি অত্যন্ত কাস্টমাইজযোগ্য, যখন ফ্ল্যাশিয়রগুলি জাভাস্ক্রিপ্টকে বেশ ভারীভাবে ব্যবহার করার প্রবণতা রাখে তাই আপনার টুইকের জন্য কম উপযুক্ত হতে পারে।
চার। Freebiesbug.com
Freebiesbug কি পরিমাণে কম তা গুণমানের চেয়ে বেশি। একটি সাইট যেখানে তরুণ বিকাশকারীরা তাদের দক্ষতা প্রদর্শন করে, এতে অনেক উচ্চমানের, প্রিমিয়াম ডিজাইন অন্তর্ভুক্ত রয়েছে।
সাইটের ফ্রি টেমপ্লেটগুলির চিত্তাকর্ষক সংগ্রহ এজেন্সি, ফটোগ্রাফার, অ্যাপ ডেভেলপার এবং অন্যান্য সৃজনশীলদের জন্য উপযুক্ত। জাভাস্ক্রিপ্ট এবং সিএসএস প্রভাব এবং অ্যানিমেশন দিয়ে প্যাক করা, আপনি সাইটগুলি কাস্টমাইজ করতে পারেন, যদিও সেগুলি প্রায়ই এত সুন্দর হয় যে আপনি নাও চান।
এছাড়াও, Freebiesbug.com ওয়েব ডিজাইনারদের জন্য ফন্ট, স্টক ফটো, ইলাস্ট্রেটর স্কেচ এবং পিএসডি ফাইল এবং আরও অনেক কিছু সহ সব ধরণের বিনামূল্যে সম্পদ অন্তর্ভুক্ত করে।
5। Free-CSS.com
Free-CSS.com হল একটি নন-ফ্রিলস ওয়েবসাইট অফার-লেখার সময়-কিছু 2503 ফ্রি টেমপ্লেট, প্লাস প্রচুর প্রিমিয়ামও, যদি আপনি এখনও যা খুঁজছেন তা খুঁজে না পান।
অনেকের সাথে এটি বেছে নেওয়ার জন্য নিখুঁত নকশায় স্থির হওয়া কিছুটা কঠিন হতে পারে। মানটি সাধারণত ভাল, যদিও সাইটের 10 বছরের অস্তিত্ব মানে এটি এখনও XHTML এ লেখা টেমপ্লেটগুলি হোস্ট করে। আপনি এগুলি এড়াতে চাইবেন। আরেকটি বিষয় হল আপনার নির্বাচিত টেমপ্লেটের লাইসেন্স চেক করা নিশ্চিত করা। তারা সব বিনামূল্যে, কিন্তু কিছু পাবলিক ডোমেইন, কিছু ক্রিয়েটিভ কমন্স, এবং কিছু একটি লেখক নির্দিষ্ট লাইসেন্স ব্যবহার করে।
6। OS-Templates.com
28 পৃষ্ঠার বিনামূল্যে CSS টেমপ্লেট, বেশিরভাগই একক পৃষ্ঠায় আধুনিক, গ্রিড-ভিত্তিক লেআউট ব্যবহার করে। যদি আপনি যা করেন তা যদি সহজ হয়, তবে এটি দেখার জায়গা। ডিজাইনগুলি পরিষ্কার, আকর্ষণীয় এবং কাস্টমাইজ করা সহজ।
OS-Templates.com এছাড়াও 'মৌলিক টেমপ্লেট' এর একটি বড় সংগ্রহ অফার করে। এইগুলি আপনাকে একটি ওয়েবসাইটের জন্য বিভিন্ন জনপ্রিয় লেআউট স্কিম (দুই-কলাম, তিন-কলাম, ইত্যাদি) -এর মৌলিক কাঠামো দেয়, যখন সম্পূর্ণভাবে স্টাইলহীন। ওয়ার্ডপ্রেসে ডিফল্ট থিম ব্যবহার করার মতো, ফাঁকা ক্যানভাস আপনাকে আপনার সাইটকে যে কোন কিছুতে পরিণত করতে সক্ষম করে।
7. boag.online [আর পাওয়া যায় না]
ম্যাগলেভ একটি একক এক পৃষ্ঠার ওয়েবসাইট টেমপ্লেট যা হতে পারে boag.online এ কর্মে পূর্বরূপ ।
এটি একটি দ্রুত, পরিষ্কার টেমপ্লেট, একটি পণ্য পৃষ্ঠার জন্য আদর্শ। বিভাগগুলির মধ্যে স্ক্রোল করতে আপনাকে সাহায্য করার জন্য ন্যূনতম নকশাটি কেবল কয়েকটি জ্যাকুয়েরি প্রভাব দ্বারা বাড়ানো হয়েছে। সাধারণ লেআউটটি তার নিজস্বভাবে কাজ করে, তবে এটি আপনার নিজস্ব কাস্টমাইজেশনের জন্য একটি দুর্দান্ত সূচনা করে।
8। পিক্সেল বুদ্ধ
পিক্সেল বুদ্ধের টেমপ্লেটগুলি কেবল ওয়েবসাইটের মধ্যে সীমাবদ্ধ নয়, সেগুলিতে ইমেইল নিউজলেটারগুলির জন্য কিছু অন্তর্ভুক্ত রয়েছে।
যেকোনো উপায়ে, তারা সব HTML5 এবং CSS3 দিয়ে ডিজাইন করা হয়েছে, এবং প্রতিক্রিয়াশীল তাই যেকোনো ডিভাইসে দারুণ লাগছে। হাইলাইটগুলির মধ্যে রয়েছে হাওডি এইচটিএমএল, একটি সুন্দর পোর্টফোলিও/সারসংকলন টেমপ্লেট এবং এসওএইচও এইচটিএমএল, একটি দুর্দান্ত দেখতে ইকমার্স পৃষ্ঠা যা এইচটিএমএল এবং সিএসএসের উপরে উত্স পিএসডি ফাইল অন্তর্ভুক্ত করে।
আমি কোথায় বিনামূল্যে বই ডাউনলোড করতে পারি?
9। Templatemo.com
Templatemo থেকে প্রায় 500 টি বিনামূল্যে টেমপ্লেট পাওয়া যায়। কিছু সেরা হল যেগুলি বুটস্ট্র্যাপ-স্টাইলের গ্রিড সিস্টেম থেকে আলাদা হয়ে কিছু আলাদা করার চেষ্টা করে।
বেশিরভাগ টেমপ্লেটগুলি সহজ এবং অবাধ, যদিও লাইটবক্স এবং কন্টেন্ট ক্যারোসেলের মতো বৈশিষ্ট্যগুলি যেখানে প্রয়োজন সেখানে অন্তর্ভুক্ত করা হয়েছে। আমরা এটাও পছন্দ করি যে বেশ কয়েকটি টেমপ্লেট ডিফল্টরূপে ছয়টি পৃষ্ঠার সাথে কাজ করার জন্য সেট আপ করা হয়েছে। এটি আরও সহজ করে তোলে যদি আপনার সামগ্রী ক্রমবর্ধমান এক-পৃষ্ঠার বিন্যাসের সাথে মানানসই না হয়।
10 Startbootstrap.com
বুটস্ট্র্যাপ একটি অবিশ্বাস্যভাবে জনপ্রিয় ফ্রন্ট-এন্ড ফ্রেমওয়ার্ক যা আপনাকে বিনা সময়ে উচ্চমানের ওয়েবসাইট তৈরি করতে সক্ষম করে। যাইহোক, এটি শিখতে একটু সময় লাগে, যেখানে স্টার্ট বুটস্ট্র্যাপ আসে।
বিনামূল্যে, ওপেন সোর্স টেমপ্লেটগুলির এই সংগ্রহগুলি বুটস্ট্র্যাপের গ্রিড সিস্টেম ব্যবহার করে তৈরি করা হয়েছে। 30 টিরও বেশি বেছে নিতে হবে। কিছু সম্পূর্ণরূপে ডিজাইন করা হয়েছে, এবং অ্যাপস, ব্লগ এবং ল্যান্ডিং পৃষ্ঠাগুলির জন্য তৈরি করা হয়েছে, অন্যরা ফাঁকা লেআউটগুলি আপনার স্টাইল করার জন্য অপেক্ষা করছে।
এগারো Bootswatch.com
অবশেষে, কিছুটা বেশি হাতে-কলমে। বুটসওয়াচ বুটস্ট্র্যাপ ব্যবহার করে নির্মিত স্টাইল সাইটগুলিতে 16 টি ওপেন সোর্স থিম সরবরাহ করে।
আপনি বুটস্ট্র্যাপ ব্যবহার করে নিজের সাইটের লেআউট নিজেই তৈরি করতে পারেন, অথবা স্টার্ট বুটস্ট্র্যাপ থেকে একটি ফাঁকা টেমপ্লেট ডাউনলোড করতে পারেন। বুটসওয়াচ যা করে তা হ'ল ফন্ট, পটভূমির রঙ এবং বোতাম, মেনু এবং অন্যান্য উপাদানগুলির স্টাইল পরিবর্তন করা। এটি আপনার সাইটকে বুটস্ট্র্যাপের অতি পরিষ্কার পরিচ্ছন্ন নীতি মেনে চলার সময় একটি অনন্য চেহারা দেয়।
বুটস্ট্র্যাপ সহ একটি মৌলিক ওয়েবসাইট একত্রিত করা সহজ, এবং বুটসওয়াচ এটিকে কিছু তাত্ক্ষণিক পালিশ দেয়।
কিভাবে CSS টেমপ্লেট ব্যবহার করবেন
ব্যাপকভাবে বলতে গেলে, টেমপ্লেটগুলি ব্যবহার করার দুটি উপায় রয়েছে। আপনি হয় সেগুলিকে যেমন ব্যবহার করেন অথবা আপনি আপনার নিজের ডিজাইনের ভিত্তি হিসাবে ব্যবহার করেন।
টেমপ্লেট ব্যবহার করার সময় বিপদ হল যে আপনি এমন একটি ওয়েবসাইটের সাথে শেষ করেন যা অন্য কারও অনুরূপ। একটি জনপ্রিয় টেমপ্লেট বাছুন এবং সেখানে আক্ষরিকভাবে হাজার হাজার অভিন্ন সাইট থাকতে পারে। এটি তাদের কাস্টমাইজ করার পক্ষে প্রধান যুক্তি।
কিভাবে বিনামূল্যে প্লেক্স পাস পাবেন
সিএসএস টেমপ্লেটগুলি অভিজ্ঞ ওয়েব ডিজাইনারদের জন্য একটি দুর্দান্ত শর্টকাট যাঁদের মনে একটি প্রাথমিক লেআউট রয়েছে এবং এটি স্টাইলিংয়ে সরাসরি ঝাঁপিয়ে পড়তে চান।
তারা ওয়েব ডিজাইনে নতুন যে কারো জন্যও নিখুঁত। যদি আপনি এইচটিএমএল এবং সিএসএস -এর আশেপাশে আপনার পথ জানেন কিন্তু এখনও শুরু থেকে একটি সাইট তৈরির জন্য আত্মবিশ্বাস বা জ্ঞান না থাকলে একটি সিএসএস টেমপ্লেট একটি দুর্দান্ত লুকিং সাইট পাওয়ার একটি সহজ উপায় এবং একটি অসাধারণ লার্নিং টুল হিসেবে কাজ করে।
আপনি এটিকে একটি কাজ হিসাবে বিবেচনা করতে পারেন। দ্বারা শুরু ফন্ট সুইচ আউট এবং রঙের স্কিম পরিবর্তন করা , এবং সময়ের সাথে সাথে আপনি বিদ্যমান উপাদানগুলিকে পুনরায় ডিজাইন করতে পারেন, নতুনগুলি যুক্ত করতে পারেন এবং আরও অনেক কিছু করতে পারেন। ব্যবহারিক, হাতে-কলমে অভিজ্ঞতার চেয়ে ভালো কিছু শেখার আর কোন উপায় নেই।
ওয়েবসাইট তৈরির সময় আপনি কি CSS টেমপ্লেট ব্যবহার করেন? সেগুলি খুঁজে পেতে আপনার প্রিয় জায়গাগুলি কী? আপনার অভিজ্ঞতা এবং টিপস আমাদের সাথে মন্তব্যগুলিতে ভাগ করুন।
শেয়ার করুন শেয়ার করুন টুইট ইমেইল কিভাবে কমান্ড প্রম্পট ব্যবহার করে আপনার উইন্ডোজ পিসি পরিষ্কার করবেনযদি আপনার উইন্ডোজ পিসি স্টোরেজ স্পেস কম থাকে, এই দ্রুত কমান্ড প্রম্পট ইউটিলিটি ব্যবহার করে জাঙ্ক পরিষ্কার করুন।
পরবর্তী পড়ুন সম্পর্কিত বিষয়- প্রোগ্রামিং
- ওয়েব ডিজাইন
- সিএসএস
অ্যান্ডি একজন প্রিন্ট সাংবাদিক এবং ম্যাগাজিন সম্পাদক যিনি 15 বছর ধরে প্রযুক্তি সম্পর্কে লিখছেন। সেই সময়ে তিনি অসংখ্য প্রকাশনায় অবদান রেখেছেন এবং বড় বড় প্রযুক্তি সংস্থার জন্য কপিরাইটিং কাজ তৈরি করেছেন। তিনি মিডিয়া এবং শিল্প ইভেন্টগুলিতে প্যানেল হোস্ট করার জন্য বিশেষজ্ঞ মন্তব্য প্রদান করেছেন।
অ্যান্ডি বেটস থেকে আরোআমাদের নিউজলেটার সদস্যতা
প্রযুক্তি টিপস, রিভিউ, ফ্রি ইবুক এবং এক্সক্লুসিভ ডিলের জন্য আমাদের নিউজলেটারে যোগ দিন!
সাবস্ক্রাইব করতে এখানে ক্লিক করুন