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

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

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

1. استفاده از سایه ها برای زیبا سازی طراحی سایت:

سایه (Drop Shadow) از اولین تکنیک های طراحیست که اکثر طراحان از آن در طراحی سایت استفاده می کنند. دو نوع سایه داخلی و خارجی وجود دارد که استفاده از آن باعث می شود که تصویر فرو رفته و یا برجسته شود و به عبارتی دیگر تصویر 3D به نظر می رسد.

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

2. استفاده از گرادیان رنگ برای زیبا سازی طراحی سایت:

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

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

3.استفاده از تصاویر گرافیکی برای زیبا سازی طراحی سایت:

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

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

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

وقتی کاربر به طور اتفاقی وارد سایتی می شود اولین سوالی که برایش پیش میاید این است که این سایت چه خدمتی ارائه می دهد؟  آیا برای یک شرکت تولیدات صوتی تصویریست؟ آیا برای یک سازمان خدماتیست؟ آیا برای یک برنامه تلویزیونیست؟ و ....

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

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

سایت  Colorblind Web Page Filter محیط و رنگ سایت شمارا از دید کاربران بازسازی می کند واین امکان را به شما می دهد تا بررسی کنید همه ی مطالب خوانا و قابل تشخیص هستند یا خیر.

انتخاب ترکیب مناسب رنگ ها برای طراحی سایت:

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

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

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

مشتریان به چه چیزی اهمیت می دهند؟

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

استفاده از ادبیات مناسب

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

درباره ی ما نباید شامل تبلیغات باشد

در این بخش می خواهیم شرکت و یا برند خود را معرفی کرده و اهداف کلی شرکت بیان کنیم و برتری شرکت خود را به مشتری بفهمانیم برای داشتن یک درباره ی ما قوی به هیچ عنوان نباید تبلیغات داشته باشیم.

استفاده از تصاویر

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

معرفی مشتریان شاخص

معرفی مشتریان و بیان اظهار نظراتشان در باره ی نحوه ی عملکرد شرکت  در بخش درباره ی ما می توانید اعتماد مشتریان بیشتری را به برند خود جلب کنید.

الکسا یک وب سایت آنالیز کننده از سرویس های amazon است که در آدرس www.Alexa.com قابل دسترسی برای عموم است. از طریق آن می توان از اطلاعات کلی میزان ترافیک (تعداد بازدیدکنندگان) و محبوبیت یک سایت مطلع شد. هرچه عدد رتبه بندی به عدد 1 نزدیکتر باشد رتبه وب سایت بهتر وبالاتر می باشد.

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

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

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

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

 http://www.alexa.com/siteinfo/migna.ir

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

1. Claim Your Site: به الکسا اجازه دهید که برای آنالیز بهتر بتواند به وب سایتتان دسترسی داشته باشد. برای این کار ID الکسا را درheader وب سایت خود قرار دهید.

2.نصب toolbar الکسا: نوار ابزار الکسا را در مرورگر خود نصب کنید و  به دیگران و کربران وب سایت خود نصب toolbar الکسا را پیشنهاد کنید.

3. به روز کردن مداوم وب سایت: الکسا از محتوایات تازه وب سایت ها استقبال می کند پس سعی کنید محتوای سایت خود را در هفته 7 تا 10 مرتبه به روز نمایید.

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

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

6. اظهار نظر در وبلاگ: هرگز در اظهار نظر کردن در وبلاگها زیاد روی نکنید چرا که ممکن است گوگل شمارا اسپم کند. پس در پست تان از کلمات کلیدی عاقلانه بهره ببرید. تا رتبه الکسا شما پیشرفت چشمگیری کند.

7.Go for Alexa-pro: برای افزایش رتبه الکسا از شبکه های اجتماعی و لینک های شبکه های اجتماعی همانند فیس بوک، توییتر، گوگل پلاس استفاده کنید.

CTA مخفف Call To Action است. همانطور که از نامش مشخص است هدف این تکنیک اینست که کاربر را تشویق به کلیک بر روی دکمه  CTA می کند تا فعالیت مورد نظر انجام شود. CTA ها در بنرها ، وب سایت ها و خبرنامه ها کاربرد دارد.

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

در طراحی سایت Call To Action  ها را در کجا بکار ببریم؟

اولین سوالی که برای طراح سایت بوجود میاید این است که محل مناسب قراردادن CTA کجای صفحه سایت، بنر ویا خبر نامه است!

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

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

چگونه Call To Action  خود را  گیرا و تاثیر گذار کنیم؟

متن یا عبارتی که برای CTAها بکار میبریم بسیار حائز اهمیت است. در کشور ما اکثر طراحان از عبارت "اطلاعات بیشتر" استفاده می کنند که تاثیر گذاری چندانی ندارد.

برای انتخاب عبارت مناسب برای  CTA ابتدا باید مقدمه و زمینه کلیک کردن روی  CTAتان را فراهم کنید.

با پاسخ دادن به این پرسش "کسب و کار شما چه خدماتی را به کاربران ارائه می دهد؟" برای موثر واقع شدن CTA کافیست در یک عبارت ویا جمله خدماتی را که عرضه می کنید شرح دهید.  

