প্রস্তাবিত ওয়েবসাইট রেজোলিউশন (প্রস্থ এবং উচ্চতা)? [বন্ধ]

123

সাধারণ ওয়েবসাইট রেজোলিউশনের কোনও মানক আছে?

আমরা কমপক্ষে 1280px প্রস্থে আরও নতুন মনিটরের লক্ষ্যবস্তু করছি, তবে উচ্চতাটি পরিবর্তিত হতে পারে এবং প্রতিটি ব্রাউজারেও বিভিন্ন টুলবারের উচ্চতা থাকতে পারে।

এটির জন্য কি কোনও ধরণের মান আছে?

browser  standards  resolution 
— Aximili
সূত্র
32
কেন এটি "গঠনমূলক নয়" হিসাবে বন্ধ ছিল? জিজ্ঞাসা করার জন্য একটি বৈধ প্রশ্ন মনে হয় এবং বিশেষত সর্বোচ্চ রেটযুক্ত এবং গৃহীত উত্তরগুলি মূল্যবান তথ্য সরবরাহ করে।
— দামন
20
আমি ড্যামনের সাথে একমত এটি একটি বৈধ প্রশ্ন এবং অনেক লোক এর উত্তর শুনতে পছন্দ করে। আমি মনে করি এস.ও. বন্ধ করার প্রশ্নে অতিমাত্রায় উদ্বেগজনক হয়ে উঠেছে।
— ওয়েবওয়ার্ম
স্ট্যাক ওভারফ্লো নিরঙ্কুশ প্রশ্নোত্তরের জন্য আরও উপযুক্ত, এটি হ'ল প্রযুক্তিগত স্টাফের একটি সুনির্দিষ্ট উত্তর রয়েছে, সেই প্রশ্নগুলিতে নয় যেখানে বিভিন্ন মতামত বৈধ হতে পারে বা সঠিক উত্তরটি ব্যবহারের ক্ষেত্রে / প্রকল্পের উপর নির্ভুলভাবে নির্ভর করে
— জুয়ান
স্ট্যাকওভারফ্লো সাইটের প্রস্থ প্রায় 1090px.odd!
— নেকটিভি
— ররি ও'কেনে

উত্তর:

221

আজকাল পরামর্শটি হ'ল:

1024x768 এর জন্য অনুকূলিত করুন । বেশিরভাগ সাইটের জন্য এটি বেশিরভাগ দর্শকদের কভার করবে। সর্বাধিক লগগুলি দেখায় যে আপনার দর্শনগুলির 92-99% প্রস্থ 1024 এর বেশি হবে। যদিও 1280 ক্রমবর্ধমান সাধারণ, এখনও 1024 এ প্রচুর রয়েছে এবং এর কিছু নীচে। এটির জন্য অপ্টিমাইজ করুন তবে অন্যকে উপেক্ষা করবেন না।

1024 = ~ 960 । স্ক্রোলবার, উইন্ডো প্রান্ত ইত্যাদির জন্য অ্যাকাউন্টিং মানে 1024x768 স্ক্রিনের আসল প্রস্থটি প্রায় 960 পিক্সেল । কিছু সরঞ্জাম সামান্য ছোট আকারের উপর ভিত্তি করে , প্রায় 940 । এটি টুইটার বুটস্ট্র্যাপের ডিফল্ট ধারক প্রস্থ ।

এক আকারের জন্য ডিজাইন করবেন না । উইন্ডোর আকারগুলি পৃথক হয়। ধরবেন না যে স্ক্রিনের আকারটি উইন্ডোজ আকারের সমান। যুক্তিসঙ্গত ন্যূনতম জন্য নকশা করুন, তবে এটি সামঞ্জস্য করুন ume

প্রতিক্রিয়াশীল ডিজাইন এবং তরল বিন্যাস ব্যবহার করুন । উইন্ডোটি পুনরায় আকার দেওয়ার সময় সমন্বিত হবে এমন বিন্যাসগুলি ব্যবহার করুন। লোকেরা এটি অনেক কিছু করে, বিশেষত বড় মনিটরের উপর। এটি কেবল সিএসএস অনুশীলন। বেশ কয়েকটি ফ্রন্ট-এন্ড ফ্রেমওয়ার্ক রয়েছে যা এটি সমর্থন করে।

প্রথম শ্রেণীর নাগরিক হিসাবে মোবাইল আচরণ করুন । আপনি সর্বদা মোবাইল ডিভাইস থেকে আরও ট্র্যাফিক পাচ্ছেন। এগুলি আরও বেশি পর্দার আকার প্রবর্তন করে। আপনি এখনও 960 এর জন্য অনুকূল করতে পারেন, তবে প্রতিক্রিয়াশীল ওয়েব ডিজাইন কৌশলগুলি ব্যবহার করার অর্থ আপনার পৃষ্ঠাটি স্ক্রিনের আকারের উপর ভিত্তি করে সামঞ্জস্য করবে।

লগ ব্রাউজার প্রদর্শন তথ্য । আপনি এই সম্পর্কে প্রকৃত সংখ্যা পেতে পারেন। আমি এখানে এবং এখানে এবং এখানে কিছু নম্বর পেয়েছি । একই ডেটা সংগ্রহ করার জন্য আপনি আপনার সাইটে রিগ করতে পারেন।

ব্যবহারকারী স্ক্রোল করবেন তাই উচ্চতার বিষয়ে খুব বেশি চিন্তা করবেন না । পুরানো যুক্তিটি ছিল যে ব্যবহারকারীরা স্ক্রোল করবেন না এবং গুরুত্বপূর্ণ কিছু "ভাঁজের উপরে" হওয়া উচিত। এটি বহু বছর আগে উল্টানো হয়েছিল। ব্যবহারকারীরা অনেক স্ক্রোল করে ।

স্ক্রিন রেজোলিউশন সম্পর্কে আরও:

প্রতিক্রিয়াশীল নকশা সম্পর্কে আরও:

প্রতিক্রিয়াশীল ডিজাইন এবং তরল বিন্যাসগুলির জন্য সরঞ্জাম এবং ফ্রন্ট-এন্ড ফ্রেমওয়ার্কগুলি:

