طراحی سایت تخصصی و حرفه ای در عمل وظیفه ی شرکت هایی است که نیروی های متخصصی در امر برنامه نویسی دراختیار دارد و قادر به برنامه نویسی و طراحی backend و frontend سایت هستند. طراحی سایت تخصصی فقط شامل طراحی یک سایت زیبا و دارای نمهای ظاهری مطابق با سلیق ما نیست، هرچند که این موضوع خود کم حائز اهمیت نیست. اما طراحی سایت حرفه ای و تخصصی باید براساس نیازها ، اهداف از پیش تعیین شده برای موفقیت باشد و علاوه بر ظاهر جذاب، کار خود را به درستی انجام دهد، روی مخاطب تاثیر لازم را بگذارد و رسیدن به اهداف مهم را تسهیل نماید.
ادامه مطلب ...
Wireframing یا وایرفریمینگ را میتوانیم اولین و ,hdvtvdl مهمترین قدم در طراحی سایت عنوان کنیم. قدمی که کارهای شمارا پیش میبرد. چون هم جالب هست و هم دوستداشتنی و راحت.
اگر بهشخصه نظر من را درباره طراحی سایت شرکتی و یا فروشگاهی برای راه اندازی کسب و کار اینترنتی بپرسید، میگویم: فقط شروع کنید و هیچ نیازی به وایرفریمینگ و این داستانها نیست. چون معتقدم که نباید کمال طلب بود. کارتان را استارت بزنید و حتی شده با یک طرح ساده شروع کنید. بعداً فرصت برای تکمیل سایت خواهید داشت.
اما این روند را بیشتر برای کسبوکار خودتان پیشنهاد میکنم، نه برای مشتری. چراکه مشتری همیشه تکامل طلب هست. هزینه کرده و وظیفهدارید که یک کار عالی و کامل تحویل دهید. پس اگر طراح سایت هستید این مقاله خواهد توانست به شما کمک کند تا در آینده دردسر کمتری موقع تحویل سفارش به مشتری داشته باشید.
فرض کنید میخواهید یک منزل برای خودتان بسازید. طبیعتاً شروع نمیکنید به ساختن پی و دیوارها را بالا بیاورید و بعد تازه به این فکر کنید که نقشه به چه شکل باشد. بلکه با کمک یک مهندس نقشهکش ساختمان، شروع به کشیدن یک طرح ساده سیاهوسفید میکنید. هرچند این نقشه، منزل شمارا بهصورت کامل نمایش نخواهد داد اما درهرصورت پرده از آینده تاریک این خانه برداشته خواهد شد. دقیقاً همین روند در طراحی سایت انجام میشود.
یک نمونه از Wireframing در طراحی سایت
شما می توانید با استفاده از طراحی وبسایت در قالب Wireframe (وایرفریم)، یک طرح اولیه از وب سایت پیاده کنید. به این شکل:
وایرفریم بالا در عرض ۴۰ ثانیه ساخته شده. به همین راحتی میتوانید یک پیش نمایش در سایتی که قصد طراحی آن را دارید، پیاده کنید تا بدانید که هر بخش از وب سایت قرار هست در کدام قسمت از سایت شما نمایش داده شود.
دلیل اهمیت وایرفریمینگ زمانی مشخص می شود که از موقع شروع کار طراحی سایت برای مشتری هیچ خبری از شما نیست تا زمانی که سایت را تکمیل میکنید. بعد از تکمیل طراحی، سایت طراحی شده را با شوق و ذوق به مشتری نشان میدهید و مشتری چپ چپ به شما نگاه میکند. حالا شما هستید و یک لیست بلندبالا از تغییراتی که نیاز هست.
با طراحی وایرفریم وبسایت و نمایش آن به مشتری قبل از شروع رنگ و لعاب دادن به سایت، مشتری از ساختار اولیه سایت طراحی شده مطلع خواهد بود و بعدا دلیلی برای نگاههای معنادار نخواهد داشت. البته همیشه حق با مشتری هست. پس هرطور شده مشتری را راضی نگه دارید. بارها و بارها ثابت شده که انجام تغییرات برای مشتری بسیار راحت تر از بحث و جدال هست.
CSS sprite یک تکنیک بهینه سازی عملکرد طراحی سایت است که تصاویر چندگانه را به یک تصویر منفرد به نام یک صفحه ی sprite یا مجموعه کاشی ترکیب می کند. Sprites با کاهش تعداد بارگیری های لازم برای رندر یک صفحه وب، تراکم شبکه را کاهش می دهد.
شما با استفاده از تکنیک CSS Sprite میتوانید سرعت سایت خود را تا حد زیادی افزایش دهید. تا همین چند وقت پیش همه طراحان سایت عکس ها را به تصاویر کوچکتر تقسیم میکردند تا صفحات سریعتر بارگزاری شوند ولی این تکنیک با فریب چشم انسان و نشان دادن تصاویر در هر گوشه از صفحه این حس را میدهد که سرعت بارگزاری افزایش یافته است ولی در واقع هرکدام از این تصاویر یک فراخوان از HTTP را بهمراه دارد و بازدهی صفحه شما را به شدت کاهش میدهد.
بخش پنجم
در بخش پنجم مقاله آموزش طراحی سایت راجع به سی اس اس ( css) و نحوه استایل دهی به آن صحبت خواهم کرد . برای اینکه بتوان به صفحه وب سایتمان ظاهری زیبا بدهیم می بایست با css این کار را انجام داده و یا به عبارتی به عناصر وب سایتمان سبک بدهیم.
اولین مورد در طراحی، فونت یا typeface استفاده شده در سایت می باشد، که به صورت پیش فرض فونت مورد استفاده برای اکثر مرورگرها Times New Roman است. اما از نظر کاربران این فونت باعث ایجاد یکنواخت شدن سایت ها شده به همین دلیل در طراحی یک وب سایت می توان با استفاده از خصوصیت font-family سبک فونت استفاده شده در سایت را تغییر داد.
بخش چهارم
با قسمت چهارم آموزش طراحی سایت از پایه در خدمتتون هستم و امیدوارم این مقاله هم مانند مقاله های گذشته بازخوردهای خوبی داشته باشد. در این مقاله ابتدا تگ های خاص و تگ هایی که طراحان سایت کمتر از آن ها استفاده می کنند را ذکر کرده و سپس کمی راجع به سی اس اس (css) صحبت می کنیم.
عنصر blockquote:
این تگ ، یک تگ container (که در جلسات قبل توضیح داده شده) است و طبق گفته کتاب این تگ برای نمایش یک گفته شخصی استفاده می شود.
ولی در کتاب های دیگر به تگ های Quotes اشارات متنوعی شده است. Quotes به معنی نشان یا نقل قول است و کلا” این تگها برای جلب توجه بیشتر استفاده می شود در واقع یک شهادت ویا سفارش و یا کامنت است.