طراحی صفحات وب و فتوشاپ

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

ایجاد وب سایت یا
فروشگاه حرفه ای رایگان

دسته بندی سایت

آرشیو مطالب سایت

ترفندنرم افزار

محبوب ترین ها

پر فروش ترین های فورکیا

پر بازدید ترین های فورکیا

پیوند ها

آمار بازدید

بازدید امروز : 514
بازدید دیروز : 386
بازدید کل : 921362

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

1- طراحان گرافیست

2- عكاسان

3- طراحان وب و چندرسانه‌ای

تاكنون ابزارهای فراوانی را برای دسته‌های اول و دوم با هم بررسی كرده‌ایم و با كاربرد آنها آشنا شده‌ایم‌، اما برای دسته سوم كه همان طراحان وب هستند زیاد صحبت نكرده‌ایم. در این مقاله می‌خواهیم درباره طراحی صفحات وب به كمك فتوشاپ و ابزارها و فرامینی كه به ما در این زمینه كمك می‌كنند صحبت كنیم و با آنها آشنا شویم.

هر صفحه وب از 2 بخش تشكیل شده است؛ بخش اول محیط گرافیكی صفحه و بخش دوم محیط كدنویسی است كه به كمك آن محیط گرافیكی ایستا به یك محیط پویا تبدیل می‌شود. به جرات می‌توان گفت به همان اندازه كه كدنویسی درست در طراحی وب‌سایت مهم است، طراحی گرافیكی وب سایت نیز اهمیت ویژه‌ای دارد. اینجاست كه فتوشاپ پا به میدان می‌گذارد و طراح وب می‌تواند با كمك آن به بهترین نحو ممكن قدرت كدنویسی خود را به نمایش بگذارد. معمولا قبل از شروع به كار طراحی وب‌سایت، طرح جامعی از سایت و صفحات مورد نیاز آن تهیه و با توجه به آن قالب گرافیكی سایت طراحی می‌شود. پس از اتمام طراحی، با انتقال قالب به محیط برنامه‌های طراحی وب، ارتباط بین قسمت‌های مورد نظر تعریف شده و خروجی نهایی صورت می‌گیرد.

اولین كار برای ایجاد قالب سایت، تعریف یك پروژه جدید با اندازه مورد نظر سایت است. برای این كار ابتدا از قسمت File گزینه New را انتخاب و پروژه جدید را تعریف می‌كنیم. فقط باید دقت كرد كه در محیط وب واحد اندازه‌گیری بر مبنای پیكسل بوده و از استاندارد معینی تبعیت می‌كند. برای سهولت كار می‌توانیم در پنجره New با كلیك در قسمت Preset و انتخاب گزینهWeb از اندازه‌های استانداردی كه در قسمت Size ظاهر می‌شود استفاده كنیم. رزولوشن محیط وب نیز برخلاف چاپ كه تاكید كردیم ‌300 انتخاب شود، باید 72 یا حداكثر 96 باشد، زیرا بیشتر از این مقدار تغییر چندانی در كیفیت تصویر ایجاد نمی‌شود، فقط حجم فایل خروجی را بیهوده افزایش داده‌ایم.

در نهایت با تایید ابعاد پروژه وارد محیط كاری فتوشاپ می‌شویم. استفاده از خطوط راهنمایی كه در شماره گذشته درباره آن صحبت كردیم در طراحی قالب، وب یكی از كاربردی‌ترین بخش‌هاست و به كمك آن می‌توانیم نسبت به مشخص كردن موقعیت و محل قسمت‌های مختلف سایت خود اقدام كنیم. پس در ابتدای كار با مشخص كردن Header و Footer و محل چیدمان ستون‌های سایت خود، خطوط راهنمایی را در موقعیت مناسب آنها قرار می‌دهیم.

