ریسپانسیو کردن قالب بدون استفاده از فریم ورک ها

[Beginner Programmer]

سلام به همگی دوستان:قلب:
من دنبال یه منبعی میگردم برای اموزش طراحی واکنش گرا وب سایت ها بدون استفاده از فریم ورک هایی مثل بوت استرپ و فاندیشن و...
میخوام منطقش رو متوجه بشم و بفهمم و بتونم با مدیا کوئری ها کار کنم کسی منبع مناسبی سراغ داره؟من هر چی سرچ میزنم به چیز جالبی نمیرسم...
خیلی جاها شاید نیاز باشه که شما یه ماژول یا چیزی رو به قالب اضافه کنی اون موقع کل قالب واکنش گراست ولی این یه تیکه کار لنگ میزنه یا ممکنه پیش بیاد که یه قالب رو واکنش گراش کنید از 0...
خلاصه اینکه میخوام خودم از 0 یه قالب رو واکنش گرا کنم یا یه قالب واکنش گرا رو بدون استفاده از فریم ورک بسازم... اگر کسی منبع مناسبی بامثال های خوب سراغ داره معرفی کنه ممنون میشم...

[سعید کشاورز]

سلام دوست عزیز
یه نکته بهت میگم بعدش خودت تصمیم بگیر
الان دلیل اینکه می خوای خودت این کار رو بکنی چیه؟ دیگه از کسایی که بوت استرپ رو نوشتن که حرفه ای تر نیستی درسته؟
خیلیا میان میگن بوت استرپ 130 کیلوبایت حجمشه که خوب حرفشون منطقیه
اما شما اگه فقط از گرید بندی بوت استرپ استفاده بکنی حجمش میشه کمتر از 30 کیلوبایت
حالا شما چقدر باید زمان صرف کنی تا یه سیستم گرید بندی برای خودت بنویسی؟
حساب کن ببین واقعا ارزش داره؟ معلومه که نداره
اما اینجا یه چیزی هست به اسم یادگیری
شاید شما دوست داشته باشی یاد بگیری که چجوری اینهارو ایجاد میکنن
خوب اینجا شما باید مقادیر رو به درصد وارد کنید و همچنین از Media Screenها استفاده کنی و در رزولوشن های مختلف اون درصد ها رو کم و زیاد کنی
به این ترتیب میتونی اون گرید بندی خودت رو ایجاد کنی
ولی بازم میگم ارزش نداره خودت بخوای وقت بزاری و این کارو انجام بدی
البته اگه میخای یاد بگیری فکر میکنم شرکت لیندا یه آموزش توی همین زمینه که شما دنبالشی داشت
که بدون استفاده از فریم ورک ریسپانسیو میکرد
موفق باشی

[ravand]

کار با مدیا کوئری تنها ، خیلی وقت گیره. مشتری هم که پول نمیده که شما اینقدر وقت خودت رو بذاری. الان بیشتر کاربران هم adsl دارن. سرعتشون بهتر شده. دیگه مثل گذشته نیست که اکثرا با دایل آپ بودن.

[tamafi6]

سلام به همگی دوستان:قلب:
من دنبال یه منبعی میگردم برای اموزش طراحی واکنش گرا وب سایت ها بدون استفاده از فریم ورک هایی مثل بوت استرپ و فاندیشن و...
میخوام منطقش رو متوجه بشم و بفهمم و بتونم با مدیا کوئری ها کار کنم کسی منبع مناسبی سراغ داره؟من هر چی سرچ میزنم به چیز جالبی نمیرسم...
خیلی جاها شاید نیاز باشه که شما یه ماژول یا چیزی رو به قالب اضافه کنی اون موقع کل قالب واکنش گراست ولی این یه تیکه کار لنگ میزنه یا ممکنه پیش بیاد که یه قالب رو واکنش گراش کنید از 0...
خلاصه اینکه میخوام خودم از 0 یه قالب رو واکنش گرا کنم یا یه قالب واکنش گرا رو بدون استفاده از فریم ورک بسازم... اگر کسی منبع مناسبی بامثال های خوب سراغ داره معرفی کنه ممنون میشم...
دوست عزیزآموزش به زبان فارسی تقریبا وجودنداره واگرهم وجودداره به صورت جزیی هست
آشنایی با media query هایک مبحث کاملا مفصل وپیشرفته هست ویک کتاب هزارمنی میخوات.
دوتاازسایت هایی که به طورکامل به این مبحث پرداخته رادرزیرمیتونیدببینید.
http://alistapart.com/topic/responsive-design/

