logo
  • گرافیک سایت

آموزش طراحی قالب

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

گرافیست سایت حرفه ای

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

گرافیست سایت حرفه ای

ده نکته برای گرافیست سایت حرفه ای شدن :

1. همیشه خود را آپدیت کنید :

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

2. از دنیای برنامه نویسی و اجرای وب سایت آگاهی پیدا کنید :

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

3. بهترین وب سایتهای ایرانی را مشاهده کنید:

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

4. وب سایتهای خارجی :

وب سایتهایی هستند که در طول یک سال بهترین وب سایتهای جهانی را انتخاب می کنند از لحاظ برنامه نویسی و طراحی همیشه از این وب سایتهای دیدن کنید تا گرافیک سایت بهتری را طراحی کنید و با دیزاینهای جدید اشنا شونید یکی از بهترین وب سایتها در این زمینه وب سایت awwwards.com است.

5. ایده پردازی کنید :

سعی کنید برای طراحی وب سایت گرافیک جدید بزنید و ایده پردازی  کنید از گذاشتن چیزهای جدید در طرح خود نترسید زیرا همین تضادهاست که یک طرح را ویژه و منحصر به فرد می کند.

6. از خط ها و باکسهای نا متقارن استفاده کنید :

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

7. تصاویر زیبا و حرفه ای طراحی کنید :

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

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

با توجه به دانش خود و سلیقه مشتری طرحی بزنید که هم خود بپسندید و هم بر  اساس نظرات مشتری باشد زیرا در اخر کارفرما بر نظرات شما ارجهیت دارد و باید طرح طوری باشد که او بپذیرد.

9. اطلاعات را درست و کاربردی در سایت بچنید :

اطلاعات و موضوعات سایت را کاربردی و هر چیز را سر جای خودش بگذارید طوری که کاربران سایت بتوانند راحت به موضوع مورد نظر خود برسند و در سایت سردرگم نشوند.

10. طرح خود را بعنوان گرافیست سایت چند بار بررسی و ویرایش کنید :

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

گرافیست سایت حرفه ای

مثلث رنگ در طراحی گرافیکی سایت

مثلث رنگ همان طور که از نامش پیداست یک مثلی رنگی است که در قالب گرافیکی سایت و طراحی گرافیکی سایت می تواند بسیار از ان بهره برد این مثلث به گونه ای طراحی شده که سه رنگ اصلی یعنی رنگهای قرمز،آبی و زرد در سه گوشه  مثلث قرار می گیرند و اضلاع انها و مسیرهای داخلی را طیف هایی از رنگهای اصلی پر می کند مثلث رنگ می تواند شامل رنگهای دیگر هم باشد و لطیف های انها را نشان دهد ولی نمونه ی اولیه و اصلی ان باید شامل رنگهای اصلی باشدپس از توسعهٔ نظام سی‌آی‌ای مثلث رنگ به همراه ارزش عددی آنها (معمولا ارزش مبنای شانزده) به عنوانی نموداری برای نمایش و ارائهٔ رنگ‌ها به کار می‌رود

مثلث رنگ در طراحی گرافیکی سایت ، نظریهٔ ترکیب رنگ‌ها توسط توماس یانگ ارائه شد و بعدها جیمز مکسول و هرمان وان هلمولتز آن را توسعه دادند اما قبل از این نیز ترکیب‌های سه رنگ آبی، قرمز، و زرد با استفاده از مثلث رنگ آرایش می‌یافت بنابراین همیشه سعی کنید در طراحی قالب سایت و گرافیک سایت خود از رنگها و روشهای اصولی استفاده کنید هر رنگی را در هر جای سایت به کار نبرید زیرا اگربدون آگاهی می توانستیم کار کنیم چه نیازی به ساخت و گرش روشهایی چون مثلث رنگ پس همیشه اصول هر کاری را در انجام ان رعایت کنید تا دراخر به نتیجه درست برسید و همیشه برای گرافیک سایت سعی کنید از رنگهایی که هارمونی دارند بهره ببرید و برای بهتر دیده شدن قالب سایت حتما از رنگهای خنثی مثل خاکستری ( طوسی ) و یا کرم بسته به نوع رنگهای صفحه استفاده کنید اغلب لازم نیست از هر رنگی پر رنگ ترین را انتخاب کنید گاهی استفاده از رنگهای ملایم و لایت جلوه بیشتری به کارتان میدهد فکر کنید با استفاده از رنگهای ملایم سایتتان بی حال می شود نه بلکه در بعضی موارد بسیار جذاب و زیبا خواهد شد ( مثلث رنگ در طراحی گرافیکی سایت )

