یک وبسایت ریسپانسیو چهگونه طراحی میشود؟
یک
وبسایت ریسپانسیو چهگونه طراحی میشود؟ یکی از روشها برای ریسپانسیو کردن سایت، به کار گیری کردن از مدیا کوئریهاست . شما میتوانید ترکیبی از کوئریهای CSS و افکتهای حرکتی CSS را به عمل ببرید . برای طراحی یک وب سایت ریسپانسیو با به کارگیری از کوئریهای مدیا، شما باید سایز مرورگر را دائم عوض کنید تا ببینید برخورد تارنما چه چیزی است . در اینجا پرشهای فاحشی را مشاهده خواهید کرد . آنگاه از این، افکتهای حرکتی CSS به شما کمک مینمایند و با این شیوه تغییرات انیمیشنی میگردند . حتمی به ذکر میباشد که باید پیش از طراحی سایت ریسپانسیو، متا تگ view port را به سایتتان بیافزایید .
برای اینکه کاری فرمایید وبسایتتان در مانیتورها، گوشیها و تبلتها طوری سناریو داده شود که به اسکرول افقی نیازی نباشد، می بایست سایز دستگاههای گوناگون را بدانید . برای این کارها حتما نیز لازم نمیباشد خودتان زحمت بکشید بلکه کادر ورکهای مطرحی در دسترس است که میتوانید از آنان استعمال فرمائید . سازندگان این فریمورکها برای راحتی کار، ابعاد وسایل الکترونیکی را ارزیابی و گزینش کردهاند .
phones:
< 768px Tablets:
> 768px Medium
Desktops: > 99px Large
Desktops: > 1200px برای رئیس کردن پهنای موادتشکیل دهنده وبسایتتان در دستگاههای مختلف ضروری می باشد که از Max-width و Min-width استعمال نمایید . به این ترتیب میتوانید عرض همگی تگها را در گوشی موبایل جوری تهیه و تنظیم نمائید که در وسط ورقه قرار بگیرند و در شرای بخواهید در تبلتها، سمت راست سناریو داده شوند میتوانید مدیا کوئری دیگری اضافه فرمائید .
عمده افرادی که در زمین? طراحی وب سایت کار دارند، از کد ID:right استفاده میکنند که برای شما نیز قابل به کار گیری هست .
به
جز کدنویسی چه روشهایی برای ریسپانسیو کردن وبسایت وجود دارد؟ یک شیوه دیگر استفاده از افزونههای ریسپانسیوکننده تارنما هست . شما میتوانید با به کارگیری از افزونههای معروف در این زمینه، سایتتان را واکنشگرا فرمایید . یک عدد از افزونههای پر اسم و رسم افزون? Jet Pack هست . این افزونه که بیشتر از 33 ویژگی کلیدی دارااست خیلی سریع میتواند به شما امداد کند . این پلاگین کدها را دستکاری میکند و با استانداردهای ریسپانسیو مطابقت و همخوانی میدهد و سبب ساز سرعت دریافت کردن سایتتان میگردد . سادگی، آسانی و عدم نیاز به تنظیمات طولانی تر روی سرورها، قابلیت و امکان به اشتراکگذاری مطالب سایت و تولید خبرنامه، قابلیت و امکان لایک کردن محتوا، بررسی و مدیر ویژگیهای سایت، داشتن ابزارکی برای نشان دادن توئیتهای اخیر، قابلیت تولید گالری تصاویر Full screen، داشتن ویرایشگر css و . . . از ویژگیهای جالب این پلاگین است .
افزون? دیگری که وجود دارد، Wptouch میباشد . این افزونه از بهترین افزونهها برای واکنشگرا کردن وبسایت می باشد که در درحال حاضر حاضر بوسیله بیش از 5 میلیون سایت در حالا نصب و بهره برداری میباشد . سرعت این پلاگین زیاد بسیار و چه بسا بالاتر از حد ریسپانسیو میباشد . این افزونه دارنده خصوصیت جدید کشِ حرفهای میباشد که سرعت لود تارنما را هم روی گوشی ارتقا میدهد . تصاویر و استایل قالب براساس گوشیهای تلفن همراه در اندازههای گوناگون بهینه سازی می شود . این افزونه در دو گونه مجانی و مبلغی منتشر شده که نسخ? پولی پیکربندی بیشتری دارااست . اعلام کردن این نکته لازم هست که افزونه Wptouch تهیدست نسخ? وردپرس 3 .9 به بالا میباشد .
افزون? سوم برای واکنشگرا کردن سایت، افزونه Wp Mobile Detector هست . شما که مطمئن نیستید کاربرانتان از چه دسته گوشی موبایلی استعمال میکنند؟ این افزونه شایسته ترین دسته در آشنایی دستگاهی هست که می خواهد وبسایت را گشوده نماید و همگی گونه گوشی از اندروید، آی پد، ویندوز فون و . . . را تشخیص میدهد . بیش از 5000 مدل گوشی موبایل را پشتیبانی می کند و دارای 11 قالب ظاهری می باشد .
اسم افزونهی چهارم Word Press Mobile Pack 2 .1 .3 هست . این پلاگین امکان این را دارد که پکیجی از وبسایتتان را مخصوص سیستم عاملها و پلتفرمهای گوناگون فراهم نماید . این پلاگین با شش ظاهر از پیش توصیف شده در دست هست و استفاده کننده با به کار گیری از این افزونه می تواند صفح? وبسایت شما را به فیس تمام صفحه ببیند .
آخرین افزونهای که معرفی می شود WP Mobile Edition می باشد . این افزونه به شما قابلیت و امکان می دهد که ظاهر سایتتان در تلفن همراه به گونهای باشد که انگار یک تارنما منحصربهفرد برای گوشی می باشد و تماما متناسب با نسخ? موبایل، سیستم عاملهای اندروید، IOS و ویندوز فون می باشد . این افزونه یک سوئیچر دارد که به طور هوشمندانه وب سایت را هنگام باز شدن با موبایل به صورت جدیدی ریسپانسیو می کند . همچنین تم مربوط به تلفن همراه آن دوچندان ناچیز حجم میباشد و زود لود می گردد .