آموزش طراحی سایت

آموزش طراحی سایت (158)

آشنایی با زبان HTML5

نوشته شده توسط دوشنبه, 22 تیر 1394 12:46
منتشرشده در آموزش طراحی سایت

HTML5 چیست؟

TML5 جدیدترین نسل از زبان hyper text market مورد استفاده در طراحی سایت بوده و مورد تایید کنسرسیوم شبکه جهانی اینترنت یا همان W3C می باشد. پیشنویس اولیه آن در سال 2008 ارائه شد ولی تا 2011 تغییرات خاصی در آن اعمال نشده بود. در سال 2011 HTML5 بصورت رسمی منتشر شد و از آن روز مورد استفاده برنامه نویسان قرار گرفت ولی در ابتدا مرورگرهای کمی این زبان جدید را پشتیبانی میکردند. امروزه تمام مرورگرهای اصلی مانند کروم، سافاری، فایرفاکس و اینترنت اکسپلورر زبان کدنویسی HTML5 را پشتیبانی میکنند و امکان استفاده از تمام ظرفیت های آن فراهم شده است.
HTML5 در حال حاضر با CSS3 همراه بوده و هنوز درحال توسعه و پیشرفت است، W3C در نظر دارد سال 2014 نسخه نهایی و کامل آن را عرضه کند ولی با توجه به امکانات و توانایی هایی که هر روز به آن افزوده میشود به نظر میرسد که میتوان آینده دورتر و بهتری برای آن متصور شد.
تهیه و انتشار HTML5 با اهداف مشخصی صورت گرفت که مهمترین آنها عبارتند از:

  • امکانات جدید باید بر پایه HTML، CSS، DOM و javascript بوده و همخوانی لازم را داشته باشد.
  • نیاز به افزونه های خارجی و جانبی مانند فلش تا حد امکان کاهش یابد.
  • رفع مشکلات و ارورها در HTML5 از نسخه های پیشین راحت تر باشد.
  • استفاده از اسکریپت در کدنویسی این زبان با نشانه گذاری جایگزین شود.
  • HTML5 باید مستقل از دستگاه باشد و بر روی هر توع کامپیوتر و گجتی قابل استفاده باشد.
  • مراحل پیشرفت و بروزرسانی آن متن باز و در اختیار عموم باشد.
لوگو HTML5

صفحه 404 و روبرویی با ارور 404

نوشته شده توسط دوشنبه, 22 تیر 1394 12:43
منتشرشده در آموزش طراحی سایت

صفحه 404 چیست؟

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

نکاتی برای بهبود صفحه 404

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

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

3 نمونه صفحه 404 در سایتهای خارجی

Inriality

یک نمونه صفحه 404 گرافیکی

یک نمونه صفحه 404 گرافیکی

روانشناسی رنگها و استفاده در سایت

نوشته شده توسط دوشنبه, 22 تیر 1394 12:38
منتشرشده در آموزش طراحی سایت

روانشناسی رنگها در طراحی سایت

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

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

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

Cocacola

روانشناسی رنگها در سایت کوکاکولا

“درباره ما” شامل چه اطلاعاتی باشد؟

نوشته شده توسط دوشنبه, 22 تیر 1394 12:36
منتشرشده در آموزش طراحی سایت

اهمیت بخش درباره ما

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

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

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

بازدیدکننده سایت به کجا نگاه میکند؟

نوشته شده توسط یکشنبه, 21 تیر 1394 12:58
منتشرشده در آموزش طراحی سایت

تحلیل عملکرد بازدیدکننده سایت

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

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

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

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

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

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

نوشته شده توسط یکشنبه, 21 تیر 1394 12:55
منتشرشده در آموزش طراحی سایت

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

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

Douglas Hughmanick طراح سایت حرفه ای

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

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

افزایش فروش با کم کردن انتخاب ها

نوشته شده توسط یکشنبه, 21 تیر 1394 12:49
منتشرشده در آموزش طراحی سایت

افزایش فروش سایت

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

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

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

افزایش فروش سایت فروشگاهی

بهتر است که با یک مثال بررسی کنیم. فرض کنید که قرار است وان حمام خود را عوض کنید با کمی جستجو در اینترنت چندین سایت در این زمینه خواهید یافت.
اولین سایتی که پیدا کردیم The Tub Connection است، محصولات صفحه اصلی در 15 ردیف ارائه شده و مجموعا 44 عدد هستند همچنین با رفتن به صفحات بعدی شما امکان مشاهده 54 وان حمام را خواهید داشت. این شرکت ممکن است علم و امکانات زیادی در زمینه تولید و فروش وان حمام داشته باشد ولی در ارائه محصولات بسیار ضعیف عمل کرده زیرا این تعداد گزینه میتواند موجب سردرگمی مشتریان در انتخاب شود.

افزایش فروش فروشگاه

3 روش ساده برای طراحی زیبای سایت

نوشته شده توسط یکشنبه, 21 تیر 1394 12:46
منتشرشده در آموزش طراحی سایت

طراحی زیبای سایت

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

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

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

طراحی زیبای سایت با سایه

استفاده از طراحی تخت در لوگو

نوشته شده توسط یکشنبه, 21 تیر 1394 12:43
منتشرشده در آموزش طراحی سایت

طراحی تخت چیست؟

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

طراحی تخت سایت

سیر تکامل در کدنویسی HTML

نوشته شده توسط یکشنبه, 21 تیر 1394 12:38
منتشرشده در آموزش طراحی سایت

پیدایش اینترنت و زبان کدنویسی HTML

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

اولین نسل از زبان HTML

در دهه 90 میلادی و بهمراه افزایش ارتباط کاربران با اینترنت، امکان خواندن مطالب در فضای اینترنت با استفاده از کدنویسی HTML مهیا شد. در آن زمان صفحات وب از متن هایی محدود و در یک ستون تشکیل میشدند و مودم های دیال آپ سرعت بسیار پایینی داشتند به همین دلیل طراحان وب هرگز به فکر استفاده از تصویر و فیلم در صفحات سایت نبودند.
Mosaic نام اولین مرورگر برای ارتباط و درک صفحات وب بود که بر روی سیستم عامل Unix راه اندازی شد. برای غلبه بر این مشکلات و محدودیت ها تلاش های فراوانی صورت گرفت تا دنیای وب به شکل امروزی آن رسیده است.

نسل دو زبان کدنویسی HTML

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

کنسرسیوم جهانی وب

کدنویسی HTML

فروشگاه ساز طراحی وب سایت شرکت طراحی وب سایت خبری طراحی وب سایت تخفیف گروهی طراحی وب سایت آگهی طراحی وب سایت شخصی

آیا نیاز به مشاوره دارید؟

مشاوره طراحی وب سایت

با ما در تماس باشید

تلفن:  031-36612265 , 09133045663 , 09129252046
ایمیل : info@webpouya.com
webpouya rss وب پویا در تلگرام وب پویا در گوگل پلاس وب پویا در اینستگرام وب پویا درتویتر

نظر مشتریان طراحی سایت

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