مثلث رنگ در طراحی گرافیکی سایت

مثلث رنگ در طراحی گرافیکی سایت

اندازه استاندارد بنرهای تبلیغاتی

اندازه استاندارد بنرهای تبلیغاتی، همانطور که میدانید هر چیزی یک استانداردی دارد که باید رعایت شود این استانداردها بر اساس قوائد و قانونهایی به دست آمده اند برای طراحی بنر و طراحی اسلایدر سایت هم استاندارهایی وجود دارد که معمولا از انها پیروی میگردد البته می توان خارج از استاندارها هم کار کرد ولی اگر بخواهید بنر خود را به سایت دیگری بدهید امکان دارد به مشکل بخورید زیرا در سایتهای دیگر هم اندازه های استاندار برای بنرها تعریف شده و چون سایت مورد نظر شما باید اندازه های استاندار خود را برای یک بنر خراب کند معمولا از پذیرش بنرتان سر باز میزند و یا از شما می خواهد که بنرتان را تغییر سایز دهید پس بهتر است از همان ابتدا روی سایزهای درست و استاندار کار کنید تا در اینده به مشکل نخورید

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

برای مثال به سایت www.varzesh3.com نگاه کنید این سایت یکی از پر بنده ترین سایتهای کشور است اندازه بنرها در تمامی قسمتهای سایت استاندار و درست است و برای دادن تبلیغات در این  چنین سایتهایی مبلغی از کاربران دریافت میشود و در ازای مباغ اگهی به مدت زمان یک ماه یا یک سال در سایت باقی می ماند و بازدیدکنندگان این سایت که اکثرا عموم مردم هستند وارد سایتتان میگردند و می توانید تجارت خود را گسترش دهید

اندازه استاندارد بنرهای تبلیغاتی

اندازه استاندارد بنرهای تبلیغاتی

رنگهای گرم و سرد

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

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

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

رنگهای سرد در طراحی قالب سایت

رنگهای گرم و سرد

رنگهای گرم در گرافیک سایت

قالب سایت پزشکی

با توجه به دو قالب سایت بالا به راحتی می توان تفاوت رنگهای گرم و سرد را در طراحی قالب سایت و گرافیک سایت پی برد هر بسته به سن مشتری وب سایت خود می توانید از رنگهای سرد یا گرم استفاده کنید مشتریان رده سنی 18 تا 35 سال اکثر خواستار رنگهای گرم هستند و رد سنی 40 سال به بالا اکثر خواستار رنگهای سرد در طراحی وب سایت می باشند

رنگهای گرم و سرد

چرا به طراحی وب سایت نیاز داریم؟

آیا تا به حال به این سوال فکر کرده اید که چرا به طراحی وب سایت نیاز داریم؟

مطابق با آمارهای جهانی42 میلیون ایرانی کاربر وب سایتها می باشند و این نشان دهنده عمق نفوذ اینترنت در زندگی امروزی کاربران و مردم کشور ایران است پس برای اینکه با این پیشرفت همپا شویم باید بکوشیم تا بسته به موارد بیان شده درزیر نیاز به طراحی وب سایت را برای خود بسنجیم ( چرا به طراحی وب سایت نیاز داریم؟ )

1.با طراحی قالب سایت (وب سایت) می توانیم اطلاعات زیادی را در مدت زمان کوتاه به کاربران بدهیم:

در گذشته برای دادن اطلاعات به کاربران معمولا متون زیادی اغلب بودن تصویر به کاربر داده می شد تا بتواند اطلاعات را بخواند و به موضوع مورد نظر خود دست پیدا کند اما در یک سایت کاربران می توانند به راحتی در صفحات مختلف کشت و گزار کنند و مطلب مورد نظر خود را سرچ کنند و با دیدن اسلایدر سایت رنگارنگ از بودن در وب سایت خسته نشوند

اطلاعات سایت

2. با طراحی قالب سایت می توانیم از مرزهای جغرافیایی بودن صرف هزینه ای خارج شویم

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

