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

  • اصول اولیه طراحی سایت تجاری

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

  • حتما میپرسید پس داره چی کار می کنه؟

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

  • من اینجا چی کار میکنم؟

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

  • من کلا گیج شدم.

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

  • اصول اطلاعات

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

  • شما با ما در امنیت هستید.

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

  • اصول اولیه طراحی سایت شخصی
  • این سه نکته

همین که یه نفر پاشو به صفحه شما میذاره، باید بفهمه شما کی هستید، چی کار می کنید و از بازدیدکننده چی میخواهید. لازم نیست یه جلد کتاب درباره خودتون بنویسید. 2-3 پاراگراف کافیه. این کار به سئوی سایتتون هم کمک می کنه. چند تا از جاهایی که کار می کنید رو معرفی کنید. یه سری از پروژه هایی که روشون کار کردید و بهشون افتخار می کنید رو هم بگید و توضیح بدید چرا این کارها براتون افتخار انگیز هستن. نقاط قوتتون رو تو حوزه کاری که توش تخصص دارید نام ببرید. تو این قسمت میتونید یکم هم از شخصیتتون بگید. با یکمی شوخ طبیعی، جذابش کنید. البته اگه واقعا آدم شوخ طبیعی هستید اینکار خوب از آب درمیاد. وگرنه بهتره بی خیالش بشید. فلسفه خودتونو از یه سری مسائلی که فکرتونو زیاد به خودشون مشغول کردن توضیح بدید. بذارید کسی که از صفحه دیدن می کنه، شما رو ببینه. اما باید هوشیار هم باشید. قرار نیست اینجا داستان زندگیتونو بگید. زیادی شخصیش نکنید. اگه زیادی رک و صادق باشید، قسمت "شرحی کوتاه درباره من" خیلی زود تبدیل میشه به "کل دنیای عجیب و غریب". اینجا باید بهترین قضاوت هاتونو داشته باشید. حتما اصل کم گویی رو رعایت کنید.

  • این یکی رو حتما بخونید

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

  • من اینطور فکر می کنم

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

  • کجا بودید؟

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

  • یه رفیق خوب شاد

از اینکه نمونه کارهاتونو بذارید تا دیگران هم ببینید ترسی نداشته باشید. اتفاقا اگه بتونید با اعتماد به نفس درباره خودتون حرف بزنید خیلی خوبه. حتی اگه بتونید دیگران رو هم مجاب کنید که درباره شما خوب بگن، بهتر هم میشه. چند تا حرف کوتاه، یا یکی دو پاراگراف درباره نحوه کار کردنتون و اینکه همکاری با شما چطوریه. اینجور چیزها باعث میشن جذاب تر و کامل تر به نظر بیایید. اینجا هم دوباره کم گویی صدق می کنه. خوب نیست چند صفحه مطلب درباره خوبی های خودتون بنویسید و از خودتون تعریف کنید. زیاده گویی تو این قسمت، باعث میشه مطلب از اینکه "چه آدم خوبیه" تبدیل بشه به اینکه "این یارو زیادی به خودش میباله، مگه نه؟".
خب بفرمایید. اینم یه نگاه گذرا و کوتاه که فکرتونو به طراحی قدیمی سایتتون درگیر کنه و برای فکر کردن به طراحی سایت جدید مشتاقتون کنه. البته فقط یه نگاه گذرا بود، در حد یه یادآور. به این جمله فکر کنید: تار عنکبوت طوری طراحی شده که طعمه رو جذب کنه و نگه داره. تار حشرات، قطره های آب و اینجور چیزها رو تا وقتی که عنکبوت بخواد بخوردشون یا تو شکمشون تخم ریزی کنه نگه میداره. جدا از محدودیت دسترسی تار عنکبوت و خوردن بازدیدکننده ها، شبکه جهانی وب هم میتونه مثل شبکه تار عنکبوت عمل کنه. صفحه وب شما باید طوری طراحی شده باشه که توجه کاربرها رو جلب کنه و نگه داره. از اینجا میتونید ایده ها، خواسته ها و اطلاعاتتونو تو سرشون بریزید. برای رسیدن به این هدف باید طراحی سایتتون قوی باشه. از خودتون بپرسید، سایت من چقدر قویه؟ عنکبوت درختی داروین میتونه تاری به پهنای تقریبا 25 متر بتنه و خود تار 10 برابر قوی تر از تارهای کوچیکه. این یعنی جدیت در کار و قدرت. اینطوری احتمالا یه اسب آبی به دام میندازه و کل عمرش میتونه مثل یه پادشاه غذا بخوره. سایت شما هم همین قدرت رو تو طراحی داره؟ میتونید توجه نصف بازدیدکننده ها رو جلب کنید و تو سایتتون نگهشون دارید؟

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

  • وایرفریم دقیقا چیست؟

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

  • نقش مشتری چیست؟

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

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