— কার্ল ফাস্ট
সূত্র
8
আপনি যাচাই করতে চাইতে পারেন: গ্রিডে 960 পিক্সেল ব্যবহার করে ডিজাইন সম্পর্কিত 960.gs একটি সম্পূর্ণ সাইট। কৌশলটিকে "960 গ্রিড ডিজাইন" বলা হয়।
— বার্গগ্রিনডিকে
3
দেখে মনে হচ্ছে এসও 960 ব্যবহার করে কিছুই তরল না হয়ে থাকে। জাস্ট
— এফআইআই
আপনার সাইটে 800px এ অনুভূমিক স্ক্রোলিং হওয়া উচিত নয়। সম্ভবত এটি সেরা দেখাচ্ছে না, তবে এখনও সবকিছু ফিট করা উচিত।
— পালসুইম
এ সম্পর্কে কোন আপডেট? এই উত্তরটি এখন বেশ কয়েক বছর পুরনো।
— ক্র্যাশলোট
29

খারাপ ধারণা, আমি বিশ্বাস করি। বিন্যাস থেকে সামগ্রী আলাদা করার পুরো বিষয়টিটি ছিল আপনার ওয়েব পৃষ্ঠাটিকে যে কোনও ব্রাউজারে প্রদর্শিত হতে সক্ষম করা।

ন্যূনতম পর্দার আকারের মতো কৃত্রিম সীমাবদ্ধতাগুলিতে রাখলে আপনার বাজার সীমাবদ্ধ হয়ে যায়।

এটি বলার পরে, আমি বিশ্বাস করি যে প্রতিটি ডেস্কটপ 1024x768 প্রদর্শন করতে সক্ষম হবে। তবে আইফোন বা অন্যান্য স্ক্রীন-চ্যালেঞ্জযুক্ত ডিভাইসে ব্রাউজারগুলি বা ব্রাউজারের জন্য তাদের পুরো ডেস্কটপ ব্যবহার করে না এমনগুলি সম্পর্কে কী?

আপনার নির্দিষ্ট প্রশ্নের উত্তরে, না, আমি বিশ্বাস করি না যে ব্রাউজারগুলিতে ন্যূনতম বা সাধারণ প্রদর্শন ক্ষেত্রের জন্য কোনও মান আছে।

— paxdiablo
সূত্র
14
অপেক্ষা করুন, 1024x768 পুরো স্ক্রিনের আকার হতে পারে তবে এটি প্রায়শই সিস্টেম বার, উইন্ডো সজ্জা, মেনু বার, সরঞ্জাম বার, ট্যাব বার এবং সম্ভাব্য স্ক্রোল বার এবং একটি নেভিগেশন ট্যাব দ্বারা হ্রাস পায়।
— সোভান্তে
7
খারাপ পরামর্শ। কে বলেছে যে এইচটিএমএল বিন্যাসের জন্য নয়? তরল বিন্যাসগুলি 90 এর দশকের, যেখানে রেজোলিউশনের পার্থক্য তুলনামূলকভাবে কম ছিল। কোনও চাপানো প্রস্থ সীমা ছাড়াই 2560x1600 স্ক্রিনে 10pt ফন্টে কিছু পাঠ্য পড়ার চেষ্টা করুন। আপনি খুব শীঘ্রই এই তরল বিন্যাসগুলি ঘৃণা শুরু করবেন।
— ওয়াউটার ভ্যান নিফটারিক
1
@ প্যাক্স: আমার বক্তব্যটি ছিল যে খুব কম এবং খুব উচ্চতর রেজোলিউশন উভয় ক্ষেত্রেই ভাল কাজ করে এমন একটি তরল বিন্যাস নিয়ে আসা খুব কঠিন। আমি কখনও এমন কোনও ওয়েবসাইট জুড়ে আসিনি যা আমার পিডিএতে এবং একই এইচটিএমএল সহ একটি উচ্চ-রেজোলিউশন মনিটরে সুন্দরভাবে কাজ করে। সেরাগুলি বিশেষভাবে লক্ষ্যবস্তু করা হয়।
— ওয়াউটার ভ্যান নিফটারিক
1
সম্মত, তরল লেআউটগুলি সবার জন্য আরও ভাল কাজ করে। বড় স্ক্রিনগুলি অত্যধিক বড় হওয়াই একটি নন-ইস্যু কারণ এই ব্যবহারকারীরা তাদের ব্রাউজারটিকে যে পরিমাণে মাত্রা অনুসারে মাপতে পারেন।
— নাইলিটডাউন
9
তরল বিন্যাসগুলির জন্য, যারা সর্বদা একটি বড় ডিসপ্লেতে সর্বাধিক ব্রাউজার চালান তাদের জন্য উপরের সীমা স্থাপনের জন্য আপনি সর্বদা সর্বোচ্চ প্রস্থ সেট করতে পারেন।
— রিচার্ড
8

আপনার ব্যবহারকারীকে অনুভূমিকভাবে স্ক্রোল করতে বাধ্য করা একটি গুরুতর ইউআই লঙ্ঘন। আপনি যদি কোনও নির্দিষ্ট পর্দার আকারের জনসংখ্যার জন্য নির্দিষ্টভাবে কোনও ওয়েব সাইট তৈরি না করেন তবে আপনার সুরক্ষা নিশ্চিত করা আপনার নকশাটি 800 পিক্সেল প্রস্থের মতো ছোট পর্দার সাথে কাজ করে (মেমরিটি সঠিকভাবে পরিবেশন করলে ওয়েব সার্ফিং জনসংখ্যার প্রায় 8%)। এটি বড় স্ক্রিনের সাথে ভালভাবে খাপ খাওয়ানো বুদ্ধিমানের কাজ তবে লোকেরা এখনও 800x600 এ সার্ফিং করে ব্যয় করে না।

এখানে আরও একটি বিষয় বিবেচনা করার বিষয় রয়েছে: প্রত্যেকেই তাদের ব্রাউজারকে পূর্ণ স্ক্রিনে চালায় না (আমি করি না)। সুতরাং এই ধারণাটি যদি নির্দিষ্ট (এবং বৃহত্তর) "স্ক্রিন সাইজের" জন্য ডিজাইন করা ঠিক হয় তবে বেশ কয়েকটি কারণে সত্যই কাজ করে না।