سئو در سایت

3. می توانید به راحتی با مشتریان خود تعامل داشته باشید و انها بازخورد کاری بگیرید

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

تعامل با مشتری سایت4. پاسخگویی همه روز و 24 ساعته به مشتریان

با داشتن وب سایت می توانید به راحتی در تمامی روز در دسترس مشتریان خود باشید

وب سایت5. استفاده از موتورهای جستجو برای بازاریابی کسب و کارتان

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

چرا به طراحی وب سایت نیاز داریم؟

 چرا به طراحی وب سایت نیاز داریم؟

روشهای طراحی بنر

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

بنرها رنگها و سایزهای متفاوتی دارند می توانند در سایت شما قرار بگیرند و یا مناسب با گرافیک سایت طراحی شده و در وب سایتهای دیگر برای تبلیغات سایت شما استفاده شوند از جمله سایتهایی که می توانید بنر خود را در انها قرار دهید و در حال حاضر بسیار پر مخاطب هستند سایتهای ورزش 3 ، ایسنا و … هستند بیشتر بنر های سایت که در وب سایتهای دیگر قرار می گیرند باعث می شوند که کاربران از سایتهای پر بازدید به سایت شما وارد شوند و چون اغلب بنرها حرکت و افکت نور دارند ناخوداگاه باعث کلیک کاربران می شوند و این کلیکها به بهینه سازی سایت کمک می کند

در طراحی قالب توجه به گرافیک مناسب و استفاده از بنرهای حرکتی به جذابیت سایت کمک می کند زیرا به جای استفاده از کدهای جاوا و یا فلش به راحتی می تواند یک بنر حرکتی را در نرم افزارهای فتوشاپ یا Bannershop GIF Animator  طراحی کرد و سپس یک فایل کم حجم و بدون هیج کد نویسی را در وب سایت آپلود کرد این روش هم از حجم سایت شما می کاهد و هم به جای سنگین کردن سایت شما توسط فلش به راحتی شما را به گرافیک سایت زیبا و کاربردی می رساند (روشهای طراحی بنر)

نمونه کارها

روشهای طراحی بنر

روشهای طراحی بنر

بهینه سازی سایت

اما SEO چیست؟ معنای لغوی SEO که مخفف Search Engine Optimization است، بهینه سازی موتور جستجو می باشد. SEO یا بهینه سازی سایت یعنی طراحی وب سایت مطابق با دستورهای موتورهای جستجوگرکه بهترین این موتورهای جستجو در حال حاضر موتور جستجوگر گوگل می باشد

برای بهینه سازی سایت در درجه اول باید طراحی قالب سایت بهینه باشد یعنی قالب گرافیکی سایت با توجه به تکنیک های بهینه سازی سایت طراحی شود که سایت حجم کمی داشته باشد  و در عین حال زیبایی خود را نیز از دست ندهد برای بهینه سازی قالب گرافیکی سایت در صفحه اول حداکثر ده تصویر باید قرار گیرد و این تصاویر زیر 100 کیلوبایت باشند و بقیه موارد گرافیک سایت از رنگ تشکیل شده باشد حتی تصاویر هم تا جایی که امکان دارد ریز شوند ، مثلا به جای یک عکس 100*20 ما یک برش از ان ایجاد کنیم 1*20 و آن را 100 بار تکرار کنیم با انجام این کار در طراحی قالب سایت به جای یک عکس 200 کیلو بایتی ، یک عکس 2 کیلوبایتی داریم پس حدود 198 کیلو بایت به بهینه سازی سایت خود کمک کرده ایم.

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

با توجه به گسترده بودن بهینه سازی سایت ما در این وب سایت طراحی قالب سایت را به صورت بهینه انجام میدهیم و بهینه سازی سایت را توسط سایت دیگرمان به نام کـــــــــــارنا به انجام میرسانیم.

برای مثال شما می توانید دونمونه از کارهایی که در زمینه بهینه سازی سایت انجام شده را با سرچ کردن در گوگل مشاهده کنید

1.کلمه کلیدی(کلاس اکسل) که سایت www.pooryab.ir  با این کلمه در صفحه اول قرار دارد

2.کلمه کلیدی (باغ عروسی) که سایت www.daneshgarden.com با این کلمه در صفحه اول قرار دارد

بهینه سازی سایت

بهینه سازی سایت

قالب گرافیکی استاندارد

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

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

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

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

نمونه کارها

قالب گرافیکی استاندارد

قالب گرافیکی استاندارد

طراحی گرافیکی سایت

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

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

طراحی گرافیکی سایت ما شامل موارد زیر می باشد :

  • طراحی قالب گرافیکی سایت ویزه و خاص
  • طراحی سایت مناسب با موتورهای جستجو
  • طراحی گرافیکی سایت در سه رنگ متفاوت به صورت رایگان
  • برنامه نویسی و اجرای سایت
  • انجام بهینه سازی سایت برای موتورهای جستجو

نمونه کارها

طراحی گرافیکی سایت

طراحی گرافیکی سایت

اینفوگرافیک

داده‌نمایی یا همان اینفوگرافیک به نمایش داده‌ها با استفاده از چند نمودار و شکل در قالب یک تصویر گفته می‌شود. داده‌نما یا اینفوگرافیک (گرافیک اطلاع‌ رسان) نمایشگرانی هستند که داده ها و اطلاعات را به زبان تصویری ساده ، برای مخاطب بیان می کنند. استفاده از گرافیک‌های اطلاع رسان باعث می‌شود بیننده، حجم قابل توجهی از اطلاعات را که شکل نوشتاری آن ممکن است مقاله بلند بالایی را تشکیل دهد، به سادگی و در کوتاه‎ترین زمان ممکن از طریق بصری دریافت کند داده‌نما می‌تواند شامل جدول، نمودار، متن و عکس باشد.

اینفوگرافیک درطراحی قالب سایت  واقع روشی است که با استفاده از آن، اطلاعات به صورت گرافیکی به کاربران سایت منتقل میگردد در این روش شما می توانید اطلاعات و ارقام خسته کننده را به صورت جذاب و زیبا درآورید در حالیکه اغلب اینفوگرافیک ها مجموعه خاصی از اطلاعات را نمایش می دهند، اما اینفوگرافیک طراحی سایت ابزاری است که با ایجاد یک گرافیک واضح، می توان ترافیک سایت را افزایش داد و باعث جذب کاربران شود

اینفوگرافیک

اینفوگرافیک در طراحی سایت

تایپوگرافیک هنر مرتب نمودن کلمات و حروف برای انتقال بهتر مفاهیم است تا کلمات به صورت زیبا نمایش داده شوند و مخاطب به راحتی و بدون نیاز به زمان مفهم شما را متوجه شود در حالیکه اینفوگرافیک بسیار گسترده تر از آن است و علاوه بر کلمات به جنبه های بصری نیز توجه دارد و شما می توانید از تصاویر هم استفاده کنید مهم ترین نکته که معمولاً اکثر طراحان اینفوگرافیک به آنها توجه نمی کنند این است که در طراحی سایت فضای کمی برای ارائه اطلاعات دارید، پس همیشه این فضا را در نظر بگیرید و اطلاعات را به شیوه مختصر و روشن نمایش دهید اگر شما مجبورید که اطلاعات زیادی را در فضای کمی قرار دهید، از بوردر برای مشخص کردن مرزها استفاده کنید؛ و در نظر داشته باشید که فضای کافی برای هر قطعه از اطلاعات قرار دهید تا کاربر سایت سردرگم نشود و بتواند به راحتی اطلاعات مورد نیاز خود را در سایت شما پیدا کند

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

مرتب کردن مطالب و انتقال درست به کاربران : در این حالت کلمات و در نهایت جنبه های بصری در اینفوگرافیک سایت موثر هستند .

انتخاب رنگ زیبا : انتخاب رنگ زیبا و متناسب با فعالیت شرکت شما می تواند در اینفوگرافیک سایت موثر باشد .

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

 

اینفوگرافیک

اصول طراحی قالب سایت

اصول طراحی قالب سایت ، شما می توانید با طراحی یک سایت خوب تجارت خود را گسترش دهید و کسب و کار بهتری داشته باشید پس بهتراست  از ابتدای کار اصول طراحی قالب سایت را رعایت کنید تا وب سایت خوب و کاربردیی طراحی گردد و هم شما و هم مشتریان شما راضی باشید

ازجمله مهمترین اصول طراحی قالب سایت می توان به گرافیک سایت اشاره کرد :

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

2.همیشه برای گرافیک سایت از تصاویری استفاده کنید که با سایت شما همخوانی داشته باشد تا به زیبایی سایت خود بیفزاید

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

 

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

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

2. همیشه اندازه فونت را رعایت کنید معمولا کمترین اندازه 12px می باشد کمتر از این اندازه برای کاربران خوانا نیست

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

 

مهمترین اصول طراحی قالب سایت توجه داشتن به کاربران است :

1. همیشه سلیقه کاربر اصلی سایت خود یعنی مشتری خود را در نظر بگیرید و سعی کنید همه موارد را حول محور سلیقه و انتخاب او پیش ببرید

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

اصول طراحی قالب سایت

نمونه کارها

اصول طراحی قالب سایت

اصول طراحی لوگو

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

اصول طراحی لوگو :

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

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

3. در طراحی لوگو به سلیقه مشتری خود احترام بگذارید و لوگویی طراحی کنید که مشتری دوست داشته باشد و نظرات خود را به او تحمیل نکنید

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

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

6. در هنگام طراحی لوگو ذهن را آزاد بگذارید و به نمونه های قبلی و مشابه فکر نکنید تا طرح منحصر به فرد ایجاد کنید

7. همیشه در مرحله اخر رنگ آمیزی کنید زیرا هم در این صورت نمونه چاپی لوگوی خود را می بیند زیرا لوگوها باید در چاپ سیاه و سفید هم معنی داشته باشند و هم از شلوغی کار می کاهید تا سردر گم و گیج نشوید

8. با توجه به نوع کاری کمپانی خود از آیتمها استفاده کنید مثلا اگر کمپانی شما یک بانک است نباید از ایتمهای فان و خنده دار استفاده کنید همه چیز باید رسمی و جدی باشد

9. سعی کنید لوگوی ساده طراحی کنید هر چه طراحی لوگو شما ساده تر و قابل فهم تر باشد در ذهن مشتری بیشتر خواهد ماند

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

 

اصول طراحی لوگو

وب سایت چیست؟

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

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

اهداف طراحی وب سایت :

  • آموزشی (به صورت رایگان و یا با پرداخت هزینه)
  • ورتال‌های سازمانی، ارگان‌ها و مراکز دولتی برای ارائه خدمات عمومی و یا استفاده درون سازمانی و…
  •  اطلاع رسانی و ارائه اخبار داخلی (سازمان، دانشگاه و…) و یا عمومی (خبرگزاری ها)
  •  تجاری (معرفی محصولات، خدمات، بازاریابی، تبلیغات، فروش آنلاین، تجارت الکترونیک و…)

ویژگیهای یک وب سایت :

  • ابتدا شما برای طراحی یک وب سایت احتیاج به طراحی قالب  گرافیکی دارید
  • انتخاب نام وب سایت و خریداری هاست و دامنه
  • طراحی لوگو و انتخاب رنگ سایت
  • برنامه نویسی و اجرای گرافیک سایت اغلب باید توسط یک برنامه نویس انجام شود زیرا پیچیدگی و مراحل خود را دارد که نیاز به دانش مربوطه دارد
  • طراحی اسلایدر و بنر سایت
  • وارد کردن اطلاعاتی که سایت برای آن طراحی شده است

 

نمونه کارها

قالب سایت شخصی

وب سایت چیست؟

 

وب سایت چیست؟


طراحی اسلایدر

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

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

اسلایدر سایت

لباس مجلسی

اسلایدر تولد

طراحی اسلایدر

اسلایدر سازمانی

اسلایدر سه بعدی

اسلایدر همراه اول

طراحی اسلایدر انار

اسلایدر سایت زبان

طراحی اسلایدر1

اسلایدر تعمیرات موبایل

اسلایدر سایز بزرگتر (اسلایدر سایت روغن لادن) :

اسلایدر روغن لادن

اسلایدر قلب و گل

اسلایدر خانواده

اسلایدر کودک

 

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

امکانات ما برای طراحی اسلایدر :

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

طراحی اسلایدر

تکنیک های طراحی سایت

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

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

نمونه ای از یک طرح تکنیکال ساده :

نمونه کارها

تکنیک های طراحی سایت

تکنیک های طراحی سایت

عکاسی

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

