فریم‌ورک های سی اس اس را بهتر بشناسیم

نوشته پویا سلیمی • 05 مرداد 1390

در سال های اخیر استفاده از کتابخانه‌های آماده یا همان فریم‌ورک‌ها در طراحی وب بسیار مرسوم شده است. اکنون دیگر برای php، javascript و CSS فریم‌ورک‌های زیادی تولید شده‌اند که به کمک آن‌ها فرایند توسعه نرم‌افزاری تحت وب بسیار سریع و راحت شده است. در این نوشتار می‌خواهیم در مورد فریم‌ورک‌های CSS صحبت کنیم و به معرفی چند نمونه از انها بپردازیم.

cssframeworks

قبل از هر چیز باید به این نکته اشاره کرد که استفاده از فریم‌ورک ها در نوع خودشان مزایا و معایبی دارد که به شرح برخی از آنها می‌پردازیم.

مزیت های استفاده از فریم‌ورک‌های سی‌اس‌اس

بالا رفتن سرعت انجام کار: با استفاده از فریم‌ورک‌ها بهره‌وری خودتان را بالا می‌برید و اشتباهات رایج را انجام نمی‌دهید. اگر شما سایت‌هایی را طراحی می‌کنید که تقریبا هم نوع یکدیگر هستند، می‌توانید با استفاده از فریم‌ورک‌های سی اس اس سرعت کار خود را بالا ببرید و از طرفی دیگر، از خطا‌هایی که به صورت معمول طراحان وب انجام می‌دهند دوری کنید.

نرمال سازی کد‌های استفاده شده: با استفاده از فریم‌ورک‌ها کد‌های خود را کاملا نرمال سازی می‌کنید و به صورت پیش فرض از کلاس‌ها و کد‌های معتبر استفاده می‌کنید، این کار باعث می‌شود که در پروژه‌های مختلف خود از کلاس‌های یکسانی استفاده کنید و این مسئله بسیار کمک می‌کند که طرح‌های خود را در صورت نیاز فقط با تغییر چند کد سی اس اس تغییر دهید و نیازی به تغییر سرس کد‌های اصلی نداشته باشید.
ضمن اینکه وقت کمتری جهت شناسایی ساختار طراحی شده صفحه‌ای که مدت‌ها قبل طراحی کرده‌اید، نیاز خواهید داشت.

انجام کار‌های تیمی: با استفاده از فریم‌ورک‌ها کار‌های تیمی را بهتر می‌توانید انجام دهید. اگر از فریم‌ورک‌های سی اس اس در کار‌های تیمی استفاده کنید، می‌توانید مطمئن باشید که افرادی که همراه شما بر روی پروژه‌ای فعالیت می‌کنند، از یک روش استفاده می‌کنند و در آخر، طرحی کاملا استاندارد از آب در خواهد آمد. همچنین وقت کمتری را باید صرف رفع خطا‌ها و اشتباهات احتمالی کنید.

استفاده از فریم‌ورک‌ها سی اس اس باعث می‌شود که در پایان کار کمتر نگران سازگاری طرح خود با مرورگر‌های مختلف باشید.

عدم نیاز به تعریف رویه مجدد برای هر عنصر: استفاده از فریم‌ورک‌های سی اس اس باعث می‌شود که کد‌های ابتدایی طراحی خود را از پیش نوشته شده داشته باشید. تمامی عناصر صفحه استایل دهی شده است و لازم نیست که هر مرتبه فکر استایل دهی عناصری چون abbr و یا code باشید.

معایب استفاده از فریم‌ورک‌های سی‌اس‌اس

نیاز به زمان: اغلب طراحان نیاز به مقداری زمان دارند تا نحوه کار با فریم‌ورک‌ها را یاد بگیرند، البته کار با فریم‌ورک‌های سی اس اس آن‌قدر‌ها هم مثل فریم ورک‌های جاوا اسکریپت و یا پی اچ پی، سخت و پیچیده نیست اما باز هم نیازمند آن است که روی آن وقت بگذارید.

راحتی بیشتر سودجویان: همیشه افرادی هستند که کاری جز کپی کردن طرح‌های دیگران بلد نیستند! شاید بد‌ترین عیب استفاده از فریم‌ورک‌ها این باشد که این دسته از افراد به نحوه طراحی شما آشنا می‌شوند و کپی زدن طرح‌های شما برای آن‌ها بسیار ساده و راحت می‌شود.

