مشکل در طراحی واکنش گرا

[jaboli]

سلام.یه سوال داشتم.چرا سایتی که من طراحی کردم http://sabz-design.ir/ وقتی زوم یا کوچیک میکنم صفحه مرورگر رو از ارتفاع قالب کم و زیاد می کنه ولی مثلا این سایت http://mohammadbanner.ir/# هرچی زوم میکنی یا کوچیک میکنی تمام قسمتاش متناسب با هم کوچیک و بزرگ میشن؟!!آیا باید عرض رو درصد بدیم یا ارتفاع رو ؟!
یه توضیح بدید که دقیقا باید چیکار کنم تا طراحی من کاملا واکنش گرا باشه؟!

[Moien Tajik]

باید قالبتون رو ریسپانسیو بکنید ، میتونید از بوت استرپ استفاده کنید. http://getbootstrap.com/2.3.2/

[jaboli]

چی هست این؟!!

[mehdi.mousavi]

چی هست این؟!!

سلام.
این یک CSS Framework هستش که بصورت Responsive طراحی شده و مانند 960GS (http://960.gs/) و دیگر Framework ها یا Grid System های قدیمی،
برای Fixed Width طراحی نشده. البته دوستان نسخه قدیمی تر Bootstrap رو معرفی کردن، اما نسخه جدید همین Framework (http://getbootstrap.com/) در واقع
بر اساس Mobile First Approach طراحی شده که کنترل بیشتری روی سایت، هنگامیکه سایت روی Tablet، Smartphone و ... دیده میشه
داشته باشید.

هر دو سایتی هم که معرفی کردید، ایرادهای عمده ای دارن که البته بحث در مورد اونها از حوصله این تاپیک خارجه...

موفق باشید.

پ.ن.: نمونه سایت هایی که با Bootstrap ساخته شده رو می تونید اینجا ببینید (http://builtwithbootstrap.com/).

[merlin425]

Bootstrap یک css فریم ورک هست یه سری css از قبل نوشته شده و اماده و استاندارد
css framework رو search کن همه چی دستگیرت میشه منتها Bootstrap حجمش واسه صفحه زیاده صفحه رو سنگین میکنه فریم ورکای دیگه ای هم هست که رسپانسیو باشن مثل

Unsemantic (http://unsemantic.com/)
Foundation (http://foundation.zurb.com/)
Less Framework (http://lessframework.com/)
Skeleton (http://www.getskeleton.com/)
Responsive Grid System (http://www.responsivegridsystem.com/)

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

اینها که گفتم منبع خوب واسه یاد گیری ندارن یا من پیدا نکردم ولی واسه Bootstrap میتونی بری اینجا (http://www.aparat.com/video/video/result?text=Bootstrap&secfrdcodedvar=7a113084827c672cdb5289187181b56e89b 6561a&btnSubmit=+&data%5Bcheckgetrequest%5D=true&frm-id=1380193499524414dbbb804)

[soroush.r70]

آموزش طراحی وب سایت با استفاده از تکنیک responsive (http://barnamenevis.org/showthread.php?378702-%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA-%D8%A8%D8%A7-%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87-%D8%A7%D8%B2-%D8%AA%DA%A9%D9%86%DB%8C%DA%A9-responsive&highlight=%D8%B1%DB%8C%D8%B3%D9%BE%D8%A)