uody
7th April 2011, 03:04 PM
69 نکته در طراحی و ساخت صفحات وب
1- صفحات را با استفاده از استاندارد HTML4 يا XHTML1 به اندازه توان مرورگر طراحي کنيد.
2- تمام صفحات ايستا(HTML) را بررسي، ارزيابي و آزمایش کنيد.
3- اغلب کاربران مرورگر را بخاطر بروز خطا/مشکل مقصر نمي دانند، سايت را مقصر مي دانند!
4- حتاالمکان با XHTML هماهنگ شويد تا آينده صفحات وبتان تضمين شده باشد.
5- حتاالمکان با استفاده از CSS طرح بصري ايجاد کنيد نه با تصاوير.
6- براي بالا بردن کيفيت و خوانايي کد، از توضيحات/Comments استفاده کنيد.
<!– Begin header –!>
<!– End header –!>
<!– Begin menu –!>
<!– Menu::Main –!>
…
<!– Menu::Links –!>
…
<!– End menu –!>
…
7- از تغییر مسیر خودکار خطاهای 404 خودداری کنید.
8- قوانین CSS را در صفحات بررسی کنید و از استاندارد های CSS1 بهره بگیرید.
9- حتاالمکان از Stylesheet های خارجی(External) استفاده کنید.
<link type=”text/css” href=”…/print.css” rel=”stylesheet” media=”all” title=”Print” />
10- حالت غیرفعال/Disable بودن CSS در مرورگر را حساب کنید.(Tableless ها!)
11- از Stylesheet های Print/چاپ هم استفاده کنید و قابلیت انتخاب به کاربر بدهید.
12- از پیچاندن بیش از حد آدرسها و URL ها خودداری کنید(پیچیدگی =! امنیت).
13- داده های ورودی توسط کاربر را بدقت بررسی و کنترل کنید.
14- از اجرا نمودن برنامه های Console/Shell از طریق اسکریپت(Client-side) خودداری کنید.
15- از توضیحات/Comment های HTML در تگ <script> استفاده کنید.
<script>
<!–
…
–!>
</script>
16- با استفاده از تگ <NoScript> وضعیت غیرفعال/Disable بودن جاوااسکریپت را کنترل کنید!
17- مشخصات و صفت های تگهای<style> و <script> را کامل بنویسید.
<script type=”text/javascript” language=”javascript1.5″>
<style type=”text/css” media=”all” title=”Common”>
18- خطاهای جاوااسکریپت صفحات را حل و مدیریت کنید. 19- از بکاربردن بیش از حد کدهای CSS و جاوااسکریپت خودداری کنید!
20- حتاالمکان از ActiveX ها و Plug-in ها استفاده نکنید.21- مشکل مرورگرهایی که از جاوااپلت پشتیبانی نمی کنند را مدیریت کنید.
22- کاربران را از استفاده/کاربرد کوکی برای ذخیره اطلاعات مطلع کنید.
23- از استفاده بیش از حد کوکی خودداری کنید.
24- از استفاده موسیقی و صوت در صفحاتتان خودداری کنید. یا حداقل قدرت انتخاب به کاربر بدهید.
25- کاربر و طراح یکی نیستند!
26- طوری طراحی کنید که تفاوت سلیقه ها را هم در نظر داشته باشد.
27- صفحات را عاری از عیب و نقص طراحی کنید(مرورگرها، سیستمها و… به اندازه خودشان مشکلات دارند).
28- شکل ظاهری سایت را با رفتار و نوع سایت طراحی کنید.
29- کاربران از سایت استفاده می کنند، نه مرورگر!
30- از بکاربردن متون، تصاویر و پس زمینه های پررنگ خودداری کنید.
31- از بکاربردن Background های شلوغ و سنگین خودداری کنید.
32- کاربران انتظار حداکثر بازده از حداقل کار را دارند.
33- مدت زمانی که کاربر منتظر می ماند برابر باشد با پاداش/نتیجه مطلوبی که میگیرد.
34- از متون خیلی ریز یا خیلی درشت استفاده نکنید.
35- سایت طوری طراحی کنید که نیازهای افراد مبتدی، متوسط و حرفه ای را فراهم کند.
36- افرادی را برای تست سایت دخالت دهید که در فرایند طراحی “نبوده اند”.
37- صفحاتی را برای Privacy و Term of use/service ایجاد نمایید.
38- پست الکترونیک یا فرم تماس را در دسترس قرار دهید.
39- انتقادات، پیشنهادات و نظرات(Feedback) کاربران را مشتاقانه پذیرا باشید.
40- ایجاد نقشه سایت و راهنما را فراموش نکنید.
41- از صفت Alt در تگهای تصاویر، پیوندها و… استفاده کنید.
42- از استفاده بیش از حد Frame خودداری کنید.
43- Link های صفحات را چک کنید و از سالم بودنشان مطمئن بشید.
44- شکل ظاهری صفحات جداگانه را با شکل ظاهری صفحات اصلی یکنواخت کنید.
45- به املا و دیکته لغات دقت کنید.
46- برای تگهای Link از صفت Title استفاده نمایید.
47- صفحات را از نظر محتوا و کدنویسی بروز کنید!
48- سایتها/Link های خارجی را در پنجره/صفحه خودتان باز نکنید.
<a href=” target=”_BLANK”>Title</a>
49- از پس زمینه های تیره استفاده نکنید.50- جداول را خارج از Scrollbar مرورگر قرار ندهید. بطوری که اسکرول افقی ایجاد شود! 51- حتاالمکان از تصاویر PNG استفاده نکنید(فعلاً).
52- از قرار دادن تصاویر و فایلهای Download در پوشه اصلی سایت خودداری کنید.
53- آدرس تصاویر را از سایتهای خارجی(External) نگیرید!
54- حجم و نوع فایلهای Download را نمایش دهید.
file.zip – 5 MB
Iran.mp3 – 7 MB
…
55- از تگ <blink> استفاده نکنید.56- متنها را بصورت حروف بزرگ ننویسید(این یعنی با صدای بلند/فریاد با خواننده حرف زدن)
WHAT IS YOUR NAME?! 57- دائماً از حروف Bold/توپر و اریب/Italic استفاده نکنید.
58- حد فاصل بین Link ها را رعایت کنید.
Index | About | Contact | FAQ | …
59- عرض متون را محدود کنید.
60- تصاویر را برای بزرگ نمایی نکشید.
61- از تعدد رنگ استفاده نکنید.
62- صفحات را در تمام مرورگرها تست و بررسی کنید. IE, Firefox, Opera…
63- صفحات را برای رزولوشن های بالا طراحی نکنید!
64- از استفاده بیش از حد پنجره های Popup خودداری کنید!
65- سایت خود را در موتورهای جستجو و Link directory ها ثبت کنید.
66- چندین آدرس و URL قابل حدس برای بخشهای مهم سایت ایجاد کنید.
67- همیشه صفت MaxLength را برای فیلدهای متنی درنظر بگیرید.
69- صفت های فرم ها را بصورت کامل قرار دهید و به حالت پیش فرض رها نکنید.
منیع:sem-eng.com
1- صفحات را با استفاده از استاندارد HTML4 يا XHTML1 به اندازه توان مرورگر طراحي کنيد.
2- تمام صفحات ايستا(HTML) را بررسي، ارزيابي و آزمایش کنيد.
3- اغلب کاربران مرورگر را بخاطر بروز خطا/مشکل مقصر نمي دانند، سايت را مقصر مي دانند!
4- حتاالمکان با XHTML هماهنگ شويد تا آينده صفحات وبتان تضمين شده باشد.
5- حتاالمکان با استفاده از CSS طرح بصري ايجاد کنيد نه با تصاوير.
6- براي بالا بردن کيفيت و خوانايي کد، از توضيحات/Comments استفاده کنيد.
<!– Begin header –!>
<!– End header –!>
<!– Begin menu –!>
<!– Menu::Main –!>
…
<!– Menu::Links –!>
…
<!– End menu –!>
…
7- از تغییر مسیر خودکار خطاهای 404 خودداری کنید.
8- قوانین CSS را در صفحات بررسی کنید و از استاندارد های CSS1 بهره بگیرید.
9- حتاالمکان از Stylesheet های خارجی(External) استفاده کنید.
<link type=”text/css” href=”…/print.css” rel=”stylesheet” media=”all” title=”Print” />
10- حالت غیرفعال/Disable بودن CSS در مرورگر را حساب کنید.(Tableless ها!)
11- از Stylesheet های Print/چاپ هم استفاده کنید و قابلیت انتخاب به کاربر بدهید.
12- از پیچاندن بیش از حد آدرسها و URL ها خودداری کنید(پیچیدگی =! امنیت).
13- داده های ورودی توسط کاربر را بدقت بررسی و کنترل کنید.
14- از اجرا نمودن برنامه های Console/Shell از طریق اسکریپت(Client-side) خودداری کنید.
15- از توضیحات/Comment های HTML در تگ <script> استفاده کنید.
<script>
<!–
…
–!>
</script>
16- با استفاده از تگ <NoScript> وضعیت غیرفعال/Disable بودن جاوااسکریپت را کنترل کنید!
17- مشخصات و صفت های تگهای<style> و <script> را کامل بنویسید.
<script type=”text/javascript” language=”javascript1.5″>
<style type=”text/css” media=”all” title=”Common”>
18- خطاهای جاوااسکریپت صفحات را حل و مدیریت کنید. 19- از بکاربردن بیش از حد کدهای CSS و جاوااسکریپت خودداری کنید!
20- حتاالمکان از ActiveX ها و Plug-in ها استفاده نکنید.21- مشکل مرورگرهایی که از جاوااپلت پشتیبانی نمی کنند را مدیریت کنید.
22- کاربران را از استفاده/کاربرد کوکی برای ذخیره اطلاعات مطلع کنید.
23- از استفاده بیش از حد کوکی خودداری کنید.
24- از استفاده موسیقی و صوت در صفحاتتان خودداری کنید. یا حداقل قدرت انتخاب به کاربر بدهید.
25- کاربر و طراح یکی نیستند!
26- طوری طراحی کنید که تفاوت سلیقه ها را هم در نظر داشته باشد.
27- صفحات را عاری از عیب و نقص طراحی کنید(مرورگرها، سیستمها و… به اندازه خودشان مشکلات دارند).
28- شکل ظاهری سایت را با رفتار و نوع سایت طراحی کنید.
29- کاربران از سایت استفاده می کنند، نه مرورگر!
30- از بکاربردن متون، تصاویر و پس زمینه های پررنگ خودداری کنید.
31- از بکاربردن Background های شلوغ و سنگین خودداری کنید.
32- کاربران انتظار حداکثر بازده از حداقل کار را دارند.
33- مدت زمانی که کاربر منتظر می ماند برابر باشد با پاداش/نتیجه مطلوبی که میگیرد.
34- از متون خیلی ریز یا خیلی درشت استفاده نکنید.
35- سایت طوری طراحی کنید که نیازهای افراد مبتدی، متوسط و حرفه ای را فراهم کند.
36- افرادی را برای تست سایت دخالت دهید که در فرایند طراحی “نبوده اند”.
37- صفحاتی را برای Privacy و Term of use/service ایجاد نمایید.
38- پست الکترونیک یا فرم تماس را در دسترس قرار دهید.
39- انتقادات، پیشنهادات و نظرات(Feedback) کاربران را مشتاقانه پذیرا باشید.
40- ایجاد نقشه سایت و راهنما را فراموش نکنید.
41- از صفت Alt در تگهای تصاویر، پیوندها و… استفاده کنید.
42- از استفاده بیش از حد Frame خودداری کنید.
43- Link های صفحات را چک کنید و از سالم بودنشان مطمئن بشید.
44- شکل ظاهری صفحات جداگانه را با شکل ظاهری صفحات اصلی یکنواخت کنید.
45- به املا و دیکته لغات دقت کنید.
46- برای تگهای Link از صفت Title استفاده نمایید.
47- صفحات را از نظر محتوا و کدنویسی بروز کنید!
48- سایتها/Link های خارجی را در پنجره/صفحه خودتان باز نکنید.
<a href=” target=”_BLANK”>Title</a>
49- از پس زمینه های تیره استفاده نکنید.50- جداول را خارج از Scrollbar مرورگر قرار ندهید. بطوری که اسکرول افقی ایجاد شود! 51- حتاالمکان از تصاویر PNG استفاده نکنید(فعلاً).
52- از قرار دادن تصاویر و فایلهای Download در پوشه اصلی سایت خودداری کنید.
53- آدرس تصاویر را از سایتهای خارجی(External) نگیرید!
54- حجم و نوع فایلهای Download را نمایش دهید.
file.zip – 5 MB
Iran.mp3 – 7 MB
…
55- از تگ <blink> استفاده نکنید.56- متنها را بصورت حروف بزرگ ننویسید(این یعنی با صدای بلند/فریاد با خواننده حرف زدن)
WHAT IS YOUR NAME?! 57- دائماً از حروف Bold/توپر و اریب/Italic استفاده نکنید.
58- حد فاصل بین Link ها را رعایت کنید.
Index | About | Contact | FAQ | …
59- عرض متون را محدود کنید.
60- تصاویر را برای بزرگ نمایی نکشید.
61- از تعدد رنگ استفاده نکنید.
62- صفحات را در تمام مرورگرها تست و بررسی کنید. IE, Firefox, Opera…
63- صفحات را برای رزولوشن های بالا طراحی نکنید!
64- از استفاده بیش از حد پنجره های Popup خودداری کنید!
65- سایت خود را در موتورهای جستجو و Link directory ها ثبت کنید.
66- چندین آدرس و URL قابل حدس برای بخشهای مهم سایت ایجاد کنید.
67- همیشه صفت MaxLength را برای فیلدهای متنی درنظر بگیرید.
69- صفت های فرم ها را بصورت کامل قرار دهید و به حالت پیش فرض رها نکنید.
منیع:sem-eng.com