در ادامه به كمك ابزارهای موجود مثل ابزارهای برداری، شیب رنگ، Layer Style و… به طراحی قالب مورد نظرمان اقدام می‌كنیم. یكی از مهم‌ترین نكاتی كه یك طراح سایت باید در نظر داشته باشد، كم حجم كردن سایت برای سهولت بارگذاری آن در اینترنت‌های كم‌سرعت است و با توجه به این كه بیشتر حجم یك سایت نیز مربوط به تصاویر استفاده شده در آن است، بنابراین به كمك فتوشاپ و ترفندهای طراحی سایت می‌توانیم سایتی با كمترین حجم ممكن بدون صرف‌نظر كردن از جلوه‌های گرافیك تولید كنیم.

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

برای تولید تصویری كه با تكرار آن، شكل مورد نظر ایجاد می‌شود می‌توانیم از قسمت جعبه ابزار فتوشاپ و مجموعه ماركی ابزار Single Row یا Single Column را برای انتخاب یك پیكسل از تصویر به صورت افقی یا عمودی از محیط كاری استفاده كنیم. درمرحله بعد با قرار دادن خطوط راهنما در ابتدا و انتهای قسمت انتخاب‌شده، به كمك ابزار Crop آن بخش را برش داده و از آن برای تكرار و ایجاد حالت مورد نظر استفاده كنیم.

یكی دیگر از قسمت‌های كاربردی فتوشاپ برای طراحان وب، ابزار Slice در زیر مجموعه ابزار Crop است كه به كمك آن طراح می‌تواند تصویر خود را به قسمت‌های كوچك‌تری تقسیم كرده و باعث افزایش سرعت بارگذاری سایت شود. حتی می‌تواند برای هر بخش انتخاب شده آدرس URL دلخواهی را تعریف كند تا كاربر با كلیك روی آن بخش، به صفحه مورد نظر طراح هدایت شود. برای این كار كافی است پس از تعریف Slice در گوشه سمت چپ و بالای آن دوبار كلیك كنید و در پنجره باز شده آدرس مورد نظر و سایر مشخصات دلخواه را بنویسید. یكی دیگر از قابلیت‌های مهم فتوشاپ برای طراحان وب تولید خروجی مناسب وب از صفحه طراحی شده بدون استفاده از برنامه‌های طراحی وب است. برای این كار پس از اتمام طراحی، از قسمت File گزینه save for web را انتخاب كرده و با تعریف فرمت دلخواه از قسمت Preset گزینه save را انتخاب می‌كنیم.

البته كاربرد اصلی این بخش، تولید تصاویر كم‌حجم به منظور استفاده در صفحات اینترنتی است، اما همان‌گونه كه گفته شد می‌توانیم این تصاویر را همراه صفحه html مورد نظر نیز تولید و آن را در سایت خود آپلود كنیم.

از فرمت‌های كم حجم رایج عكس برای استفاده در صفحات وب می‌توان به JPEG، Gif و PNG اشاره كرد كه از بین آنها فرمت Gif و PNG جهت ذخیره‌سازی لایه‌های شفاف نیز كاربرد دارد كه البته حجم بیشتری نیز نسبت به فرمت JPEG دارد. در صورت استفاده از تصاویر شفاف روی دیگر تصاویر در وب، كادری اطراف تصویر مورد نظر ظاهر نمی‌شود و از این بابت حرفه‌ای‌تر خواهد بود.

با انتخاب گزینه Save for Web‌ از قسمت File‌ پنجره‌ای مطابق شكل ظاهر می‌شود كه از آن می‌توانیم برای ایجاد تناسب دلخواه بین كیفیت و حجم تصویر از بین حالت‌های فراوانی كه وجود دارد، استفاده كنیم.

1- فعال‌كردن حالت مقایسه‌ای تصویر بین حالت اصلی و حالت انتخاب شده برای ایجاد خروجی كم حجم.

2- پیش‌نمایش تصویر قبل و بعد از اعمال تغییرات.

