آموزش طراحی وب سایت های واکنش گرا

35,000 تومان
  • آموزش طراحی وب سایت های واکنش گرا و قابل انعطاف
  • از مبتدی تا پیشرفته از شرکت معتبر لیندا
  • به زبان انگلیسی روان با بهترین کیفیت
  • اختصاصی فروشگاه عتیقه

توضیحات

آموزش طراحی وب سایت های واکنش گرا Responsive

وب سایت هایی که به صورت واکنش گرا یا همان ریسپانسیو (Responsive) طراحی می شوند بدون ایجاد شدن کوچکترین بهم ریختگی در جایگاه عناصر و محتوا تشکیل دهنده صفحه، در تمامی مانیتورها (با اندازه صفحه نمایش متفاوت) و دستگاه های موبایل (انواع تبلت و گوشی های هوشمند) به طور یکسان نمایش داده می شوند. در واقع ریسپانسیو به قالب های واکنش گرا گفته می شود بطوری که اگر کاربری با موبایل یا تبلت و یا آیفون وارد سایت شما شود نسخه بهینه شده سایت را براساس سایز مانیتور یا نمایشگر سیستم خود مشاهده می کند. در دوره آموزشی Building a Responsive Single-Page Design شما با چگونگی طراحی یک وب سایت تک صفحه ای واکنش گرا با استفاده از HTML, JavaScript و CSS آشنا می شوید.

عناوین آموزشی:
– تجزیه و تحلیل پروژه قبل از شروع
– ایجاد استایل های اولیه
– ساخت Sass mixins
– کدنویسی ناوبری (navigation)
– ساخت navigation ریسپانسیو با استفاده از grid ها
– استفاده از طرح بندی تقسیم شده
– ایجاد انیمیشن های توئین
– کنترل صحنه با اسکرول
– و …

Learn how to build dynamic, responsive single-page designs with HTML, JavaScript, and CSS. The website featured in this course combines docking navigation, columns that adjust without cluttering your site layout or HTML markup, and animated scrolling effects that respond to user direction. Author Ray Villalobos shows you how to build it.

He starts with a lean, easy-to-read template, and then explains how to add the features that make single-page designs so great, with these four frameworks:
– Compass, whose Sass mixins help you leverage CSS3 features like Flexbox
– Susy 2, the framework that “subtracts” the math from responsive grid design
– ScrollMagic, for adding “magical” scroll effects
– Breakpoint, which makes writing media queries in Sass a snap

But this course isn’t just about the tools. It’s a realistic project that epitomizes many of the design challenges website developers face in the real world. Start watching now and learn how to use HTML, jQuery, and CSS to build your own dynamic, deeply responsive designs.

Topics include:
– Analyzing the project before you begin
– Creating basic styles
– Building your own Sass mixins
– Coding the navigation
– Making the navigation responsive, with grids
– Using a split layout
– Creating tween animations
– Controlling scenes with scrolling


با توجه به اینکه دستگاه های قابل حمل هوشمند با اندازه های متفاوت صفحه نمایشگر هر روز بیشتر در میان افراد رایج می شوند نیاز به طراحی وب سایت های ریسپانسیو (واکنش گرا) برای کسب رضایت بیشتر کاربران و به اشتراک گذاردن بهتر محتوا، امری لازم محسوب می شود. ریسپانسیو (Responsive) به قالب های واکنش گرا گفته می شود بطوری که اگر کاربری با موبایل یا تبلت و … وارد سایت شما شود نسخه بهینه شده سایت را براساس سایز مانیتور یا نمایشگر سیستم خود مشاهده می کند. در دوره آموزشی Responsive Media شما با چگونگی تبدیل layouts (طرح بندی های) ثابت به layout های شناور برای انطباق با صفحه نمایش های با اندازه های مختلف آشنا می شوید.

عناوین آموزشی:
– تعیین اندازه های بر حسب درصد
– تغییر اندازه تایپوگرافی
– استفاده از فونت های آیکون
– محتوای Embedding HTML5 video
– تغییر اندازه و فشرده سازی عکس های رستر (raster)
– تغییر اندازه و فشرده سازی تصاویر وکتور
– و …

