در این قسمت شما می توانید اولین صفحه وب خودتان را خلق نمایید و با XHTM آشنا خواهید شد و مرحله به مرحله کارهای خود را در مرورگر تست میکنید .
طراحی وب سایتی که شما می بینید به سه لایه اصلی تقسیم می شود که یادگیری آن شما را به یک طراح تبدیل می کند:

لایه اول لایه محتوا است و شامل تگهای متفاوتی می باشد .لایه دوم لایه نمایش است که به عناصر HTML شکل و ظاهر می دهد و لایه سوم لایه رفتار است که حرکت و پویایی صفحات را شامل می شود.

چیزی که در این کتاب آموزش داده می شود مربوط به 2 لایه  HTML و  CSS است.

دیدن Source برنامه:

دیدن کد برنامه می تواند به یادگیری شما سرعت ببخشد البته باید در انتخاب وب سایت خود دقت نمایید تا اشتباه آنها مسیر یادگیری شما را تغییر ندهد. روش کار بدین صورت است که ماوس را درروی صفحه جایی غیر از تصاویر ببرید و کلیک راست کنید و view page source  یا view source را بزنید.

عناصر اصلی یک صفحهHTML :

 یک DocType
یک tag
یک  tag

           

حالا می خواهیم با تک تک این عناصر آشنا شویم :

داک تایپ DocType  : Document Type Definition 

اولین آیتم صفحه است بدون فاصله. این یک قانون است.
همانطوری که فایل word 2007 در نمایش در 2000 دچار مشکل می شود HTML ها با داک تایپ های متفاوت هم نمایش متفاوت در مرورگرها خواهند داشت.
در واقع این داک تایپ است که به مرورگر می گوید این سند از چه نوعی است و باید به چه ترتیب Render شود . نحوه رندر شدن و تفاوت های آنها باید در سطح حرفه ای تری مطرح شود.
داک تایپ ها هم در طول زمان به وجود می آیند یعنی مانند word نوع های جدیدی روی قبلی ها عرضه می شوند مانند HTML5  که به تازگی مطرح شده است.
برای دیدن داک تایپ های موجود به این آدرس بریدhttp://reference.sitepoint.com/html/doctypes

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

به کدهای داک تایپ دقت نمایید: ما در این خط می گوییم نوع سند چیست و آدرسی که باید به این نوع سند در وب سایت کنسرسیوم جهانی وب World Wide Web Consortium یا W3C ، اشاره کند کدام است.
در حال حاضر دو نوع داکتایپ هستند که استفاده بیشتری دارند Transitional  و  Strict 
همانطوری که گفتم فعلا دنبال تفاوت این داک تایپ ها نباشید به آن هم خواهیم رسید .
تاکید میکنم : اولین آیتم صفحه است بدون فاصله. این یک قانون است.

عناصر HTML  :

قبل از این که عناصر HTML را شرح دهم باید با مفهوم تگ (tag)  آشناشوید. تگ یعنی اسمی که میان این دو <> قرار گیرد و نام تگ همان متنی است که بین این دو <> قرار می گیرد

تگ HTML   
تگ HEAD  

تگ ها می توانند شامل چند attribute  (ویژگی) باشند:

http://www.w3.org/1999/xhtml "  dir="rtl" >

تگ ها به دودسته container و empty  تقسیم می شوند.تگ های container شامل یک تگ بازشونده و یک تگ بسته شونده هستند به مثال بالا دقت نمایید HTML  باز شده و بسته شده است. تگهای empty  متفاوت هستند مانند مثال زیر

تگ های empty  را می توان به صورت container استفاده کرد ولی در داک تایپ های xhtml توصیه شده است که تگ های empty را به همان شکل empty  بنویسیم
در استفاده از تگ ها باید دانید که از چه نوعی هستند تا سند شما دچار error نشود بعنوان مثال اگر تگ div را به صورت empty  بنویسیم دچار error می شویم.
نگران نباشید کم کم همه آنها را خواهید آموخت . بیایید همین الان تو اینترنت عبارت روبرو را جستجو کنیم :

empty tag in html

بسیار عالی شما هم این نتایج را پیدا کردید :

این را گفتم که هیچ وقت دنیای وب و جستجو را فراموش نکنید.

غیر از داک تایپ ها تمامی عناصر صفحه داخل تگ HTML است که شامل 2 بخش می شود head و  body