1. دوربین را در هین عکاسی همیشه هم سطح با چشمان سوژه خود قرار دهید

اگر در عکاسی دوربین هم سطح با سوژه نباشد زیاد مناسب نیست اگر از بالا به سوژه نگاه کنید تحقیر آمیز و سوژه کوچک می شود و اگر از پایین باشد سوژه بیش از اندازه طبیعی بزرگ به نظر می رسد

عکاسی

2. همیشه سعی کنید از زمینه یک دست استفاده کنید تا سوژه شما در عکستان به خوبی نمایان شود

اگر در عکس زمینه شما شلوغ باشد سوژه شما به راحتی در زمینه گم می شود و عکس شما زیبایی خود را از دست می دهد

عکاسی خوبعکاسی درست

3. در زیر نور آفتاب و نور شدید از فلش استفاده کنید

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

عکاسی با فلش

4. سوژه خود را در مرکز کادر عکاسی خود قرار ندهید

در اغلب عکاسی های قدیمی سوژه دقیقا در وسط کادر قرار می گیرفت اما امروزه سوژه در نقاط طلایی و در گوشه سمت چپ یا راست عکس هم می تواند قرار بگیرد بهتراست از چیزهای تکراری و کلیشه ای دوری کنید

کادر بندی

 5. همیشه هواستان به فکوس دوربین باشد که دقیقا روی چه سوژه ای فکوس شده

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

فکوس دوربین

 6. طول و اندازه برد فلش دوربین خود را بدانید

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

برد فلش در عکاسی

7. سعی کنید تا جایی که لازم است به سوژه خود نزدیک شوید

اگر سوژه شما از یک خودرو کوچکتراست حتما به او نزدیک شوید و سعی نکنید با زوم کردن عکس بگیرید زیرا اغلب دوربین ها زوم خوبی ندارند و عکس شما تار می شود

عکاسی نزدیک

8. همیشه به نور در عکاسی توجه داشته باشید

نور مهمترین عامل در عکس است همیشه سعی کنید بیرون ازخانه و در نور زیاد عکس بگیرید و بهترین نور برای عکاسی یک روز ابریست که خورشید در پشت ابرهاست و همیشه سعی کنید در مسیر نور عکس بگیرید و پشت شما به نور باشد و روی سوژه سایه ایجاد کنید

نور در عکاسی

9. عکاسهای خود را کارگردانی کنید کمی به سوژه انعطاف دهید

از چیزهای تکراری فرار کنید سعی کنید همیشه عکسهای جدید به سبکهای جدید بگیرید از مدلهای استادن تکراری، لبخندها یا ژستهای کلیشه ای خود داری کنید

عکاس

برگرفته از سایت ( امید رحمانی )

عکاسی

رسپانسیو

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

رسپانسیو

سایت ریسپانسیو

اما سایتهای رسپانسیو این قابلیت را دارند که تمامی محتوای وب سایت را در هرنوع مرورگر یا وسیله ای به طور کامل نمایش دهند برای تست رسپانسیو بودن سایت می توانید مرورگر خود را ازحالت maximize   خارج کرده  و با موس صفحه مرورگر را کوچک و بزرگ کنید ، می بینید که سایز صفحه تغییر می کند اما نوشته ها و لینک ها همچنان خوانا هستند و نیازی به zoom in و یا  zoom out  و اسکرول ندارند ، این کار را هم در صفحه اصلی و هم در صفحات داخلی تست کنید گر سایت مورد نظر شما در تمامی حالات درست بود و شما می توانستید متون را راحت بخوانید پس این سایت رسپانسیو طراحی شده است

ازجمله معایت و فواید سایتهای رسپانسیو در طراحی سایت و گرافیک سایت :

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

رسپانسیو

پارالاکس

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

طراحی پارالاکس (Parallax) چیست؟

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

پارالاکس

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

مزایای استفاده از طراحی پارالاکس (Parallax) در طراحی قالب سایت :

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

معایب استفاده از طراحی پارالاکس (Parallax) در گرافیک سایت :

  • تک صفحه بودن سایت که  خود نکته ای منفی در بهینه سازی وب سایت (سئو) محسوب می شود
  • زمان بارگذاری سایت بالا می رود
  • عدم سازگاری با طراحی رسپانسیو و تلفن های هوشمند

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

