রোবোটো ফন্ট হল গুগল তৈরি একটি স্যান্স-সেরিফ টাইপফেস। এটি সুন্দর এবং হাই-রেজোলিউশন স্ক্রিন যেমন অ্যান্ড্রয়েড ফোনে খুব ভালো রেন্ডার করে। তাই এটি অনেক অ্যাপ্লিকেশনের জন্য একটি আদর্শ পছন্দ। আরো ভালো খবর হল, উইন্ডোজ, macOS এবং লিনাক্সে রোবোটো ফন্ট ইনস্টল করা খুব সহজ।
এই পোস্টে আমরা দেখাব কীভাবে উইন্ডোজ, macOS, লিনাক্স এবং এমনকি আপনার ওয়েবসাইটে গুগল রোবোটো ফন্ট ইনস্টল করতে হয়। চলুন শুরু করি!
গুগল রোবোটো ফন্ট ডাউনলোড করা
প্ল্যাটফর্ম যেকোনো হোক, প্রথমে আপনাকে রোবোটো ফন্ট প্যাক ডাউনলোড করতে হবে। এর জন্য রোবোটো ফন্ট সাইটে যান। সমগ্র ফন্ট পরিবার ডাউনলোড করার সবচেয়ে সহজ উপায় হল "Download Family" বোতামে ক্লিক করা।
এটি আপনার কম্পিউটারে একটি ZIP ফাইল হিসেবে ডাউনলোড হবে, যা আপনার অপারেটিং সিস্টেমে ইনস্টল করা যাবে।
উইন্ডোজ, ম্যাক এবং লিনাক্সে গুগল রোবোটো ফন্ট ইনস্টল করার পদ্ধতি
শুভ সংবাদ হল, আপনি যেকোনো প্ল্যাটফর্মে রোবোটো ফন্ট ইনস্টল করতে চান, এতে শুধু কয়েকটি ক্লিক লাগবে।
১. উইন্ডোজ ১০
উইন্ডোজের জন্য, প্রথমে রোবোটো ফন্ট ফোল্ডারটি আনজিপ করুন। তারপর স্টার্ট মেনু থেকে সেটিংস পেজ খুলুন।
এখান থেকে Personalization অপশনে ক্লিক করুন, তারপর Fonts নির্বাচন করুন।
এরপর এক্সট্র্যাক্ট করা ফন্টগুলো ইনস্টলার উইন্ডোতে ড্র্যাগ করে ফেলুন। কয়েক সেকেন্ডের মধ্যে গুগল রোবোটো ফন্ট উইন্ডোজে ইনস্টল হয়ে যাবে। আপনি আপনার ইনস্টল করা অ্যাপ্লিকেশনগুলোর মধ্যে অন্য ফন্টের মতো এটি সিলেক্ট করতে পারবেন।
২. macOS
ম্যাকের জন্য, প্রথমে ZIP ফাইলটি এক্সট্র্যাক্ট করুন, তারপর ফোল্ডারের ভিতরের সব ফন্ট সিলেক্ট করুন (LICENSE.txt বাদ দিয়ে), রাইট-ক্লিক করুন এবং কনটেক্সট মেনু থেকে "Open With → Font Book" নির্বাচন করুন।
এটি ফন্টগুলো ফন্ট বকে লোড করবে এবং আপনার অ্যাপ্লিকেশনগুলিতে ব্যবহার করার জন্য উপলব্ধ করবে।
দ্রষ্টব্য: আপনি আলাদা আলাদা ফন্ট ফাইলগুলোর ওপর ডাবল-ক্লিক করেও সেগুলো ফন্ট বকে লোড করতে পারেন।
৩. লিনাক্স
হোম ফোল্ডার খুলুন এবং হিডেন ফাইল/ফোল্ডার দেখানোর অপশন এনেবল করুন। ".fonts" ফোল্ডারটি লোকেট করুন। যদি এটি না থাকে, তবে তৈরি করুন। এরপর রোবোটো ফন্ট ফোল্ডারটি এই ".fonts" ফোল্ডারে সরিয়ে দিন।
বিকল্পভাবে, আপনি ফন্ট ম্যানেজার প্রোগ্রাম ব্যবহার করে আপনার ফন্টগুলো ম্যানেজ করতে পারেন।
- সফটওয়্যার সেন্টার বা রিপোজিটরি থেকে ফন্ট ম্যানেজার ইনস্টল করুন।
- এটি ইনস্টল হলে, এটি ওপেন করুন এবং সার্চ বার থেকে Fonts অ্যাপ ওপেন করুন।
- ফন্ট ম্যানেজারের Manage ট্যাবে যান এবং প্লাস আইকনে ক্লিক করুন।
- আপনার এক্সট্র্যাক্ট করা ফন্ট ফোল্ডারে নেভিগেট করুন এবং প্রয়োজনীয় ফন্টগুলো অ্যাড করুন।
আপনি যে অ্যাপগুলো ব্যবহার করছেন সেগুলো রিস্টার্ট করলে রোবোটো ফন্ট সিলেকশনের জন্য উপলব্ধ থাকবে।
ওয়েবসাইটে গুগল রোবোটো ফন্ট ব্যবহার করা
আপনি যদি আপনার ওয়েবসাইটে রোবোটো ফন্ট ব্যবহার করতে চান, তবে CSS3 @font-face সিনট্যাক্স ব্যবহার করে এক্সটার্নাল ফন্টকে আপনার ওয়েবপেজে এম্বেড করতে পারেন।
FontSquirrel রোবোটো ফন্ট পেজে যান, "Webfont Kit"-এ ক্লিক করুন, তারপর আপনার পছন্দের ফন্ট ফরম্যাট, সাবসেট (যদি থাকে) বেছে নিন এবং "Download @Font-Face Kit"-এ ক্লিক করুন।
জিপ ফাইলটি এক্সট্র্যাক্ট করে আপনার ওয়েবসাইটের ফন্ট ফোল্ডারে রাখুন। আপনার ওয়েব স্টাইলশিট খুলুন এবং নিচের কোড যোগ করুন:
@font-face { font-family: 'Roboto'; src: url('Roboto-Regular-webfont.eot'); src: url('Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Regular-webfont.woff') format('woff'), url('Roboto-Regular-webfont.ttf') format('truetype'), url('Roboto-Regular-webfont.svg#RobotoRegular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('Roboto-Italic-webfont.eot'); src: url('Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Italic-webfont.woff') format('woff'), url('Roboto-Italic-webfont.ttf') format('truetype'), url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg'); font-weight: normal; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('Roboto-Bold-webfont.eot'); src: url('Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Bold-webfont.woff') format('woff'), url('Roboto-Bold-webfont.ttf') format('truetype'), url('Roboto-Bold-webfont.svg#RobotoBold') format('svg'); font-weight: bold; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('Roboto-BoldItalic-webfont.eot'); src: url('Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-BoldItalic-webfont.woff') format('woff'), url('Roboto-BoldItalic-webfont.ttf') format('truetype'), url('Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg'); font-weight: bold; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('Roboto-Thin-webfont.eot'); src: url('Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Thin-webfont.woff') format('woff'), url('Roboto-Thin-webfont.ttf') format('truetype'), url('Roboto-Thin-webfont.svg#RobotoThin') format('svg'); font-weight: 200; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('Roboto-ThinItalic-webfont.eot'); src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-ThinItalic-webfont.woff') format('woff'), url('Roboto-ThinItalic-webfont.ttf') format('truetype'), url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); font-weight: 200; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('Roboto-Light-webfont.eot'); src: url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Light-webfont.woff') format('woff'), url('Roboto-Light-webfont.ttf') format('truetype'), url('Roboto-Light-webfont.svg#RobotoLight') format('svg'); font-weight: 100; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('Roboto-LightItalic-webfont.eot'); src: url('Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-LightItalic-webfont.woff') format('woff'), url('Roboto-LightItalic-webfont.ttf') format('truetype'), url('Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg'); font-weight: 100; font-style: italic; }
@font-face { font-family: 'Roboto'; src: url('Roboto-Medium-webfont.eot'); src: url('Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Medium-webfont.woff') format('woff'), url('Roboto-Medium-webfont.ttf') format('truetype'), url('Roboto-Medium-webfont.svg#RobotoMedium') format('svg'); font-weight: 300; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('Roboto-MediumItalic-webfont.eot'); src: url('Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-MediumItalic-webfont.woff') format('woff'), url('Roboto-MediumItalic-webfont.ttf') format('truetype'), url('Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg'); font-weight: 300; font-style: italic; }
"src" পাথটি আপনার ফন্ট ফোল্ডারের লোকেশন অনুযায়ী পরিবর্তন করতে ভুলবেন না।
এরপর font-family:"Roboto"; সিনট্যাক্স ব্যবহার করে আপনার ওয়েবপেজে রোবোটো ফন্ট প্রদর্শন করুন।
উপসংহার
গুগলের রোবোটো ফন্ট হেলভেটিকা এবং অ্যারিয়ালের মতো رئيسي ফন্টগুলোর একটি স্টাইলিশ বিকল্প। আরও том, এটি গুগলের ম্যাটেরিয়াল ডিজাইন উদ্যোগের অগ্রদূত। যাইহোক, রোবোটো সব ধরনের অ্যাপ্লিকেশনে কাজ করে এবং উইন্ডোজ, macOS, লিনাক্স এবং এমনকি আপনার ওয়েবসাইটে ইনস্টল করা খুব সহজ।
আপনি যদি রোবোটো ফন্ট পছন্দ না করেন, তবে আমাদের আর্টিকেল যেখানে ওয়েবসাইট ডিজাইন এলিমেন্ট চেক করার পদ্ধতি বর্ণনা করা আছে, সেটি পড়ে আপনি জানতে পারেন কোন ওয়েবসাইটে কোন ফন্ট ব্যবহার করা হয়েছে। আপনি কি আপনার কম্পিউটারে রোবোটো ফন্ট ব্যবহার করেন? যদি করেন, তবে কী উদ্দেশ্যে? কমেন্ট সেকশনে জানান!