پیشرو انفورماتیک


Strict Standards: Declaration of JCacheControllerView::get() should be compatible with JCacheController::get($id, $group = NULL) in /home/h97813/domains/pishroanformatic.com/public_html/libraries/joomla/cache/controller/view.php on line 137

Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/plugins/content/rsform/rsform.php on line 57

Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/plugins/content/jw_sigpro/jw_sigpro.php on line 51

Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/plugins/content/jw_sigpro/jw_sigpro.php on line 52

Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/plugins/content/joominahtml5player/joominahtml5player.php on line 34

Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/plugins/content/rsform/rsform.php on line 57
طراحی سایت ریسپانسیو واکنشگرا

طراحی سایت ریسپانسیو یا واکنشگرا - در گذر زمان و به سبب رشد تکنولوژی، روز به روز نمایشگر هایی در ابعاد و اندازه های گوناگون در حال تولید می باشد. بعد از تولید مانیتور های عریض و سپس به سبب تولید تبلت و اسمارت فون ها و ... در نمایشگر های کوچکتر طوفان چالش عرض صفحات سایت در افکار طراحان وب سایت ایجاد شد. لذا واحد تحقیق و توسعه شرکت پیشرو انفورماتیک تصمیم به شرح تاریخچه تغییرات عرض سایت ها گرفت و مقاله ای را که مطالعه می فرمایید به قلم نوشتار دراورده است. لذا به صورت موردی به شرح تاریخچه این موضوع خواهیم پرداخت.

طراحی سایت ریسپانسیو یا واکنشگرا

طراحی سایت با عرض ثابت

در سالیان گذشته که عمدتا کامپیوتر ها از ویندوز XP با رزولوشون نمایش 800*600 بود، طراحان سایت از عرض های ثابت استفاده می نمودند، چرا که در آن ایام هنوز اسمارت فون های به بازار تلفن همراه نیامده بود و گوشی های تلفن همراه قابلیت مرور اینترنت را نداشتند و رویت صفحات وب سایت در هیچ تلفن همراهی فراهم نبود. همچنین عمده ضفحات نمایشگر و یا به عبارت دیگر مانیتور ها در عرض ثابت تولید می شدند جز معدودی از مانیتور های که در نسخه آزمایشی خود به تعداد محدودی به صورت عریض به بازار عرضه شدند و لذا این عریض شدن ضقحات نمایشگر در حین نمایش صفحات سایت با فضای خالی در دو طرف سایت مواجه می شد به مرور این تمر طنش زیادی را برای برنامه نویسان و طراحان وب سایت ها ایجاد نمود و در نتیجه درصدد ابداع راه حلی جهت برطرف نمودن این موضوع بر آمدند. اما این مورد با اضافه نمودن عرض به صورت ثابت حل نمی شد، چرا که مانیتور های عادی با عرض =800*600 با مشکل نمایش اسکرول عمودی مواجه می شدند و این موضوع مخالفت شدید کاربران و ناخشنودی آن ها را در بر داشت . اما چه تدبیری برای این موضوع اندیشیده شد.

طراحی سایت با عرض شناور (Fluid)

با گسترش انواع موبایل و تبلت ها و افزایش دسترسی موبایلها به اینترنت، چالش جدیدی برای طراحان وب ایجاد شد. اینک نمایش سایز در صفحاتی با پهنای 240 تا 480 پیکسل مدنظر صاحبان سایتها بود. دیگر نمیشد با طراحی سایت شناور، سایت را جوری طراحی کرد که هم در سایز مانیتور خوب نمایش داده شود و هم در سایز موبایلها. راه حل چه بود؟ اولین راه حلی که استفاده شد، طراحی دو نسخه متفاوت برای سایت بود. یکی برای نمایش در موبایل و یکی برای نمایش در مانیتورهای معمولی.

این روش هنوز هم در برخی موارد استفاده میشود و کاربردی است. در این روش ، دو قالب مجزا برای سایت طراحی میگردد. برای هدایت کاربر هم از user-agent مرورگر کمک گرفته میشود. مثلا اگر سیستم عامل کاربر سیمبیان یا آی او اس یا اندروید بود، کاربر را به صفحه موبایل منتقل می کنیم و اگر سیستم عامل ویندوز یا مک یا لینوکس بود، او را به صفحه معمولی سایت می فرستیم. مزیت این روش این است که در نسخه موبایل سایت، می توان بسیاری از بخش هایی را که لازم نداریم حذف کنیم تا صفحه سبک تر شود. همچنین کنترل بیشتری در طراحی نسخه موبایل داریم . چون از پایه کلیه المان ها را چیدمان می کنیم. اما هزینه طراحی دو قالب، برای شرکت های کوچک به صرفه نیست.

