آیا به دنبال افزودن کمی خلاقیت و منحصر به فرد بودن به وب سایت خود هستید؟ با HTML، CSS، و انیمیشنهای وب، هر چیزی ممکن است!
در این کلاس، من به شما نشان خواهم داد که چگونه با معرفی برخی از عناصر طراحی اضافی، عمدتاً با استفاده از HTML و CSS، صفحه اصلی وب سایت یا برنامه وب خود یا صفحات فرود را یک درجه بالا ببرید. همچنین برخی از انیمیشنهای مبتنی بر CSS را بهعنوان راهی برای افزودن کمی جذابیت بصری بررسی خواهیم کرد.
با استفاده از CodePen، یاد خواهید گرفت که چگونه:
بعلاوه، من نکات و منابعی را برای انتخاب بهبود طراحی مناسب برای وب سایت شما، بر اساس اهداف سایت شما، به اشتراک خواهم گذاشت.
چه یک فریلنسر باشید که به دنبال ایجاد سایتهای مؤثرتر برای مشتریان هستید، یا یک فرد مزدور به دنبال ایجاد یک سایت تجاری مؤثرتر، تکنیکهایی را برای معرفی برخی پیشرفتهای طراحی که جذابتر و جذابتر را ارائه میدهند، یاد خواهید گرفت. تجربه به یاد ماندنی برای بازدیدکنندگان سایت.
توجه: برای بهترین تجربه مشاهده، تماشای ویدیوها در حالت تمام صفحه توصیه می شود. اگر صفحه نمایش شما محدود است، به پیوندهای CodePen ارائه شده برای مشاهده کد منبع برای درس ها مراجعه کنید.
برای پروژه کلاس، 2 یا بیشتر از تکنیک های پوشش داده شده در دوره را انتخاب کنید و آنها را در پروژه وب خود پیاده سازی کنید. شما بسیار تشویق می شوید که از CodePen برای این پروژه استفاده کنید تا بتوانید لینک پروژه تکمیل شده خود را به راحتی در گالری پروژه به اشتراک بگذارید. منابع کلاس و پیوندهای درس ضمیمه شده را حتماً بررسی کنید. اگر میخواهید نقطه شروعی داشته باشید، راحت از قلم شروع استفاده کنید (از گزینه "fork" در CodePen برای ایجاد کپی خود استفاده کنید.
سعی کنید از منطقه راحتی خود خارج شوید! اگر معمولاً با انیمیشن ها کار نمی کنید، سعی کنید یک انیمیشن CSS را در پروژه خود قرار دهید. اگر معمولاً طرحبندی CSS را آزمایش نمیکنید، سعی کنید بلوکی از محتوا را با استفاده از شکل CSS یا لبه زاویهدار اضافه کنید.
من تمام پروژههای ارسالی را بررسی میکنم و به طور مرتب انجمن بحث کلاس را بررسی میکنم تا به هر سؤالی که پیش میآید پاسخ دهم.
قلم شروع نهایی پروژه
پیوندهای درس
درس شماره 1: همپوشانی متن در پسزمینه گرادیان -
درس شماره 2: متن قهرمان متحرک -
درس شماره 3: اشکال CSS -
درس شماره 4: لبه های زاویه دار -
درس شماره 5: فیلترهای CSS با تصویر پس زمینه -
درس شماره 6: حالت های ترکیبی CSS در متن همپوشانی -
درس شماره 7 (پاداش): انیمیشن SVG -
اسکیلشر یک پلتفرم آموزشی آنلاین است که به میلیونها افراد در سراسر جهان امکان یادگیری مهارتهای جدید را فراهم میکند. این پلتفرم با ارائه دورههای متنوع در زمینههایی از جمله هنر و طراحی، فناوری، کسب و کار، و زندگی موفق، به کاربران خود این امکان را میدهد تا به صورت آنلاین به یادگیری بپردازند.
یکی از ویژگیهای منحصر به فرد سکیلشر، ارائه دورههای تدریس شده توسط صاحبان مهارتها و افراد موفق در زمینههای مختلف است. این امر باعث میشود که کاربران از تجربیات و دانش عملی افرادی که در حوزههای مورد نظرشان موفق عمل کردهاند، بهرهمند شوند و بهترین اطلاعات را برای بهبود مهارتهای خود دریافت کنند. به این ترتیب، سکیلشر نه تنها یک پلتفرم آموزشی است، بلکه یک جامعه آموزشی است که افراد را به اشتراک گذاری دانش و تجربیات تشویق میکند و به آنها کمک میکند تا در مسیر پیشرفت و موفقیت خود ادامه دهند.
توسعه دهنده وب/UI
سلام! من Sheelah هستم، یک توسعه دهنده وب/UI جلویی.
من بهعنوان برنامهنویس بهصورت تماموقت از راه دور کار میکنم. در اوقات فراغت، من عاشق ساختن نمونه های اولیه CSS، جاوا اسکریپت و SVG در CodePen هستم. من از به اشتراک گذاشتن دانش خود در این راه لذت می برم!
من را پیدا کنید و در این آدرس سلام کنید:
https://twitter.com/sheelah_b
https://instagram.com/ramblingfloweristahttps://sheelahb.com
نمایش نظرات