ابعاد استاندارد سایت: ویژگی ها، الزامات و توصیه

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

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

عرض استاندارد در پیکسل برای سایت شما همیشه نیاز

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

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

پوسته برای همه موارد

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

بنابراین به رخ کشیدن فراوانی از نسخه های برای صفحه نمایش های مختلف می توانید با این تفاوت که سایت های odnostranichniki که هدف باشد - به فروش یک محصول و مطمئن شوید که آن را به خوبی انجام. خوب، اگر شما در یکی از آن فرود نیست، یک چند سایت، آن را ایستد به همین دلیل بیشتر است.

اندازه محبوب ترین سایت های

یک مصالحه بین دو افراط و یک نقاشی از طرح برای سه یا چهار است اندازه صفحه نمایش. در میان آنها، باید یک طرح برای دستگاه های تلفن همراه است. بقیه باید برای صفحه دسکتاپ کوچک، متوسط و بزرگ اقتباس شده است. چگونه در انتخاب عرض از سایت؟ در زیر ما در حال حاضر HotLog آمار خدمات برای ماه مه سال 2017، که به ما نشان می دهد توزیع محبوبیت وضوح صفحه نمایش های مختلف از دستگاه، و همچنین به عنوان پویایی تغییر در این شاخص.

از جدول ممکن است به یاد بگیرند که چگونه برای تعیین اندازه از سایت شما می خواهید به استفاده از. علاوه بر این، می توان نتیجه گرفت که امروز رایج ترین فرمت صفحه نمایش 1366 در 768 پیکسل است. این صفحه نمایش در یک لپ تاپ بودجه نصب شده است، بنابراین محبوبیت خود طبیعی است. محبوب ترین بعدی HD کامل مانیتور است که استاندارد طلایی برای فیلم، بازی، و، بنابراین، برای ایجاد طرح بندی وب سایت است. علاوه بر این در جدول مشاهده می کنیم اجازه دستگاه های تلفن همراه 640 × 360 پیکسل، و همچنین به عنوان تجسم های مختلف از دسکتاپ و صفحه نمایش تلفن همراه پس از آن.

طراحی و طرح بندی

بنابراین، پس از تجزیه و تحلیل آمار، میتوان نتیجه گرفت که عرض بهینه از سایت دارای 4 تغییرات:

1. لپ تاپ نسخه با 1366 پیکسل عرض.
2. با کیفیت Full HD نسخه.
3. 800 پیکسل در طرح اندازه عرض برای نمایش بر روی مانیتور رومیزی کوچک است.
4. نسخه موبایل از وب سایت - 360 پیکسل در عرض.

فرض کنید ما تصمیم آنچه شما می خواهید به استفاده از اندازه از کد منبع تولید برای سایت. اما چنین پروژه هنوز هم پر هزینه باشد. بنابراین گزینه های بیشتر، این بار بدون استفاده از یک عرض ثابت در نظر بگیرید.

یک طرح انعطاف پذیر

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

نسبت طلایی چیست و چگونه به استفاده از صفحات وب را برای طرح؟

حتی در دوران رنسانس بسیاری از معماران و هنرمندان سعی کردند به خلق خود را به شکل کامل و نسبت. برای پاسخ به سوالات در مورد پیامدهای چنین نسبت، آنها را به ملکه تمام علوم تبدیل شده است - ریاضیات.

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

بیایید به بازگشت به طراحی وب سایت

این بسیار ساده است - با استفاده از نسبت طلایی، شما می توانید صفحات خواهد شد که خشنود به چشم انسان را طراحی کنند. محاسبه با توجه به فرمول از بخش طلایی، پیدا کنیم و تعداد غیر منطقی 1.6180339887 ...، اما برای راحتی شما می توانید مقدار گرد شده از 1.62 استفاده کنید. این به این معنی است که بلوک های صفحه ما باید 62٪ و 38٪ از کل، مهم نیست چه اندازه کد منبع برای سایت شما با استفاده از تولید می شود. به عنوان مثال شما می توانید در این طرح زیر را ببینید:

استفاده از فن آوری های جدید

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

چگونه برای افزایش فضای کاری سایت

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

حداکثر فضای آزاد تا در سایت که ممکن است، پنهان کردن ناوبری در منوی pop-up است. این رویکرد منطقی به استفاده از نه تنها تلفن همراه، بلکه بر روی دسکتاپ است. پس از همه، کاربر می کند در همه زمان ها لازم نیست که در چه است سرفصل را در سایت خود نگاه - آن است برای محتوای آمده است. یک کاربر بخواهد برای محترم شمرده شود.

نمونه ای از یک راه خوب برای مخفی کردن منو طرح زیر (تصویر زیر) است.

در بالا گوشه ای از قرمز منطقه، شما می توانید یک صلیب را مشاهده کنید، با کلیک بر روی منوی که در یک آیکون کوچک پنهان، ترک کاربر به تنهایی با محتوای وب سایت.

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

بهترین وب سایت - سازگار

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

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

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

طراحی پاسخگو متفاوت از سایت های تلفن همراه به طوری که در مورد اخیر، کاربر یک HTML کد دریافت می کند، متفاوت از دسکتاپ است که است. این یک نقطه ضعف از نقطه نظر بهینه سازی عملکرد سرور، و همچنین بهینه سازی موتور جستجو می باشد. علاوه بر این، سخت تر از آن می شود به در نظر گرفتن آمار در نسخه های مختلف از یک سایت است. یک رویکرد تطبیقی عاری از کاستی است.

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

شما می توانید اطلاعات بیشتر در مورد طراحی پاسخگو یادگیری و توسعه شما می توانید از کتاب.