نمونه ای از سایتهای پارالاکس یا همان سایتهای تک صفحه ای در طراحی قالب سایت:

www.terra-digitalis.dfg.de

سایت پارالاکس
www.honda.com.au/cars/models/cr-v.html

پارالاکس چیست
www.everylastdrop.co.uk

پارالاکس جالب

پارالاکس

نقطه طلایی

نقطه طلایی در عکاسی و همچین نقطه طلایی در طراحی بسیار مهم است زیرا نقطه طلایی جایی است که کاربر به صورت غیر ارادی در اول نگاه خود به تصویر می بیند پس اگر ما در طراحی وب سایت و گرافیک سایت به درستی از نقاط طلایی استفاده کنیم قالب سایت حرفه ای و  مناسبی خواهیم داشت در زیر به توضیح نقطه طلایی و یک سوم می پردازیم.
» خطوط پهنا (افقی) :

نقطه طلایی

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

EDUTOPIA0007

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

» خطوط بلندا (عمودی) :

دو خط عمودی در بلندای،  تصویر را به سه قسمت تقسیم نموده اند.

EDUTOPIA0008

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

خطوط عمودی

» (+) طلایی :

در مکان برخورد این خطوط (افقی و عمودی) به یکدیگر یک + شکل گرفته است که نقاطه طلایی را می سازد.

ترازبندی چیست

این + ها اثرگذارترین نقطه های تصویر شما را نشان می دهید.

نقاط طلایی در عکاسی

نقطه طلایی در تصاویر

هر چیزی که در این جا قرار بگیرد ارزش مکانی ویژه ی خود را خواهد داشت.
»  تراز بندی :

تراز بندی را از یاد نبرید، بین چپ و راست تصویر همانند یک ترازو، توازن ایجاد کنید.

تراز بندی در عکاسی

ترازبندی

چهار خط راهنما که کادر تصویر ما را در پهنا و بلندا به ۹ قسمت تقسیم کرده بودند خطوط طلایی ما هستند.

محل برخورد این خطوط به یکدیگر (+) نقاط طلایی نامیده می شود.

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

» یک سوم ها در عکاسی :

کادر در عکاسی، محیطی‌ست که تصویر در آن جای می‌گیرد.

یک سوم

کادر همیشه به شکل یک مستطیل است. اگر آن را همانند شکل بالا، به یک‌سوم‌های مساوی تقسیم کنیم، 4 نقطه پدید می‌آید که به آن نقاط طلایی گفته می‌شود.

بهتر است سوژه خود را در مرکز کادر خود قرار ندهیم زیرا بسیار کلیشه و ابتدایی‌ست ( مگر در جاهایی خاص ).

سعی کنید کادر خود را متناسب با این یک‌ سوم‌ها تنظیم کنید. مثلا خط افق را در یک سوم پایین بگذارید و سوژه‌ای که از آن عکس می‌گیرد را در یک سوم راست و در نقطه طلایی قرار دهید تا تصاویر زیبا خلق کنید.

یک سومها در عکاسی

یک سوم در طراحی

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

نقطه طلایی

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

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

رنگ ها می توانند احساسات مهم و  زیادی را منتقل کنند  طراحی قالب گرافیکی سایت خیلی مهم است که بدانید  رنگ ها چه تاثیری دارند روی ذهن کاربر دارند.

آیا می دانید که رنگ ها چه مفهومی  طراحی قالب گرافیکی سایت  دارند؟

رنگ های گرم و سرد:

warmcolors

coolcolors

هارمونی رنگها  سایت ،رنگ های گرم شامل رنگ های قرمز، زرد نارنجی است . از این رنگ برای دیوار ها و خانه استفاده می شود یا به عنوان رنگ تاکید کننده و نمایش بیشتر رنگ های خنثی ( سفید و مشکی) استفاده می گردد

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

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

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

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

رنگ های سرد باعث ایجاد اثرات منفعل( غیر فعال) مغز می شود که باعث ایجاد احساس رضایت، آرامش و عدم فعالیت کاربران وب سایت می گردد.

قرمز

 

red2

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

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