12/15/2010-এ আপডেট করুন: আমি যখন প্রথম এই প্রশ্নের উত্তর দিয়েছিলাম তখন ৮০০ পিক্সেল উপযুক্ত উত্তর ছিল। যাইহোক, এই মুহুর্তে, আমি 1024 পিক্সেল প্রশস্ত (বা অন্য কেউ হিসাবে 960) সুপারিশ করব। প্রযুক্তি মার্চ ...

— মার্ক ব্রিটিংহ্যাম
সূত্র
আমি বক্তব্যটি প্রসারিত করব সম্ভবত বলব যে বহু-দিকনির্দেশক স্ক্রোলকে বাধ্য করা সম্ভব লঙ্ঘন। সঠিকভাবে করা গেলে হোরি-স্ক্রোল দুর্দান্ত হতে পারে। deanoakley.com thehorizontalway.com/html/css/urban-outfitters
— টাইপনেয়ার
2
আমাদের কী-বোর্ডের দুটি নতুন কী, "পৃষ্ঠা বাম" এবং "পৃষ্ঠা ডান" দরকার।
— paxdiablo
@TypeOneError, যদিও এটি ব্রাউজ করা ভাল মনে হয় না, এটি প্রাকৃতিক নয়।
— UnkwnTech
@TypeOneError, পোর্টফোলিও সাইটটি এর "ঝরঝরে" এবং নকশাটি কতটা পরিষ্কার ছিল সে কারণে এটি ভাল প্রভাব ফেলেছিল। তবে আমি আনকনটেকের সাথে একমত যে এটি ঠিক মনে হচ্ছে না। এই বিষয়টি উল্লেখ না করে যে বেশিরভাগ ব্যবহারকারীর একটি উল্লম্ব স্ক্রোল হুইল থাকবে এবং একটি অনুভূমিক একটি থাকবে না। এটি একা অনুভূমিক স্ক্রোলিংকে একটি খারাপ ধারণা করে।
— এরিক
@ এরিক, আমার স্ক্রোল হুইলটি লিঙ্কযুক্ত দুটি সাইটে অনুভূমিকভাবে স্ক্রোল করে। আমি পোর্টফোলিওগুলির মতো জিনিসগুলির জন্য বলব যেখানে আপনি মনোযোগ আকর্ষণ করতে এবং একটি আর্টসির স্টাইল প্রদর্শন করতে চান এটি আলাদা হওয়া ঠিক আছে। তবে সাধারণত এটি কোনও ব্যবহারকারীর জন্য বিভ্রান্তিকর হবে
— monkeypushbutton
4

এখানে ২০০৮ সালে ব্রাউজার প্রদর্শনের পরিসংখ্যান রয়েছে: http://www.w3schools.com/browsers/browsers_display.asp

প্রায় 50% ব্যবহারকারী এখনও 1024x768 ব্যবহার করছেন। আপনি যদি চান যে উচ্চ সাইটগুলিতে আপনার সাইটটি দেখতে সুন্দর লাগবে তবে নমনীয় বিন্যাসটি ব্যবহার করুন।

— অ্যাডাম ডিজেেন্ডজিয়েল
সূত্র
মনে রাখা সেরা যে ডাব্লু 3 স্কুলগুলির পরিসংখ্যানগুলি তাদের সাইটে যাওয়া লোকদের জন্য। এটি বেশিরভাগই ওয়েব পৃষ্ঠাগুলি বিকাশকারী লোক হবে যা জনসংখ্যার যথাযথ ক্রস বিভাগ নয়। তাদের ব্রাউজারের পরিসংখ্যান দেখে, ফায়ারফক্স 44% এবং আইআই 46%। সাধারণ ওয়েবটি गेজ করার জন্য সম্ভবত কোনও ভাল নমুনা নয়।
— কিব্বি
3

প্রস্থের জন্য শিল্পের মানগুলি রয়েছে (কমপক্ষে ইয়াহু অনুসারে)। তাদের সমর্থিত প্রস্থগুলি 750, 950, 974, 100%

তাদের পূর্বনির্ধারিত গ্রিড (কলাম লেআউট) এর জন্য এই প্রস্থগুলির সুবিধাগুলি রয়েছে যা যদি আপনি কোনওটি অন্তর্ভুক্ত করেন তবে বিজ্ঞাপনগুলির জন্য স্ট্যান্ডার্ড মাত্রাগুলির সাথে ভাল কাজ করে।

আকর্ষণীয় আলোচনা খুব মূল্যবান।

দেখতে Yui বেজ

— Simon_Weaver
সূত্র
আপনি যে আলোচনার কথা বলেছেন তার একটি লিঙ্ক যুক্ত করতে পারেন?
— শ্রী কাদিমিসেটি
3

এখানে একটি দুর্দান্ত সরঞ্জাম: গুগল ল্যাবস ব্রাউজারের আকার

— Plynx
সূত্র
লিঙ্কটি মারা গেছে। এটি এখন গুগল অ্যানালিটিকার অংশ, কেবলমাত্র শ্রোতাদের> প্রযুক্তি> ব্রাউজার এবং ওএস> এর অধীনে লগইন সহ অ্যাক্সেসযোগ্য "স্ক্রিন রেজোলিউশন" নির্বাচন করুন।
— ডেভ লিপম্যান
2

