صفحات وبی که با استفاده از تگ های اچ تی ام ال ساخته میشوند از هر گونه زیبایی ظاهری مبرا هستند و اگر بخواهیم این گونه صفحات را به یک ساختمان تشبیه کنیم، بایستی بگوییم که همچون سازه ی اصلی یک ساختمان بوده که هیچ گونه رنگ و بویی ندارند!
با پیشرفت وب، نیازهای کاربران هم به مراتب بیشتر شد که یکی از اساسیترین آن ها، نیاز به زیبایی ظاهری برای صفحات وب بود. به همین منظور، زبانی تحت عنوان CSS که مخفف Cascading Style Sheets به معنی الگوهای آبشاری است توسط Håkon Wium Lie در سال ۱۹۹۶ ابداع شد تا همچون سازه ی یک ساختمان که با استفاده از رنگ، گچبری، سنگ کاری و … زیبا می گردد، صفحات خام اچ تی ام ال را زیبا سازد. زبان سی اس اس صرفاً چهار / پنج سال پس از ابداع زبان اچ تی ام ال توسعه یافت و به مرور زمان که مرورگرهای بیشتری اقدام به پشتیبانی از آن کردند، در میان توسعه دهندگان جای خود را باز کرد و امروزه به عنوان بخش لاینفک دنیای وب شناخته می شود.
با استفاده از زبان سی اس اس، به راحتی خواهیم توانست هر یک از تگ ها -یا بهتر بگوییم اجزای تشکیلدهنده ی زبان اچ تی ام ال- را استایل دهیم. به طور کلی، در اینجا منظور از استایل دادن این است که بتوانیم رنگ نوشته ها، اندازه ی آن ها، چینش، سایه و بسیاری چیزهای دیگر را کنترل کنیم.
آشنایی با فریم ورک های زبان CSS
در دنیای برنامه نویسی، یکی از معیارهای تعیین کننده از بسیاری جنبه ها، سرعت اجرای پروژه های برنامه نویسی است. در همین راستا برای استایل دادن به تگ های اچ تی ام ال توسط زبان سی اس اس، یکسری فریم ورک ها نیز ابداع شدهاند که سرعت کار برنامه نویسان و طراحان سایتها را به مراتب بیشتر کردند که از جمله ی این فریم ورک ها، میتوان به Twitter Bootstrap اشاره کرد.
در سال ۲۰۱۱ دو نفر از توسعه دهندگان شرکت توییتر به نام های Mark Otto و Jacob Thornton اقدام به توسعه ی یکسری کدهای سی اس اس برای استفاده در شبکه ی اجتماعی توییتر کردند اما چیزی نگذشت که مجموعه کدهای سی اس اس خود را در قالب یک فریم ورک به صورت آزاد در اختیار سایر توسعه دهندگان دنیا قرار دادند که در حال حاضر، این فریم ورک به منزله ی یکی از محبوبترین فریم ورک های سی اس اس دنیا است.
در واقع، پیش از به وجود آمدن فریم ورک هایی از این دست، توسعه دهندگان و طراحان سایت می بایست برای استایل دهی به صفحات وب، برای هر پروژه ای اقدام به کدنویسی از صفر کنند که این مسأله توسعه ی نرمافزار را زمان بر می کرد.
یکی از ویژگیهای منحصر به فرد فریم ورک هایی مثل توییتر بوت استرپ این است که صفحات وب ما را آماده ی نمایش در صفحه های نمایش با اندازه های مختلف -از مانیتورهای بزرگ گرفته تا صفحه نمایشهای کوچک موبایل- می سازد. به عبارت دیگر، وب سایت ما را Responsive یا واکنش گرا می کنند. علاوه بر این، فریم ورک های سی اس اس این تضمین را ایجاد میکنند که سایتهای طراحی شده با آن ها در مرورگرهای مختلف با حداقل اختلاف ظاهری به نمایش درخواهند آمد که همین یک ویژگی فریم ورک هایی همچون بوت استرپ، مورد توجه توسعه دهندگان بسیاری قرار گرفته است. از جمله فریم ورک های سی اس اس معروف دنیا، میتوان به موارد زیر اشاره کرد:
- Twitter Bootstrap
- Foundation
- Pure
- Materialize
- uikit
- Skeleton
- Yaml
- Gumby
- Kube
- Less Framework
- Responsive Grid System
- BASE
- Semantic
- Responsive Grid System
- compass
- columnal
- Fluid Baseline Grid
- The Goldilocks
- Blueprint
- Grid
- (960) Grid System
البته این لیست نسبتا طولانی به همین موارد ختم نشده و دائما فریم ورک های جدید با قابلیت هایی نوین در اختیار توسعه دهندگان قرار می گیرد.