انجمن سایت کلیدستان


رتبه موضوع:
  • 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
تاثیر فلکس باکس در طراحی سایت

تاثیر فلکس باکس در طراحی سایت

#1
Star 
تاثیر فلکس باکس در طراحی سایت

[عکس: flexbox-website.jpg]
کد پی‌اچ‌پی:
[code]
<
div class="grid flex">
        <div class="col_6 column">Content Here</div>
        <div class="col_6 column">Content Here</div>
</
div>
[/
code
در زمان قدیم نه خیلی قدیم عهد ماشین حساب نه سال 2009 در ماژول های css3  چیزی اومد به اسم فلکس باکس که کار طراحان سایت را خیلی راحت می کرد برای اینکه بتوانند صفحه طراحی سایت مشتری خود را طراحی کنند و به مشکل نخورند فلکس باکس اول در سه نسخه آمد یکی سال 2009 که شروع آن بود سال 2011 که نسخه دوم آن و نسخه نهاییflexbox  را هم طراحی کردند دستشون درد نکنه ما را راحت تر کردند

 [عکس: Advantage-flex-box.jpg]
فلکس باکس چی هست؟

خوب اول بگم فلکس باکس یا همان Flexbox یا Flexible Box Layout Model قوانین و تکنیک هایی هستند که ما بهتر بتونیم سایت خودمان رو ریسپانسیو کنیم برای اینکه در دستگاه های مختلف سایت ها به یک شکل و درست نمایش دهد اگر از قالب های آماده استفاده می کنید خوش به حالتون هلویی برای خودتان ساخته اید چون این تکنیک در سایت های خارجی استفاده شده است ولی اگر شما هم مثل ما در ساین وب قالب ها را از پایه طراحی سایت می کنید و بعضی اوقات مشکل دارید با مشتری که که چرا سایت من مثلا در سیستم ios  مشکل دارد حتما فلکس باکس را یاد بگیرید البته تکنیک قدیمی هم موجو دارد که طراحان سایت از آن با خبر هستند به اسم display: inline-block ولی بهتر هست از flexbox  استفاده کنید تا سایت های شما هم در دستگاه های مختلف قشنگ به نمایش در بیاید دیگر الان بیشتر افراد هر سایتی را در موبایل ها و تبلت های خود مشاهده می کنند تا کامپیوترهای خانگی یا حتی لب تاپ ها پس سعی کنید به روز باشید

[عکس: example-flex-box.jpg]
مزیت های استفاده از flexbox نگاه کنید
استفاده از فلکس باکس کار شما را در طراحی سایت ریسپانسیو خیلی راحت می کندشما می توانید چند اجزا را در فلکس باکس قرار دهید و برای همه یک استایل گروهی انتخاب کنید این برای یک برنامه نویس سمت کاربر واقعا کار را راحت می کندبرای اینکه چند مجموعه را در کنار هم قرار دهید از فلکس باکس استفاده کنیداگر می خواهید از آبکجتی در طراحی سایت خود استفاده کنید از flexbox  استفاده کنیدبرای اینکه بتوانید لایه های خود را در سایت تنظیم کنید از فلکس باکس استفاده کنید البته برای این کار از display  و float  هم می توان استفاده کرد ولی دیگر این تکنیک ها قدیمی شده است

[عکس: Support-flex-box.jpg]

معایب فلکس باکس

جدول بالا به شما نشان می دهد فلکس باکس در چه دستگاه هایی ساپورت می شوداولین چیز پشتیبانی نکردن مرورگرهای کاربران چیزی که به کابوس ما طراحان سایت تبدیل شده است کاش همه آخرین نسخه مرورگر خود را داشتند مثلا کسی که ie9 داشته باشد و  شما فلکس باکس استفاده کنید سایت به هم می ریزدما بیشتر در این مطلب قصد داشتیم شما را با فلکس باکس آشنا کنیم اگر توانستیم و خدا یاری کرد آموزش فلکس باکس را هم براتون آماده می کنیم ولی شما می توانید با جستجو ساده آموزش های انگلیسی فلکس باکس را دانلود و مشاهده کنید

یکی از آموزش ها flexboxامیدواریم شما هم از این تکنیک های جدید در طراحی سایت تهران  های خودتان استفاده کنید

گروه طراحی سایت مهندسین ساین وب

ایده و خلاقیت اتفافی نیست

021-66467942
پاسخ
 سپاس شده توسط شماره مجازی امارات ، تلگرام ضد فیلتر 2023


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان