مشاهده پست های بی پاسخ | مشاهده موضوعهای فعال تاریخ امروز پنجشنبه 19 جولای, 2018 10:49 pm



پاسخ به موضوع  [ 33 پست ]  برو به صفحه قبلی  1 ... 3, 4, 5, 6, 7
 آموزش متدولوژی و روش طراحی وب سایت گام به گام 
نویسنده پیام
آواتار کاربر

عضو: شنبه 19 آوریل, 2008 3:02 pm
پست ها: 431
پست Re: آموزش متدولوژی و روش طراحی وب سایت گام به گام
Gif شفاف

امتيازي که فايلهاي Gif نسبت به تصاوير JPG دارند اين است که طراح مي تواند يک رنگ از تصاوير Gif طراحي کند که شفاف باشد و اين ويژگي باعث رفع محدوديت ها در اشکالي مثل مربع يا مثلث مي شود . براي مثال يک طراح مي تواند يک Logo دايره اي با يک زمينه رنگ شفاف ايجاد کند . بنابراين عکس با اطلاعات شفاف و بصورت دايره ظاهر مي شود .

تمرين 5-1 ايجاد سايت عکسهاي متحرک :

در اين تمرين شما از يک سرويس دهنده بر روي اينترنت براي ايجاد يک تصوير متني و متن متحرک استفاده مي کنيد .
1- وارد سايت http://www.mediabuilder.comشويد .
2- اتصال 3D Text Maker را که در طرف چپ صفحه قرار دارد انتخاب کنيد.
3- در مرحله اول فونتي دلخواه را براي متن خود انتخاب کنيد .
4- در مرحله 2 رنگي براي فونت خود در نظر بگيريد .
5- مي توانيد ابعاد متن خود را تنظيم کنيد .
6- در اينجا شما مي توانيد افکت هاي رنگي نيز براي متن خود اعمال کنيد .
7- در ميدان متني ، متن مورد نظر خود را وارد کنيد . مي توانيد براي مثال متن My 3D Text را وارد کنيد و سپس روي Make 3D Text کليک کنيد صفحه ديگر با فايل گرافيکي کامل شده بارگذاري مي شود . شما مي توانيد تغييرات ديگري را نيز وارد کنيد و همچنين مي توانيد فايل خود را با ابزار ديگري بنام Gif Works ويرايش کنيد و آنرا بر روي هارد محلي خود ذخيره کنيد .
8- به صفحه خانگي http://www.mediabuilder.com بازگرديد و اين بار ابزار Animated Banner Maker را انتخاب کنيد .
9- دستورالعمل استفاده از اين ابزار را بخوانيد .
10- براي اين تمرين سبک Around the world را انتخاب کنيد .
11- اگر نياز باشد با اسکرول به پائين برويد و وارد اولين ميدان متني شويد .
12- بر روي دگمه Make Banner کليک کنيد Banner در صفحه اي جديد ظاهر مي شود .
13- مراحل ذخيره فايل را به هارد بخوانيد .


Joint Photographic Experts Groop -JPEG :

عکسها در قالب JPEG از رنگهاي بيشتري نسبت به فايلهاي Gif برخوردار هستند . اما معمولا به زمان بارگذاري بيشتري نيز نياز دارند .
فايلهاي JPG شامل اطلاعات 24 بيت رنگي ( 16.7 ميليون رنگ ) مي باشند و به خوبي در تصاوير يکپارچه گرافيکي و عکسبرداري ها ظاهر مي شوند . بايد به خاطر آوريد که خيلي از کاربران فقط توانايي نمايش 8 بيت رنگ را براي خود دارند و در نتيجه در نمايش عکس براي آنها به مقدار قابل ملاحظه اي افزايش نور ايجاد مي شود . ( پديده اي که قبلاً راجع به آن بحث شد)
فايلهاي JPG به طور اتوماتيک فشرده مي شوند و در هنگام ورود به صفحات وب از حالت فشردگي خارج مي شوند . اثرات فشرده سازي متفاوت هستند . فشردگي بيشتر تنزل درجه بيشتري در عکس نهايي دارد . JPG را به عنوان يک فايل زيان آور و پر اتلاف در نظر مي گيرند . به اين معني که فشردگي عکس را افزايش مي دهد . رنگها با قطره چکان از جعبه رنگ عکس برداشته مي شود و نتيجه آن تنزل در کيفيت عکس است . براي مثال يک فايل 100 kb مي تواند 10 kb فشرده شود و به هر جهت اين فشردگي کيفيت عکس را کم مي کند . يکي از مضرات استفاده از اين قالب اين است که طراح کنترلي بر چگونگي تبديل 24 bit به 256 رنگ استفاده شده با صفحه نمايش کاربر را ندارد .
همچنين تفاوت بارزي در نحوه نمايش اين قالب در 2 مرورگر IE و NetScape وجود دارد بعلاوه نحوه نمايش در PC ها نيز متفاوت تر از مکينتاش مي باشد . طراح بايد قبل از آنکه صفحه خود را به اتمام رسانيد بداند که کدام قالب منظور وي را بهتر تامين ميکند و کار خود را در دو مرورگر با سيستم عامل هاي مختلف آزمايش کند .

