Responsive Design ဆိုတာဘာလဲ
Responsive Design ဆိုတာဘာလဲ Responsive Design ဆို မတူညီတဲ့ Device screen size တွေမှာ ကိုယ် web pageကို ကြည့်ကောင်းအောင်ပြတာကိုပြောချင်တာပါ။ ဥပမာ desktopမှာအဆင် ပြေပြီး mobileမှာ image crop off ဖြစ်တာမျိူး စာက တစ်ပိုင်းပဲပြတာမျိုး userအတွက်အဆင်မပြေဘူးပေါ့သုံးရတာ။ ဒါ့ကြောင်း responsive design က web development ကအတွက်အရေးပါတဲ့အပိုင်းတစ်ခုဖြစ်ပါတယ်။ ဒါ့အပြင် responsive ကလွယ်မလိုလိုနဲ့ ခက်ပါတယ်။ ဘာလို့ဆို အရမ်းအသေးစိတ်ရလို့ပါ။ Responsive design မှာ screen ကို Small ( 640px အောက်)၊ Medium ( 641px to 1007 px )၊ Large ( 1008px and larger) ဆိုပြီး breakpoint 3 ခုရှိပါတယ်။ Small ဆိုတာကတော့ mobile phone, smart watch, TVs စတာတွေပါပါတယ်။ Medium မှာတော့ Tablets ဖြစ်ပြီ၊ Largeကတော့ PCs, laptops, စတာတွေဖြစ်ပါတယ်၊ TVsက ဘာလို့ smallဖြစ်ရလဲဆိုတော့ 1080px ရှိနေပေမဲ့ ၁၀ပေ အကွာအဝေးက ကြည့်တဲ့အခါ 540pxလောက်ပဲ effective ဖြစ်တာကြောင့်ပါ။ Responsive design ရဲ့ အဒီကလုပ်ရတဲ့အပိုင်းတွေကတော့ flexible layouts, images ၊ CSS media query စတဲ့အပိုင်းတွေကိုအဒီကကြည့်ရတာပေါ့။ Layout ဆိုတာကတော့ Desktop view မှဦပြမဲ့ layout နဲ့ mobile view မှာပြမဲ့ layout က မတူနိုင်ပါဘူး အဲအတိုင်း website designဆွဲရင် ရေးရင်ပြင်ဆင်ဖိုလိုပါတယ်။ CSS framwork တွေမှာတော့ responsive layout၊ responvie grib၊ responsive tableစသဖြင့် support ေပးထားကြပါတယ်များသောအားဖြင့်။ bluma, bootstrap, uikit, foundation, materialize စ တဲ့အမျိုးမျိုး css framework တွေရှိပါတယ်။ Image တွေမှာလဲ screen size ပေါမူတည်ပြီး CSS နဲ့ width , height, crop, စတဲ့အမျိုးမျိုးသော properties ေတွကိုသုံးပြီး ပြောင်းတာမျိုး၊ CSS media query ဆိုတာကတော့ screen ရဲ့ width height properties က ဒီ valueေရာက်တဲ့အခါ ဒီ css ကိုသုံးမယ်ဆိုပြီးသတ်မှတ်ာမျိုးပေါ့။ ဟုတ်ပါပြီ ဒီလောက်ဆိုရင် responsive designဘာလဲတီးမိခေါက်မိလောက်ပိထင်ပါတယ်ဒါဆိုရင်တော့ စလေ့လာလို့ရပါပြီ responsive designနဲ့ပတ်သက်ပြီး။ Facebook မှာရော Telegramမှာပါ ဝင်ရောက်ဆွေးနွေးပေးကြပါဗျ။Facebook page ၊ telegram channel နဲ့ Youtube Channel ကို follow subscribe လုပ်သွားနိုင်ပါတယ်ဗျ။ Facebook - @callmedevbypeter Telegram - @callmedevbypeter Youtube - Call Me Dev by Peter သိချင်တဲ့အကြောင်းအရာရှိရင် comment မှာရေးသွားပါဗျ။ Thanks you ပါ။ #callmedevbypeter #responsive_design #web_development
Responsive Design ဆိုတာဘာလဲ
Responsive Design ဆိုတာဘာလဲ Responsive Design ဆို မတူညီတဲ့ Device screen size တွေမှာ ကိုယ် web pageကို ကြည့်ကောင်းအောင်ပြတာကိုပြောချင်တာပါ။ ဥပမာ desktopမှာအဆင် ပြေပြီး mobileမှာ image crop off ဖြစ်တာမျိူး စာက တစ်ပိုင်းပဲပြတာမျိုး userအတွက်အဆင်မပြေဘူးပေါ့သုံးရတာ။ ဒါ့ကြောင်း responsive design က web development ကအတွက်အရေးပါတဲ့အပိုင်းတစ်ခုဖြစ်ပါတယ်။ ဒါ့အပြင် responsive ကလွယ်မလိုလိုနဲ့ ခက်ပါတယ်။ ဘာလို့ဆို အရမ်းအသေးစိတ်ရလို့ပါ။ Responsive design မှာ screen ကို Small ( 640px အောက်)၊ Medium ( 641px to 1007 px )၊ Large ( 1008px and larger) ဆိုပြီး breakpoint 3 ခုရှိပါတယ်။ Small ဆိုတာကတော့ mobile phone, smart watch, TVs စတာတွေပါပါတယ်။ Medium မှာတော့ Tablets ဖြစ်ပြီ၊ Largeကတော့ PCs, laptops, စတာတွေဖြစ်ပါတယ်၊ TVsက ဘာလို့ smallဖြစ်ရလဲဆိုတော့ 1080px ရှိနေပေမဲ့ ၁၀ပေ အကွာအဝေးက ကြည့်တဲ့အခါ 540pxလောက်ပဲ effective ဖြစ်တာကြောင့်ပါ။ Responsive design ရဲ့ အဒီကလုပ်ရတဲ့အပိုင်းတွေကတော့ flexible layouts, images ၊ CSS media query စတဲ့အပိုင်းတွေကိုအဒီကကြည့်ရတာပေါ့။ Layout ဆိုတာကတော့ Desktop view မှဦပြမဲ့ layout နဲ့ mobile view မှာပြမဲ့ layout က မတူနိုင်ပါဘူး အဲအတိုင်း website designဆွဲရင် ရေးရင်ပြင်ဆင်ဖိုလိုပါတယ်။ CSS framwork တွေမှာတော့ responsive layout၊ responvie grib၊ responsive tableစသဖြင့် support ေပးထားကြပါတယ်များသောအားဖြင့်။ bluma, bootstrap, uikit, foundation, materialize စ တဲ့အမျိုးမျိုး css framework တွေရှိပါတယ်။ Image တွေမှာလဲ screen size ပေါမူတည်ပြီး CSS နဲ့ width , height, crop, စတဲ့အမျိုးမျိုးသော properties ေတွကိုသုံးပြီး ပြောင်းတာမျိုး၊ CSS media query ဆိုတာကတော့ screen ရဲ့ width height properties က ဒီ valueေရာက်တဲ့အခါ ဒီ css ကိုသုံးမယ်ဆိုပြီးသတ်မှတ်ာမျိုးပေါ့။ ဟုတ်ပါပြီ ဒီလောက်ဆိုရင် responsive designဘာလဲတီးမိခေါက်မိလောက်ပိထင်ပါတယ်ဒါဆိုရင်တော့ စလေ့လာလို့ရပါပြီ responsive designနဲ့ပတ်သက်ပြီး။ Facebook မှာရော Telegramမှာပါ ဝင်ရောက်ဆွေးနွေးပေးကြပါဗျ။Facebook page ၊ telegram channel နဲ့ Youtube Channel ကို follow subscribe လုပ်သွားနိုင်ပါတယ်ဗျ။ Facebook - @callmedevbypeter Telegram - @callmedevbypeter Youtube - Call Me Dev by Peter သိချင်တဲ့အကြောင်းအရာရှိရင် comment မှာရေးသွားပါဗျ။ Thanks you ပါ။ #callmedevbypeter #responsive_design #web_development
CallMeDevbyPeter
Since 2022