আমি বলব যে আপনার কেবলমাত্র 800x600 রেজোলিউশন সহ ব্যবহারকারীদের একটি মনিটরের আশা করা উচিত। কানাডিয়ান সরকারের মান রয়েছে যা এটিকে প্রয়োজনীয়তার একটি হিসাবে তালিকাবদ্ধ করে। এটি অভিনব ওয়াইডস্ক্রিন মনিটর সহ কারও কাছে কম মনে হলেও, মনে রাখবেন যে প্রত্যেকেরই সুন্দর মনিটর নেই। আমি এখনও 1024x768 এ চালানো প্রচুর লোককে জানি। 8008x600 এর মধ্যে যারা চলছে, বিশেষত সস্তার ওয়েব ক্যাফেগুলিতে ভ্রমণের সময় এটি চালানো মোটেই অস্বাভাবিক নয় c এছাড়াও, আপনি না চাইলে আপনার ব্রাউজারের উইন্ডোটিকে পূর্ণ স্ক্রিন তৈরি করতে পেরে খুব ভাল। আপনি আরও বৃহত্তর মনিটরে সাইটকে আরও বিস্তৃত করতে পারেন, তবে ব্যবহারকারীকে অনুভূমিকভাবে স্ক্রোল তৈরি করবেন না। কখনো। নিম্ন রেজোলিউশনগুলিকে সমর্থন করার আরেকটি সুবিধা হ'ল আপনার সাইটটি মোবাইল ফোনগুলিতে এবং নিন্টেন্ডো উই'র কাজ অনেক সহজ করবে।

আপনার কমপক্ষে 1280 প্রশস্ত একটি নোট, আমাকে এভাবে যেতে হবে over সর্বাধিক 17 এবং এমনকি আমার 19 ইঞ্চির নন ওয়াইডস্ক্রিন মনিটরগুলি কেবল 1280x1024 সর্বাধিক রেজোলিউশনকে সমর্থন করে। এবং এখন আমি যে 14 ইঞ্চির ওয়াইডস্ক্রিন ল্যাপটপটি টাইপ করছি তা কেবল 1280 পিক্সেল জুড়ে। আমি বলব যে আপনার পক্ষে সর্বনিম্ন সর্বনিম্ন রেজোলিউশনের জন্য চেষ্টা করা উচিত সেটি হল 1024x768, তবে 800x600 আদর্শ হবে।

— Kibbee
সূত্র
2

এখন পর্যন্ত সমস্ত উত্তর ডেস্কটপ মনিটরের সম্পর্কে কথা বলেছে, তবে আমি আমার আইফোনে স্ট্যাক ওভারফ্লো ব্যবহার করছি এবং আমার মনে হয় না যে আপনার কোনও মোবাইল প্ল্যাটফর্ম 1024 বা 1280 অনুভূমিক পিক্সেল লক্ষ্য করে বাদ দেওয়া উচিত। আপনার পৃষ্ঠাটি চিহ্নিত করুন যাতে ব্রাউজারটি এর অর্থ কী তা জানে এবং এটিকে ব্যবহারযোগ্য করে তোলা সহজ করে দেবে, এমনকি স্ক্রিন পাঠক এবং অন্যান্য কিট এমনকি আপনি ভাবেননি।

ব্রাভো, আপনি আমার সাথে একমত হওয়ার পর থেকেই উজ্জীবিত :-) যদিও এটি সম্পর্কে দু'পক্ষের মনে থেকে আপনি আমার চেয়ে বেশি ভোট পেতে পারেন :-( আচ্ছা ভাল, সি'স্ট লা ভি।
— প্যাক্সিডিয়ালো
দৃশ্যত আইফোন কীবোর্ড দিয়ে এই প্রতিক্রিয়া টাইপ করার জন্য +1। ;) আইফোনটির সাফারি, ফিউইউউ সহ আমার ওয়েবসাইটটি 1024 এ দুর্দান্ত দেখাচ্ছে।
— টাইপনেয়ার
আইফোনটির সাথে আমি মনে করি এটি আপনি কীভাবে
— ধরেছেন
1
@TypeOneError আমি কেবল এটি আইফোনে টাইপ করিনি, আমি পাব থেকেও ফিরে
@ প্যাক্স নং, স্পষ্টতই আমি করব না। ;-)
1

কোনও নির্দিষ্ট রেজোলিউশনকে টার্গেট না করা, তবে অনেকগুলি বিভিন্ন রেজোলিউশনে সহজেই মানিয়ে নেওয়া ভাল।

— Nate879
সূত্র
1

আমরা যে নির্দেশিকা ব্যবহার করি, যা মোটামুটিভাবে বহুল ব্যবহৃত বলে মনে হয় এবং আমরা গুগল অ্যানালিটিক্স থেকে প্রাপ্ত পরিসংখ্যানগুলির ব্যাক আপ করা হয় সেগুলি সাইটটি ডিজাইন করতে হয় যাতে এটি 1024 পিক্সেল প্রশস্ত এবং 768 পিক্সেল উচ্চতার স্ক্রিনে কাজ করবে (1024x768) এবং 1280x800 হল সবচেয়ে সাধারণ রেজোলিউশন যা আমরা দেখি, সমস্ত ট্র্যাফিকের কমপক্ষে 70% হিসাবে অ্যাকাউন্টিং)।

এজন্য আপনি অনেকগুলি সাইট (এটি অন্তর্ভুক্ত রয়েছে) দেখতে পান যা একটি কেন্দ্রীয় কলাম প্রায় 1000 পিক্সেল প্রশস্ত এবং শীর্ষস্থানীয় 500-600 পিক্সেলের সর্বাধিক গুরুত্বপূর্ণ বিষয়বস্তু সহ ব্যবহার করে থাকে যাতে এই আকারের পর্দায় দেখার সময় এটি ভাঁজের উপরে থাকে।

1000 পিক্সেলের প্রশস্ত লেআউটটি ব্যবহার করা প্রায় 1680 পিক্সেল প্রস্থের স্ক্রিন আকারে মোটামুটি ভাল কাজ করে (সাধারণত 17 টির চেয়ে বেশি ল্যাপটপে আপনি দেখতে পাবেন) তবে 1920 পিক্সেলটিতে কিছুটা নিরীহ চেহারা শুরু করবেন না বিস্তৃত (উচ্চ প্রান্তের কম্পিউটারগুলি, সাধারণত ওয়ার্কস্টেশনগুলি), তবে এই উচ্চতর রেজোলিউশনগুলি সাধারণ ইন্টারনেটের ট্র্যাফিকের একটি বিশাল শতাংশের জন্য নয় - 2% বা তার চেয়ে কম (অন্যদিকে, যদি আপনার কাছে এই সাইটের মতো বিশেষজ্ঞের শ্রোতা থাকে তবে , উচ্চ রেজোলিউশন সহ চিত্রটি কিছুটা বেশি হতে পারে)।

