Bootstrap چیست؟ چه میکند؟ چه کاربردهایی دارد؟ و چرا از فریمورکهای محبوب توسعهدهندگان فرانت اند میباشد؟ اینها سوالاتی هست که درصورتیکه قصد دارید وب طراحی صفحه یاد بگیرید، مطلقا به گوشتان خورده هست.
شرکتها و کسبوکارهای زیادی میباشند که کارایی میکنند طراحی وب را وارفتهتر کنند. ابزارهای زیادی در سالهای اخیر ایجاد شده است تا شغل کدنویسی را برای طراحان وبسایت و پیشرفتدهندگان سهل و آسانتر و کمتر کنند. کتابخانههای هر زبان اپلیکیشننویسی ازجملهی این ابزارهاست. درکنار کتابخانه، فریمورکهای مختلفی نیز وجود دارند که یاری بسیار بزرگی برای توسعهدهندگان وب سایتها و اپها می باشند.
تصور کنید نرمافزاری وجود داشته باشد که قطعه کدهای فراوانی را که طراح یا پیشرفتدهنده باید بنویسد، آمادهشده و نوشتهشده در خود دارااست. رویایی هست! مگر نه؟ بوت استرپ از همین ابزارهای حاذق و رویایی برای گسترشدهندگان است. میگردد اذعان کرد که بوت استرپ هم کتابخانه میباشد و هم بهنوعی یک کادر ورک.
درین نوشتهیعلمی قصد دارم شما را با Bootstrap، کاربردها، مزایا و معایب آن آشنا کنم و به سوالاتی که درابتدا طرح شد و حتما سوال های شما هم هست، جواب بدهم.
آنچه دراین نوشته خواهیم داشت
بوت استرپ چیست؟
کاربردهای (مزایای) بوت استرپ در طراحی وب سایت
۱. Bootstrap Responsive Grid System
۲. Bootstrap Responsive Images
۳. Bootstrap Components
۴. Bootstap JavaScript
۵. Bootstrap Documentation
معایب Bootstrap
نسخههای Bootstrap
یک سری حقیقت دیدنی در زمینه ی تاریخچه Bootstrap
گردآوریبندی و فایدهگیری
نویسنده
مهدیه اسماعیلی
بوت استرپ چیست؟
بگذارید از زبان خود بوت استرپ بیانکنم که آن چیست و چه میکند. یادتان باشد که وبسایت رسمی Bootstrap مرجع دستیابی اطلاعات بیشتر و دانلود آن است. بگذارید همینجا بیانکنم که ابدا نباید از وبلاگ این سایت غافل شوید. درادامه، بیشتر در ارتباط بلاگ تارنما سخن میکنم.
با بوت استرپ تارنماهای سریع و واکنشگرا بسازید.
با بوت استرپ، که محبوبترین جعبهابزار منبع باز فرانت اند فقید است، تخت گاز سایتهایی واکنشگرا و کاملا سازگار و مناسب برای نمایش در دستگاههای موبایل طراحی و باصرفه فرمائید. این جعبهابزار ویژگیهای زیادی داراست. ازجملهی آنان می توان به افزونههای قدرتمند جاوااسکریپ و همچنین سیستم grid برخوردگرا اشاره کرد.
بوت استرپ چیست
بوت استرپ مجانی است و شما بهراحتی میتوانید آخرین نسخهی آن را (Bootstrap 5) از تارنما رسمیاش دانلود فرمایید. در صورتیکه کمی بخواهم بیشتر در ارتباط بوت استرپ توضیح دهم می بایست بیانکنم که این جعبهابزار گروهای از قطعه کدهای آمادهی HTML, CSS & JavaScript می باشد که نرمافزار نویس را از نوشتن کدهای زیاد بینیاز میکند. بدین ترتیب در وقت گسترشدهنده بسیار صرفهجویی میشود و او قادر است بر دیزاین و طراحی رابط کاربری وقت بیشتری بگذارد.
همچنین بوت استرپ کتابخانهای منبعباز از آیکونهای SVG و مجموعهای از Themeهای منحصر به فرد به خود را دارد. themeهای بوت استرپ درواقع Extensionهای آن میباشند. Themeها مثل آیکونها رایگان نیستند و باید آن ها را از وبسایت خرید. اما خیلی هم گران نیستند و به عنوان مثال با ۴۹ دلار می گردد یک کدام از آخرین themeهای بوت استرپ را خرید.
در حالتیکه میخواهید با یکی از کادرورکهای کارکشته جاوااسکریپت آشنا شوید، «معرفی Ember.js، قاب ورکی برای بسطی وب نرم افزارها» را بخوانید.
کاربردهای (مزایای) بوت استرپ در ساخت وب سایت
چرا می بایست بوت استرپ خیال و خاطر گرفت؟ چه کاربردهایی بوت استرپ را در طراحی سایت و وب اپها اساسی و موءثر میکند؟ یا درواقع، مزیتهای به کارگیری از بوت استرپ در وب صفحه ارایی و گسترشی وب نرم افزارها چیست؟
۱. Bootstrap Responsive Grid System
درصورتی که گسترشدهنده یا نرم افزارنویسی بخواهد با CSS چیزی مثل تصویر زیر را طراحی کند، ساعت ها و ساعتها بایستی کدنویسی ایفا دهد. نو ممکن میباشد بهره آن چیزی نباشد که میمنظور میباشد. چون در موبایل بهصحت نمایش داده نمیشود یا مشکلی دارد. یعنی طراحی واکنشگرا نیست.
کاربردهای بوت استرپ
البته بوت استرپ سیستم grid دارد. یعنی تمامیچیز فراهم هست. توسعهدهنده تنها می بایست اندازهی فضاها (Container) را و جزئیات دیگر را آنطور که میخواهد تهیه و تنظیم کند. و آنها را با محتوایی که میخواهد پر کند. و نگران عکس العملگرایی طراحی هم نباشد.
۲. Bootstrap Responsive Images
طراحان سایت و گسترشدهندگان میدانند که درستدرآوردن اندازهی مناسب برای عکسها، ازنظر واکنشگرایی و اینکه در هر دستگاهی با هر اندازهای کامل و درست نمایش داده شوند، چه چالش بزرگی میباشد. بوت استرپ کدهایی دارااست که بهصورت خود کار اندازه و وضعیت عکسها را براساس اندازهی صفحهی نمایش تنظیم میکند. یعنی نیاز نیست طراح مدام تنظیمات عکس را تغییر تحول دهد و سود را تحقیق کند. کافی است از جمله classهای تحت به عکسهای ورقه اضافه شوند و برای آنها المان مادر تمجید خواهد شد تا اندازه و وضعیت عکسها بهنسبت المان مادر تنظیم شود:
img-responsive
img-circle
img-rounded
۳. Bootstrap Components
بوت استرپ ابزاری هست که تاحد زیادی خاطر طراح و بسطدهنده را برای طراحی رابط کاربری (UI) و اجرای طرحها راحت میکند. تصور کنید که نیازی نباشد برای اضافهکردن المانها و موادسازنده بصری بسیار مهم به هر شیت از سایت مانند نوارهای ناوبری (Navigation Bars)، جدولها، انواع دکمهها، گونه های آیکونها، انواع Alertها، Progress Bar، منوهای کشویی (Dropdown Bars)، فرمها و … کدنویسی CSS ایفا دهید. چون در بوت استرپ همگیی اینها ازپیشتمجیدشده وجود داراهستند. و اساسیتر اینکه به هیچ وجه نیازی نیست طراح نگران واکنشگرایی این المانها باشد. تمامی المانهای ساختهشده در بوت استرپ در تلفن همراه همانقدر بهتر نمایش داده می گردند که در ورقهنمایش ۱۴ اینچی.
مزایای بوت استرپ
۴. Bootstap JavaScript
قدرت بوت استرپ فقط در دسته کدهای ازپیشآمادهی CSS نیست، درین قاب ورک بسطدهنده کتابخانهی جی کوئری را هم دارد. اما نکته اینجاست که آن کدهای جی کوئری در بوت استرپ آورده شده که میتوانند به طراحی و زیبایی المانهای بصری بیفزایند. یعنی به طراح وب سایت و طراح ui وبسایت امکان ابتکار بیشتر و اجرای طرحهای خلاقانهتر را میدهند. مثلا، برخی کدهای جی کوئری که در این ابزار مو جود است، خاصیتی را بهطور اتومات به المانی اضافه میکنند.
۵. Bootstrap Documentation
کلیهچیز در بوت استرپ واضح می باشد. کلیهچیز در باب هر کدام از امکانات و کاربردهای این کادر ورک جامعوکامل در وبسایت آن توضیح داده شدهاست. شما حتی اگر توسعه و گسترشدهندهای بسیار تازه کار باشید، کافی است وارد وب سایت شوید و بروید به قسمت documentation. آنگاه آن کاری را که میخواهید در بوت استرپ ایفا دهید انتخاب کنید. هر توضیح و مثال و قطعه کدی را که نیاز داشته باشید در دستهبندیهای منظم خواهید یافت.
معایب Bootstrap
بله، همانطور که بارها گفتم، هیچچیز در این عالم بیعیبونقض نیست. این قاب ورک قوی هم اما معایب خاص خودش را دارد. مهمترین عیب شغل با این ابزار این می باشد که بسطدهنده و طراح نیازی ندارند به طبع تمامیی کدها را خیال و خاطر بگیرد. چون همگیچیز نوشتهشده و آماده می باشد.
دومین عیب Bootstrap این است که فایلهایش بسیار سنگین است. همین یعنی دورانمجال بازگذاری سایت ممکن هست زیاد شود. توسعهدهنده بایستی کوشش کند تا در بوت استرپ قطعه کدهای اضافی و غیرضروری نداشته باشد. البته تشخیص این یه خرده تجربیات میخواهد و برای تازهکارها ریلکس نیست.
سومین عیب هم مربوط میشود به سینتکس (Syntax) یا همان قواعد نوشتاری و روشی قرارگرفتن کدها کنار هم در Bootstrap . سینتکس بوت استرپ ممکن است سرگردانکننده باشد. مخصوصا وقتی قرار هست از سیستم grid استفاده شود. بهتر است نخستین قواعد سیستم grid را به طور کامل بخوانید تا بدانید تقسیمبندیهای آن به چه شکل میباشد تا درصورتی که عددی فی مابین کدها قرار گرفت بدانید برای چیست.
آخرین عیب این میباشد که سایتهایی که با Bootstrap ساخته میشوند، درغالب مفاد شبیه هم می گردند. بههمیناستدلال، توسعهدهنده نباید این نکته را فراموش کند که Bootstrap دنیایی از ابزار میباشد در دستان او تا خلاقانه و نوآورانه از آنها به کار گیری کند.
در حالتی که برنامهنویس یا طراح وبسایت جدیدکاری هستید، قرائت محتوای «۹ سوال کلیدی در گفتگو طراحی وب» برای شما بسیار مفید خواهد بود.
نسخههای Bootstrap
بوت استرپ ۵ نسخه دارااست. طبیعی هست که هر ورژن کاملتر از گذشته شده و امکاناتی به آن اضافه شدهاست. Bootstrap 2 در سال ۲۰۱۲ آمد و مهم ترین ویژگیاش این بود که قابلیت Responsive Web Design به آن افزوده شد. یکسال بعد، Bootstrap 3 که برای طراحی تخت یا صاف (Flat Design) و همچنین طراحی وب سایت با منش Mobile First ارتقا یافته بود به عالم معرفی شد.
اما بیشترین تغییرات در Bootstrap 4 (2018) و Bootstrap 5 (2021) اتفاق افتاد. از مهمترین ویژگیهای نسخهی ۴ سازگاری آن با آخرین ورژن تمامی مرورگرها، ازجمله گوگل کروم و سافاری و موزیلا، و همچنین CSS Flexbox بود. قابلیت و امکان به کار گیری از flexbox کار ستونبندی صفحه ها و تقسیمبندی فضای المانها را بسیار سهلتر و کاربردیتر کرد.
در نسخهی ۵ بیشترین تغییرات مربوط میگردد به ارتقای سیستم grid و همچنین کدهای آمادهی CSS. شاید بهترین ویژگی در آخرین نسخه ازنظر ما فارسیزبانان، سازگارشدن آن با زبانهای RTL است. این ویژگی به طراحان و توسعهدهندگان امکان میدهد تا برای زبانهایی که از راست به چپ نوشته میشوند وبسایت طراحی کنند و مشکلی با هماهنگکردن جهت المانهای صفحه با نوشته نداشته باشند.
چند حقیقت جالب در باب تاریخچه Bootstrap
واقعیت، گفتن یک سری نوشتهیعلمی دیدنی راجع به بوت استرپ قبلازاینکه این محتوا را مجموع کنم خالی از بهره نیست:
واژه و کلمهی Bootstrap یعنی خودراهانداز.
Bootstrap را دو کارمند دیرین توییتر بهنامهای Mark Otto and Jacob Thornton برای توییتر ساختند.
این دو کارمند توییتر بهیاور چندین توسعه و گسترشدهندهی دیگر در توییتر تصمیم گرفتند تا بهجای استفادهکردن از کتابخانههای متفاوت که سبب ناهماهنگی میشد، ابزاری داخلی برای هماهنگی عمل گسترشدهندگان بسازند. نام آن را هم گذاشتند Twitter Blueprint.
بعداز مدتی، بیشتر توسعه و گسترشدهندگان توییتر فقط با Blueprint شغل میکردند. خالقان اصلی آن متوجه شدند که این ابزار بسیار کار کشته می باشد و پتانسیل این را دارد که به گسترشدهندگان در سراسر دانا کمک کند.
پس با یاریگرفتن از دیگری بسطدهندگان آن را بهبود دادند و نامش را عوض و آن را منتشر کردند.
Bootstrap همچنان متعلق به آن دو نفر میباشد و برای ارتقای آن گروهی از گسترشدهندگان با آنها همکاری میکنند.
از عمر بوت استرپ صرفا ۱۱ سال میگذرد. بوت استرپ در سال ۲۰۱۱ عرضه شد.
تاریخچه بوت استرپ
عدهبندی و فایدهگیری
۱. بوت استرپ را سهل و آسان میشود خاطر گرفت. اما این آسانی برای عده ای می باشد که دستکم با HTML و CSS آشنایی بسیار خیر و خوبی داشته باشند.
۲. درخلاصهترین شکل میشود اظهار کرد که Bootstrap ابزاری می باشد برای وب دیزاینی بسیار سریع، واکنشگرا و خوشگل.
۳. مزیت بسیار مهمی که درباره ی تمامی ابزارهای قاب ورک بوت استرپ وجود دارااست این است که طراح وب سایت می تواند تمامی را آنطور که خودش میخواهد در کمترین فرصت تنظیم و درواقع شخصیسازی کند.
۴. Bootstrap یعنی دیگر نگران واکنشگرایی سایت نباشید.
۵. خوشبختانه، منابع کمکی آنلاین خیلی خوبی برای یاری به کسانیکه میخواهند Bootstrap را خیال بگیرند وجود داراست: github.com و w3schools.com و از تمامی مهمتر وب لاگ وب سایت این قاب ورک، blog.getbootstrap.com.
۶. در شرایطیکه میخواهید مشاهده کنید با این ابزار چه کارها میگردد در ساخت سایت کرد، محرمانه به وبسایت NASA و FIFA بزنید.
۷. در طی طراحی تارنما، بعداز یادگرفتندادن HTML و CSS که پایهی یادگیری بوت استرپ می باشد؛ عمل با Bootstrap آموزش داده میشود.
Bootstrap چیست؟ چه میکند؟ چه کاربردهایی دارد؟ و چرا از فریمورکهای محبوب توسعهدهندگان فرانت اند میباشد؟ اینها سوالاتی هست که درصورتیکه قصد دارید وب طراحی صفحه یاد بگیرید، مطلقا به گوشتان خورده هست.
شرکتها و کسبوکارهای زیادی میباشند که کارایی میکنند طراحی وب را وارفتهتر کنند. ابزارهای زیادی در سالهای اخیر ایجاد شده است تا شغل کدنویسی را برای طراحان وبسایت و پیشرفتدهندگان سهل و آسانتر و کمتر کنند. کتابخانههای هر زبان اپلیکیشننویسی ازجملهی این ابزارهاست. درکنار کتابخانه، فریمورکهای مختلفی نیز وجود دارند که یاری بسیار بزرگی برای توسعهدهندگان وب سایتها و اپها می باشند.
تصور کنید نرمافزاری وجود داشته باشد که قطعه کدهای فراوانی را که طراح یا پیشرفتدهنده باید بنویسد، آمادهشده و نوشتهشده در خود دارااست. رویایی هست! مگر نه؟ بوت استرپ از همین ابزارهای حاذق و رویایی برای گسترشدهندگان است. میگردد اذعان کرد که بوت استرپ هم کتابخانه میباشد و هم بهنوعی یک کادر ورک.
درین نوشتهیعلمی قصد دارم شما را با Bootstrap، کاربردها، مزایا و معایب آن آشنا کنم و به سوالاتی که درابتدا طرح شد و حتما سوال های شما هم هست، جواب بدهم.
آنچه دراین نوشته خواهیم داشت
بوت استرپ چیست؟
کاربردهای (مزایای) بوت استرپ در طراحی وب سایت
۱. Bootstrap Responsive Grid System
۲. Bootstrap Responsive Images
۳. Bootstrap Components
۴. Bootstap JavaScript
۵. Bootstrap Documentation
معایب Bootstrap
نسخههای Bootstrap
یک سری حقیقت دیدنی در زمینه ی تاریخچه Bootstrap
گردآوریبندی و فایدهگیری
نویسنده
مهدیه اسماعیلی
بوت استرپ چیست؟
بگذارید از زبان خود بوت استرپ بیانکنم که آن چیست و چه میکند. یادتان باشد که وبسایت رسمی Bootstrap مرجع دستیابی اطلاعات بیشتر و دانلود آن است. بگذارید همینجا بیانکنم که ابدا نباید از وبلاگ این سایت غافل شوید. درادامه، بیشتر در ارتباط بلاگ تارنما سخن میکنم.
با بوت استرپ تارنماهای سریع و واکنشگرا بسازید.
با بوت استرپ، که محبوبترین جعبهابزار منبع باز فرانت اند فقید است، تخت گاز سایتهایی واکنشگرا و کاملا سازگار و مناسب برای نمایش در دستگاههای موبایل طراحی و باصرفه فرمائید. این جعبهابزار ویژگیهای زیادی داراست. ازجملهی آنان می توان به افزونههای قدرتمند جاوااسکریپ و همچنین سیستم grid برخوردگرا اشاره کرد.
بوت استرپ چیست
بوت استرپ مجانی است و شما بهراحتی میتوانید آخرین نسخهی آن را (Bootstrap 5) از تارنما رسمیاش دانلود فرمایید. در صورتیکه کمی بخواهم بیشتر در ارتباط بوت استرپ توضیح دهم می بایست بیانکنم که این جعبهابزار گروهای از قطعه کدهای آمادهی HTML, CSS & JavaScript می باشد که نرمافزار نویس را از نوشتن کدهای زیاد بینیاز میکند. بدین ترتیب در وقت گسترشدهنده بسیار صرفهجویی میشود و او قادر است بر دیزاین و طراحی رابط کاربری وقت بیشتری بگذارد.
همچنین بوت استرپ کتابخانهای منبعباز از آیکونهای SVG و مجموعهای از Themeهای منحصر به فرد به خود را دارد. themeهای بوت استرپ درواقع Extensionهای آن میباشند. Themeها مثل آیکونها رایگان نیستند و باید آن ها را از وبسایت خرید. اما خیلی هم گران نیستند و به عنوان مثال با ۴۹ دلار می گردد یک کدام از آخرین themeهای بوت استرپ را خرید.
در حالتیکه میخواهید با یکی از کادرورکهای کارکشته جاوااسکریپت آشنا شوید، «معرفی Ember.js، قاب ورکی برای بسطی وب نرم افزارها» را بخوانید.
کاربردهای (مزایای) بوت استرپ در ساخت وب سایت
چرا می بایست بوت استرپ خیال و خاطر گرفت؟ چه کاربردهایی بوت استرپ را در طراحی سایت و وب اپها اساسی و موءثر میکند؟ یا درواقع، مزیتهای به کارگیری از بوت استرپ در وب صفحه ارایی و گسترشی وب نرم افزارها چیست؟
۱. Bootstrap Responsive Grid System
درصورتی که گسترشدهنده یا نرم افزارنویسی بخواهد با CSS چیزی مثل تصویر زیر را طراحی کند، ساعت ها و ساعتها بایستی کدنویسی ایفا دهد. نو ممکن میباشد بهره آن چیزی نباشد که میمنظور میباشد. چون در موبایل بهصحت نمایش داده نمیشود یا مشکلی دارد. یعنی طراحی واکنشگرا نیست.
کاربردهای بوت استرپ
البته بوت استرپ سیستم grid دارد. یعنی تمامیچیز فراهم هست. توسعهدهنده تنها می بایست اندازهی فضاها (Container) را و جزئیات دیگر را آنطور که میخواهد تهیه و تنظیم کند. و آنها را با محتوایی که میخواهد پر کند. و نگران عکس العملگرایی طراحی هم نباشد.
۲. Bootstrap Responsive Images
طراحان سایت و گسترشدهندگان میدانند که درستدرآوردن اندازهی مناسب برای عکسها، ازنظر واکنشگرایی و اینکه در هر دستگاهی با هر اندازهای کامل و درست نمایش داده شوند، چه چالش بزرگی میباشد. بوت استرپ کدهایی دارااست که بهصورت خود کار اندازه و وضعیت عکسها را براساس اندازهی صفحهی نمایش تنظیم میکند. یعنی نیاز نیست طراح مدام تنظیمات عکس را تغییر تحول دهد و سود را تحقیق کند. کافی است از جمله classهای تحت به عکسهای ورقه اضافه شوند و برای آنها المان مادر تمجید خواهد شد تا اندازه و وضعیت عکسها بهنسبت المان مادر تنظیم شود:
img-responsive
img-circle
img-rounded
۳. Bootstrap Components
بوت استرپ ابزاری هست که تاحد زیادی خاطر طراح و بسطدهنده را برای طراحی رابط کاربری (UI) و اجرای طرحها راحت میکند. تصور کنید که نیازی نباشد برای اضافهکردن المانها و موادسازنده بصری بسیار مهم به هر شیت از سایت مانند نوارهای ناوبری (Navigation Bars)، جدولها، انواع دکمهها، گونه های آیکونها، انواع Alertها، Progress Bar، منوهای کشویی (Dropdown Bars)، فرمها و … کدنویسی CSS ایفا دهید. چون در بوت استرپ همگیی اینها ازپیشتمجیدشده وجود داراهستند. و اساسیتر اینکه به هیچ وجه نیازی نیست طراح نگران واکنشگرایی این المانها باشد. تمامی المانهای ساختهشده در بوت استرپ در تلفن همراه همانقدر بهتر نمایش داده می گردند که در ورقهنمایش ۱۴ اینچی.
مزایای بوت استرپ
۴. Bootstap JavaScript
قدرت بوت استرپ فقط در دسته کدهای ازپیشآمادهی CSS نیست، درین قاب ورک بسطدهنده کتابخانهی جی کوئری را هم دارد. اما نکته اینجاست که آن کدهای جی کوئری در بوت استرپ آورده شده که میتوانند به طراحی و زیبایی المانهای بصری بیفزایند. یعنی به طراح وب سایت و طراح ui وبسایت امکان ابتکار بیشتر و اجرای طرحهای خلاقانهتر را میدهند. مثلا، برخی کدهای جی کوئری که در این ابزار مو جود است، خاصیتی را بهطور اتومات به المانی اضافه میکنند.
۵. Bootstrap Documentation
کلیهچیز در بوت استرپ واضح می باشد. کلیهچیز در باب هر کدام از امکانات و کاربردهای این کادر ورک جامعوکامل در وبسایت آن توضیح داده شدهاست. شما حتی اگر توسعه و گسترشدهندهای بسیار تازه کار باشید، کافی است وارد وب سایت شوید و بروید به قسمت documentation. آنگاه آن کاری را که میخواهید در بوت استرپ ایفا دهید انتخاب کنید. هر توضیح و مثال و قطعه کدی را که نیاز داشته باشید در دستهبندیهای منظم خواهید یافت.
معایب Bootstrap
بله، همانطور که بارها گفتم، هیچچیز در این عالم بیعیبونقض نیست. این قاب ورک قوی هم اما معایب خاص خودش را دارد. مهمترین عیب شغل با این ابزار این می باشد که بسطدهنده و طراح نیازی ندارند به طبع تمامیی کدها را خیال و خاطر بگیرد. چون همگیچیز نوشتهشده و آماده می باشد.
دومین عیب Bootstrap این است که فایلهایش بسیار سنگین است. همین یعنی دورانمجال بازگذاری سایت ممکن هست زیاد شود. توسعهدهنده بایستی کوشش کند تا در بوت استرپ قطعه کدهای اضافی و غیرضروری نداشته باشد. البته تشخیص این یه خرده تجربیات میخواهد و برای تازهکارها ریلکس نیست.
سومین عیب هم مربوط میشود به سینتکس (Syntax) یا همان قواعد نوشتاری و روشی قرارگرفتن کدها کنار هم در Bootstrap . سینتکس بوت استرپ ممکن است سرگردانکننده باشد. مخصوصا وقتی قرار هست از سیستم grid استفاده شود. بهتر است نخستین قواعد سیستم grid را به طور کامل بخوانید تا بدانید تقسیمبندیهای آن به چه شکل میباشد تا درصورتی که عددی فی مابین کدها قرار گرفت بدانید برای چیست.
آخرین عیب این میباشد که سایتهایی که با Bootstrap ساخته میشوند، درغالب مفاد شبیه هم می گردند. بههمیناستدلال، توسعهدهنده نباید این نکته را فراموش کند که Bootstrap دنیایی از ابزار میباشد در دستان او تا خلاقانه و نوآورانه از آنها به کار گیری کند.
در حالتی که برنامهنویس یا طراح وبسایت جدیدکاری هستید، قرائت محتوای «۹ سوال کلیدی در گفتگو طراحی وب» برای شما بسیار مفید خواهد بود.
نسخههای Bootstrap
بوت استرپ ۵ نسخه دارااست. طبیعی هست که هر ورژن کاملتر از گذشته شده و امکاناتی به آن اضافه شدهاست. Bootstrap 2 در سال ۲۰۱۲ آمد و مهم ترین ویژگیاش این بود که قابلیت Responsive Web Design به آن افزوده شد. یکسال بعد، Bootstrap 3 که برای طراحی تخت یا صاف (Flat Design) و همچنین طراحی وب سایت با منش Mobile First ارتقا یافته بود به عالم معرفی شد.
اما بیشترین تغییرات در Bootstrap 4 (2018) و Bootstrap 5 (2021) اتفاق افتاد. از مهمترین ویژگیهای نسخهی ۴ سازگاری آن با آخرین ورژن تمامی مرورگرها، ازجمله گوگل کروم و سافاری و موزیلا، و همچنین CSS Flexbox بود. قابلیت و امکان به کار گیری از flexbox کار ستونبندی صفحه ها و تقسیمبندی فضای المانها را بسیار سهلتر و کاربردیتر کرد.
در نسخهی ۵ بیشترین تغییرات مربوط میگردد به ارتقای سیستم grid و همچنین کدهای آمادهی CSS. شاید بهترین ویژگی در آخرین نسخه ازنظر ما فارسیزبانان، سازگارشدن آن با زبانهای RTL است. این ویژگی به طراحان و توسعهدهندگان امکان میدهد تا برای زبانهایی که از راست به چپ نوشته میشوند وبسایت طراحی کنند و مشکلی با هماهنگکردن جهت المانهای صفحه با نوشته نداشته باشند.
چند حقیقت جالب در باب تاریخچه Bootstrap
واقعیت، گفتن یک سری نوشتهیعلمی دیدنی راجع به بوت استرپ قبلازاینکه این محتوا را مجموع کنم خالی از بهره نیست:
واژه و کلمهی Bootstrap یعنی خودراهانداز.
Bootstrap را دو کارمند دیرین توییتر بهنامهای Mark Otto and Jacob Thornton برای توییتر ساختند.
این دو کارمند توییتر بهیاور چندین توسعه و گسترشدهندهی دیگر در توییتر تصمیم گرفتند تا بهجای استفادهکردن از کتابخانههای متفاوت که سبب ناهماهنگی میشد، ابزاری داخلی برای هماهنگی عمل گسترشدهندگان بسازند. نام آن را هم گذاشتند Twitter Blueprint.
بعداز مدتی، بیشتر توسعه و گسترشدهندگان توییتر فقط با Blueprint شغل میکردند. خالقان اصلی آن متوجه شدند که این ابزار بسیار کار کشته می باشد و پتانسیل این را دارد که به گسترشدهندگان در سراسر دانا کمک کند.
پس با یاریگرفتن از دیگری بسطدهندگان آن را بهبود دادند و نامش را عوض و آن را منتشر کردند.
Bootstrap همچنان متعلق به آن دو نفر میباشد و برای ارتقای آن گروهی از گسترشدهندگان با آنها همکاری میکنند.
از عمر بوت استرپ صرفا ۱۱ سال میگذرد. بوت استرپ در سال ۲۰۱۱ عرضه شد.
تاریخچه بوت استرپ
عدهبندی و فایدهگیری
۱. بوت استرپ را سهل و آسان میشود خاطر گرفت. اما این آسانی برای عده ای می باشد که دستکم با HTML و CSS آشنایی بسیار خیر و خوبی داشته باشند.
۲. درخلاصهترین شکل میشود اظهار کرد که Bootstrap ابزاری می باشد برای وب دیزاینی بسیار سریع، واکنشگرا و خوشگل.
۳. مزیت بسیار مهمی که درباره ی تمامی ابزارهای قاب ورک بوت استرپ وجود دارااست این است که طراح وب سایت می تواند تمامی را آنطور که خودش میخواهد در کمترین فرصت تنظیم و درواقع شخصیسازی کند.
۴. Bootstrap یعنی دیگر نگران واکنشگرایی سایت نباشید.
۵. خوشبختانه، منابع کمکی آنلاین خیلی خوبی برای یاری به کسانیکه میخواهند Bootstrap را خیال بگیرند وجود داراست: github.com و w3schools.com و از تمامی مهمتر وب لاگ وب سایت این قاب ورک، blog.getbootstrap.com.
۶. در شرایطیکه میخواهید مشاهده کنید با این ابزار چه کارها میگردد در ساخت سایت کرد، محرمانه به وبسایت NASA و FIFA بزنید.
۷. در طی طراحی تارنما، بعداز یادگرفتندادن HTML و CSS که پایهی یادگیری بوت استرپ می باشد؛ عمل با Bootstrap آموزش داده میشود.
راهنمایی برای بهبود نمره سئو با استفاده از تحلیلهای سرچ کنسول