نکاتی که به هنگام استفاده Call To Action در طراحی سایت باید رعایت شوند

1. اندازه ی CTA باید بزرگ باشد تا هدف درخواست انجام فعالیت که جلب توجه کاربر است محقق شود.
2. فضای کافی برای CTA در نظر بگیرید زیرا شلوغ کردن صفحه کاربرد CTA را از بین میبرد. پس ترکیب مناسبی بین CTA و دیگر الملن های صفحه ایجاد کنید.
3. CTA  را در ابتدا و بالای صفحه قرار دهید تا کاربر بدون اسکرول کردن به پایین صفحه آن را مشاهده کند.
4. یکی از عوامل مهم و تاثیرگذار برای جلب توجه CTA استفاده از تضاد رنگی است.برای این کار می توانید از رنگی مخالف  رنگ زمینه برای متن ویا دکمه خود استفاده کنید.
5. استفاده از جلوه خاص پس از قرارگیری ماوس بر روی  CTA یکی دیگر از اقدامات جلب توجه است. مانند تغییر رنگ دکمه به هنگام قرار دادن ماوس بر روی دکمه یا متن.  
6. شکل اغلب CTA ها مستطیل شکل است در صورت استفاده از تصاویر گرافیکی  از تصاویری استفاده کنید  که دارای گوشه های  گرد و خمیده باشد. گرافیک هایی که دارای گوشه های تیز هستند کاربر را به یاد تبلیغات می اندازد و نرخ کلیک را کاهش می دهد.
7. استفاده از جهت ها و فلش ها برای جلب توجه بیشتر CTA
8. در CTA بیشتر بر روی متن توجه کنید تا گرافیک! تحقیقات نشان می دهند که کاربران محتویات متنی را بیشتر از محتویات گرافیکی می خوانند.
9. ترجیحا و تا حد امکان از چند CTA در صفحه استفاده نکنید. در صورت استفاده از چند CTA در طراحی سایت آنها را اولویتبندی کنید. آنهایی که مهمترند را از لحاظ اندازه بزرگتر و از لحاظ مکان در موقعیت بالاتر قرار دهید. 

بهترین رنگ برای Call To Action چه رنگی است؟

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

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

چند اصل مهم در افزایش پیج رنک عبارتند از:

1. مهمترین اصل که باید برای افزایش و بهبود پیج رنک استفاده کرد، رعایت اصول بهینه سازی سایت می باشد؛ که می توانید با مطالعه بخش بهینه سازی سایت با این اصل آشنا شوید.
2. همچنین رعایت HEO نیز می تواند تاثیر گذار در جذب مخاطبان باشد، که یکی از موارد امتیاز دهی به طراحی سایت و وب سایت، داشتن آمار بازدید زیاد است.
3. بعد از رعایت این موارد شما باید اغدام به تبلیغ وب سایت خود در سایت های پر بازدید نمایید. تبلیغاتی که لینک وب سایت شما در آن قرار داشته باشد، البته توجه نمایید، لینک به کلمه ایی که مد نظر شماست که می خواهید نتیجه جست و جوی آن کلمه در اینترنت و موتور های جست و جو وضعیت بهتری پیدا نماید.
4. نکته مهم دیگری که باید رعایت نماییم، تولید محتوای مناسب و ایجاد ارتباط بین این محتوا می باشد. شما می توانید به عنوان مثال مقالات آموزشی ما را تماشا فرمایید ،و ارتباطات بین این محتوا را که توسط لینک شدن کلمات می باشد، مشاهده نمایید؛ که قطعا باعث افزایش پیج رنک شما خواهد شد.
5. نکته آخری که برای بهبود پیج رنک و بالا رفتن پیج رنک می توانیم به آن اشاره نماییم، داشتن صفحه های متناظر با وب سایتتان در جوامع مجازی مثل فیسبوک می باشد.

مهمترین مسئله ایی که برای رتبه بندی سایت ها به آن اشاره می توان کرد، رتبه بندی آنها در موتور های جست و جو می باشد، که این رتبه بندی بسته به امتیاز های بدست آمده توسط وب سایت از قبیل : آمار بازدید ، محتوای مناسب، تعداد لینک ها و... می باشد.

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

در ادامه مقالات به روش های پیشرفت در پیج رنک و افزایش پیج رنک می پردازیم.

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

مهمترین مسئله ایی که برای رتبه بندی سایت ها به آن اشاره می توان کرد، رتبه بندی آنها در موتور های جست و جو می باشد، که این رتبه بندی بسته به امتیاز های بدست آمده توسط وب سایت از قبیل : آمار بازدید ، محتوای مناسب، تعداد لینک ها و... می باشد.

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

در طراحی سایت به رو فول فلش، از نرم افزار فلش استفاده می شود.

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

البته اصطلاح فول فلش در طراحی سایت های استاتیک به کار می رود، در طراحی سایت های داینامیک این روش را فلش داینامیک می نامند.

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