عدم آشنایی کامل با تمامی عناصر استفاده شده: با طراحی یک سایت از پایه شما می‌توانید درکی از طراحی وب پیدا کنید که به جرات می‌توان گفت در هیچ کتاب آموزشی نمی‌توانید آن را یاد بگیرید و هیچ کسی نیز نمی‌تواند برای شما آن را تشریح کند. وقتی فردی در مورد ساختار صفحه از شما سوالی می‌پرسد، به سادگی می‌توانید به سوالش پاسخ دهید چرا که شما با ساختار صفحه کاملا آشنایی دارید.

وقتی از فریم ورک‌های سی اس اس استفاده می‌کنید، طبیعتا با مواردی از پیش تعیین شده روبرو می‌شوید که شاید بعضی از آن‌ها برای شما قابل درک نباشد و شما نیز به خود این زحمت را ندهید که به دنبال یادگیری آن بروید و فقط از آن در کار خود استفاده می‌کنید.

به ارث بردن باگ‌های دیگران: این روز‌ها هیچ کاری بدون نقص نیست، هیچ فریم ورکی بهترین نیست و هیچ طرحی بر‌ترین طرح نیست. اگر شما طرحی را از صفر کار کنید، مطمئنا در آن مشکلاتی وجود خواهد داشت. فرق آن با زمانی که شما از فریم‌ورک استفاده می‌کنید آن است که در مورد اول شما اشتباهات خودتان را باید پیدا و تصحیح کنید و با این کار دیگر آن را تکرار نخواهید کرد، اما در مورد دوم ممکن است اشتباهات دیگران را به ارث ببرید و مجبور باشید اشتباهاتی که شاید هیچ وقت مرتکب آن‌ها نمی‌شدید را تصحیح کنید!

آشنایی با چند فریم‌ورک سی اس اس

تا کنون فریم‌ورک‌های مختلفی برای سی اس اس ارائه شده‌اند که از مهم‌ترین آن‌ها می‌توان به 960 ، Blueprint و YAML – Yet Another Multicolumn Layout اشاره کرد. نمونه‌های زیاد دیگری نیز هستند که می‌توانید آن‌ها را جستجو کنید.

960 فریم‌ورکی است که تاکید بسیار زیادی به طراحی‌های 960 پیکسلی دارد و اصلا اسمش هم بر همین مبنا انتخاب شده است. این فریم ورک صفحه 960 پیکسلی را به 14 و یا 16 ستون تقسیم می‌کند که به صورت تکی و یا کنار هم می‌توان از آن‌ها استفاده کرد. اطلاعات بیشتر در مورد این فریم ورک را می‌توانید از زبان نویسنده آن بدست آورید.

960.gif

YAML یک فریم‌ورک آلمانی است و بر اساس استادارد‌های وب طراحی شده است؛ حتی IE5 هم پشتیبانی می کند! YAML یکی از فریم‌ورک‌های پیشرفته است که قابلیت‌های زیادی دارد. یکی از امکانات جالب آن این است که شما می‌توانید از YAML Builder استفاده کنید تا آرایش صفحه خود (layout) را به صورت کاملا دیداری، در مرورگر وب تغییر و توسعه دهید. می‌توانید دکوتایپ صفحه را انتخاب کنید و تغییرات دیگری که بهتر است خودتان آن‌ها را مشاهده نمایید.

yaml.gif

Blueprint توسط دانشجوی نروژی، Olav Frihagen Bjørkøy نوشته شده است. این فریم ورک هم قابلیت‌های خوبی دارد. مدیریت آسان گریدها و صفحات چاپی از جمله امکانات این فریم‌ورک است. علاوه بر آن می‌توانید از Blueprint Grid CSS Generator استفاده کنید تا راحت‌تر به ساختار صفحه خود دست پیدا کنید.

blueprint.gif

گذشته از همه این فریم‌ورک‌ها، شما می‌توانید فریم‌ورک مخصوص به خود را داشته باشید و از آن در طرح‌های خود استفاده کنید. به یاد داشته باشید که تمامی این ابزار‌ها جهت طرح‌های استاندارد و آسان‌تر کردن کار طراحان ارائه شده است، بنابراین هیچ الزامی در استفاده از آن‌ها نیست و شما می‌توانید هر طور که راحت هستید صفحات وب خود را طراحی نمایید.

نویسنده پویا سلیمی
موارد مرتبط 960gs blueprint css framework سی اس اس طراحی طراحی وب فریم ورک معرفی yaml