سوال در مورد طراحی سایت

[GFX Master]

خوب بالاخره گذر من به این انجمن هم افتاد! :دی

نمیدونم سوالی که میخوام مطرح کنم مربوط به این انجمن میشه یا نه؟!

اگر مربوط نمیشه ممنون میشم مدیر محترم منتقل کنن به بخش صحیحش.

من برای طراحی قالب یه سایت میخوام پس زمینه ای شبیه به این داشته باشم:

http://fc04.deviantart.net/fs33/f/2008/308/4/4/UnboxedGames_by_nicosaure.png

اگر دقت کنید پس زمینه بصورت یکنواخت نیست.

سوالم اینه که موقع تبدیل قابل به HTML اینطور پس زمینه ها رو چطوری کار میکنن که توی هر رزلوشنی بدون مشکلی نمایش داده بشه؟!

چون مثلا پس زمینه هایی شبیه به پس زمینه ی همین انجمن خودمون چون تایل شده بدون مشکل تو هر رزلوشنی
نمایش داده میشه. ولی پس زمینه هایی شبیه به این پس زمینه قابلیت تایل ندارن.

یعنی باید بصورت یه عکس واحد باشه درسته؟

بعد عکس با چه ابعادی باشه تا توی هر رزلوشنی بدون مشکل نمایش داده بشه؟

 

[aghanaser]

پاسخ

با سلام
براي اينكار با اين تصوير كه شما داريد قطعا نمي تونيد از خاصيت هايي مثل water mark استفاده كنيد.پس بايد ابتدا يك table در اندازه ي همين عكس با خاصيت مكاني Center بسازيد و بكگراند اون Table را تصوير مورد نظرتون قرار بديد و خاصيت repeat اون را در CSS بصورت norepeat تعريف كنيد.دراين حالت براي بكگراند كلي صفحه هم مي تونيد يك رنگ دقيقا مثل حاشيه هاي عكستون انتخاب كنيد و يا ازيك تصوير همرنگ استفاده كنيد.
- براي رزوليشن معمولا قبل از ساخت قالب يك رزوليشن كه كاربرد بيشتري داره مثلا 1024x768 را براي كل صفحه در نظر مي گيرن تا در مانيتورهاي 16 به بالا ودر مانيتورهاي Wide بدرستي نمايش داده بشه.
موفق باشيد

 

[pouya saadeghi]

حاشیه های عکس رو میشه یکرنگ گذاشت و background-position رو center کرد

پس بايد ابتدا يك table در اندازه ي همين عكس با خاصيت مكاني Center بسازيد و بكگراند اون Table را تصوير مورد نظرتون قرار بديد و خاصيت repeat اون را در CSS بصورت norepeat تعريف كنيد.

به جای تیبل خدابیامرز میشه همین کار رو با div انجام داد

 

[ALI4GHA]

در تکمیل صحبت های دوستان

عکس زمینه را با یک پهنای بزرگ برای مثال ۱۴۰۰ پیکسل ذخیره کنید و برای قرار دادن اون در پس زمینه از کدی شبیه به کد زیر استفاده کنید :

body {
	background: #fff url(main-bg.jpg) no-repeat center top;
	width: 100%;
	display: table;
}

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

 

[GFX Master]

ممنون از پاسخهایی که دادید.

فقط سوال اصلی من اینه که من اگر مثلا تصویر بک گراند فعلی ای که توی نمونه گفتم رو با سایز بزرگ مثلا عرض 1800 پیکسل
به طراح وب بدم کافیه؟! طراح وب خودش میدونه چطوری کار کنه که توی هر رزلوشنی بدون مشکل باشه دیگه؟!

 

[pouya saadeghi]

اگر مثلا تصویر بک گراند فعلی ای که توی نمونه گفتم رو با سایز بزرگ مثلا عرض 1800 پیکسل
به طراح وب بدم کافیه؟! طراح وب خودش میدونه چطوری کار کنه که توی هر رزلوشنی بدون مشکل باشه دیگه؟!

