Tag Archives: اصول طراحی وب سایت

گرد کردن گوشه تصاویر در GIMP

می‌خواهید برای یک وب سایت یا برای یک تصویر در یک متن به علت دلایل ظاهری گوشه‌های عکس‌ها را گرد کنید. برنامه “Gimp” که مربوط به کار با عکس‌ها می‌باشد، برای چنین کاری یک ویژگی از پیش تعیین شده دارد که قسمت بزرگی از کار را از دوش شما برمی‌دارد. در اینجا به شما نشان می‌دهیم که چگونه این کار را انجام دهید.
●راه حل:
۱- عکس مورد نظر را در Gimp باز کنید و در منوی موجود در صفحه قسمت Select و round corner را انتخاب کنید.
۲- یک قسمت برای شما باز می‌شود که در آن شعاع گرد کردن را تعریف می‌کنید. برای مثال، پشت Radius(%) عدد ۳۰ را بنویسید و سپس OK را فشار دهید. اگر عدد بزرگتری وارد کنید این گردی مشخص تر می‌گردد.
۳- هم اکنون در عکس یک انتخاب شده با گوشه‌های گرد شده را می‌بینید از صفحه منو کوچک کردن، انتخاب و Select را انتخاب کنید. در پنجره آمده، عددی که باعث فاصله عکستان تا گوشه صفحه می شود را بنویسید مثلا ۱۰ سپس OK‌ کنید.
۴- در منو به blending و محو کردن تدریجی، انتخاب بروید. همان عددی را که در شماه ۳ گذاشتید، اینجا هم بگذارید و OK را فشار دهید. این دستور باعث روی هم قرار گرفتن لبه‌های عکس‌ها البته به صورت خیلی ضعیف و غیر قابل احساس می‌شود.
اگر جلوه به اندازه انتظار شما قوی نبود، یک عدد بزرگتری را وارد کنید.
۵- در صفحه منو Inverse select را انتخاب کنید و سپس ‍Crop را بکار گیرید. توسط این کار قسمت‌هایی از عکس را که انتخاب نکرده‌اید کنار گذاشته می‌شوند. آنچه باقی می‌ماند عکس است با گوشه‌های گرد شده و روی هم گذاشتگی لبه‌ها به صورت نرم‌ و محسوس.
PC Welt
مترجم: وهاب حاجی باقری

ده اشتباه نابخشودنی طراحان وب

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

۱- ‌Pop up‌ها و صفحات خودکار:

یکی از روش‌های تبلیغ داخل بسیاری از وب‌سایت‌ها، باز شدن پنجره‌های موسوم به پاپ‌آپ است اما جالب این‌جاست که بدترین روش برای تبلیغ نیز همین است. کاربران معمولا به‌جای بستن پنجره پاپ‌آپ، پنجره وب‌سایت را هم می‌بندند و دیگر به آنجا سر نمی‌زنند مگر اینکه مجبور باشند.

۲– نوشته‌ها مهم هستند ‌ ‌

در یک همه‌پرسی که توسط موسسه ‌Landslide‌ انجام شد، حدودا دو سوم از آراء، فونت نامناسب را دلیل نخواندن سایت مورد نظر می‌دانستند. ‌ ‌

۳– لینک‌های غیر استاندارد

این ۵روش کلیدی را در کلیه لینک‌ها به‌کار گیرید:

– زیر لینک‌ها خط بکشید. (ولی جاهایی که لینک نیستند را ‌Underline‌ نکنید.)

– لینک‌های کلیک شده را رنگی کنید.

– برای بهتر‌شدن سایت از نظر جستجو ‌(SEO)‌ داخل سایت به‌جای عبارت “اینجا را کلیک کنید”،متن را بنویسید و لینک کنید.

– از به کار بردن متدهای جاوا اسکریپت که قابلیت تعاملی لینک را پایین می‌آورد خودداری کنید.

– صفحات را در یک پنجره جدید باز نکنید مگر در یک سری موارد خاص مانند باز کردن ‌PDF‌ یا پرکردن فرم که آن هم ضدارزش است.

۴– فلش

استفاده نابجا از فلش یک شکست بزرگ در طراحی وب است. در سال ۲۰۰۵ ادوبی فلش، مدال برنز را در آزار‌دهندگی پیدا کرد! با وجود تمام تمهیدات انجام شده و توصیه‌های انجام گرفته، اکثر وب‌سایت‌های فلش از کاربردهای نابجا و عناصر غیرمفید این نرم‌افزار استفاده کرده‌اند. اگر شما یک محتوای نامناسب دارید، مطمئن باشید که با استفاده از تکنیک‌های حرکتی نمی‌توانید سایت خود را بهبود بخشید. بنابراین بهتر است به جای این کارها از عکس‌های زیبا‌تر و متون پخته‌تر استفاده کنید.