دو نکته در مورد طراحی سایت واکنش گرا برای توسعه دهنده های ظاهری سایت
دوست دارید یه سایت واکنش گرای حسابی طراحی کنید اما نمیدونید از کجا شروع کنید؟ از اونجایی که احتمالا چند ساله که تو کار توسعه سایت هستید، باید خیلی براتون سخت باشه...به اندازه کافی تو این کار بودید که سایت های جذاب و درخشانی رو ببینید که از دوران تیره و تار اینترنت - اون زمانی که هیچ کس اطلاعاتی نداشت یا اگر هم داشت به دیگران نمیداد - زنده بیرون اومده باشن. ترس نداره: دارکوب اینجاست که راه طراحی های واکنش گرا رو نشونتون بده. این مقالک قرار نیست به اندازه عنوانش فنی باشه. بیشتر قصد داریم دو عنصر اساسی طراحی واکنش گرا رو برای توسعه دهنده های سطح متوسط – که جاوااسکریپت، CSS و غیره رو بلدند - معرفی کنیم.
قبل از اون، طراحی سایت واکنش گرا چیه؟ احتمالا از اینور و اونور درموردش شنیدید یا خوندید. اگه نشنیدید، در این حد بدونید که سایتی که برای مشاهده در دستگاه های مختلف (گوشی تلفن همراه، تلفن هوشمند، کامپیوتر رومیزی، لپتاپ و تبلت) مناسبه. البته توجه داشته باشید که شامل سایت هایی که مناسب صفحه نمایش های بزرگ و آخرین مدل های تلویزیون طراحی شدند هم میشه.

  • آنچه باید درباره CSS3 بدانید

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

  • آنچه باید درباره جاوااسکریپت بدانید

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

دوشنبه, 29 شهریور 1395 09:41

طراحی سایت بدون صفحه چیست؟

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

  • سازگاری با تلفن همراه

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

  • پیمایش کلیکی و ضربه ای

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

  • سازماندهی داستان

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

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

  • داستان یکی از مشتری ها

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

  • چطوری فریب نخوریم

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

  • کروم یا فایرفاکس باز کنید.
  • سایت شرکت مورد نظر رو باز کنید و دنبال سایتهایی که قبلا طراحی کردن بگردید.
  • یکی از اون سایت ها رو باز کنید، روی صفحه راست کلیک کنید و view source code رو کلیک کنید.
  • Find رو بزنید: توی مک باید دستور + F بدید.
  • Theme رو پیدا کنید. باید دنبال کدی بگردید که این عبارت توش باشه: wp-content/theme/ و آخرش هم اسم کد رو نوشته.
  • اسم کد رو که بعدا از theme/ نوشته میشه نگاه کنید. اگه خودشون ساخته باشن باید اسم سایت باشه. (راه های زیادی برای تقلب هست، اما عوض کردن این یکی سختتره). اگه دیدید اسم با اسم سایت یکی نیست، کپیش کنید.
  • برید تو گوگل و عبارت ("اسم تم کپی شده" wordpress theme) رو گوگل کنید. احتمالا اولین نتیجه باید همون تمی باشه که دنبالش بودید.
  • سایر نشونه های اینکه سایتتون شخصی نیست
  • قبل از توسعه سایت، نمونه فتوشاپی سایتتون رو بهتون نشون نمیدن.
  • طراح بهتون میگه که نمیتونن تغییرش بدن. (مجبورید ساختمان کلی قالب رو هرطور که هست قبول کنید)
  • هیچ جای سایت شرکت طراحی سایت کلمه "سفارشی" دیده نمیشه. (البته ممکنه بعضی شرکت های معتبر هم از این کلمه استفاده نکنن، میتونید تو این مورد از خودشون بپرسید یا به سایر علائم توجه کنید).
  • طراحی و قالب سایت همه مشتری هاشون شبیه همن.
  • تو قراردادشون کلمه سفارشی رو فقط به یکی از عناصر طراحی نسبت میدن، مثلا مینویسن "گرافیک هدر سفارشی".
  • نتیجه گیری

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

  • تصاویر و ویدئوهای قهرمان

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

  • طراحی فلت و مینیمالیستی

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

  • پیمایش و الگوی عمودی

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

  • استفاده از فونت های چاپی برای نوشته ها

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

  • تصاویر متحرک کوچک با بارگذاری نامحسوس

