آموزش ساخت یک سایت نمونه کارها Responsive

Building a Responsive Portfolio Site

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: نمونه کارهای عالی می تواند تفاوت بین فرود کار و واگذار شدن را ایجاد کند. این دوره مبتنی بر پروژه سریع و سرگرم کننده به شما نشان می دهد که چگونه از ابتدا تا انتها یک سایت نمونه کارها پاسخگو بسازید. نویسنده هیات مدیره جاستین سیلی نحوه برنامه ریزی وب سایت در فتوشاپ و تبدیل برنامه به یک سایت تک صفحه ای را نشان می دهد. ستون فقرات محرک نمونه کارها Skeleton خواهد بود ، یک چارچوب CSS بصری که شما خواهید آموخت چگونه از آن برای پروژه های خود استفاده کنید. در این راه ، نحوه کار با فونت های وب مانند فونت های Google و فونت های آیکون ، نحوه شروع قرار دادن محتوا در ظروف و نحوه سبک جلوه دادن سرصفحه ها ، تصاویر ، تایپوگرافی و حتی دکمه های شبکه های اجتماعی با برخی موارد را خواهید فهمید. CSS سفارشی ساده برای اطمینان از اینکه سایت شما برای موبایل آماده است ، یک جلوه سبک پاسخگو و برخی پرسشهای رسانه را اضافه کنید و یک بستر کامل و با کیفیت بالا برای به نمایش گذاشتن کارهای خود خواهید داشت.
موضوعات شامل:
  • برنامه ریزی و تنظیم طرح HTML
  • ایجاد شبکه های CSS پاسخگو
  • ترکیب فونت های وب و آیکون
  • ساخت یک طرح با شبکه اسکلت
  • یک ظاهر طراحی وب سایت
  • استفاده از jQuery برای جلوه های ساده جعبه سبک
  • تست پاسخگویی وب سایت
  • تنظیم درخواستهای رسانه

سرفصل ها و درس ها

مقدمه Introduction

  • خوش آمدی Welcome

  • نحوه استفاده از فایل های تمرینی How to use exercise files

  • آنچه باید قبل از شروع بدانید What you need to know before you begin

1. شروع کار 1. Getting Started

  • پروژه خود را برنامه ریزی کنید Planning your project

  • چارچوب اسکلت را بارگیری کنید Downloading the Skeleton framework

  • تنظیم سند HTML خود Setting up your HTML document

  • اسناد CSS خود را تنظیم و پیوند دهید Setting up and linking your CSS documents

  • فونت های Google را به پروژه خود اضافه کنید Adding Google fonts to your project

  • فونت عالی را به پروژه خود اضافه کنید Adding Font Awesome to your project

2. تخمگذار کار زمینی 2. Laying the Groundwork

  • درک چارچوب اسکلت Understanding the Skeleton framework

  • طرح خود را با استفاده از شبکه Skeleton بسازید Building your layout using the Skeleton grid

  • درج محتوا در ظروف خود Inserting content into your containers

3. طراحی وب سایت شما 3. Styling Your Website

  • ساختن فهرست محتویات CSS Building a CSS table of contents

  • عنوان سایت خود را طراحی کنید Styling the header of your site

  • تعریف سبک های تایپوگرافی خود Defining your typography styles

  • تنظیم سبک های خاص تصویر Setting image-specific styles

  • ایجاد یک عنصر آرم CSS Creating a CSS logo element

  • نمادهای آیکون رسانه های اجتماعی Styling social media icons

  • پاورقی Styling the footer

4- اضافه کردن جلوه Lightbox 4. Adding a Lightbox Effect

  • بارگیری با شکوه Downloading Magnific Popup

  • پیوند دادن پرونده های سبد CSS و JavaScript Linking the lightbox CSS and JavaScript files

  • افکت سبد را به HTML خود اضافه کنید Adding the lightbox effect to your HTML

  • یک اثر بزرگنمایی به سبد اضافه می شود Adding a zoom effect to the lightbox

5- پاسخگویی نهایی 5. Finalizing Responsiveness

  • پاسخگویی وب سایت خود را آزمایش کنید Testing your website's responsiveness

  • جستجوی رسانه ها Tweaking your media queries

  • بررسی پروژه نهایی Exploring the final project

نتیجه Conclusion

  • از اینجا به کجا بروم Where to go from here

نمایش نظرات

آموزش ساخت یک سایت نمونه کارها Responsive
جزییات دوره
1h 47m
27
Linkedin (لینکدین) Linkedin (لینکدین)
(آخرین آپدیت)
171,037
- از 5
ندارد
دارد
دارد
Justin Seeley
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Justin Seeley Justin Seeley

جاستین سیلی بیش از 15 سال است که در زمینه های گرافیک و طراحی وب کار می کند و علاقه زیادی به آموزش و دسترسی آموزش به مردم در سراسر جهان دارد. تا به امروز بیش از 80 دوره آنلاین نویسنده است و تقریباً 250 ساعت مطالب را در بر می گیرد. جاستین سخنران عادی رویدادهایی مانند HOW Design LIVE ، NAB ، AIGA Design ، Creative Pro Week و Adobe MAX است.