CSS3 آخرین نسخه و سازگار با تمام نسخه های قبل است. در این مقاله به 10 نکته راجع به CSS3 که توسعه دهندگان باید بدانند و انجام دهند، می پردازیم.

CSS3 آخرین نسخه و سازگار با تمام نسخه های قبل است. در این مقاله به 10 نکته راجع به CSS3 که توسعه دهندگان باید بدانند و انجام دهند، می پردازیم.

• طراحی کامل پروژه روی کاغذ

درابتدا، هنگامی که شما پروژه را در ذهن خود تجسم می کنید، سخت و پیچیده به نظر میرسد. اما اگر آن را بر روی کاغذ پیاده سازی کنید، می بینید از آنچه که فکرش را هم کرده بودید، آسانتر است.

دراصل هنگامی که پروژه تان را روی کاغذ کشیدید، اساساً سندتان را ایجاد کرده اید.

• CSS از ماژول تشکیل شده است.

CSS از ماژول ساخته شده است که از مهمترین آن ها میتوان به Selectors (انتخابگرها)، Box Model (مدل جعبه)، Backgrounds and Borders، Web Fonts، Animations، Image Value، 2D/3D Transformations، Multiple Column Layout، User Interface میتوان اشاره کرد. از میان اینها Box Model و Multiple Column Layout اساسی تر هستند. زیرا آن ها هستند که تعیین می کنند که صفحات وب شما چگونه ظاهر می شود.

• از یک ویرایشگر HTML/CSS استفاده کنید.

شما می توانید فایلهای CSS3 خود را از ابتدا با استفاده از Notepad یا یک ویرایشگر متن دیگر کپی کنید. اما اگر از برنامه هایی مانند Adobe Dreamweaver استفاده می کنید، زندگی شما بسیار ساده تر خواهد بود.

Adobe Dreamweaver دسترسی به قالب های Starter را به شما می دهد. در این نسخه از برنامه، شما دارای قالب هایی از جمله BootStrap هستید.

BootStrap دارای بسیاری از سبک های پیش فرض CSS است.

• از نظر دادن استفاده کنید.

اگر در حال کار روی پروژه ای هستید که دیگران بعد از شما هم به این پروژه سر خواهند زد، نظردادن و کامنت گذاشتن، اطلاعات ارزشمندی را راجع به فرآیند شما فراهم می کند و برنامه نویس جدید، کدها را به راحتی درک خواهد کرد.

• Backgrounds and Borders

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

Border نیز انعطاف پذیری فوق العاده ای به طراحی شما می دهد.

• Control Over Image (کنترل تصاویر)

با استفاده از Control Over Image شما می توانید طیف گسترده ای از انواع تصاویر را استفاده کنید.

• Web Fonts

قانون Font-Face این اجازه را می دهد تا شما از فونت های وب که بر روی کامپیوترتان نصب نشده است، استفاده کنید. شما می توانید فونت ها را به سرور خود آپلود کنید و در آخر مطمئن شوید که مرورگر شما از نوع موردنظرتان پشتیبانی می کند.

• 2D/3D Transformations

با استفاده از این گزینه نیز می توانید جلوه های دوبعدی و سه بعدی برای پروژه تان ایجاد کنید.

• Animations

شما می توانید انیمیشن های کار با کد CSS3 را به طور مستقیم ایجاد کنید. که البته این کار دست و پا گیر است. راه بهتر این است که از هریک از برنامه های مختلف طراحی شده برای این منظور استفاده کنید. انجام این کار زمان زیادی را صرفه جویی خواهد کرد و به شما امکان می دهد انیمیشن های حرفه ای برای پوسته های خود تولید کنید.

• Testing

تست، آخرین مرحله در فرآیند برنامه نویسی است. مهم است که کد را امتحان کنید تا ببینید آیا مشکل وجود دارد یا نه. که در صورت وجود آن را آزمایش و حل کنید.

و در آخر: 

CSS3 بسیار قدرتمند است و به شما امکان میدهد که طرح های صفحات وب را کنترل کنید.

با خواندن این مقاله فقط توانستید که طعم و مزه ی CSS3 را بچشید و هنگامی که خواستید آن را عملاً تست و امتحان کنید، این شما هستید که مغلوب خواهید شد.

امیدواریم از این مقاله لذت کافی را برده باشید.

مجموعه ABLY