— গ্রেগ বিচ
সূত্র
যদি আপনি নিম্ন-ভোট দিয়ে থাকেন তবে দয়া করে কেন একটি মন্তব্য যুক্ত করুন।
— গ্রেগ বিচ
1

যদিও সেরা প্রস্থটি 1024 এর মধ্যে আপনাকে বিভিন্ন ব্রাউজার সেটিংসের জন্য অ্যাকাউন্টের জন্য উচ্চতা সামঞ্জস্য করতে হবে (নেভিগেশন সরঞ্জামদণ্ড, বুকমার্ক টুলবার, স্ট্যাটাস সরঞ্জামদণ্ড, ইত্যাদি) এবং টাস্কবার সেটিংসের জন্য অ্যাকাউন্ট। এটি দ্রুত 768 কে প্রায় 550-এ নামিয়ে ফেলবে।

— কালো বিড়াল
সূত্র
1

আপনার টার্গেট ব্রাউজারের আকার যাই হউক না কেন, উপরের মতো ব্রাউজারের সরঞ্জাম বার, স্ট্যাটাস বার এবং স্ক্রোল বারগুলির জন্য স্থান অন্তর্ভুক্ত করার বিষয়টি নিশ্চিত করুন। ইন্টারনেট এক্সপ্লোরার (আইএমই) এর প্রায়শই সরঞ্জামদণ্ড এবং স্থিতি বারগুলিতে 100px এর বেশি উল্লম্ব স্থান থাকে। সাধারণত, যদি আমি 1024 x 768 এর জন্য শুটিং করি তবে আমি নিরাপদ থাকার জন্য প্রায় 960 - 980px প্রশস্ত এবং 600px উচ্চের একটি নকশা তৈরি করার চেষ্টা করব। এইভাবে আপনি প্রয়োজনে স্ক্রোলিং এবং কিছু সুন্দর সাদা জায়গা (যদি নকশার প্রয়োজন হয়) accom আপনার সুনির্দিষ্ট আকারগুলি লক্ষ্য করতে হবে এমন দৃষ্টান্তগুলির জন্য আমি উচ্চতর YUI গ্রিডগুলির পরামর্শ দিচ্ছি:

YUI গ্রিড

— typeoneerror
সূত্র
1

আমি ডিজাইনারদের কাছ থেকে কেবল প্রস্থই নয়, 'সমস্ত কিছুর উপরে রাখার' জন্য কী উচ্চতা ব্যবহার করতে হবে সে সম্পর্কে অনেকগুলি প্রশ্ন পেয়েছি। আমি সম্প্রতি একটি উত্তর এখানে দিয়েছি -

প্রস্থের জন্য, আমি ডিজাইনার নই তবে আমি পড়েছি যে 960px প্রস্থটি এই দিনগুলিতে যাওয়ার উপায়, কারণ এটি নিজেকে সুন্দর দেখায় এমন কলামগুলিতে বিভক্ত করার জন্য ধার দেয় এবং বেশিরভাগ ডিসপ্লেতে সুন্দরভাবে ফিট করে। আপনি যদি পারেন তবে একটি তরল বিন্যাস ডিজাইন করুন - তবে এটি আপনার ডিজাইনার, আপনার সিএসএস দক্ষতা, চিত্রগুলি এবং পাঠ্যের পরিমাণের উপর নির্ভর করে সর্বদা ব্যবহারিক নয়।

(আপনি সর্বদা চান প্রতি লাইনে 65-80 টি অক্ষর থাকতে হবে, প্রায় 1.15 লাইন-উচ্চতা সহ)। এটি পাঠ্যের জন্য সর্বোত্তম কলামের প্রস্থ এবং এটি খুব প্রশস্ত বা সংকীর্ণ কলামগুলির চেয়ে পড়ার পক্ষে আরও দ্রুত এবং মনোরম বলে প্রমাণিত হয়েছে)

'ভাঁজ উপরে' হিসাবে, আমি শুধু ওয়েবে এই জাতীয় ধারণা ব্যবহার বিরুদ্ধে সতর্কতা অবলম্বন করতে হবে। অনুভূমিক স্ক্রোলিং এড়াতে পারে এবং এড়ানো উচিত, তবে উল্লম্ব স্ক্রোলিং এমন একটি জিনিস যা আপনি 100% এড়াতে পারবেন না। আমি আপনাকে কেবল এটিই বলতে পারি যে 1024x768 ডিসপ্লেতে (কমপক্ষে 95% ব্যবহারকারীর কাছে বা তার বেশি থাকে) আপনার একটি নির্দিষ্ট 600px উচ্চ ব্লকের সাথে ঠিক থাকতে হবে। তবে সেখানে অনেকগুলি ভিন্ন ডিসপ্লে ফর্ম্যাট রয়েছে, ব্রাউজার ক্রোম প্রচুর পরিমাণে জায়গা নিতে পারে এবং সবাই ব্রাউজার উইন্ডো সর্বাধিক করে না।

এখানে আরও কিছু সাইট রয়েছে যা কম-বেশি বা একই জিনিস বলে - তবে সবার জন্য একেবারে 'ভাঁজের উপরে' পাওয়ার পরিকল্পনা করা শক্ত কারণ কারণ তখনকার পরিসংখ্যান অনুসারে আপনার কেবল 400px বা তাই হতে পারে।

এবং পরিশেষে একটি ভাল দীর্ঘ নিবন্ধ যা দুর্দান্ত বিশদে চলে যায় (আমি আরও পোস্ট করব তবে এসও বলেছে যে আমি খুব ন্যুব্দি) - ব্রাউজারের আকারগুলির জন্য কীভাবে ডিজাইন করতে হয় - baekdal.com

— sbeam
সূত্র
1

পৃষ্ঠাগুলির মাঝখানে কেন্দ্রীভূত হয়ে আমি ব্যক্তিগতভাবে সর্বদা সর্বোচ্চ 1000px প্রস্থে আটকে গিয়েছি (মার্জিন বাম / ডানদিকের মাধ্যমে: অটো)।

