در خواست: نظرات و پیشنهادات شما دوستان در مروده بهینه سازی و کم کردنه حجمه یک قالب گرافیکی وبسایت ?!؟

[DaRiOuShJh]

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

مرسی سپهر جان
در مورده هیدر طولش رو میگی یا عرضش رو؟ خوده قالب استاندارد طراحی شده و برای رزولوشنه 800*600 طراحی شده
خودش طولش طرفایه 768-780 پیکسل هست!
دیگه اون درخته سمته چپیه رو اتفاقا خیلی دوستش دارم!!! چون از سایه و glow مشکی استفاده کردم تو گوشه ها تاریک یا سیاه باشه جالب نمیشه همچین
مثله گوشه ی سمته راسته بالا و پایین! اوان رو دوست ندارن همچین! هر چی زور هم زدم که باله فرشته هه یه نمه بیاد بیرون از گوشه ی راست خشنگ تر شه نشد!
در مورده اون bg هم اون نمونه هست و اونو نمیزارم! چون حجم رو میبره بالا! ببینم چی میشه
یا:

یه قسمتش که با repeat شدن همشکل نداشته باشه و ساده هم باشه رو میبرم یا درست میکنم میزارم برای تکرار!

اگه جالب هم نشد ورش میدارم!

ولی آخه همچین عادت ندارم جایی پشتش خالی باشه و یه رنگ باشه! همونطور که میبینی بعضی جاها هم که خالی بود کثیف کاری کردم و هر چی گیرم میومده میپاشیدم

دستت درد نکنه برار

1. یه مقدار از BG رو به عکست اضافه کن تا بتونی تطابق رو ایجاد کنی



2. برای این مسئله هم پیشنهاد من استفاده از jpg هست با اضافه bg به کارت یه کم هماهنگی زیاد میخواد ولی اگه بتونی این کار رو بکنی خیلی از حجم سایتت کمتر میشه



3. منظور من حجم نبود میزان استفاده از منابع سیستم هست که باعث سنگینی نمایش یاست میشه

4. کاری هم که این آخر گذاشتی زیباست

شاد باشی و آرام

مرسی ارام جان
بازم مرام و معرفته شما

1 و 2. والا اون رو دیگه نم نم تغییر دادم چون از سر باز کنی بود تا حدودی و خیلی کار نکرده بودم روی این یکی دارم کار میکنم! در مورده repeat هم این کار رو تا حدوده زیادی کرده بودم که اون شده بود! در مورده جدید هم چون معلوم نیست کجای bg بیافته نمیشه دقیق مشخص کرد

و.لی اساسه قالبه جدید رو دوباره گزاشتم رو jpg البته به جر آیکون ها و خط ها که اونا هم حجمه زیادی ندارن
بتونم به طرفای 200- 300 کیلو برسونم حرف نداره

3. مرسی، ولی آخه اکثرا جاوا اسکریپت هستن که استفاده ی زیادی فک نکنم ببرن

4. ممنون، یه 10-12 ساعتی کار برده تا به حال
ولی سره پایینش موندم
میخوام دسته راسته پایین رو تاب بدم
نظرتون چیه؟ جالب میشه؟


****************************************

ممنون از همگیه دوستان

[DaRiOuShJh]

دوستان چش و گوششون رو باز کنن و بر و بر اینجا رو نیگا کنن وسر بزنن زود به زود! الان فرصت دارید تا استاده نابغه ای مثله بنده!×! پیشتونه و اسراره کارش رو داره قدم قدم فاش میکنه و یاد میده یه 4 تا چیز یاد بگیرید!
از این فرصت ها دیگه گیرتون نمیاد ها

هـــــــــــــــــــی زمانه ما که همه تو شیش و پنج بودن و یه نفرم تو باغ نبود یه چیزی ازش بپرسیم! همه چی رو خودم یاد گرفتم!!! اوهو اوهو اوهو

یاد بگیرید نصفه شما بودم!×!

*******************************