Why restrict yourself to inline images and static text, especially in our multidevice, multiplatform era? Responsive media allows you to share more content with more people. Learn what you need to know to build image- and typography-rich pages (with HTML5 video!) that display correctly on a wide variety of devices. Christopher Schmitt will also show you how to convert fixed-width layouts into fluid grid layouts that adapt to different screen sizes, use media queries to deliver custom design experiences, and prepare and retrieve PNG, JPEG, and SVG images so that they look their best.

Topics include:
– Using percentage-based values for scaling
– Resizing typography
– Using icon fonts
– Embedding HTML5 video content
– Resizing and compressing raster images
– Compressing vector images


دریم‌ویور (Dreamweaver) نرم افزار قدرتمند و غنی است که اکثر طراحان برای طراحی های وب خود از آن استفاده می کنند. با Dreamweaver می توانید به سادگی اقدام به نوشتن کد ها و تگ های مد نظر خود نمایید، همچنین محیط ویرایشگر فوق حرفه ای این برنامه با تفکیک کردن کدهای مختلف، کد نویسی را برای شما آسان می نماید. با رواج استفاده از دستگاه های تبلت و گوشی های هوشمند نیاز به طراحی وب سایت هایی که قابلیت نمایش در صفحه مانیتور ، دستگاه های تبلت و گوشی های هوشمند را داشته باشند مطرح شده است. ریسپانسیو (Responsive) به قالب های واکنش گرا گفته می شود بطوری که اگر کاربری با موبایل یا تبلت و یا آیفون وارد سایت شما شود نسخه بهینه شده سایت را براساس سایز مانیتور یا نمایشگر سیستم خود مشاهده می کند. در دوره آموزشی Responsive Design with Dreamweaver CS6 شما با طراحی وب سایت های ریسپانسیو بوسیله نرم افزار دریم‌ویور آشنا می شوید.

عناوین آموزشی:
– بررسی Fluid Grid Layout پیش فرض
– اضافه کردن تگ های div
– قرار دادن محتوا در fluid grid
– اصلاح تعداد ستون های گرید
– تنظیم عرض ستون و حاشیه ها
– ساخت مدیا کوئری ها (media queries) از ابتدا
– استفاده از تکنیک های جاوا اسکریپت
– تنظیم راه حل های سمت سرور
– و …

This course illustrates two approaches to responsive web design, the new Fluid Grid Layout feature and media queries, which allow a wide spectrum of designers to reach their target audience via desktops, tablets, or other mobile devices. Author Joseph Lowery shows how to use the Fluid Grid Layout feature in Dreamweaver to create a single web site that delivers different layouts to targeted screen sizes. The course also offers a more advanced approach to responsive design by using media queries—employing the Multiscreen Preview feature and enhancing the resulting output code—as well as methods for handling mobile first priorities and adaptive images.

Topics include:
– Exploring the default Fluid Grid Layout
– Adding building block div tags
– Inserting content into a fluid grid
– Modifying the number of grid columns
– Adjusting column widths and margins
– Building media queries from scratch
– Handling orientation changes
– Applying JavaScript techniques
– Setting up server-side solutions


همچنین ببینید :

Lynda pro web design Wordpress Lynda
Adobe Muse + Training Bootstrap
سجاد نبی زاده

سجاد نبی زاده

سجاد نبی زاده مدیر سایت فروشگاه عتیقه است. سابقه 20 سال فعالیت نرم افزاری دارد. در زمینه آموزش نرم افزارهای گرافیکی و طراحی وب فعال است. روزها می نویسد و شب ها می خواند. آرشیو جامع نرم افزار و آموزش و بازی های کامپیوتری دارد. آماده همکاری با همه دوستان خوب است. با او در ارتباط باشید تماس -- کانال تلگرام

More Posts

Follow Me:
TwitterFacebookLinkedInPinterestGoogle PlusDiggYouTube

نقد و بررسی‌ها

هیچ دیدگاهی برای این محصول نوشته نشده است.

اولین کسی باشید که دیدگاهی می نویسد “آموزش طراحی وب سایت های واکنش گرا”

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این سایت از اکیسمت برای کاهش هرزنامه استفاده می کند. بیاموزید که چگونه اطلاعات دیدگاه های شما پردازش می‌شوند.