آموزش اصول طراحی وب سایت
طراحی سایت
طراحی سایت همان چیزی است که اکثر مردم به دلیل سر و کار داشتن با ظاهر وب سایت ها، وقتی به طراحی وب فکر می کنند، در ذهن دارند. اگر شما با طراحی گرافیک آشنا هستید، از آنجا که مهارت‌های طراحی بصری برای این رشته بسیار مهم هستند، برای شروع این منطقی‌ترین مکان برای شما است. مهم است توجه داشته باشید که مشخصه‌ی منحصربه‌فرد وب، محیط بصری یا همان ظاهر سایت است و آموزش نحوه طراحی درست برای وب دقیقاً همان اهمیت را دارد که یادگیری نحوه طراحی موثر برای اسناد چاپی! هنگام ایجاد وب سایت‌ها و طراحی سایت ، مهم است که بین طراحی بصری و چیزهایی مانند زمان بارگذاری سایت، قابلیت استفاده و سازگاری با تجربه کاربر توازن ایجاد شود. در حال حاضر صحبت از طراحی بصری، رنگ، تایپوگرافی و طراحی سایت، در مقابل اسناد چاپی نیاز به رویکردی متفاوت دارد.
به عنوان مثال، بر روی وب، بازدیدکننده‌ها می‌توانند اندازه‌ی متن را به دلخوا‌ه انتخاب کنند، یا اگر ترجیح می دهند، فونت نوشته را کاملاً جایگزین کنند، درحالی که در اسناد چاپی مانند پوستر و بروشورها، این امکان وجود ندارد. طراحی سایت ها به همین دلیل پیچیدگی محیطی بیشتری دارند. این فقدان کنترل بر محیط طراحی شده، باعث می شود که بیشتر طراحان گرافیک برای مأنوس شدن با محیط وب، به زمان نیاز داشته‌باشند و با طراحی سایت مشکل دارند. به جای تلاش برای ایجاد طراحی صفحات وبی که بیشتر شبیه به طراحی نسخه قابل چاپ باشد، پیشنهاد می کنیم همه‌چیز را درباره‌ی محیط جدید و اصول طراحی سایت فرا بگیرید و به صورت خاص برای این محیط طراحی کنید. طراحی سایت شرایط و محیط خود را دارد.
این بدین معنی است که هرچیزی را می‌توانید درباره‌ی چگونگی کنترل روش ارائه‌ی مطالب روی وب و چگونگی به حداکثر رساندن خوانایی محتوایتان بیاموزید و بدانید چگونه استانداردها و الگوهای طراحی برای هر نوع مشخص از وبسایت‌ها به‌وجود آمدند. وب همواره در حال تغییر است و به‌دنبال آن استانداردهای وب همچنان درحال تکامل می‌باشند. به همین دلیل طراحی سایت و طراحی صفحات وب سایت امری کاملا متفاوت با طراحی صفحات یک بروشور یا تبلیغ کاغذی است. پس بهترین حالت این است که در طول زندگی حرفه ای خود در طراحی سایت روی این امر تمرکز کنید. همچنین این نیز مهم است که به خاطر داشته باشید برای وب، شما نه تنها بخش بصری را می سازید بلکه در حال ایجاد یک رابط کاربر هستید که هم باید نیازهای مشتری (مالک سایت) را برآورده کند و هم کاربران را. با توجه به این، اجازه دهید برای یک لحظه گردشی در روند کاری رایج بسیاری از طراحان وب سایت داشته باشیم.
نخست باید اهداف و مخاطبان سایتتان را بررسی کنید. این موضوع یکی از مهمترین اصول طراحی سایت می باشد. هرچه درباره‌ی اهمیت این بخش بگوییم کم گفته‌ایم. دفعات زیادی با مشتریانی نشست داشته‌ایم که هرچند آنها می‌دانستند یک سایت می‌خواهند، اما هیچگاه واقعاً ننشسته‌اند و اهداف سایتشان را اولویت بندی نکرده‌اند. بنابراین این سوال مطرح است که هدف از یک طراحی سایت مناسب چیست؟ در یک طراحی سایت حرفه ای به دنبال چه چیزی باید باشیم؟
پیش از اولین چکنویس و طرح اولیه، شما باید لیستی از تمام چیزهایی که مشتری می‌خواهد با سایت انجام دهد را آماده کرده و سپس آنها را با نیازهای مخاطبان هدف مقایسه‌کنید. در طراحی سایت این کار بسیار حائز اهمیت است. عملکرد سایت را اولویت‌بندی کرده و مطمئن شوید که آن را برای دادن پاسخ مناسب هم به مشتری‌های هدف و هم انتظارات کاربر آماده می‌کنید. تکمیل این مرحله، به طراحی سایت شما جهت می دهد و ذهنتان را روشن می‌کند که چه قابلیت‌هایی برای پوشش همه‌ی آن اهداف مورد نیاز می باشد.
در مرحله‌ی بعد اطمینان حاصل کنید که بر روی محتوای سایت تمرکز کرد‌ه‌اید و ساخت آن محتوا را در مرکز طراحی سایت قرار داد‌ه‌اید. بسیار مهم است که بدانید نسبت به طراحی اسناد قابل چاپ، روی وب، محتوا فوق العاد‌ه مهم است. یک مقاله در زمینه اهمیت محتوا در طراحی سایت منتشر کرده ایم که مطالعه آن را توصیه می کنیم. اگر محتوا واضح و دست یافتنی نباشد، انیمیشن، ویدئو و همه‌ی گرافیک‌های جالب در جهان نمی توانند از شکست یک سایت جلوگیری کنند. در واقع، طراحی سایت هایی را دید‌ه‌ایم که المان‌های سایت، دسترسی به محتوا را محدود کرده و یافتن چیزی را که دنبالش بودند برای کاربران سخت‌تر می‌کنند. به‌یاد داشته‌باشید، طراحی سایت خوب اغلب روشن، مختصر و مرتب و بدون درهم ریختگی می باشد. این حرف‌ها به معنی عدم تمرکز روی بخش بصری سایت نیست، فقط موضوع این است که در رابطه با وب، این موارد (بخش بصری) باید توجه به محتوا را بهبود ببخشند نه اینکه کاربر را از آن منحرف کنند. برای نمونه فلش را درنظر بگیرید. ارائه با استفاده از فلش فوق‌العاده است. اما باید در نظر داشته باشید بسیاری از مرورگرهای کاربران فاقد افزونه فلش ریدر می باشد که سبب عدم نمایش سایت یا قسمت هایی از طرح شما می شود. طراحی سایت با فلش اصلا توصیه نمی شود!
با این حال، اگر شما نمی‌توانید از آن به خوبی استفاده کنید یا زمانی را که باید صرف یادگیری آن شود را توجیه‌کنید، خوب راه‌حل بسیار ساده است: از آن استفاده نکنید! هرچند پاک کردن صورت مسئله، راهکار موجهی نیست! به طور معمول، برای طراحی سایت، یک جهت روشن داریم، شروع به سازماندهی محتوا می کنیم و سپس وایرفریم آن را می‌سازیم. اکنون ساختار سایت را می دانیم و دریافتیم که ناوبری یا navigation چگونه باید کار کند.
هرچند این موضوع بیشتر مربوط به معماری اطلاعات است تا طراحی، اما گام بسیار مهمی است. در ادامه معماری اطلاعات را به طور دقیق بررسی خواهیم‌کرد. مهم است درک کنیم که چگونه سازماندهی سایت، به‌طور چشمگیری سراسر طراحی سایت را تحت تأثیر قرار خواهد داد. ناوبری مناسب، سازماندهی محتوا، و تعداد صفحات لازم، با سازماندهی صحیح محتوا پیش از رفتن به پروسه‌ی طراحی در ارتباط مستقیم است. سپس برای مرور کار با مشتری، تعدادی mockup کوچک یا اصطلاحاً بند انگشتی می سازیم. در حال حاضر مواردی که طرح اولیه‌شان را می‌سازیم معمولاً شامل صفحه‌ی اصلی، مکان محتوای ثانویه، گرافیک و مجموعه رنگ‌ها می‌باشد. بسته به خواست مشتریان، این مرحله می تواند هر چیزی از یک طرح اولیه بر روی یک کاغذ یادداشت تا یک مدل کامل سایت در فایرورکز، فتوشاپ یا ایلیوستریتور باشد. حالا اگر سایت دارای قابلیت‌های پیشرفته باشد، ممکن است به سمت ساخت نمونه‌های قابل کلیک پیش برویم. به طوری که مشتری می تواند با دقت نسبتاً خوبی تجسم کند که سایت چگونه عمل می‌کند.
هنگامی که بررسی نخستین مشتری کامل شد و روی طرح‌های اولیه توافق حاصل گردید، شروع به ساختن سایت با HTML و CSS ، تصاویر، هر فن آوری یا محتوای اضافی مورد نیاز می‌کنیم. معمولاً سایت‌ها را به طور مستقیم از نمونه‌های اولیه (prototype)، گرافیک‌های بیرون آمد‌ه از آن و با استفاده از آن نمونه‌ها به عنوان یک مرجع برای HTML و CSS، می سازیم. در این نقطه، طراحی به پایان رسید‌ه‌است و فقط آن را با استفاده از فن آوری مناسب مونتاژ می‌کنیم. البته‌یک موضوع دیگر باقی ماند‌ه‌است. برای اینکه مطمئن شوید سایتتان را به بیشینه‌ی اثربخشی رساند‌ه‌اید باید آن را بیازمایید. شما باید کاربران و روش کار آنها در وب را به‌طور مداوم مطالعه کنید. در حال حاضر این موارد، مطالعه چگونگی استفاده مردم از وب و اولویت شخصیشان در درگیر شدن با ناوبری سایت و تعامل آنها با سایت شما است.
برای ایجاد سایت‌های موثر، دانستن اینکه چگونه مخاطبان هدف شما، استفاده از وب را اولویت بندی می‌کنند و یافتن موانعی که ممکن است شما ناخواسته در طراحی خود قرار داده‌باشید، ضروری است. می‌دانم به نظر می رسد مواردی که گفتیم بیش از اندازه خشک و بدون انعطاف به نظر می‌رسند. با این حال امیدواریم اهمیتی را که این نکات دارند، روشن کرده‌باشیم. نکاتی که بیش از حساسیت داشتن درباره‌ی طراحی خوب یک سایت هستند.
نکته‌ی مهم دیگری نیز هست که باید آن را همیشه در خاطر خود نگه دارید. پذیرش این موضوع می تواند برای بیشتر طراحان سخت باشد، اما شما باید با این فکر که «نمی توانید کنترل کاملی بر اینکه چگونه بازدیدکنندگان سایت شما را می بینند»، احساس راحتی کنید. سایت‌های شما به احتمال زیاد با مرورگرها و دستگاه‌های گوناگون دیده می‌شوند، که هرکدام از آنها، صفحاتتات را با اندکی تفاوت نمایش می دهند. درک این که چگونه این مرورگرها و دستگاه‌ها کار می کنند، به شما توانایی ساخت طرح‌هایی را می‌دهد، که هنگام بازدید از آنها با دستگاه‌ها و مرورگرهای گوناگون، تجربه‌ی یکسانی را به کاربر می دهند و موفقیت درازمدت سایت شما را تضمین می‌کند.
این طراحی های جدید سایت ، طراحی سایت ریسپانسیو یا طراحی سایت واکنش گرا نامیده می شود که در مطلب دیگری به توضیح آن خواهیم پرداخت.