۵– محتوای مختص وب

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

۶– جستجوی بد

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

۷– عدم تطابق با ‌Browser‌ در باز شدن سایت

در حال حاضر در بیشتر کشورهای غربی ‌Firefox‌ و در کشور ما ‌IE‌ به عنوان ‌Browser‌های استاندارد استفاده می‌شود. اما شما نمی‌توانید کاربرتان را برای استفاده از ‌Browser‌ محدود کنید. با رعایت استانداردهای ‌C3W‌ و ‌۴ Html‌ وب‌سایت شما در اکثر ‌Browser‌ها یکسان دیده می‌شود.

۸– فرم‌های ورود اطلاعات طولانی و پیچیده:

خوب به ذهن بسپارید که هیچ‌کس تمایل ندارد یک فرم ۵صفحه‌ای را پای کامپیوتر خود پر کند. بنابراین اطلاعات را تا حد امکان ساده کنید.

۹–عدم‌درج اطلاعات تماس با ما یا اطلاعات مربوط به کمپانی

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

‌ ‌۱۰– بزرگ شدن نا‌مناسب عکس‌ها

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

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

اصول طراحی صفحات وب طراحی سایتهای صنعتی

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

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

گرایش به مشتری در روشی که صفحات صنعتی، مشتری را چه از لحاظ تصویری و چه از لحاظ تعاملی درگیر می کنند، دیده می شود. صفحات صنعتی غالبا معمولی تر از صفحات دیگر به نظر می رسند.

● صفحات صنعتی در کل دارای سه عنصر می باشند

۱) خصوصیات محصول: هر مشتری می بایست بتواند یک محصول خاص را از میان مجموعه ای از محصولات مشخص کند. این کار می تواند به صورت تصویری، با استفاده از یک لیست انتخابی یا با استفاده از یک برنامه جستجو انجام شود.

۲) مشخصات محصول: بیشتر محصولات صنعتی همراه با اطلاعاتی عرضه می شوند که صفحه مشخصات نامیده می شود. یک صفحه مشخصات ترکیبی از متن، تصویر و توصیفاتی در مورد کارایی محصول در یک ورق کاغذ می باشد. خصوصیات کارایی یا تصویر توصیف کننده ساختار کالا، اغلب عامل فروش یک محصول می باشند.

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

۳) ارتباط با مشتری: ‏‏‏کارتهای جالبی را که در آنها از شما سوال می شود «آیا مایلید که نمایندگی سرویس های مشتری در مورد کالایی خاص با شما تماس بگیرد؟» را بخاطر بیاورید. با استفاده از وب سوالات تقریبا پس از پرسیده شدن جواب داده خواهند شد.

● طراحی صفحات تجاری

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

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

قطعات اصلی پازل صفحه وب تجاری شامل اجزا زیر می باشد:

▪ نام شرکت رسما چگونه استفاده می شود؟

▪ آیا به طور کامل نوشته می شود یا مخفف؟

▪ آیا نام، یک نام تجاری ثبت شده است؟

▪ آیا نام شرکت تحت قانون حق تکثیر می باشد؟

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

▪ آیا یک آرم تجاری یا یک نشان سازمانی است؟

▪ آیا اسامی محصولات، اسامی تجاری طراحی شده به شکل خاص می باشند؟

▪ آیا این نوع اسامی با قلم،وزن و تاکید متفاوتی نمایش داده می شوند؟

▪ آیا رسم الخط رسمی، برای بدنه اصلی مکاتبات وجود دارد؟

▪ آیا متن ترازبندی شده است یا دارای برآمدگی و فرورفتگی است؟

▪ آیا اصلا رنگهای رسمی برای شرکت وجود دارد؟

▪ آیا یک سلسله مراتب برای مکاتبات در شرکت وجود دارد؟

▪ شما چگونه می توانید سوالات و تقاضاهایتان را به قسمتهای مختلف ابلاغ کنید؟

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

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

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

● طراحی صفحات مربوط به سرگرمی

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

صفحات وب سرگرمی دارای خصوصیات زیر می باشد:

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

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

نویسنده: الهه صالحی