دوره SVG (گرافیک برداری مقیاس‌پذیر) 2024 - درون کد

آنچه یاد خواهید گرفت:

• کجا SVGها را پیدا کنید و چگونه آنها را بسازید؟
• روش‌های افزودن SVG به صفحات وب
• درک کد زیرساختی تصاویر SVG
• با المان‌ها و ویژگی‌های SVG آشنا شوید.
• چگونگی ویرایش، تبدیل و متحرک‌سازی تصاویر SVG

پیش نیازهای دوره

• این دوره نیازمند دانش قبلی HTML و CSS است.
• آشنایی با Visual Studio Code یا یک ویرایشگر کد دیگر مفید است اما کاملاً اجباری نیست.
• اشتیاق به یادگیری جدیدترین اطلاعات در مورد گرافیک برداری مقیاس‌پذیر.

توضیحات دوره

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

چگونگی کدنویسی برای اشکال اولیه مانند دایره، خط، منحنی و چندضلعی

چگونگی درک مسیرها و فرمان های استفاده شده برای رسم آنها

چگونگی افزودن المان‌های متنی هنری به SVG

چگونگی هدف‌گیری و استایل‌دهی المان‌های خاص SVG با استفاده از CSS یا ویژگی‌های نمایشی

چگونگی درک viewportها، viewBox، اندازه‌گیری و موقعیت‌دهی المان‌های SVG

چگونگی تبدیل یا متحرک‌سازی المان‌های SVG

چگونگی پیاده‌سازی گرادیان‌ها، فیلترها، clip-pathها و ماسک‌ها

چگونگی ایجاد، ویرایش یا حذف المان‌های SVG از یک صفحه وب با استفاده از JavaScript

چگونگی استفاده از عناوین، توضیحات، نقش‌ها و ویژگی‌های aria برای دسترس‌پذیری و سئوی SVG

تجربه قبلی کدنویسی کاملاً ضروری نیست زیرا این دوره یک نمای کلی خوب از مبانی SVG ارائه می‌دهد. اما برای بهره‌برداری حداکثری از درس‌ها، داشتن دانش یا تجربه در HTML5 و CSS3 مفید است.

این دوره برای چه کسانی مناسب است؟

• این دوره برای طراحان وب، توسعه‌دهندگان و هر کس دیگری که در مورد SVGها (گرافیک برداری مقیاس‌پذیر) کنجکاو است در نظر گرفته شده است. شاید شما درباره SVGها شنیده باشید یا حتی از آنها در قالب لوگو و آیکون استفاده کرده باشید و اکنون می‌خواهید واقعاً آنها را درک کنید. شاید نگاهی به کد SVG انداخته‌اید و آن را بسیار پیچیده و طاقت‌فرسا یافته‌اید. یا شاید از وب‌سایتی با بارگذاری سریع با گرافیک و انیمیشن‌های شگفت‌انگیز بازدید کرده‌اید و خواسته‌اید بدانید چگونه ساخته شده‌اند. اگر هر یک از این موارد شما را توصیف می‌کند، پس دوره درستی را انتخاب کرده‌اید. مدرس کاملاً درک می‌کند که SVGها می‌توانند پیچیده باشند و کد آنها می‌تواند ترسناک باشد. اما وقتی برای درک معنای کد و چگونگی دستکاری و متحرک‌سازی SVGها وقت بگذارید، می‌توانید کارهای شگفت‌انگیزی در وب‌سایت خود انجام دهید.