JPEG2000:

قالب جديد JPEG به منظور توسعه ويژگي هاي فشردگي فايلهاي JPEG استاندارد مي باشد همانطور که قبلا بحث شد قالب اخير JPEG که اطلاعاتي راجع به تصويري که فشرده شده است در بردار سودمند نسيت و اين قضيه در نتيجه روزنه هايي را در تصوير ايجاد مي کند و باعث ايجاد تصوير خالدار مي گردد . در JPEG 2000 فشرده سازي در اثر يک تکنولوژي مواج بوجود مي آيد که اطلاعات را به گونه اي متفاوت ذخيره مي کند که تعداد زيادي از تکه هايي که در تصاوير فشرده شدهاي که از طريق JPEG بوجود آمدند را از بين مي برد .

Portable Network Graphics -PNG:

قالب PNG به عنوان يک قالب جديد براي گرافيکهاي وب ظاهر شده است . براي تصاوير وب PNG بهترين ترکيب از ويژگيهاي JPG و GIF را تحت يک قالب واحد دارا مي باشد . فايلهاي PNG زيادتر هستند و همچمين از شفافيت فايلهاي GIF و از عمق رنگي JPGحمايت مي کنند . فشردگي در فايلهاي PNG با استفاده از فيلترهاي فشردگي که تا عمق 48 bit حمايت مي شوند توسعه پيدا کرده است . مرورگرها قدیمی از قالب PNG حمایت نمی کنند.
Netscape 4.7 و IE5 و به بالا با درجات مختلفي از PNG حمايت مي کنند . به هر جهت کميته www در 1996 فرمت PNG را پيشنهاد داد ولي فرمت همه گیری نیست .

تصاوير برداري مقياس پذير SVG

قالب تصاوير برداري مقياس پذير (SVG) در فاز نقشه هاي کاري W3C مي باشد . SVG در XML در تشريح اشکال اصلي کاربرد دارد . مشابه بردارهاي گرافيکي ديگر SVG هنگامي که با هنرهاي خطي و اشکال کار مي کند بهينه مي شود .
ضمیمه:
07.gif


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


سه شنبه 26 آگوست, 2008 1:37 pm
مشخصات شخصی
آواتار کاربر

عضو: شنبه 19 آوریل, 2008 3:02 pm
پست ها: 431
پست Re: آموزش متدولوژی و روش طراحی وب سایت گام به گام
ايجاد تصاوير

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

ويژگي ALT :

ويژگي ALT متون اختياري در مکانهايي از تصاوير بر روي صفحات HTML ايجاد مي کند . گرامر استفاده از ويژگي ALT به شکل زير دنبال مي شود :

ضمیمه:
08.gif


ويژگي ALT براي مکان هاي زير مهم است :

ويژگي ALT براي مکان هاي زير مهم است :

● کاربراني که گزينه نمايش عکس را در مرورگرهاي خود غير فعال کردند از اين طريق مي توانند آنرا بخوانند.
● هنگامي که صفحه در حال بارگذاري است کاربر مي تواند توصيف آنرا بخواند .
● اين گزينه براي کاربراني که قدرت بينايي يا شنوايي کمي دارند امکانات خوبي ايجاد ميکند.


بهينه سازي تصاوير :

يک طراح وب اگر نتواند تصاوير خود را بهينه سازي کند هيچ يک از توانمنديهاي Gif و jpg و Png تشخيص داده نمي شود. اين اشتباه غلط ازآنجا ناشي ميشود که بگويم هيچ يک از اين قالبها از ديگري بهتر نيست. در صورتيکه در قبل گفتيم که هر قالب تصوير داراي توانمندي مي باشد که آن را منحصر به فرد مي کند . به عنوان يک طراح وب بايد بياموزيد که چه نوع قالبي را براي ايجاد يک تصوير خوب و جذاب و بدون مشکل به کار بريد استفاده از قالبهاي Gif يا Jpg شما را به استفاده از تصاوير بهينه مطمئن نمي سازد .

موارد زير راهنمايي است که شما را در بهينه سازي تصاوير کمک مي کند :

● استفاده از رنگهايي که در وب امنيت دارند .
● ايجاد يک ليست از رنگهاي ممکن
● استفاده از رنگ هاي يکدست در هر جايي که ممکن باشد .
● اجتناب از اثرات بصري نامطلوب تا جايي که مقدور است .
● استفاده از امکانات بهينه سازي .

منابع بهينه سازي :

در حال حاضر خيلي از منابع وجود دارند که براي کمک به طرح بهينه سازي تصاوير در دسترس مي باشند . روش اصلي براي بهينه سازي, محاسبه کوچکترين مقدار رنگ ممکن و انتخاب قالب فايلي است که مي تواند کيفيت رنگ درخواستي شما را ايجاد کند .
بيشترين استفاده معمول در بهينه سازي استفاده از نرم افزارهاي Photo Shop ، Fire Works ، Image Ready و ... مي باشد .
2 روش بهينه ساز معمول ديگر که در حال حاضر مورد استفاده قرار مي گيرند Online Version ، Desktop Version مي باشند .

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