از وقتی که سایت ها شروع کردن از تصاویر متحرک فلش استفاده کردن و HTML5 و CSS3 با حرکت های سایده ،برای بارگذاری صفحات متحرک رونق گرفتن، دکمه ها و فهرست های کشویی و چسبنده رواج پیدا کردن.
تو سایت M is for Money  ازTransitions  CSS استفاده شده. اسلایدی که تو سایت میبینید از یه انتقال انیمیشنی بهره میبره و  با تصاویر متحرک و زیبای اسلایدها یه تجربه "جوان پسند" برای سایت خلق می کنه. قبلا، انیمیشین هایی مثلا این رو باید با افزونه هایی مثل فلش درست می کرد. اما الآن CSS Transition ها دیگه نیازی به افزونه ندارن و خیلی سریع تر دانلود میشن. باید در عمل کارشو ببینید تا متوجه بشید.

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

خیلی وقتا می بینم طراحی فقط با هدف زیبایی انجام شده. البته اشتباه برداشت نکنید، شکی نیست که سایت باید زیبا هم باشه. اما هیچ وقت نباید هدف اصلی طراحی رو بذاریم رو زیبایی.
از خودتون بپرسید: اولین شاخص عملکرد کلیدیتون برای سایت جدیدی که میخواهید طراحی کنید چیه؟ منظورم اینه که سایتتونو دارید میسازید تا باهاش محصولاتتونو بفروشید؟ خدماتتونو ارائه بدید؟ قراره این سایت منجر به فروش بیشتر یا جذب مشتری های بیشتری براتون بشه؟ خب اگه سایتتونو این کارا رو نمی کنه یعنی کارشو درست انجام نمیده.
طراحی تو بیشتر پروژه های سایت ها، نقش خیلی مهمی داره. "اگه این کلید اینجا باشه قشنگره، اما در عین حال نرخ تبدیل رو 25% کم می کنه." دقیقا مثل جنگ می مونه. اما متاسفانه خیلی از طراح ها فقط به طراحی فکر می کنن و حتی یه لحظه هم به هدف کسب و کار شما یا اینکه چطوری می تونن شما رو به جایی که میخواهید برسونن، فکر نمی کنن.
پس باید خودتون به فکر خودتون باشید. اجازه ندید رنگ های زیبا و طراحی های پر زرق و برق چشمتونو بگیره. از خودتون و طراح سایتتون بپرسید: چرا این اینجاست؟ این یکی برای مشتری هام چه فایده ای داره؟ کارشونو راحتتر می کنه؟ فروش منو بیشتر می کنه؟ اصل کار همینه که فروشتونو بیشتر کنه. قرار نیست که جایزه ی زیباترین سایت رو ببرید (البته اگه بشه هم جالبه)، هدف شما از ساختن سایت اینه که سودتونو بالا ببرید. به همین راحتی.
خیلی از اینا به شما برمیگرده، چون اینجا شما مشتری هستید. به جای اینکه درباره طراحی سایتتون حرف بزنید، یکم وقت بذارید و به طراحتون توضیح بدید هدف تجاریتون از این سایت چیه، اینجوری به جای بهتری میرسید. هیچی بیشتر از این عصبانیم نمی کنه که یه مشتری بخواد براش طراحی پاراکس کنم یا تصویر متحرک بذارم تو سایتش، یا مثلا رنگ های پاستلی داشته باشه، یا یه عکس کل صفحشو بگیره، یا کلا هر چیزی که مد شده بخواد. از خودتون بپرسید این چیزها به چه درد من میخوره. به تجارتتون کمکی میکنه؟
بیشتر وقت ها اصلا کمکی نمی کنه. طراحی پارالاکس وقتی به درد می خوره که بخواهید طراحی هاتونو تو سایت نشون بدید. اما اگه یه شرکت کوچیک یا متوسط بخواد یه کالایی رو بفروشه، طراحی پارالاکس اصلا لازم نیست. هدف طراحی ارتباط برقرار کردنه، نه هنر. این دو تا رو باهم اشتباه نگیرید.
پس خلاصه بگم، کل حرفم اینه که باید طراحی پیدا کنید که به جای اینکه بخواد ببینه چه جور طراحی ای دوست دارید، بخواد نیازهای کارتونو بدونه. اگه تو سایتتون به نیازهای کاریتون جواب بدید، طراحی خیلی طبیعی تر میشه.
موفق باشید.

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

  • توانایی ها: بله، معلومه که میدونید، اما جدی میگم، سر بحثو باز کنید و ازشون درباره گروه و تونایی هاشون بپرسید. ببینید چه قبلا رو چه نوع پروژه هایی کار کردن. نقاط قوتشون چیه. اگه یه برنامه حرفه ای ایده آل بخواهید نباید با شرکتی که میگه "ما متخصص سایت های شرکتهای کوچیکیم" وارد بحث بشید، چون مطمئنا تواناییشون در حد پروژه شما نیست.
  •  اشارات، توصیه نامه ها و رضایت نامه ها: توصیه نامه هارو جدی بگیرید. طراحی کردن سایت فرایند پیچیده ایه و اگه دوست یا همکاری دارید که بهتون یه شرکتی رو معرفی کرده، حتما از اون شرکت راضی بوده و به همه چیزایی که میخواسته رسیده، پس حتما شما هم میتونید با اون شرکت به خواسته هاتون برسید. با مشتری های قبلی شرکت تماس بگیرید و ببینید راضی بودن یا نه. مسلما اونا هم راستشو میگن.
  • یه گروه با استعداد، نه یه همه فن حریف: باید دنبال شرکتی بگردید که هر کدوم از کارمنداش متخصص یه کاری باشن. با سرعت پیشرفتی که فناوری ها دارن، باید گروهی رو سایتتون کار کنن که علاوه بر اینکه تو حوزه کاری خودشون متخصصن، از چیزهای دیگه هم سر دربیارن.
  •  منحصر به فرد و خاص یا کارهای قالبی: به حرفشون اعتماد نکنید و خودتون سایت هایی رو که قبلا طراحی کردن نگاه کنید. رزومشونو بررسی کنید و ببینید سایت هایی که طراحی کردن همه مشابه هم نباشن. اگه اینطور باشه یعنی دارن از قالب های آماده استفاده می کنن و سایت ها رو شخصی سازی نمی کنن. ازشون راجع به شخصی سازی سایت های که طراحی کردن بپرسید و ببینید بطور خلاصه برای رضایت مشتری هاشون چی کارها کردن.
  • شفافیت: به خصوص اگه میخواهید با یه طراح سایت محلی کار کنید، ازشون بخواهید که حضورا یه ملاقات داشته باشید و با گروهشون آشنا بشید. اگه چیزی برای مخفی کردن نداشته باشن نباید مشکلی باشه. به علاوه وقتی آدمایی که میخوان رو پروژتون کار کنن رو میبینید، میتونید بسنجید که اصلا خوشتون میاد با این آدما کار کنید و باهاشون شراکت داشته باشید یا نه.
  • یک گروه داخلی: اعضای گروه قراره تو دفتر شما کارشونو انجام بدن یا نه؟
  • مشاوره و نصیحت: دنبال شرکتی بگردید که بهتون نصیحت و پیشنهاد ارائه بده. بالاخره اونا کلی سایت قبل از سایت شما طراحی کردن و میتونن چیزهایی رو ببینن که شاید شما نبینید. باید ازتون سوال بپرسن و نظر بدن.
  • فضای تغییر: طراحتون طوری سایت رو طراحی می کنه که خودتون بعدا بتونید یه سری امکانات و کاربردهایی که میخواهید رو بهش اضافه کنید؟ از چه سیستم مدیریت محتوایی استفاده می کنن؟ میشه باهاش برنامه های معمول رو اجرا کرد؟ این CMS منبع باز هست که هر وقت خواستید بتونید سایتتونو به یه توسعه دهنده دیگه بسپرید؟
  • یه شبکه ی خوب: اگه شروع کنید به سایتتون فکر کنید، می بینید که خیلی چیزها رو باید در نظر بگیرید. مثلا اینکه یه طراح و توسعه دهنده لازم دارید یا عکاس هم میخواهید که از کالاهاتون عکس بگیره؟ شاید بخواهید ویدئوی مشتریاتون که محصولاتتونو توصیه می کنن هم بذارید رو سایت. یه شرکت ایده آل باید بتونه با روابط عمومی خوب، علاوه بر طراحی و توسعه، با شبکه ای از متخصصان مختلف ارتباط بگیره و شما دیگه نیاز نباشه دونه دونه دنبال متخصصای مختلف بگردید.
  • پشتیبانی واقعی: این مسئله خیلی مهمه. هیچوقت نباید ندید بگیریدش. پشتیبانی میتونه برنامه های سایتتونو درست کنه، یا اگه بد باشه شاید خراب کنه. قراره تلفنی با شرکت کار کنید؟ اگه جوابتون مثبته، این شرکت داخلیه یا خارجی؟ کارمندای فنی گروهش سایتتونو میشناسن؟

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

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

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

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