3- توضیحات مربوط به اندازه تصویر نهایی و سرعت بارگذاری آن در اینترنت.

4- گزینه‌های قابل انتخاب برای تنظیم حالت دلخواه تصویر نهایی از بین 3 فرمت JPEG، Gif و PNG (از حالت‌های پیشفرض موجود در قسمت Preset نیز می‌توان استفاده كرد).

5- نمایش یا عدم نمایش متا دیتا مخفی شده در عكس.

6 – جدول رنگ‌های استفاده شده در صورتی كه حالت Gif انتخاب شده باشد.

7- تنظیم سایز تصویر نهایی.

8- تنظیم انیمیشن موجود در تصویر در صورت تعریف انیمیشن و ایجاد خروجی Gif.

در نهایت با كلیك روی دكمه save و انتخاب حالت دلخواه Image Only یا html Only یا هر دو، فایل خود را با كمترین حجم ممكن ذخیره می‌كنیم.

انتشار : ۱۰ آبان ۱۳۹۴ تعداد بازدید : 331

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته پنجم فروردین ماه 1403

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما همیشه دنبال این بودی یه جایی باشه تا راحت بتونی محتوای مطمئن با طراحی خوب را پیدا کنی؟ همیشه دنبال این بودی یکی کارهای محتوایی را ناظر به مسائل روز انجام بده و دغدغه تأمین محتوا را نداشته باشی؟ همیشه ... ...

دریافت فایل : دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته پنجم فروردین ماه 1403

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته اول اردیبهشت ماه 1403

دریافت فایل : دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته اول اردیبهشت ماه 1403

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته دوم فروردین ماه 1403

دریافت فایل : دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته دوم فروردین ماه 1403

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما فروردین ماه 1403

دریافت فایل : دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما فروردین ماه 1403

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