আপনি যদি 1024x768 এর চেয়ে কম কিছুতে ছুটে চলেছেন তবে আপগ্রেড করার সময় এসেছে। সিরিয়াসলি। এটি প্রায় 2010. আপনি 1280x1024 এর নেটিভ রেস সহ দর কষাকষি এলসিডি মনিটর কিনতে পারেন।

— Sneakyness
সূত্র
এটি যুক্ত করার জন্য, আমি এই কালো শুক্রবারে 150 ডলারে মাত্র 23 ইঞ্চি ওয়াইডস্ক্রিন 1080p (1920x1080) এলসিডি স্ক্রিন কিনেছি।
— স্নিগ্ধতা
2
আমি বুঝতে পারছি না কীভাবে বিকাশকারীর পর্দা প্রশ্নটির কোনও গুরুত্ব আছে? এটি দেখার ওয়েবসাইটটি কী গুরুত্বপূর্ণ যে আমি এটি দেখতে গুরুত্বপূর্ণ? আরও ভাল মনিটর বা একাধিক মনিটরের জন্য এটির জন্য একটি ভাল পুনঃসংশ্লিষ্ট হওয়ার কারণ।
— বার্গগ্রিনডিকে
1

আমি আপনাকে মিডিয়া-কোয়েরিগুলিতে একবার দেখে পরামর্শ দিই। এটি সিএসএসে একটি দরকারী নতুন সংযোজন যা সত্যই এতটা অর্থবোধ করে, আপনি ভাববেন কেন আগে এই ওয়াইয়ে বাস্তবায়ন করা হয়নি। মূলত এটি আপনাকে সিএসএসের মাধ্যমে ব্রাউজারের বৈশিষ্ট্যগুলি (যেমন সর্বোচ্চ এবং ন্যূনতম প্রস্থের মতো) লক্ষ্যবস্তু করতে এবং সেখান থেকে আপনার বিন্যাস কোডটি শাখা করার অনুমতি দেয়। মুদ্রণের স্টাইলশিট তৈরি করার অনুরূপ, আপনি একই ফাইলের সমান্তরালে আপনার ডেস্কটপ এবং মোবাইল লেআউটগুলি তৈরি করতে পারেন, যা বিকাশের জন্য গাধাটিকে লাথি দেয়।

— জেসি
সূত্র
1

নমনীয় বা তরল লেআউটগুলি ডিজাইনটিকে সামান্যই পুনরুদ্ধার করে example

আমি বরং সাইটের জন্য বিভিন্ন সিএসএস লেআউট তৈরি করব এবং ব্যবহারকারীর রেজোলিউশনের উপর নির্ভর করে সেগুলি প্রয়োগ করতে পারি, বা যদি এটি সম্ভব না হয় (এখনও এটিতে খনন করা হয়নি), এটি একটি পছন্দনীয় বিকল্প হিসাবে তৈরি করুন।

— মাইক
সূত্র
1

ঠিক আছে, আমি এখানে অনেক ভুল তথ্য দেখতে পাই। প্রারম্ভিকদের জন্য, একটি নির্দিষ্ট রেজোলিউশন ব্যবহার করে একটি ওয়েব পৃষ্ঠা তৈরি করা, উদাহরণস্বরূপ 800x600 বলুন, কেবলমাত্র সেই রেজোলিউশনটি ব্যবহার করেই পৃষ্ঠাটি যথাযথভাবে রেন্ডার হয়ে যায়! যখন একই পৃষ্ঠাটি অন্য কারও ল্যাপটপে বা হোম পিসি মনিটরে প্রদর্শিত হবে, পৃষ্ঠাটি সেই পর্দার বর্তমান রেজোলিউশন ব্যবহার করে প্রদর্শিত হবে, পৃষ্ঠাটি ডিজাইনের সময় আপনি যে রেজোলিউশন ব্যবহার করেছিলেন তা নয়। একটি নির্দিষ্ট রেজোলিউশনের জন্য ওয়েব পৃষ্ঠাগুলি তৈরি করবেন না! ওয়েব ডিজাইনের সাথে কোনও অস্তিত্ব নেই বলে একটি "দৃশ্যের সাথে সমস্ত কিছু ফিট করে" এমন প্রত্যাশা করার জন্য অনেকগুলি ভিন্ন অনুপাত এবং স্ক্রিন রেজোলিউশন রয়েছে। সমাধানটি এখানে রয়েছে: রেজুলেশন অভিযোজ্য কোড তৈরি করতে CSS3 মিডিয়া ক্যোয়ারী ব্যবহার করুন। এখানে একটি উদাহরণ:

@media screen and (max-width: 800px) {
styles
}
@media screen and (max-width: 1024px) {
styles
}
@media screen and (max-width: 1280px) {
styles
}

দেখুন, আমরা কেবল যা করেছি তা হল 3 টি স্টাইলের সেট যা বিভিন্ন রেজোলিউশনে রেন্ডার হয়। আমাদের উদাহরণের ক্ষেত্রে, যদি কোনও স্ক্রিনের রেজোলিউশন 800px এর চেয়ে বড় হয়, তবে পরিবর্তে 1024 এর সিএসএস কার্যকর করা হবে। তেমনি, সামগ্রীটি প্রদর্শিত পর্দাটি যদি 1224px হয়, তবে 1280 কার্যকর করা হবে যেহেতু 1224 1024-এর চেয়ে বেশি বড়। আরেকটি বিষয় মনে রাখবেন তা হ'ল একই রেজোলিউশন সহ সমস্ত মনিটরের আকারের স্ক্রিন একই থাকে না। আপনি পাশাপাশি লাগতে পারেন 15.4 ল্যাপটপগুলি, উভয়ই একই দেখায়, উভয়েরই বেশ আলাদা রেজোলিউশন থাকতে পারে, যেহেতু সমস্ত পিক্সেল বিভিন্ন এলসিডি স্ক্রিনে একই আকারের নয়। সুতরাং, মিডিয়া ক্যোয়ারীগুলি ব্যবহার করুন এবং উচ্চতর রেজোলিউশন, বিশেষত 1280+ সহ একটি ল্যাপটপ স্ক্রিন দিয়ে আপনার ওয়েবসাইট তৈরি শুরু করুন। এছাড়াও, আপনার ল্যাপটপে আলাদা রেজোলিউশন ব্যবহার করে প্রতিটি মিডিয়া ক্যোয়ারী তৈরি করুন create আপনি 800x600 কে সামঞ্জস্য করতে এবং সেই রেজিসে একটি মিডিয়া ক্যোয়ারী তৈরি করতে আপনার রেজোলিউশন সেটিংস ব্যবহার করতে পারেন এবং তারপরে 1024x768 এ স্যুইচ করুন এবং সেই রেজিসে অন্য একটি মিডিয়া ক্যোয়ারী তৈরি করুন। আমি চালিয়ে যেতে পারতাম, তবে আমার মনে হয় আপনারা ছেলেদের বিষয়টি পাওয়া উচিত।

