shs1366
25th February 2015, 01:57 AM
مقدمه
افزایش روز افزون استفاده از ابزارهای مختلف در طراحی سایت و همچنین تلاش طراحان سایت برای ایجاد سایتی کاربر پسند و زیبا موجب این شده است که استفاده از طراح های پیش ساخته در طراحی سایت امروزه بیشتر متداول شود Bootstrap نیز یکی از ابزارهای بسیار کاربردی است به طوری که به دلیل رایگان بودن محبوبیت بالایی دارد و تا به اینجا نیز نسخه سوم این ابزار کاربردی منتشر شده است.ُدر ادامه ما به معرفی اجمالی Bootstrap می پردازیم . معنی لغوی Bootstrap
بوت در زبان انگلیسی به معنی پوتین است بوت استرپ هم در معنی این است که در بعضی از پوتین ها زبانه ای برای کشیدن پاشنه قرار دارد به این زبانه بوت استرپ می گویند که کار پوشیدن پوتین را راحت می کند و احتمالا هم به همین دلیل از این اصطلاح برای ابزار بوت استرپ استفاده کرده اند چرا که طراحی سایت را تا ۸۰ درصد راحتر و سریع تر می کند. معنی اصطلاحی Bootstrap
بوت استرپ به معنی خود راه انداز است در واقع Bootstraping به معنی راه اندازی فرآیند به صورت مستقل و بدون استفاده از منابع دیگر است.و اگر دقت کنید معنی Booting (راه اندازی سیستم و وارد سازی اطلاعات اولیه نرم افزار در رم کامپیوتر) نیز از این اصطلاح برداشته شده است. تاریخچه Bootstrap
بوت استریپ توسط Jacob Thornton و Mark Otto که از برترین کارمندان توئیتر هستند طراحی شد و این طرح برای ایجاد سازگاری بین ابزارهای مختلف موجد در سایت توئتیر پیاده سازی شده است.قبل از ایجاد بوت استرپ توئیتر از کتابخانه ها و ابزارهای زیادی استفاده کرده بود ولی به دلیل هزینه بالای نگهداری و همچنین ناسازگاری با برخی از ابزارها ، راه کار را در استفاده از بوت استرپ دید.و بوت استرپ به دلیل استقبال زیاد در بین کاربران در سال ۲۰۱۱ به صورت open source در اختیار عموم قرار گرفت. Bootstrap در طراحی سایت بوت استرپ مجموعه ای از ابزارهای کاربردی و مورد نیاز برای طراحی سایت و وب اپلیکیشن و همچنین شامل قالب های طراحی HTML مبتنی بر CSS است.از این قالب ها می توان به عنوان متن ها ، فرم ها ، عکس ها ، منو ها و …. در طراحی سایت استفاده کرد.به طوری که بوت استرپ می خواهد از طراحی های پیش فرض در طراحی سایت بیشتر استفاده کنیم. و فضای بین کد نویسی و طراحی را کم کند.که این در نهایت به کاهش زمان راه اندازی پروژه می شود. بوت استرپ دارای افزونه های جاوا اسکریپت است که به راحتی می توان از آن ها استفاده کرد بدین صورت که با edit کردن آن می توان به طراحی سایت خود جلوه های زیبایی داد.بوت استریپ رایگان است و در دسترس همه قرار دارد.در ضمن بهتر است قبل از استفاده از بوت استریپ به زبانهای HTML و CSS وهمچنین JavaScript آشنا یی داشته باشید. مزایای Bootstrap
1- Mobile first : در طراحی بوت استرپ از رویکرد موبایل در اولویت استفاده می شود .یعنی در طراحی سایت قبل از اینکه به کامپوتر فکر کنیم ابتدا سایت را برای موبایل طراحی کنیم.در واقع دو نوع رویکرد برای طراحی سایت داریم: ۱- رویکرد Desktop محور: که به صورت زیر است.
http://inten.asia/wp-content/uploads/2015/01/best2.jpg (http://inten.asia/bootstrap-use-in-web-design/)
۲- رویکرد Mobile First : کهبه صورت زیر می باشد.
http://inten.asia/wp-content/uploads/2015/01/best1.jpg (http://inten.asia/wp-content/uploads/2015/01/best1.jpg)
۲- پشتیبانی مرورگر: اکثر مرورگرهای موجود بوت استرپ را پشتیبانی می کنند.
۳- استفاده آسان از بوت استرپ: با آشنایی مقدماتی از HTML و CSS می توان از بوت استرپ به راحتی استفاده کرد.
۴- طراحی ریسپانسیو: بوت استرپ دارای ابزاری است که به طراحی واکنش گرا یا ریسپانسیو برای دستگاه های مختلف کمک می کند.بوت استرپ داری کلاس های متعددی است که در حال حاظر به چها نوع صفحه نمایش با ابعاد مختلف راهکارهایی را ارائه می کند.
http://inten.asia/wp-content/uploads/2015/01/Capture2.jpg (http://inten.asia/wp-content/uploads/2015/01/Capture2.jpg) مشکل Bootstrap
مشکل اصلی به کار گیری بوت استرپ در این است که سایت ها کم کم رنگ و روی یکسانی به خود می گیرند. و با این پیشرفتی که بوت استرپ دارد درآینده ای نزدیک شاهد سایتهایی خواهیم بود که از نظر ظاهرخیلی به هم شبیه هستند.مثلا در حال حاظر رنگ مشکی هدر سایت ، بوردر یک پیکسلی خاکستری و دکمه های آبی و قرمز نشان دهنده استفاده از بوت استرپ در طراحی سایت (http://inten.asia) است. که تشخیص سایت را کمی مشکل می کند.البته منظور این نیست که از این ابزار زیبا استفاده نکنیم بلکه بهتر است در راستای بهبود فضای اینترنت از آن استفاده کنیم .
افزایش روز افزون استفاده از ابزارهای مختلف در طراحی سایت و همچنین تلاش طراحان سایت برای ایجاد سایتی کاربر پسند و زیبا موجب این شده است که استفاده از طراح های پیش ساخته در طراحی سایت امروزه بیشتر متداول شود Bootstrap نیز یکی از ابزارهای بسیار کاربردی است به طوری که به دلیل رایگان بودن محبوبیت بالایی دارد و تا به اینجا نیز نسخه سوم این ابزار کاربردی منتشر شده است.ُدر ادامه ما به معرفی اجمالی Bootstrap می پردازیم . معنی لغوی Bootstrap
بوت در زبان انگلیسی به معنی پوتین است بوت استرپ هم در معنی این است که در بعضی از پوتین ها زبانه ای برای کشیدن پاشنه قرار دارد به این زبانه بوت استرپ می گویند که کار پوشیدن پوتین را راحت می کند و احتمالا هم به همین دلیل از این اصطلاح برای ابزار بوت استرپ استفاده کرده اند چرا که طراحی سایت را تا ۸۰ درصد راحتر و سریع تر می کند. معنی اصطلاحی Bootstrap
بوت استرپ به معنی خود راه انداز است در واقع Bootstraping به معنی راه اندازی فرآیند به صورت مستقل و بدون استفاده از منابع دیگر است.و اگر دقت کنید معنی Booting (راه اندازی سیستم و وارد سازی اطلاعات اولیه نرم افزار در رم کامپیوتر) نیز از این اصطلاح برداشته شده است. تاریخچه Bootstrap
بوت استریپ توسط Jacob Thornton و Mark Otto که از برترین کارمندان توئیتر هستند طراحی شد و این طرح برای ایجاد سازگاری بین ابزارهای مختلف موجد در سایت توئتیر پیاده سازی شده است.قبل از ایجاد بوت استرپ توئیتر از کتابخانه ها و ابزارهای زیادی استفاده کرده بود ولی به دلیل هزینه بالای نگهداری و همچنین ناسازگاری با برخی از ابزارها ، راه کار را در استفاده از بوت استرپ دید.و بوت استرپ به دلیل استقبال زیاد در بین کاربران در سال ۲۰۱۱ به صورت open source در اختیار عموم قرار گرفت. Bootstrap در طراحی سایت بوت استرپ مجموعه ای از ابزارهای کاربردی و مورد نیاز برای طراحی سایت و وب اپلیکیشن و همچنین شامل قالب های طراحی HTML مبتنی بر CSS است.از این قالب ها می توان به عنوان متن ها ، فرم ها ، عکس ها ، منو ها و …. در طراحی سایت استفاده کرد.به طوری که بوت استرپ می خواهد از طراحی های پیش فرض در طراحی سایت بیشتر استفاده کنیم. و فضای بین کد نویسی و طراحی را کم کند.که این در نهایت به کاهش زمان راه اندازی پروژه می شود. بوت استرپ دارای افزونه های جاوا اسکریپت است که به راحتی می توان از آن ها استفاده کرد بدین صورت که با edit کردن آن می توان به طراحی سایت خود جلوه های زیبایی داد.بوت استریپ رایگان است و در دسترس همه قرار دارد.در ضمن بهتر است قبل از استفاده از بوت استریپ به زبانهای HTML و CSS وهمچنین JavaScript آشنا یی داشته باشید. مزایای Bootstrap
1- Mobile first : در طراحی بوت استرپ از رویکرد موبایل در اولویت استفاده می شود .یعنی در طراحی سایت قبل از اینکه به کامپوتر فکر کنیم ابتدا سایت را برای موبایل طراحی کنیم.در واقع دو نوع رویکرد برای طراحی سایت داریم: ۱- رویکرد Desktop محور: که به صورت زیر است.
http://inten.asia/wp-content/uploads/2015/01/best2.jpg (http://inten.asia/bootstrap-use-in-web-design/)
۲- رویکرد Mobile First : کهبه صورت زیر می باشد.
http://inten.asia/wp-content/uploads/2015/01/best1.jpg (http://inten.asia/wp-content/uploads/2015/01/best1.jpg)
۲- پشتیبانی مرورگر: اکثر مرورگرهای موجود بوت استرپ را پشتیبانی می کنند.
۳- استفاده آسان از بوت استرپ: با آشنایی مقدماتی از HTML و CSS می توان از بوت استرپ به راحتی استفاده کرد.
۴- طراحی ریسپانسیو: بوت استرپ دارای ابزاری است که به طراحی واکنش گرا یا ریسپانسیو برای دستگاه های مختلف کمک می کند.بوت استرپ داری کلاس های متعددی است که در حال حاظر به چها نوع صفحه نمایش با ابعاد مختلف راهکارهایی را ارائه می کند.
http://inten.asia/wp-content/uploads/2015/01/Capture2.jpg (http://inten.asia/wp-content/uploads/2015/01/Capture2.jpg) مشکل Bootstrap
مشکل اصلی به کار گیری بوت استرپ در این است که سایت ها کم کم رنگ و روی یکسانی به خود می گیرند. و با این پیشرفتی که بوت استرپ دارد درآینده ای نزدیک شاهد سایتهایی خواهیم بود که از نظر ظاهرخیلی به هم شبیه هستند.مثلا در حال حاظر رنگ مشکی هدر سایت ، بوردر یک پیکسلی خاکستری و دکمه های آبی و قرمز نشان دهنده استفاده از بوت استرپ در طراحی سایت (http://inten.asia) است. که تشخیص سایت را کمی مشکل می کند.البته منظور این نیست که از این ابزار زیبا استفاده نکنیم بلکه بهتر است در راستای بهبود فضای اینترنت از آن استفاده کنیم .