آموزش تایپوگرافی وب برای مبتدیان: متن خود را با HTML و CSS تزئین کنید
Web Typography for Beginners: Decorate Your Text With HTML and CSS
اگر از فونت‌های خارق‌العاده و حروف دوست‌داشتنی غافل هستید، اما به نظر نمی‌رسد که تایپوگرافی عالی را در صفحات وب بیاورید، این کلاس برای شما مناسب است!
برنت چندین سال را صرف برنامه نویسی نوع جذاب و خواندنی برای وب کرده است. پروژه‌های او از اپلیکیشن‌های کسب‌وکار مینیمالیستی گرفته تا نمونه کارهای هنرمندان جسور را شامل می‌شود. شما کد پشت ارائه محتوای نوشته شده را یاد می گیرید و می توانید جزئیات طراحی متنی دقیق را در صفحات وب واقعی بیاورید.
در این کلاس یاد خواهید گرفت که چگونه:
- استفاده از عناصر HTML برای ساختار محتوای نوشته شده یک صفحه وب
- بیش از 20 ویژگی CSS را برای تنظیم دقیق نمایش کاراکترها، کلمات، خطوط، پاراگراف ها و لیست ها اعمال کنید
- محتوای متنی خود را در دستگاه های مختلف اندازه گیری کنید
- یک خانواده فونت را از فونت های گوگل در وب سایت خود ادغام کنید
- فقط با CSS از مجموعه ای از ویژگی های سبک، یک فونت سفارشی ایجاد کنید
شما ایجاد خواهید کرد:
- محتوای متنی پررنگ و جلب توجه برای صفحه فرود یک وب سایت.
این کلاس برای کسانی است که حروف، تایپوگرافی یا طراحی وب را دوست دارند. شما نیازی به دانستن برنامه نویسی ندارید، اما برخی از دانش بسیار ابتدایی HTML و CSS به شما کمک خواهد کرد.
همچنین می‌توانید برنت را در یا پیدا کنید.
برای پروژه کلاس، یک وب سایت تک صفحه ای با محتوای متنی ایجاد کنید.
می‌توانید با کپی کردن و تکمیل مثال کتابخانه Letterville همه چیز را بسیار ساده نگه دارید. هر درس شما را گام به گام از آن عبور می دهد. در پایان، پروژه تمام شده شما باید شبیه پروژه من باشد .
برای چالش خلاقانه‌تر، از طرح یا کد خود در صفحه‌ای کاملاً متفاوت استفاده کنید.
صفحه شما باید نمایش داده شود:
- هدر با عنوانی چشم نواز
- یک بخش اصلی با چند پاراگراف متن اصلی و یک یا دو عنوان فرعی
- پاورقی با چند پیوند
از برخی یا همه موارد زیر استفاده کنید:
- تراز
- رنگ
- فونت ها (فونت-خانواده، سبک فونت، وزن فونت)
- لیست ها (
- اندازه
- فاصله (ارتفاع خطوط، فاصله حروف، فاصله کلمات و تورفتگی متن)
- بسته بندی (حداکثر عرض، سرریز-پوشش، شکستن کلمه)
با پست کردن اسکرین شات، قطعه کد، یا پیوندی به CodePen خود در گالری پروژه ها، کار خود را به رخ بکشید.
اگر به مشکلی برخورد کردید، کار در حال انجام خود را پست کنید و بازخورد بپرسید یا در بخش «انجمن» سؤالی بپرسید.
به کمک نیاز دارید؟
اگر سؤالی دارید یا در پروژه خود گیر کرده‌اید، از درخواست کمک دریغ نکنید. در اینجا چند گزینه وجود دارد:
- یک سوال در برگه انجمن اینجا در کلاس بپرسید.
- کارهای در دست اجرا خود را به عنوان پروژه خود به اشتراک بگذارید و بازخورد بخواهید. (شما همیشه می توانید کار در حال انجام خود را با پروژه تمام شده خود در فرصت دیگری تعویض کنید.)
- از طریق با معلم ارتباط برقرار کنید. یک پیام مستقیم برای او ارسال کنید یا او را در یک پست تگ کنید.
پیوندها به منابع
درس ها Lessons
-
نتیجه Conclusion
-
اندازه فونت با HTML Sizing Font With HTML
-
تزیین شخصیت ها و کلمات Decorating Characters and Words
-
راه اندازی پروژه Setting Up the Project
-
اصول فونت وب Web Font Basics
-
ساخت ستون متنی Making a Text Column
-
مقدمه Introduction
-
تراز افقی Horizontal Alignment
-
فاصله برای حروف، خطوط و کلمات Spacing For Letters, Lines, and Words
-
اندازه فونت ها با CSS Sizing Fonts With CSS
-
صورت های قلم سفارشی Custom Font Faces
-
سایه های متن Text Shadows
-
متن خود را با تگ های HTML ساختار دهید Structure your Text With HTML Tags
-
لیست ها Lists
https://donyad.com/d/4ce6
Brent Miller
طراح و توسعه دهنده وب
سلام! من برنت هستم.
من یک طراح و توسعه دهنده وب هستم. من به طراحان آموزش می دهم که چگونه طرح های خود را کدنویسی کنند و به توسعه دهندگان چگونه رابط کاربری خود را زیباتر کنند.
از زمانی که در سن 15 سالگی یک محافظ صفحه نمایش دسکتاپ با الهام از آبشار برای مدرسه راهنمایی خود نوشتم، ایجاد تجربیات کاربری زیبا و در دسترس برایم جذاب شد.
من در هشت سال گذشته وب‌سایت‌ها و برنامه‌های کاربردی وب را به‌طور حرفه‌ای طراحی و برنامه‌نویسی کرده‌ام. کار من از یک سایت بروشور ساده برای سالن خالکوبی گرفته تا یک برنامه وب سازمانی برای وزارت امنیت داخلی ایالات متحده است.
من چه چیزی را به اندازه عالی کردن وب دوست دارم؟ به دیگران نیز نحوه انجام آن را آموزش دهید!
هیچ کس کلاس خسته کننده ای را دوست ندارد که به طول انجامد. من در آن کلاس ها شرکت کرده ام! من تلاش می کنم مطالبم را جذاب، سرگرم کننده و قابل دسترس نگه دارم.
1. من را اینجا در Skillshare دنبال کنید. من قصد دارم در دوره های آینده جدیدترین گرایش ها و تکنیک های ایجاد تجربه کاربری برای وب را آموزش دهم.
2. من را دنبال کنید. هر روز حداقل یک منبع رایگان برای یادگیری توسعه وب به اشتراک می گذارم.
3. به من بگویید چه نوع دوره های کدنویسی خلاقانه وب را می خواهید در Skillshare ببینید. من نمی توانم کلاس کامل شما را بسازم مگر اینکه بدانم چیست.
نمایش نظرات