https://www.smashingmagazine.com/2013/06/media-queries-are-not-the-answer-element-query-polyfill/

[anvar]

اگه انگلیسیت خوبه - دو کتاب زیر دقیقا همون چیزی هستن که شما نیاز دارید
Mastering Responsive Web Design with HTML5 and CSS3

Responsive Web Design with HTML5 and CSS3

از سایت زیر قابل دانلود هستن
http://www.allitebooks.com/

[Beginner Programmer]

سلام دوست عزیز
یه نکته بهت میگم بعدش خودت تصمیم بگیر
الان دلیل اینکه می خوای خودت این کار رو بکنی چیه؟ دیگه از کسایی که بوت استرپ رو نوشتن که حرفه ای تر نیستی درسته؟
خیلیا میان میگن بوت استرپ 130 کیلوبایت حجمشه که خوب حرفشون منطقیه
اما شما اگه فقط از گرید بندی بوت استرپ استفاده بکنی حجمش میشه کمتر از 30 کیلوبایت
حالا شما چقدر باید زمان صرف کنی تا یه سیستم گرید بندی برای خودت بنویسی؟
حساب کن ببین واقعا ارزش داره؟ معلومه که نداره
اما اینجا یه چیزی هست به اسم یادگیری
شاید شما دوست داشته باشی یاد بگیری که چجوری اینهارو ایجاد میکنن
خوب اینجا شما باید مقادیر رو به درصد وارد کنید و همچنین از Media Screenها استفاده کنی و در رزولوشن های مختلف اون درصد ها رو کم و زیاد کنی
به این ترتیب میتونی اون گرید بندی خودت رو ایجاد کنی
ولی بازم میگم ارزش نداره خودت بخوای وقت بزاری و این کارو انجام بدی
البته اگه میخای یاد بگیری فکر میکنم شرکت لیندا یه آموزش توی همین زمینه که شما دنبالشی داشت
که بدون استفاده از فریم ورک ریسپانسیو میکرد
موفق باشی

سلام دلیلیش اینه که یه موقع شاید یه قسمت شما به سایتت اضافه میکنی و یا یه سری تغییرات رو انجام میدی قالب سایت هم با بوت استرپ ساخته نشده شما میخوای اون قسمتی که اضافه کردی هم حالت واکنش گرایی خودش رو حفظ کنه...

[سعید کشاورز]

سلام دلیلیش اینه که یه موقع شاید یه قسمت شما به سایتت اضافه میکنی و یا یه سری تغییرات رو انجام میدی قالب سایت هم با بوت استرپ ساخته نشده شما میخوای اون قسمتی که اضافه کردی هم حالت واکنش گرایی خودش رو حفظ کنه...
خوب اینجا یه بحثی وجود داره
هر قالب ریسپانسیوی از یه سیستم گرید بندی پیروی میکنه درسته؟
حالا چه از فریم ورک استفاده شده باشه چه قالب به صورت دستی ریسپانسیو شده باشه
حالا شما اینجا اگه قراره تغییری دز قالب بدی حتما باید از اون سیستم گرید بندی که اون طراح قالب استفاده کرده، شما هم استفاده کنی
مثلا همون قالبی لینکش رو فرستادی رو نگاه کن ببین سازنده قالب از چه گرید بندی استفاده کرده شما هم حتما باید از اون روش استفاده کنی
حالا اگه بوت استرپ بود خوب شما باید گرید بندی بوت استرپی رو بلد باشی
اگه فاندیشن بود ( که من خودم کار نکردم) شما باید از اون استفاده کنی
اگه قالب دست ساز بود که باید ببینی روش گرید بندی سازنده قالب به چه صورتیه شما هم همون روش رو در پیش بگیری و استفاده بکنی

http://www.w3schools.com/css/css3_mediaqueries_ex.asp
لینک بالا هم یه نگاه بنداز