شرکت های اینترنتی بزرگ (مانند گوگل، یاهو، فیسبوک) معمولا از این روش استفاده میکنند. زیرا تعداد کاربر آنها روی هر نسخه سایت، آنقدر زیاد است که طراحی دو یا سه قالب مجزا برای دستگاه های گوناگون، اصلا هزینه قابل توجهی به حساب نمی آید و ارزش داشتن رابط کاربری اختصاصی و مناسب را دارد.

ایجاد تحولی بزرگ توسط طراحی سایت ریسپانسیو در طراحی رابط کاربری

با افزایش سرعت دسترسی موبایل و ظهور تکنولوژی 3G و 4G ، اکثر کاربران بجای کامپیوتر، از موبایل یا تبلت خود برای گشت و گذار در وب استفاده میکنند. و متعاقبا دارندگان سایتها نیز ترجیح میدهند سایت آنها در موبایل و تبلت هم قابل استفاده باشد. در این زمان (حول و حوش 2010) اکثر کاربران نیز از مرورگرهای مدرن استفاده میکنند که تا حدی CSS را پشتیبانی میکند. همچنین در موبایل و تبلت ها، به دلیل ظهور دیروقت آنها در عرصه وبگردی، اکثرا مرورگرهای جدیدی وجود دارد که از مدیاکوئری های CSS به خوبی پشتیبانی میکند. اینگونه شد که طراحان تصمیم گرفتند تا بجای تعریف یک CSS برای چیدمان هر صفحه، از چندین فایل CSS کمک بگیرند تا بتوانند جای المان ها را در سایزهای گوناگون صفحات و مرورگرها تغییر دهند.

برای اجرای طراحی ریسپانسیو شما نیاز جدی به جاوا اسکریپت ندارید و فقط با media query ها و تعریف CSS های گوناگون، می توانید یک رابط کاربری ریسپانسیو طراحی کنید. اما استفاده از جاوا اسکریپت کنترل بیشتری را روی المان های صفحه ممکن میسازد.

طراحی ریسپانسیو آنقدر پرطرفدار شد که در سال 2012 رتبه دوم در میان روشهای پرطرفدار طراحی را به خود اختصاص داد و در سال 2013 مجله محبوب ماشابل، سال 2013 را سال طراحی واکنشگرا نامید.

ظهور فریم ورک های واکنشگرا یا ریسپانسیو

با گسترش طراحی ریسپانسیو، شرکتها و گروه های نرم افزاری، ابزارها یا فریم‌ورک هایی برای تسریع طراحی ریسپانسیو ارائه کردند. از آنجایی که اکثر طرح های ریسپانسیو باید در سه سایز دسکتاپ، تبلت و موبایل اجرا شوند، این فریم‌ورک‌ها نیز روی همین سه سایز زوم کرده اند. یک فریمورک معمولا شامل یکسری CSS از پیش تعریف شده است هنگام طراحی، شما بجای تعریف class های جدید، از نام های کلاس های این فریمورک ها استفاده میکنید. محبوب ترین فریمورک های موجود بوت استرپ و فاندیشین هستند.

خدمات شرکت پیشرو انفورماتیک در این حوزه

شرکت پیشرو انفورماتیک به اطلاعا همگان میرساند آمادگی طراحی و برنامه نویسی بهترین سایت های ریسپانسیو یا واکنشگرا (بوتسترپ) را دارا می باشد. لذا در صورت نیاز با شماره 02122209525 تماس حاصل فرمایید.

لطفا کلیپ زیر رو مشاهده فرمایید.


  • Strict Standards: Non-static method ModValAddThisHelper::calcOutput() should not be called statically in /home/h97813/domains/pishroanformatic.com/public_html/modules/mod_valaddthis/mod_valaddthis.php on line 21

    Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/modules/mod_valaddthis/helper.php on line 27

    Strict Standards: Only variables should be assigned by reference in /home/h97813/domains/pishroanformatic.com/public_html/modules/mod_valaddthis/helper.php on line 90

طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت طراحی سایت

پیشرو انفورماتیک طراحی سایت ، بهینه سازی سایت ، تجارت الکترونیک ، بازاریابی اینترنتی
تهران، خیابان شریعتی, بالاتر از ملک، کوچه کشواد پلاک 86
contactus 06
شماره های تماس با ما :
88146627 21 98+
موبایل : 80  34  181  0912
 

info@pishroanformatic.com

pishroanformatic@hotmail.com