نم نم وارده کاره سلاخی و تیکه پاره کردن و بریدنه قالبمون میشیم زین پست به بعد!×!

[DaRiOuShJh]

توجه این تاپیک رو در سه تالار و قسمته

• طراحی صفحات وب
• فتوشاپ
• انجمن متفرقه

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


************************************************** *

خوب همونطور که اشاره کردم دیگه کاره طراحی و اضافه کردن رو فعلا میزاریم کنار میرسیم به کاره نیمه سخته تیکه پاره کردنه عکس! به طوری که تا جایی که میشه راحت تر بتونیم با علم و آشنایی ای که به کدهای html و css داریم اونا رو تو قسمت های خودشون جا بدیم و فیکس کنیم ولی ترتیبه نشون دادنشون تو صفحه به هم نخوره!×!

برای این قسمت هم هنوز با خوده فتوشاپ کار میکنیم

برای راحت تر شدنه کار این اقدامات رو انجام میدم به ترتیب

0. اول از همه یادتون باشه اون لایه هایی که بعدها تو Html اضافه میکنید رو hide :نید که من در اینجا آیکون ها و تیکه های آویزونه!!! بقل رو حذف کردم!
وشته ها و پست ها رو هم باید حذف میکردم که چون خواستم جنبه ی آموزشی هم داشته باشه گزاشتم تو این عکس باشن

1. یه عکس با کیفیته عالی یا خوب (حجم مهم نیست) از قالبم خروجی میگیرم (ترجیحا jpg با کیفیته 80)

2. سنده قبلی رو میبندم
فعلا با اون کاری نداریم حالا با ctrl + r خطکش ها یا همون rulers رو فعال میکنیم

3. با دقته پیکسلی!!! قسمت هایی رو که میخواید جدا کنید و ببرید رو انتخاب میکنید
خیلی دقت کنید حتی یه پیکسل بالا پایین هم در آینده ممکنه ترتیبه قالبتون رو در html به هم بزنه!

4. در قسمت هایی که انتخاب میکنید حواستون باشه اگه جزوه قسمت های ثابت هستن یه تیکه های از گرافیک تو جاهای دیگه و برش های دیگه جا نمونه خراب کاری کنه

5. قسمت هایی که در بک گراند تکرار میشن یا فقط یه تیکشون تکرار میشه هی! رو همیشه مده نظر داشته باشید که تو قسمت هایی که میبرید نیفتن! این قسمت یکی از سخت ترین کارهاس و اکثرا باید اوایلش کارتون رو حدسی تخمین بزنید

6. قسمت ها رو میبرید و خروجی jpg با کیفیته متناسب میگیرید

*******************************

من تا مرحله ی 5 مراحله بالا رو انجام دادم فعلا و برای اینکه کارتون در شناسایی قسمت ها و اندازشون و تفکیکشون از قسمت های دیگه ساده تر بشه! (دیگه کاری نبود که انجام نداده باشم برای این موضوع!) هم اندازه ها رو زدم بر حسبه پیکسل هم اسمشون هم فرمته خروجیشون و هم های لایتشون کردم براتون
دیگه چی میخواید!×!

تا الان این طوری شده:




خوب همونطور که میبینید همه ی قسمت ها رو طوری در نظر گرفتم که تا حده امکان کاره کد نویسی رو راحت کنم

فقط تو قسمته 4 و 5 درده سره زیادی خواهم داشت
چون بیشتره اطلاعات رو نمیدونیم چی هستن و بعضا رو هم باید به جای پیکسلی و دقیق، درصدی و present ای بگیریم که خیلی اعصاب خورد کن و درده سر داره!


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

خوف نکنید با بنده همراه باشید هی!×!
داریــــــــــــوش!×!

فک کنم تا به حال یه نمه دستتون اومده باشه که چرا طراحی سایت با قالب و .... چرا بعضی اوقات به قیمت های چند میلیونی هم ممکنه برسه!×!

******************************

در ضمن موسیقیه متال (اونم یه خرمن) هم فراموش نشه که حس و حال میده بهتون!×! و باعث میشه خوابتون نبره!×!