دانلود فایل نقشه ی تابلو فرش دستباف طرح طبیعت کلبه ی زیبا دانلود فایل های کامل نقشه ی طرح تابلو فرش های دستباف طرح طبیعت کلبه ی زیبا تنها سایت ارائه دهنده فایل نقشه ی طرح های تابلو فرش (قیمت نقشه ها حداقل از 50 هزار تومان تا چندین میلیون تومان در بازار با توجه به ... ...

دریافت فایل : فایل نقشه ی تابلو فرش دستباف طرح طبیعت کلبه زیبا

دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته سوم فروردین ماه 1403

دریافت فایل : دانلود فایل‌های بسته آماده‌چاپ و نصب تابلو اعلانات مسجدنما هفته سوم فروردین ماه 1403

برنامه اکسل متره و برآورد،تهیه صورت وضعیت راه و باند سال1403

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

دریافت فایل : برنامه اکسل متره و برآورد،تهیه صورت وضعیت راه و باند سال1403

دانلود بسته 8000 تست-عمومی، اختصاصی،تخصصی-استخدامی آموزش پرورش

دانلود بسته 8000 تست-عمومی، اختصاصی،تخصصی-استخدامی آموزش پرورش فایل 8 هزار تستی با 2177 صفحه و 153 مگابایت حجم ... ...

دریافت فایل : دانلود بسته 8000 تست-عمومی، اختصاصی،تخصصی-استخدامی آموزش پرورش

پاسخنامه کتاب Introductory Steps to Understanding

کتاب‌های Steps to Understanding یکی از مهمترین و پرکاربردترین منابعی است که از سال‌های دور توسط زبان‌آموزان برای تقویت مهارت خواندن، شنیداری و واژگان مورد استفاده قرار می‌گرفته است. این مجموعه شامل 4 سطح است که در یک کتاب قرار گرفته است. تمامی درس‌های این مجموعه به صورت ... ...

دریافت فایل : پاسخنامه کتاب Introductory Steps to Understanding

دانلود کتاب صوتی روانشناسی تصویر ذهنی ماکسول مالتز

کتاب صوتی بسیار مفید #روانشناسی_تصویر_ذهنی اثر: #ماکسول_مالتز ترجمه: مهدی قراچه داغی کیفیت اجرا: خیلی خوب ... ...

دریافت فایل : دانلود کتاب صوتی روانشناسی تصویر ذهنی ماکسول مالتز

حل مسائل الکترودینامیک کلاسیک جان دیوید جکسون به صورت PDF و به زبان انگلیسی در 214 صفحه

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

دریافت فایل : حل مسائل الکترودینامیک کلاسیک جان دیوید جکسون به صورت PDF و به زبان انگلیسی در 214 صفحه

دانلود پاورپوینت در مورد [سلول های بنیادی] - شامل 4 فایل مختلف - قابل ویرایش و ارائه - ppt

دانلود پاورپوینت در مورد [سلول های بنیادی] - شامل 4 فایل مختلف - قابل ویرایش و ارائه - ppt شامل 4 فایل پاورپوینت سلول های بنیادین به زبان ساده: 1. 33 اسلاید: تاریخچه سلول های بنیادی / تعریف سلول های بنیادی / ویژگی های سلول های بنیادی / گونه های سلول بنیادی / انواع سلول ... ...

دریافت فایل : دانلود پاورپوینت در مورد [سلول های بنیادی] - شامل 4 فایل مختلف - قابل ویرایش و ارائه - ppt

پاورپوینت بازی زندگی است درس 17 تفکر و سواد رسانه ای دهم

عنوان پاورپوینت: پاورپوینت بازی زندگی است درس 17 تفکر و سواد رسانه ای پایه دهم فرمت: پاورپوینت pptتعداد اسلاید: 26 پوشش کامل درس همراه با پاسخ فعالیت ها پاورپوینت قابل ویرایش با محیط حرفه ای منطبق با آخرین تغییرات مطالب و رئوس کتاب درسی فونت ... ...

دریافت فایل : پاورپوینت بازی زندگی است درس 17 تفکر و سواد رسانه ای دهم

پاورپوینت بز یا سگ تفکر و سبک زندگی هفتم

عنوان: دانلود پاورپوینت بز یا سگ تفکر و سبک زندگی پایه هفتمفرمت: پاورپوینت قابل ویرایشتعداد اسلاید: 21 پوشش کامل درس همراه با پاسخ فعالیت ها پاورپوینت قابل ویرایش با محیط حرفه ای منطبق با آخرین تغییرات مطالب و رئوس کتاب درس فونت های ... ...

دریافت فایل : پاورپوینت بز یا سگ تفکر و سبک زندگی هفتم

دانلود جزوه امور مالی و حقوق ثبتی در دفاتر اسناد رسمی

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

دریافت فایل : دانلود جزوه امور مالی و حقوق ثبتی در دفاتر اسناد رسمی

دانلود حل المسائل [طراحی و تحلیل آزمایش]: ویرایش هشتم - داگلاس مونتگومری ( 8 ) - زبان انگلیسی - pdf

دانلود حل المسائل [طراحی و تحلیل آزمایش]: ویرایش هشتم - داگلاس مونتگومری ( 8 ) - زبان انگلیسی - pdf Solutions Manual for Design and Analysis of Experiments – 8th حل تمرین های کتاب طراحی و تحلیل آزمایش ویرایش 8 فصل های 2 تا 15 814 صفحه pdf ... ...

دریافت فایل : دانلود حل المسائل [طراحی و تحلیل آزمایش]: ویرایش هشتم - داگلاس مونتگومری ( 8 ) - زبان انگلیسی - pdf

دانلود پاورپوینت چیستی انسان 2 درس 10 فلسفه یازدهم انسانی

عنوان پاورپوینت درسی: دانلود پاورپوینت چیستی انسان (2) درس 10 فلسفه پایه یازدهم انسانی فرمت: پاورپوینت ppt تعداد اسلاید: 18 پاورپوینت قابل ویرایش با محیط حرفه ای منطبق با آخرین تغییرات مطالب و رئوس کتاب درسیبکارگریی افکت ها، تصاویر و اشکال متحرک بسیار ... ...

دریافت فایل : دانلود پاورپوینت چیستی انسان 2 درس 10 فلسفه یازدهم انسانی

دانلود 3 بک دراپ کودک تم فوتبال-کد 8082-8080

مشخصات فايل نام فايل:دانلود 3 بک دراپ کودک تم فوتبال-کد 8082-8080 نوع فايل:بک دراپ،backdrop پسوند فايل اصلي:JPEG پسوند فايل فشرده:ZIP ابعاد:3712*5249 PIX کيفيت: 300 DPI ويژگي هاي فايل فایل اصلی(Original file) کاربري آسان جايگزين مناسب براي دکورهاي گران ... ...

دریافت فایل : دانلود 3 بک دراپ کودک تم فوتبال-کد 8082-8080

پاورپوینت ادبیات بومی 2 درس آزاد فارسی دوازدهم

عنوان پاورپوینت درسی : دانلود پاورپوینت ادبیات بومی 2 درس آزاد فارسی پایه دوازدهم فرمت: پاورپوینت ppt تعداد اسلاید: 27 شامل: متن درس و شعر، معنای روان متن درس و شعر، معنای واژگان مهم، آرایه ها، کارگاه متن پژوهی همراه با جواب، قلمرو زبانی، قلمرو ... ...

دریافت فایل : پاورپوینت ادبیات بومی 2 درس آزاد فارسی دوازدهم

پاورپوینت درس 2 علوم تجربی پایه چهارم دبستان (ابتدایی): مخلوط ‌ها در زندگی

نوع فایل: power point فرمت فایل: pptx قابل ویرایش تعداد اسلایدها:‌ 43 اسلاید تصویری از پاورپوینت: این پاورپوینت آموزشی، جذاب، قابل ویرایش، کاملا منطبق با کتب درسی و با تعداد اسلاید ذکر شده تهیه و تنظیم شده است. با بکارگیری نمودار ها ، تصاویر جالب و جذاب و دسته ... ...

دریافت فایل : پاورپوینت درس 2 علوم تجربی پایه چهارم دبستان (ابتدایی): مخلوط ‌ها در زندگی

مجموعه اسکیس معماری از بناهای ایرانی

مجموعه "اسکیس معماری از بناهای ایرانی" این مجموعه شامل 225 تصویر اسکیس و کروکی معماری از بناهای مختلف ایرانی می باشد. ... ...

دریافت فایل : مجموعه اسکیس معماری از بناهای ایرانی

پاورپوینت درس دهم قرآن هشتم سوره یس، سوره صافات و تفسیر نمونه

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

دریافت فایل : پاورپوینت درس دهم قرآن هشتم سوره یس، سوره صافات و تفسیر نمونه

سیگنال گرفتن با هوش مصنوعی

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

دریافت فایل : سیگنال گرفتن با هوش مصنوعی

دانلود رایگان کتاب صوتی روش ها و فنون مشاوره دکتر عبدالله شفیع آبادی

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

دریافت فایل : دانلود رایگان کتاب صوتی روش ها و فنون مشاوره دکتر عبدالله شفیع آبادی

دانلود پاورپوینت فصل هفتم ریاضی پنجم آمار و احتمال همراه با پاسخ فعالیت ها و تمارین

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

دریافت فایل : دانلود پاورپوینت فصل هفتم ریاضی پنجم آمار و احتمال همراه با پاسخ فعالیت ها و تمارین

آموزش جدیدترین ترفندهای ویندوز - بزرگترین سایت ترفند ها

آمار بازدید

طراحی صفحات وب و فتوشاپ

تمام حقوق مادی و معنوی این وب سایت متعلق به "" می باشد