رفتن به مطلب
دفاعی

سایز مناسب برای طراحی نسخه موبایل سایت

پست های پیشنهاد شده

با سلام خدمت تمامی دوستان

[align=RIGHT][align=JUSTIFY]اين روزها استفاده از گوشي هاي موبايل براي مشاهده صفحات وب به سرعت در حال افزايش است و با توجه به پايين بودن سرعت اينترنت موبايلي و همچنين کوچک بودن صفحه نمايش موبايل ها، طراحي نسخه ويژه اي از وب سايت براي مرور در موبايل ها امري اجتناب ناپذير شده است. مشکلي که در اين زمينه پيش ميايد اين است که هم اکنون گوشي هاي مختلفي در بازار هستند که هر کدام رزولوشن صفحه متفاوتي را ارائه ميکنند، اما شما که نمي توانيد براي هر گوشي ، نسخه ويژه اي را طراحي کنيد. پس چه بايد کرد ؟

[/align]ما در کل 2 دسته گوشي داريم که قابليت وصل شدن به اينترنت و مرور صفحات وب را دارا هستند:

[align=LEFT]240x320.gif

[/align]

  • Feature Phones
  • Smart Phones

[/align]

گوشي هاي feature phone دسته گوشي هايي هستند که امکانات محدودي براي استفاده از اينترنت دارند و اکثرا از ساير صفحه 320x240 (و گاهي کوچکتر از اين) استفاده ميکنند. اکثر گوشيهايي که در سالهاي قبل فروخته شده اند، زيرمجموعه اين رده هستند. بطور مثال :

گوشي هاي featur [align=RIGHT]

  • سري K و C و W سوني اريکسون (320x240 معروف به QVGA)
  • سري N نوکيا اکثرا (320x240) البته سري هاي قديمي تر نوکيا مانند 6600 اکثرا (176x208)بودند.
  • وضعيت سايرين هم اکثرا (320x240) است و اين سايز به نوعي تبديل به کوچک ترين صفحه استاندارد موبايل شده است.

[/align]

[/align] [align=RIGHT]گوشي هاي اين رده اکثرا داراي مرورگر اينترنت WAP 2.0 هستند . اين مرورگر براي نمايش صفحات وب در صفحه نمايش کوچک طراحي شده است و تا حدي css 2.1 و برخي کدهاي جاوا اسکريپت را هم پشتيباني ميکرد. [/align] [align=RIGHT] [/align] [align=RIGHT] [/align] [align=RIGHT] گوشي هاي SmartPhone گوشي هايي هستند که اکثرا سايز هاي بزرگتري دارند و امکانات بيشتري از فيچر فون ها ارائه ميدهند. همچنين اين گوشي ها معمولا از سيستم عامل هاي پيشرفته تري استفاده ميکنند. گوشي هاي مبتني بر سيستم عامل Android، RIM ، winPhone و آيفون از اين نوعند. اين گوشي ها اکثرا سايزهاي صفحه زير را با خود دارند:

[/align] [align=RIGHT]گوشي هاي اين رده اکثرا داراي مرورگر اينترنت WAP 2.0 هستند . اين مرورگر براي نمايش صفحات وب در صفحه نمايش کوچک طراحي شده است و تا حدي css 2.1 و برخي کدهاي جاوا اسکريپت را هم پشتيباني ميکرد. [/align] [align=RIGHT] [/align] [align=RIGHT] [/align] [align=RIGHT] [align=RIGHT]

  • 320x480 معروف به HVGA که اکثرا توسط htc و سامسونگ و اپل (آيفون) بکار گرفته شده.

  • 360x640 معروف به nHD که اکثرا متعلق به گوشي هاي جديد نوکيا است.

  • 480x800 معروف به WVGA که اکثر گوشي هاي ويندوز 7 و برخي اندرويدي ها اين سايزي هستند.
  • سايزهاي بزرگتر معمولا صفحات وب را مانند يک لپتاپ مرور ميکنند و نيازي به نسخه ويژه موبايل ندارند.

[/align]

634361179018437500_5343006_493c4cc8bc_m.png

634361179018437500_5343006_493c4cc8bc_m.png [align=RIGHT]شما ميتوانيد يک نسخه موبايل ساده براي کل موارد بالا تهيه کنيد. اما اگر ميخواهيد کمي بيشتر سليقه به خرج دهيد ميتوانيد دو نسخه يکي براي سايز 320x240 و يکي براي 320x480 تهيه کنيد و وظيفه نمايش صفحه براي سايزهاي کوچکتر از 320x240 را به دوش نسخه 320x240 بيندازيد و سايزهاي بزرگتر را کلا بر عهده نسخه موبايل سايز 320x480 بگذاريد.

توجه داشته باشيد که بايد در هر دو حالت ، صفحه را با قابليت Fit شدن با سايز صفحه ( استفاده از درصد در اندازه ها بجاي پيکسل) پياده سازي نماييد تا سايزهاي احتمالي غير از سايزهاي معرفي شده نيز پوشش داده شوند. [/align]

نسخه CSS جداگانه براي سايز هاي کوچکتر از 480 پيکسل:

نسخه CSS جداگانه براي سايز هاي کوچکتر از 480 پيکسل: [align=RIGHT]کمپاني اپل پيشنهاد ميکند که در صورتي که ميخواهيد CSS خاصي را براي صفحات موبايل تعريف و استفاده کنيد از اين کد کمک بگيريد:

[/align] [align=LEFT]


در کد بالا شما تعريف ميکنيد که اگر سايز صفحه حداکثر 480 پيکسل بود ، از فايل iphone.css براي شکل دادن به صفحه استفاده شود. براي سايزهاي بزرگتر اين کد کار نمي کند و CSS ديگري که تعريف کرده ايد کار خواهد کرد.[/align]

در کد بالا شما تعريف ميکنيد که اگر سايز صفحه حداکثر 480 پيکسل بود ، از فايل iphone.css براي شکل دادن به صفحه استفاده شود. براي سايزهاي بزرگتر اين کد کار نمي کند و CSS ديگري که تعريف کرده ايد کار خواهد کرد.

[align=RIGHT]

[/align] [align=RIGHT]ليست رزولوشن هاي متداول در جهان

منبع : ماکرومدیاایکس

[/align]

به اشتراک گذاری این ارسال


لینک به ارسال
به اشتراک گذاری در سایت های دیگر

به گفتگو بپیوندید

هم اکنون می توانید ارسال داشته باشید و بعد ثبت نام خود را در سایت کامل نمایید. اگر حساب کاربری در سایت دارید، جهت ارسال با حساب کاربری خود هم اکنون وارد سایت شوید

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.


×
×
  • افزودن...