عنصر HAED

این یک تگ container  است و در بالای سند قبل از body قرار می گیرد و شامل اطلاعاتی در باره صفحه است مانند title, meta, css  و .....

عنصر  title :

یک تگ container است که متن وسط آن در عنوان (Title) بالای صفحه قرار میگیرد :

موارد استفاده دیگر:

• این تایتل در زمان مینیمایز کردن پنجره در taskbar windows قابل مشاهده است
• در زمان بوکمارک کردن صفحه با این عنوان  در لیست ما ذخیره می شود

• برای معرفی آن صفحه است

• برای موتورهای جستجو هم حائز اهمیت می باشد چیزی که در بهینه سازی وب سایت  وب اسکالا هم استفاده شده است

عنصر meta  :

متا تگ یک تگ empty است و برای  دلایل متفاوتی استفاده می شوند اطلاعات اضافی که در مرورگر نمایش پیدا نمی کند . به طور مثال برای نام نویسنده ویا حق کپی رایت و یا نوع کاراکتر و ....
Css و  javascript  هم در  head قرار میگیرند که بنا به نیاز استفاده میشوند البته برای جاوااسکریپت میتوان یک تفاوتهایی  در طراحی های حرفه ای  قائل شد. به طور مثال سورسی که در طراحی سایت فوق استفاده شده است را مشاهده نمایید. جاوا اسکریپت در پایین صفحه درج شده است.

عناصر body :

هرآنچه در body قرار می گیرد را می توان در خروجی دید: تیترها، پاراگراف ها, تصاویر و .......
در قسمت بعدی به طور عملی با هم یک وب سایت می سازیم!

 
از امروز  آموزش  مرحله به مرحله طراحی سایت را در اختیار شما دوستان قرار خواهم داد

این دوره آموزشی بر اساس کتاب Build Your Own Website The Right Way Using HTML & CSS از انتشارات Sitepoint  می باشد.

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

فصل اول:

Setting up Shop


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

1- وسیل? ابتدایی برای ویرایش فایل های متنی که در واقع صفحه وب شما را شامل میشود
2- یک مرورگر (web browser) برای دیدن صفحات وب در آن
3- فرستادن صفحه وب سایت به محیط اینترنت با استفاده از ftp client

چون اکثر کاربران ما درایران از ویندوز استفاده می کنند پس ابزارهای موجود در ویندوز را بررسی خواهیم کرد.

 

ابزارهای اولیه در ویندوز:

1- ادیت کردن متن : برای ادیت کردن متن در ویندوز می توانید از Notepad استفاده نمایید. این متن، همان صفح? وب است .
برای دسترسی به این برنامه در محیط ویندوز مسیر زیر را طی کنید:


Start > All Programs > Accessories > Notepad



2- دیدن خروجی فایل : برای دیدن کار خروجی می بایست از مرورگر و یا browser استفاده کنیم. مرورگرهای متفاوتی وجود دارد که بحث آنها بسیار مفصل است ولی در محیط ویندوز مرورگر Internet Explorer در دسترس است.
شما می توانید آن را در دسکتاپ خود و یا Quick Launch ویا فولدر برنامه ها و یا در منوی start پیدا کنید.


3- برای فرستادن صفحه به محیط وب از دستور ftp استفاده خواهیم کرد که در ادامه به آن اشاره میکنم.


ابزارهای دیگر:

برای ادیت کردن صفحات خود می توانید از برنامه NoteTab استفاده کرد .مزیت استفاده از آن اینست که می توانید تب های مختلفی را برای صفحات مختلف باز کنید و بعد از بستن هم در حافظه ش می ماند و برای دفعه بعد هم باز می ماند.

منبع :http://100-webdesign.ir

استفاده از animated GIF :

وب سایتی را در نظر بگیرید که از هر نقطه آن موضوعی در حال چشمک زدن است آیا شما به این وب سایت ها علاقه دارید و یا به محض ورود پنجره آن را می بندید؟

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

تصاویر بهینه نشده :

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

رعایت نکردن اولویت ها :

یکی از مهمترین و اصولی ترین نکات در طراحی ساختار یک وب سایت رعایت اولویت ها در استفاده از اجزاء تشکیل دهنده وب سایت است . بخش Header وب سایت ، پس از آن به بخش بدنه اصلی و یا Content وب سایت می رسیم و پس از آن به Footer رعایت این ترتیب ها در وب سایتها الزامی است . جزء به جزء ، این اجزاء نیاز به توضیحات بسیاری دارند ولی با نگاهی به وب سایت های استاندارد رعایت این نکته را به وضوح خواهید دید .

