طرح های بی آلایش

January 6, 2006 at 09:28 pm

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

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

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

اندازه معمول صفحات در طراحی

May 10, 2005 at 10:38 pm

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

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

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

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

هماهنگی ( هارمونی ) رنگ در وب

March 14, 2005 at 08:21 pm

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

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

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

چند راهنمایی اساسی در مورد استفاده خوب از رنگ ها : 1) فقط از چند رنگ متفاوت بر روی یك صفحه استفاده كنید . 2) از مقدار زیادی از رنگ ها استفاده نكنید. 3) رنگ های سرد و گرم را با یكدیگر استفاده كنید .

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

ساخت و طراحی پیوند گرافیكی Rollover دار

March 4, 2005 at 04:13 pm

منظور از پیوند گرافیكی ساده در اینجا همون منو گرافیكی هست كه در اغلب وب سایت ها حتما دیدید . بعضی از اون ها قابلیت Rollover رو هم دارن و خلاصه اینكه از افكت های ویژه ایی برای تزیین پیوندها استفاده می كنند .

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

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

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

اول با استفاده از جاوا اسكریپت . این كد جاوا اسكریپت نسبتا به سادگی نوشته می شود ، و در ابتدا فقط نیازمند تصاویری جهت بارگذاری است و پشتیبانی از شی JavaScript Image باید وجود داشته باشد . كد زیر این rollover پایه را نشان می دهد : ادامه مطلب …

استفاده از قلم های قابل دریافت از اینترنت

February 24, 2005 at 09:11 pm

در HTML قدیمی و حتی CSS اصلی ، انتخاب قلم بر روی وب بسیار محدود شده است . طراحان غالبا به قرار دادن متن درون فرم تصویری متوسل می شوند تا بتوانند یك قلم غیر استاندارد را در صفحه استفاده كنند . ولی این راه حل بهینه نیست . خوشبختانه ، فروشنده های عمده مرورگرها شروع به پشتیبانی از قلم های قابل دریافت یا به اصطلاح Downloadable Font از اینترنت كرده اند .

Open type

راه حل مایكروسافت Open Type نامیده می شود و از نگارش 4 در اینترنت اكسپلرر ساخته شده است . مرورگرهای نت اسكیپ 4.x از فناوری قلم معمولی به صورت بومی استفاده كردند . متاسفانه مرورگرهای اپرا ، 6.7 نت اسكیپ و موزیلا 1 قلم های قابل دریافت از اینترنت را در بر نمی گیرند ، بنابراین استفاده از قلم در پلت فرم های مختلف می تواند دشوار باشد .

فناوری مایكروسافت تنها روش معقول برای گذاشتن قلم ها در صفحه وب است . برای اضافه كردن یك قلم ، اول باید با استفاده از عنصر <font> یا قوانین شیوه نامه كه قلم هایی متعلق به شما را نصب می كند یك صفحه بسازید . وقتی صفحه تان را ساختید ، در مورد اینكه آیا كاربر نهایی قلم نصب شده دارد یا خیر نگران نباشید ، زیرا خودش از اینترنت دریافت خواهد شد .

سپس از Microsofts Web Embedding Font Tool (WEFT) كه در اینجا در دسترس است برای تحلیل كاربرد قلم بر روی صفحه استفاده كنید . این برنامه باید یك فایل .eot كه شامل قلم های جایگزین شده می باشد را ایجاد كند . سپس ، اطلاعات استفاده از قلم را به صفحه و به شكل قوانین CSS كه در CSS2 به طور اساسی تعریف شده اند اضافه كنید ، همان گونه كه در زیر نشان داده شده است : ادامه مطلب …

Page: 1 | 2 | 3 | 4