আপডেট: মিডিয়া ক্যোয়ারী ব্যবহার করার জন্য এখানে একটি লিঙ্ক রয়েছে যা আরও ব্যাখ্যা করতে সহায়তা করবে, মিডিয়া কোয়েরি সহ মোবাইল ডিভাইসের জন্য উদ্ভাবনী ওয়েব ডিজাইন

এই টিউটোরিয়ালটি আপনাকে সমস্ত ডিভাইসের জন্য কীভাবে ডিজাইন করতে হবে তা দেখাবে। মিডিয়া কোয়েরিগুলির জন্য বিশেষভাবে টিউটোরিয়াল রয়েছে। আমি কোনও সাবডোমাইন এবং কেবল সিএসএস ব্যবহার করে সমস্ত ডিভাইস, সমস্ত পর্দা এবং সমস্ত রেজোলিউশন রেন্ডার জন্য পুরো সাইটটি বিকাশ করেছি! আমি এখনও ট্যাবলেট এবং স্মার্ট ফোনগুলির সমর্থন নিয়ে কাজ করছি। সাইটটি কোনও ল্যাপটপ, বা আপনার 50 ইঞ্চি এলসিডি টিভিতে পুরোপুরি রেন্ডার করে এবং অনেক পৃষ্ঠা সমস্ত মোবাইল ডিভাইসে নিখুঁতভাবে কাজ করে। আপনি যদি আপনার সমস্ত কোড পৃষ্ঠাতে রাখেন, তবে আপনার পৃষ্ঠাগুলি দ্রুত বিদ্যুত্ লোড করবে! এছাড়াও, CSS "ব্যাকগ্রাউন্ড-সাইজ: কভার" সম্পর্কে সেই নিবন্ধে আলোচনায় মনোযোগ দিতে ভুলবেন না; বা "সমন্বিত" বৈশিষ্ট্যগুলি এগুলি আপনার পটভূমির গ্রাফিক্সকে তরল করে তুলবে এবং সমস্ত রেজোলিউশনে পুরোপুরি রেন্ডার করতে সক্ষম হবে।

সাইটের টিউটোরিয়ালগুলি অনুসরণ করুন এবং আপনি একটি একক ওয়েব পৃষ্ঠা তৈরি করতে পারেন যা সবকিছু এবং যে কোনও কিছুতে রেন্ডার করে!

— djdaniel150
সূত্র
0

সর্বনিম্ন প্রস্থ হিসাবে 1024 লক্ষ্য করার চেষ্টা করুন। এটি 800 এর মতো দেখতে কী করে চেষ্টা করুন তবে সেই কাজটি করার জন্য খুব বেশি বিরক্ত করবেন না। 800x600 এ প্রায় কোনও বড় ওয়েবসাইট কাজ করছে না, তাই এই রেজুলেশনে কাজ করা লোকেরা যে কোনওভাবেই সর্বদা সমস্যা হতে চলেছে।

আপনি যদি তরল বিন্যাসের জন্য যাচ্ছেন, তা নিশ্চিত করুন যে পাঠ্যটি খুব প্রশস্ত হবে না , কারণ যখন লাইনগুলি দীর্ঘ হয়, তখন সেগুলি পড়া শক্ত হয়ে যায়। বেশিরভাগ ওয়েবসাইটের একটি নির্দিষ্ট প্রস্থ থাকায় এটিই মূল কারণ।

— ওয়াটার ভ্যান নিফটারিক
সূত্র
আমি উভয় দফার সাথে সম্পূর্ণ একমত আমি প্রায় 960 প্রশস্ত (তাই 1024x768 স্ক্রিনের জন্য) যেতে পারি। ওয়েব ডিজাইনারদের অবশ্যই লাইন দৈর্ঘ্য খুব বেশি দীর্ঘ না হয় তা নিশ্চিত করতে হবে, অন্যথায় এটি পড়া সত্যিই কঠিন।
— ফিলিপ মর্টন
0

আমি 1024 পিক্সেল মনিটরকে লক্ষ্য করি (তবে সেই জায়গার 100% ব্যবহার করি না)। 800x600 এর সাথে আমি তাদের ছেড়ে দিয়েছি। আমি বরং কিছু লোককে প্রয়োজন হলে তাদের স্ক্রল তৈরি করে পুরানো হার্ডওয়্যার দিয়ে শাস্তি দেব, বনাম স্থান নষ্ট করে নতুন সরঞ্জাম দিয়ে প্রত্যেককে শাস্তি দেওয়ার বিরুদ্ধে।

আমি মনে করি এটি আপনার শ্রোতা এবং আপনার অ্যাপের প্রকৃতির উপর নির্ভর করে।

— ইজে ব্রেন্নান
সূত্র
0

শেষ পর্যন্ত, এটি মার্কআপের জন্য মানক বা সর্বোত্তম অনুশীলনের বিষয় নয়, বরং আপনার শ্রোতাদের জানা এবং আপনার ওয়েবসাইটটি আপনি এটি করতে চান তা নিশ্চিত করে তা নিশ্চিত করে।