WILD STEEL\WILD STEEL - [2007] - HEAVY METAL\10 - WILD STEEL - TRANSCENDENCE.MP3

VA - Metal Mania - (2007) - Metal\07-tobias_sammets_avantasia-the_final_sacrifice-bnl.mp3

ARCH ENEMY\RISE OF THE TYRANT - [2007] - DEATH METAL\01 - ARCH ENEMY - BLOOD ON OUR HANDS.MP3

در طرح های اسلامی میتونید از نوحه و .... سودجویید!×!

[mojtaba-design]

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

[aram_nfs]

داریوش جان قرار بود اینجا نظر سنجی کنی واسه کم کردن حجم قالبت یا آموزش کد نویسی بدی به ما؟

[DaRiOuShJh]

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

مرسی مجتبی جان
کلا قلش که مزیتی نسبت به jpg نداره چون وانم بالاخره حجم رو کم میکنه ولی حجمی که با فتوشاپ کم شه هم حرفه ای تر هست هم آپشن هایی بیشتری برای این کار دارید
مزیتی که فلش داره همونطور که گفتید پشتیبانی اون از transparent ]ست و میتونید وفایل های حجیم png به صورت transparent رو با فرمته gif و jpg ولی با همون ساپورته Png خروجی بگیرید که خیلی تو حجم تاثیر داره
همون کاری که تو header و banner کردم

البته banner چون حجم بیشتری داشت مجبور شدم یه مقدار از کیفیت هم بزنم

مرسی

داریوش جان قرار بود اینجا نظر سنجی کنی واسه کم کردن حجم قالبت یا آموزش کد نویسی بدی به ما؟

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

ولی اینطور که معلومه کسی به این موضوع علاقه نداره دیگه

از این به بعد تو همون طراحیه وب و متفرقه بقیه مراحل رو میزارم

***********************************

راستی دوستان اسمه اون پلاگ اینی که گوشه های عکس رو تو فتوشاپ بر میگردوند چی بود؟ برای گوشه پایین میخوام

دیگه دوستان نظری ندارن؟

در مورده BG در قسمته 5 نظر بدید
هیچی نگفتید ها

به نظرتون پس زمینه تکرار بشه در این قسمت خوبه یا همون رنگه ساده باشه و از بالاتر کامل FADE کنم؟ اینطوری خیلی ساده تر هم میشه طراحیش

[aram_nfs]

راستی دوستان اسمه اون پلاگ اینی که گوشه های عکس رو تو فتوشاپ بر میگردوند چی بود؟ برای گوشه پایین میخوام

در فتوشاپ cs3 و cs2 برای این کار می تونی از امکان warp استفاده کنی البته این گزینه در حالتtransform هست.
و اما اون پلاگین اسمش vizros هست که می تونی باهاش جلوه های برگشت به کارت بدی

شاد باشی و آرام

[DaRiOuShJh]

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




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

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

بلکه تا امشب برسم تیکه پاره کردنش رو تموم کنم! و یه مقدار از استایل ها و کدهای استاتیکش رو بنویسم خلاص شم!×!

[aram_nfs]

به نظر من بخش نوشته ها بذون زمینه باشه بهتره
ولی اگه اون کنارهای سوخته رو بهش اضافه کنی و نوشته ها رو از کنار فاصله بدی بهتره

[DaRiOuShJh]

مرسی آرام جان ولی دو مشکله اصلی داره این کار:

1. همینطوریش هم خیلی جا ندارم کلا 780 پیکسله که حدودا به کنارای خالیش 750 پیکسل شده!
اگر بخوام گوشه هاش رو هم حداقل از هر سمت 10-20 پیکسل بزارم 700 پیکسلم نمیمونه!
تازه 175 تا 200 پیکشل هم جا برای sidebar لازمه

2. بازم مشکل تکرار شدنش پیش میاد! اگه یه تیکش هی تکرار شه هم جالب نمیشه...