● Gifbot
http://www.netmechanic.com/accelerate.htm


تمرين بهينه سازي تصاوير :

در اين تمرين از سرويسهاي بهينه سازي تصاوير در روي اينترنت استفاده مي کنيد . اين تصاوير و اتصالات يک صفحه را بطور آشکار را ارزيابي مي کند و خلاصه اي از سايتهاي گرافيکي ايجاد مي کند و سپس ورژنهاي مختلفي از بهينه سازي تصاوير براي انتخاب و بارگذاري و نگهداري ، براي شما ارائه مي دهد .

1- وارد سايت http://www.netmechanic.comشويد .
2- بر روي اتصال Gifbot کليک کنيد .
3- از اين صفحه بر روي Try it کليک کنيد .
4- URL که عگس مورد نظرتان در آنجا قرار دارد را بر روي فيلد مخصوص وارد کنيد.
5- شما همچنين مي توانيد فايل را از کامپيوتر خود به کامپيوتر راه دور بفرستيد ، با استفاده از کليد Brows و آدرس Email خود را وارد کنيد و هر دو قالب Gif و Jpeg را از منوي خروجي انتخاب کنيد و Testnow را کليک کنيد .
6- حال اين سرويس شروع به بارگذاري عکس و ارزيابي آن مي کند .
7- وقتي بارگذاري کامل شد ليستي ايجاد مي شود .
8- وقتي ارزيابي تمام شد گزارش کاملي ظاهر مي شود .
9- براي ديدن کامل نتايج ، صفحه خود را اسکرول کنيد . بر روي سايز فايلي که در اتصالات سايت قرار دارد کليک کنيد تصوير بزرگتر ظاهر خواهيد شد .
10- اگر شما تا پايين صفحه اسکرول کنيد تکرار همان عکسها را خواهيد ديد . توجه داشته باشيد که هر عکسي اطلاعاتي راجع به عکس شامل نوع ، عمق رنگ ، سايز و زمان بارگذاري و نيز درصد ذخيره را به شما انتقال مي دهد و در صد سايز فايل را به شما مي دهد و مي توانيد تصوير بهينه شده را با تصوير اصلي با جابه جا کردن اشاره گر ماوس بالاي هر عکس مقايسه کنيد . اگر اينکار را انجام داديد تصوير اصلي ظاهر خواهد شد و يک مقايسه دقيق انجام مي دهيد . قبل از آنکه بخواهيد به تغييرات دقت کنيد بايد با اسکرول کردن تمامي عکسها را ديدن کنيد .
11- حال شما تصويري که بهينه شده و کيفيت خوبي در حد درخواست شما را دارد انتخاب کنيد .
12- بر روي عکس مورد نظر کليک راست کرده و آن را Save کنيد.
با بهينه سازي ، تمامي عکسهاي صفحه ( و سايت ) به طرز چشمگيري مي توانيد زبان بارگذاري را کاهش دهيد و براي کاربران يک مشاهده سريع را ايجاد کنيد .


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


سه شنبه 26 آگوست, 2008 1:44 pm
مشخصات شخصی
آواتار کاربر

عضو: شنبه 19 آوریل, 2008 3:02 pm
پست ها: 431
پست Re: آموزش متدولوژی و روش طراحی وب سایت گام به گام
تکه تکه کردن عکس و بهم اتصال دادن

روش ديگري که براي کمک به بارگذاري عکسهاي بزرگ در زمان کم وجود دارد برش دادن عکس مي باشد .
برش تکه هاي متعددي از عکس را در بر دارد . با استفاده از جداول HTML يک عکس مي تواند تجديد بنا شده و در پنجره مرورگر بهم پيوند داده مي شود . برش ها نمي توانند تغييري در سايز عکس بوجود آورند اما بارگذاري عکس را سريعتر ميکنند زيرا کاربر قبل از بارگذاري عکس قسمت هايي از عکس را مي بيند .


سه شنبه 26 آگوست, 2008 1:51 pm
مشخصات شخصی
مشاهده پست های قبلی:  نمایش بر اساس  
پاسخ به موضوع   [ 33 پست ]  برو به صفحه قبلی  1 ... 3, 4, 5, 6, 7

افراد آنلاین

کاربران حاضر در این تالار: - و 4 مهمان


شما نمی توانید در این تالار موضوع جدید باز کنید
شما نمی توانید در این تالار به موضوع ها پاسخ دهید
شما نمی توانید در این تالار پست های خود را ویرایش کنید
شما نمی توانید در این تالار پست های خود را حذف کنید
شما نمی توانید در این تالار ضمیمه ارسال کنید

جستجو برای:
پرش به:  
cron
استفاده و نقل از مباحث سایت، فقط با ذکر منبع و لینک سایت میکرورایانه مجاز است.
Copyright © 2006 - 2010 MicroRayaneh - Powered by phpBB © phpBB Group
Valid CSS2 Valid XHTML 1.0
طراحی سایت : میکرو رایانه