স্ক্রিন রেজোলিউশনের চেয়ে ব্রাউজার ভিউপোর্টের প্রস্থ বিবেচনা করা আরও গুরুত্বপূর্ণ - আপনি ধরে নিতে পারবেন না যে কোনও ডিসপ্লেতে থাকা প্রতিটি পিক্সেল ব্রাউজারে বরাদ্দ করা হবে (এবং তা হলেও আপনাকে ব্রাউজার ক্রোম বিয়োগ করতে হবে)। আপনার যদি এমন বিশ্লেষণ বিশ্বে অ্যাক্সেস রয়েছে যা ব্রাউজারের প্রস্থের ( এনবি ব্রাউজারের প্রস্থ নয়, স্ক্রিন রেজুলেশন নয়) রিপোর্ট করে তবে খুব ঘনিষ্ঠ মনোযোগ দিন।

ভিউপোর্টের বিস্তৃত সম্ভাব্য পরিসীমা সামঞ্জস্য করার চেষ্টা করা ভাল তবে কিছু সীমাবদ্ধতা রয়েছে। কিছু চ্যালেঞ্জগুলি সিএসএস মিডিয়া ধরণের মাধ্যমে পরিচালনা করা যায় , কিছু করতে পারে না। কিছুতে তরল বিন্যাসের সাহায্যে পরিচালনা করা যায়। তবে তরল লেআউটগুলি সমস্ত পরিস্থিতিতে কাজ করতে পারে না, তথ্যের ধরণের উপর নির্ভর করে লাইন দৈর্ঘ্য, পড়া আরাম ইত্যাদির উপর নির্ভর করে কিছু তরল বিন্যাস প্রশস্ত প্রদর্শনগুলিতে কাজ করে না। বেশিরভাগ বিরতি যখন নির্দিষ্ট প্রস্থের নীচে আকার দেওয়া হয় ইত্যাদি

আমি ব্যক্তিগতভাবে ভিউপোর্টগুলি ~ 960 পিক্সেল এবং তার চেয়ে বেশি নকশা করতে চাই, আপনি সর্বদা এটি করতে পারবেন না। সুতরাং কিছু ক্ষেত্রে, ভিউপোর্ট <= 760 পিক্সেল বা তার জন্য (800 পিক্সেল প্রশস্ত ডিসপ্লে, সর্বাধিক) ডিজাইনের জন্য এটি এখনও সবচেয়ে নিরাপদ - যদিও আমরা অবশেষে একবারে এবং সকলের জন্য এই সীমাবদ্ধতা টস করতে পারি - ডেস্কটপের জন্য কমপক্ষে - খুব দ্রুত এগিয়ে আসছে।

যেখানে রূপান্তরগুলি একটি সমস্যা - এবং আপনার একটি নির্দিষ্ট প্রস্থের বিন্যাস রয়েছে - 6060০ তম পূর্বের যে কোনও জায়গায় "কা-চিং" যাওয়ার জন্য নগদ রেজিস্ট্রারের জন্য ব্যবহারকারীকে যে কোনও ক্লিক করতে হবে এমন কোনও কারণ রাখার জন্য আপনার কাছে আরও ভাল কারণ আছে better পিক্সেল।

প্রাথমিক নেভিগেশনের জন্য ডিট্টো।

অবশেষে, আপনি নিজের হাত পেতে পারেন এমন সমস্ত ক্ষেত্রে আপনার বিন্যাসটি পরীক্ষা করুন। মস্ত. ছোট। ডেস্কটপ. হ্যান্ডহেল্ড। কাজগুলো. বিকল্প নেই।

— PartialOrder
সূত্র
0

আমি যে সমস্ত ক্লায়েন্ট সাইটগুলিতে অ্যাক্সেস করেছি সেগুলি থেকে আমি কেবলমাত্র স্ক্রিন রেজোলিউশনের নমুনা নিয়েছি, এরপরে আরও বেশি 20 টির বেশি রয়েছে তবে 8 টি শিল্পে এখানে ফলাফল রয়েছে:
Alt পাঠ্য http://unkwndesign.com/so/percentScreenResolutions.png
এর ভিত্তিতে আমি বলতে চাই এটি নিশ্চিত করে যে এটি 1024x768 তে ভাল দেখাচ্ছে কারণ এটি দীর্ঘ শট দ্বারা এখানে সংখ্যাগরিষ্ঠ। উচ্চতা সম্পর্কেও ততটা চিন্তা করবেন না, তবে আপনার ডিফল্ট ফন্টের আকারে 1-2 পৃষ্ঠা মুদ্রিত পৃষ্ঠাগুলি বেশি তৈরি করা এড়াতে চেষ্টা করুন, বেশিরভাগ লোকেরা একটি পৃষ্ঠা দীর্ঘই পড়তে পারবেন না, এবং যদি কোনও ব্যবহারকারী কোনও সরঞ্জামদণ্ড ইনস্টল করে যেটি গ্রহণ করে উল্লম্ব স্থান, আমার ব্যক্তিগত অগ্রাধিকার হ'ল এটি তাদের সমস্যা, তবে আমি মনে করি না যে এটি কোনও চুক্তির চেয়ে বড়।

* লক্ষ করুন যে গোল করার কারণে শতাংশটি 100.05% পর্যন্ত যোগ করে।

— UnkwnTech
সূত্র
0

মনে রাখবেন যে রেজোলিউশনটি যত বেশি হবে, ইন্টারনেট ব্রাউজারটি সর্বাধিকতর হবে।

এবং কিছু ব্রাউজারের পাশ্বর্ীয় বারগুলিও রয়েছে।

এটি আপনি কী রেন্ডার করতে চান তার উপর নির্ভর করে তবে আমি একটি পরিবর্তনশীল প্রস্থের লেআউট যাব যা প্রায় 800-900 প্রস্থে না ভেঙে।

উচ্চতা আসলেই কোনও সমস্যা নয়।

— XenF
সূত্র
0

সবেম বলেছিল যে 'আপনি সর্বদা চান প্রতি লাইনে 65-80 টি অক্ষর থাকতে হবে'। ওটা সত্যি না. উদাহরণস্বরূপ, উইকিপিডিয়ায় প্রতি লাইনে 180 টি অক্ষর থাকতে পারে। বা এটি একটি নির্দিষ্ট ওয়েবসাইট হতে বোঝানো হয়েছিল?

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.