بیش از 100 لینک در صفحه :

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

عنوان های نا مربوط :

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

صفحات Error404 :

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

استفاده بیش از حد تبلیغات :

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

موزیک متن :

بارها برای همگی ما پیش آمده که در یک ساعت غیر معمول مثلا نیمه شب صفحه ای از یک وب سایت را باز می کنیم و ناگهان موزیک با صدای بلند شروع به پخش شدن می کند؟

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

منبع : http://100-webdesign.ir

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

نوشتن برای موتورهای جستجو و نه برای خواننده :

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

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

 

استفاده از کدهای CSS بهینه شده :

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

نکته: در صورت تعیین نشدن خصوصیت برای یک تگ ، این تگ خصوصیات تگ منشاء ( Parent ) خود را می گیرد .از این نکته نیز می توان در خلاصه سازی کدهای CSS استفاده نمود . 

 

غیبت مدیریت محتوا :

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

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

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

Wordpress

Joomla

Drupal

ExpressionEngine

Cushy

 

استفاده از تکنیک های گرافیک به صورت نامناسب :

یک نوشته پر رنگ قرمز با حاشیه های بسیار عریض که بسیار ترسناک به نظر می رسد ...! ؟

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

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

 

صفحات اعتبار سنجی نشده (Not validating) :

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

 

نگارش بد متون و غلط های املائی :

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

 

استفاده از Intro های Flash

استفاده از Intro های Flash بدترین عامل برای شناخته نشدن وب سایت شما در موتورهای جستجوست .اگر فکر می کنید که احتیاجی به شناخته شدن در موتورهای جستجو ندارید از Flash Intro استفاده کنید .صفحات Index یکی از مهمترین صفحات برای موتورهای جستجو هستند پس به بهترین نحو از آنها استفاده نمائید .

اشتباهات رایج در ساخت یک وب سایت . قسمت هفتم

 

استفاده از نوشته ها به صورت تصاویر :

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

 

پاراگرافها و تصاویر به هم چسبیده و در هم ریخته :

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

 

منوهای مختلف و رنگارنگ :

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

منبع: http://100-webdesign.ir

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

 استفاده از کدهای قدیمی

وب سایت رابطه مستقیمی با تکنولوژی دارد و تکنولوژی نیز دائما در حال رشد و پیشرفت است . یکی از مواردی که باید در یک وب سایت استاندارد رعایت شود بروز بودن کدهای HTML,XHTML,CSS و …با استاندارد های سازمان بین المللی استانداردهای وب  W3C است . رعایت این استانداردها فواید بسیار زیادی برای وب سایت ها خواهد داشت .

استفاده از تصاویر گیج کننده و آزار دهنده :

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

استفاده از فونت های غیر استاندارد :

وب سایتی را در تصور کنید که فونت های استفاده شده در آن در کامپیوتر شما موجود نیست و محتویات این وب سایت به شکل یک زبان مریخی نمایش داده می شود .! ؟

فونتها از اجزاء اصلی تشکیل دهنده یک وب سایت هستند که عدم رعایت استاندارد در استفاده از آنها می تواند باعث عدم مقبولیت و یا کارایی وب سایت شما باشد .از فونتهایی استفاده کنید که با تمامی سیستم ها و مرورگرها سازگاری داشته باشد .فونتهای استاندارد زیادی برای زبان انگلیسی وجود دارد ولی در زبان فارسی بیشتر از برای عنوانها استفاده می شود .در انتخاب اندازه فونتها نیز بسیار دقت کنید زیرا همه با هر توانایی دیدی Time و یا Arial برای متن ها و از Tahoma فونت برای تعیین فونتهای جایگزین استفاده کنید، به این معنا که در صورت پشتیبانی نکردن یک فونت ، Css باید بتوانند مطالب وب سایت شما را بخوانند .از دستورات جایگزینی برای آن موجود باشد .

استفاده از رنگ زمینه نامناسب :

رنگ زمینه زرد با فونت سبز فسفری جیغ ! ؟ چطوره؟

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

 استفاده بیش از اندازه کلمات Bold :

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

منبع: http://100-webdesign.ir