Y.P.Y
Well-Known Member
نکات و اصول مهم در طراحی/ساخت وب:
1- صفحات را با استفاده از استاندارد HTML4 يا XHTML1 به اندازه توان مرورگر طراحي کنيد.
2- تمام صفحات ايستا(HTML) را بررسي، ارزيابي و آزمایش کنيد.
3- اغلب کاربران مرورگر را بخاطر بروز خطا/مشکل مقصر نمي دانند، سايت را مقصر مي دانند!
5- حتاالمکان با XHTML هماهنگ شويد تا آينده صفحات وبتان تضمين شده باشد.
6- حتاالمکان با استفاده از CSS طرح بصري ايجاد کنيد نه با تصاوير.
7- براي بالا بردن کيفيت و خوانايي کد، از توضيحات/Comments استفاده کنيد.
<!-- Begin header --!>
<!-- End header --!>
<!-- Begin menu --!>
<!-- Menu::Main --!>
...
<!-- Menu::Links --!>
...
<!-- End menu --!>
...
8- قوانین CSS را در صفحات بررسی کنید و از استاندارد های CSS1 بهره بگیرید.
9- حتاالمکان از Stylesheet های خارجی(External) استفاده کنید.
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="http://domain/" 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- صفتهای فرمها را بصورت کامل قرار دهید و بحالت پیشفرض رها نکنید.
و در آخر، از تغییر مسیر خودکار خطاهای 404 خودداری کنید.
موفق باشید.
1- صفحات را با استفاده از استاندارد HTML4 يا XHTML1 به اندازه توان مرورگر طراحي کنيد.
2- تمام صفحات ايستا(HTML) را بررسي، ارزيابي و آزمایش کنيد.
3- اغلب کاربران مرورگر را بخاطر بروز خطا/مشکل مقصر نمي دانند، سايت را مقصر مي دانند!
5- حتاالمکان با XHTML هماهنگ شويد تا آينده صفحات وبتان تضمين شده باشد.
6- حتاالمکان با استفاده از CSS طرح بصري ايجاد کنيد نه با تصاوير.
7- براي بالا بردن کيفيت و خوانايي کد، از توضيحات/Comments استفاده کنيد.
<!-- Begin header --!>
<!-- End header --!>
<!-- Begin menu --!>
<!-- Menu::Main --!>
...
<!-- Menu::Links --!>
...
<!-- End menu --!>
...
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="http://domain/" 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- صفتهای فرمها را بصورت کامل قرار دهید و بحالت پیشفرض رها نکنید.
و در آخر، از تغییر مسیر خودکار خطاهای 404 خودداری کنید.
موفق باشید.