آره. 1800 خوبه . فقط حجمش زیاد نشه

 

[E-Boy]

سلام خدمت سارا خانم عزیز .
واقعا خوشحال شدیم که به این انجمن هم سر زدید .
دوستان یه سری توضیح دادن ولی بنده هم یه سری توضیحات اضافی میدم و یه مثال هم میزنم .
برای این که بشه یه تصویر غیر یکنواخت رو برای پس زمینه یه وب سایت قرار داد باید تصویر طوری طراحی بشه که مثلا اگر که بخواد در وسط صفحه قرار بگیره تمام کناره های اون به یه رنگ یکنواخت ختم بشه تا با افزایش رزولوشن تصویر خراب نشه .
اگر هم که قرار باشه که مثلا تصویر در سمت چپ و بالای صفحه قرار بگیره باید طرف های دیگر اون که میشه سمت راست و پایین تصویر به یه رنگ یکنواخت ختم بشه .
در زیر یه مثال از یه پس زمینه که در سمت چپ و بالای صفحه قرار گرفته براتون میزارم : Top & Left BG.zip
در این مثال از پس زمینه سایت envato استفاده شده که یکی از زیبا ترین طراحی ها رو داره .
اینم یه مثال دیگه از حالت قرار گیری در وسط صفحه و بالا : Center & Top BG.zip
و بقیه حالت ها هم به همین صورت می باشند .
رزولوشن عکس هم با توجه به نوع وب سایت و نحوه قرار گیری پس زمینه میتونه تغییر کنه .
اما باید توجه داشته باشید که عرض اجزای اصلی تصویر مثل همون دایره های سبز رنگ در مثال اول از 1000 دیگه بیشتر نشه چون که در رزولوشن های پایین مثل 700 ممکن هست که نیمی از تصویر نمایش داده نشه .
در حال حاظر چون که بیش از 70 درصد رایانه ها دارای رزولوشن 1024 در 768 هستند نباید عرض اجزای اصلی از 1000 بیشتر بشه .
آخر از همه این که با پس زمینه این نمونه ای که گذاشتین نمیشه در بخش رزولوشن مانور داد چون که اطراف تصویر به یه رنگ یکنواخت ختم نمیشه .
امیدوارم که خوب توضیح داده باشم .
اگر که سوالی بود در خدمتم .
موفق باشید .

 

[GFX Master]

ممنون از همه ی بچه ها. واقعا لطف کردید.

E-Boy جان شما هم که سنگ تموم گذاشتی. با این مثالهایی که زدی کاملا متوجه شدم.

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

یعنی هر چی به سمت کناره ها میاد به یه رنگ خاص محدود بشه.

از همگی بخاطر توضیحاتتون ممنونم.

 

[E-Boy]

ممنون از همه ی بچه ها. واقعا لطف کردید.

e-boy جان شما هم که سنگ تموم گذاشتی. با این مثالهایی که زدی کاملا متوجه شدم.

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

یعنی هر چی به سمت کناره ها میاد به یه رنگ خاص محدود بشه.

از همگی بخاطر توضیحاتتون ممنونم.

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

 

[20eshop]

سلام بچه ها من سایتم مدیریت محتوا داره می خواستم ببینم چطوری باید به قسمت admn با همنون مدریت کاربریم برم
سایت قبلیم با زدن admin/ به آخر مییومد ولی جدیده مدیریت محواش جدیده نمی دونم .مرسی
www.beest24.com

 

[winsent]

دوستان همه راهنمایی های لازم رو کردند, به خصوص E-Boy و ALI4GHA عزیز.
برای اینجور بک گراندها باید المان هایی به تگ Body و Img تصویر اضافه بشه که بیشتر این المان ها رو طراحان وب سایت در فایل های CSS قرار میدند.
موفق باشید...