چکیده خصوصیات رنگ قرمز:

  • رنگ قرمز روشن برای بیان عشق و لذت به کار می رود.
  • قرمز تیره برای بیان حس انتقام جویی، عصبانیت همچنین شجاعت و رهبری را القا می کند.
  • صورتی برای ایجاد فضای رمانتیک و قابلیت های زنانه استفاده می شود.
  • قرمز- قهوه ای تغییر و سقوط را القا می کند.

سبز

 

green2

رنگ سبز یکی دیگر از رنگ های اولیه است .این رنگ یکی از آرامش بخش ترین رنگ ها است که دارای سایه های خنثی است.

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

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

چکیده خصوصیات رنگ سبز:

  • زرد- سبز بیماری و اختلاف را القا می کند.
  • سبز تیره جاه طلبی، کامیابیرا القا می کند.
  • سبز متمایل به آبی سلامتی و ثبات را القا می کند.
  • سبز زیتونی نماد صلح و هارمونیرا القا می کند.

آبی

blue1

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

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

آبی به آب و آسمان نیز ارتباط دارد که به وب سایت شما حس طبیعت را میدهد.

چکیده خصوصیات رنگ آبی :

  • آبی روشن سلامتی، عمق، ثبات و ایمان را القا میکند .
  • آبی تیره تر دانش ،اعتماد و کمال را القا می کند.

بنفش

purple1

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

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

چکیده خصوصیات رنگ بنفش

  • بنفش روشن حس لطافت، حس نوستالژی و رومانتیک را القا می کند.
  • بنفش تیره حس دمدمی مزاج بودن، سر سختی ، دلتنگی و نا امیدی و بعضی مواقع حس جاه طلبی و نظارت  القا می کند .

زرد

yellow1

 

زرد به راحتی هارمونی رنگها در سایت ، شادی را القا می کند. این رنگ با احساس انرژِی زائی و تشویق  ارتباط است. این رنگ بسیار مهیج است و به همه چیز حس روشنائی و خورشیدی می دهد. یکی از معایب استفاده از رنگ زرد انتقال حس خطر است.

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

چکیده خصوصیات رنگ زرد:

  • رنگ زرد روشن برای القای حس خطر و ترس است.
  • رنگ زرد تیره تر برای القای شادی ، لذت و تازگی است.

نارنجی

نارنجی یک ترکیب دارای (هارمونی رنگها در سایت) هارمونی بین رنگ های قرمز و زرد است. یعنی ترکیب عشق و انرژی با رنگ اولیه یعنی زرد به همراه حس خورشیدی و تازگی آن است.نارنجی به برقراری تعادل، انرژی زا بودن و فراخوانی گرایش دارد.

اما استفاده از این رنگ کمی سخت است . طیف های نارنجی بیشتر،  قسمت های مهم سایت و به صورت رنگ تائید کننده استفاده می شود، اما وقتی به عنوان رنگ غالب از آن استفاده کنیم کمی کار شلوغ به نظر می رسد.

چکیده رنگ نارنجی  هارمونی رنگها در سایت

  • زرد- نارنجی یا نارنجی طلایی حس پرستیژ و خرد را القا می کند.
  • قرمز – نارنجی حس لذت، انرژی و سلامتی و آرزو را القا می کند.
  • نارنجی تیره به معنی تغییر و عدم اطمینان است.

قهوه ای و رنگ های خنثی

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

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

brown4

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

چکیده خصوصیت رنگ قهوه ای

  • قهوه ای خیلی کمرنگ برای القای آرامش، پاکی، ظرافت است.
  • قهوه ای کمرنگ ( میانه) خستگی، کسلی و حفاظت القا می کند
  • قهوه ای تیره استحکام، راحتی و تجربه  القا می کنند.

سیاه و سفید

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

سفید معمولا مذمون تمیزی، پاکی و کمال  القا می کند. رنگ مشکی معنی قوی بودن ، رمز آلود بودن و ظرافت را منتقل میکند. بعضی اوقات معنی ترس و نا شناخته بودن را هم میدهد.

black1

 

چکیده خصوصیت رنگ ها ی سفید و مشکی گرافیک سایت:

  • سفید، تمیزی، پاکی و رهایی  طراحی وب سایت القا می کند.
  • سیاه، قوی، ظرافت و رمزآلودگی طراحی گرافیکی قالب سایت القا می کند.
  • توسی آرامش و بی تمایلی طراحی اسلایدر سایت القا می کند.

 

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

نوشته‌های تازه