ابتعد عن هذا و افعل هذا ( 3 أجزاء )

[أبوجهاد]

بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله وبركاته
هذا رابط عن موضوع جميل يتحدث عن النقاط التي يُنصح بعملها والأخرى التي يُنصح بالابتعاد عنها في تصميم المواقع...

http://www.secretsites.com/do_dont_part1.jsp

الموضوع ممتاز ومفيد جداً ... وأنا شخصياً استفدت منه كثيراً ...
لذا بإذن الله سأقوم بترجمة المقال للغة العربية.. حتى يستفيد منه أكبر قدر من الأخوة ...
وإن شاء الله أكون وفقت في النقل والترجمة..

:shy:

[أبوجهاد]

الجزء الأول ....

هناك العديد من النقاط الجيدة والسيئة التي يجب مراعاتها عند تصميم المواقع ( نقاط يُنصح بعملها وأخرى الابتعاد عنها )، وهذه قائمة بتلك الخيارات وكيف يجب أن تتعامل معها:

1.لا تستخدم عداد الدخول (الزيارات):
(عداد الدخول: عداد يقوم بتدوين وعرض عدد المرات التي تمت فيها زيارة الصفحة).
(عداد الدخول = عدد الزيارات للموقع).
عداد الدخول (الزيارات) فعلياً لا يعمل شيء للموقع، وقد لا يتناسب مع تصميم الموقع، بالإضافة إلى أنه يخبر الزوار معلومات عن موقعك قد لا تود أن يطلع عليها أحد !
إذا كنت تود معرفة عدد زوار موقعك، يمكنك ببساطة سؤال مستضيف الموقع عن إحصائيات موقعك. جميع شركات الاستضافة لديها القدرة على تقديم إحصائيات تفصيلية.

2.لا تستخدم النصوص المشعة أو المضيئة: (Blinking or Flashing text)
المكان الوحيد الذي يمكن أن ترى فيه هذه النصوص هو الإشارات الضوئية كما في الإعلانات المنتشرة على الطرق، أو في المواقع الإلكترونية التي صممت في منتصف التسعينات!
ومعظم الزوار لا يحب أن يراها...
هناك نقطة مهمة، نحن أمام شاشة الحاسب نقرأ بسرعة تصل إلى 4 أضعاف سرعة قراءتنا من ورقة. لذا يجب أن يتميز ما نريد عرضه في الموقع بالاختصار والجمال.

3.أهتم بعنوان الصفحة:
حاول دائماً أن تكون عناوين صفحات موقعك واضحة وذات معنى.
عنوان الصفحة هو أحد الأساسيات في الصفحة، <title>عنوان الصفحة</title>، فالوسمين السابقين تضع بينها عنوان الصفحة والذي سيظهر في أعلى الصفحة وفي نتائج محركات البحث.
متصفحي المواقع ينتبهون لعناوين الصفحات، لذا احرص أن يكون واضحاً.

4.لا تجبر الزوار على تحميل نسخة جديدة من متصفح المواقع:
لا تجبرهم على تحميل نسخة جديدة وذلك فقط ليتمكنوا من مشاهدة التأثيرات الخاصة الموجودة في موقعك ( مثل Plug-in Flash ).
لا تحصر نفسك في مثل هذه التقنيات فعن طريق استخدامك الملائم لـ CSS و HTML يمكنك أن تصمم صفحات جميلة جداً.

5.فكر مرتين قبل استخدامك للإطارات.
في الأيام السابقة كان هناك جدل حول استخدامنا لها بسبب القصور في قدرات الارتباطات في لغة HTML.
أما اليوم وبعد أن أصبحت معظم المتصفحات تدعم تقنية CSS فلا يوجد حاجة لاستخدام الإطارات.
ستسأل لماذا يجب ألا أستخدم الإطارات؟
وذلك بسبب ظهور مشاكل في إنشاء واستخدام الإطارات وخاصة للمبتدئين. بالإضافة إلى أن الإطارات تجعل المواقع معقدة أكثر مما يجب، وأخيراً ستسبب لك جميع أنواع المشاكل مع محركات البحث.

6.لا تحاول استخدام حيل غبية ورخيصة لتتحايل بها على محركات البحث:
في الماضي كان مشرفي المواقع يعملون على تطوير حيل وطرق مختلفة بهدف التحسين من تقييم محركات البحث لمواقعهم وظهور مواقعهم في أمكان متقدمة في نتائج البحث.
إحدى الطرق التي كانت تستخدم، هي وضع المئات من الكلمات المفتاحية في صفحات الموقع (وتكون هذه الكلمات غير مرئية). هذه الطريقة لاقت نجاح محدود في الماضي، لكن هذه الأيام قد ولت.
حاول خداع محرك البحث الشهير جوجل ( ملك محركات البحث ) وستكون قد حكمت على موقعك بالموت المريع.
تذكر دائماً المحتوى الجيد الذي تقدمه في موقعك سيؤدي إلى تحسن تقييم موقعك في محركات البحث وسترسل لك محركات البحث الكثير من الزوار.

7.غرف الدردشة:
أغلب زوار المواقع لا يهتمون لغرف الدردشة. والأسوأ من وجود غرفة دردشة في موقعك هو أن تكون خالية من المتحدثين! فماذا لو دخل زائر إلى الغرفة ولم يجد أحداً !!
فلا تستخدمها إلا إذا كان لديك موقع يزوره شهرياً عشرات الآلاف، وهناك موضوع يحتاج وجدود غرفة محادثة لمناقشته.

8.مقدمات الفلاش:
قبل عدة سنوات كان هناك غضب منها، ولسنا متأكدين إذا كان هناك أحد يعرف لماذا نحتاج لها.
الزر SKIP INTRO ( تجاوز المقدمة الفلاشية ) يحتل المرتبة الثانية بين الروابط التي يتم الضغط عليها في المواقع هذه الأيام.
لا تضيع وقتك في هذه المقدمات وبرأيي ( أكيد رأي كاتب المقال الأصلي ) الفلاش يجب أن يستخدم فقط في الحالات التي يجب أن يُستخدم بها فقط.

9.صفحات تحت الإنشاء ( تحت الصيانة ):
حاول ألا تستخدمها إطلاقاً، إذا لم تكن الصفحة جاهزة، لا تقم برفعها إلى السيرفر. إذا كان هناك أي رابط يؤدي إلى هذه الصفحة لا تقم بتفعيله حتى تكون الصفحة جاهزة. أما إذا كانت الصفحة بالفعل تحت الصيانة ومحتواها جاهز للعرض فقط قم بعرضه في آخر التحديثات (جديد الموقع) وحاول بالفعل أن يكون هناك شي جديد في الصفحة.
مهما حصل حاول جاهداً أن لا تضعها.


إنتهى :lol:

[أبوجهاد]

أتمنى أن يكون الموضوع ذو فائدة
وهذا الجزء الثاني منه..

الجزء الثاني

1.لا تستخدم أي خلفيات موسيقية في صفحات موقعك.
بعض مصممي المواقع يحب فكرة أن تكون هناك خلفية موسيقية لموقعه، وهذا قد يكون مناسباً في حالات خاصة مثل موقع تلفزيون MTV أو موقع ديزني لاند. لكنها ستكون فكرة سيئة في أغلب المواقع، لأن الملفات الموسيقية ثقيلة نوعاً ما، مما يؤدي إلى البطء في تحميل صفحات الموقع.
أما إذا كنت ستستخدمها، اجعلها تشغيلها أمر اختياري حيث يكون للزائر الخيار بالاستماع لها من عدمه. أسهل طريقة لعمل ذلك باستخدام الفلاش، لأن أغلب المتصفحات الحديثة تستطيع تشغيل ملفات الفلاش، والفلاش يدعم MP3.

2.لا تستخدم وسم "marquee":
يُنصح بالابتعاد عن استخدامه، لأن وسم الـ HTML هذا لا يعمل إلا في Internet Explorer وبدءاً من الإصدار الثالث فقط. مما يعني عدم ظهوره بشكل صحيح لمستخدمي المتصفحات الأخرى. لكن يوجد طرق أخرى عديدة لعرض نص تحرك في موقعك. ولكن يُنصح بالابتعاد عنها قدر المستطاع.

3.حاول أن يكون هناك قالب ثابت لصفحات الموقع.
يجب أن يكون تصميم الصفحات في الموقع له صبغة معينة ثابتة.
أبسط مثال لتوضيح المعنى.. البعض قد يصمم قائمة تكون أفقية في أعلى الصفحة وعندما تنتقل إلى صفحة أخرى ترى أن هذه القائمة أصبحت في اليمين أو اليسار..

4.لا تقم بإنشاء نوافذ (POP-UP).
إذا كنت تحب إزعاج زوار موقعك أنشئ مثل هذه النوافذ.

5.أنشئ قوائم ذات نمط تقليدي فقط:
ابتعد عن التعقيدات عند إنشاء القوائم، فالبعض يصل بتعقيده إلى أن ينشئ قائمة دائرية أو مثلث ثلاثي الأبعاد.
الشركات الكبرى مثل Apple و Microsoft لا تستخدم إلا النمط التقليدي من القوائم وهي القوائم التي تكون في الأعلى فقط أو في الجانبين.

6.لا تقم بتغيير تلقائي لحجم المتصفح:
البعض خلال تصميمه للموقع يستخدم نمط له حجم معين، لذا يستخدم كود JavaScript ليغير حجم نافذة المتصفح. وهذا يضايق الزوار كثيراً، لأن كل زائر يكون قد جهز متصفحه بالطريقة الأنسب له.

7.تصميم صفحات موقعك بحيث يمكن مشاهدته بدقة 800 * 600.
العديد من المصممين أجهزة تكون دقة الشاشة فيها 1024x768 و 1280x1024. فيصممون صفحاتهم لتتلائم مع هذه الدقة، وعندما يتصفحها الزوار الذين تكون دقة الشاشة لديهم أقصاها 800x600 مما لا يتناسب معهم.
باختصار يجب أن تصمم الصفحات في هذه الأيام لتتناسب مع دقة 800x600.

8.لا تقم بالتحويل التلقائي لزوار الموقع إلا في حالات خاصة جداً
بعض الأحيان يستخدم المصممين كود JavaScript لتحويل الزوار من صفحة لأخرى لأسباب مختلفة. مما يربك الزوار، ويسبب المشاكل مع محركات البحث. إذا كنت تريد نقل الزوار إلى صفحة أخرى، ضع رابط مع شرح بسيط إلى أين سيذهبون.

9.قم بإنشاء صفحة (الصفحة غير موجودة ).
غالباً ما نرى هذه الصفحات في المواقع التي تتم استضافتها على سيرفرات ويندوز، فتظهر لك رسالة مفادها أن الصفحة غير موجودة أو تمت إزالتها أو غير موجودة مؤقتاً.
The Page Cannot be Found
هذه الصفحة لا تعطي الزائر معلومات كثيرة وقد لا يستطيع فهمها كل الزوار، لذا من الأفضل أن تنشئ صفحات 404 'Page not found' خاصة بك والتي تظهر في حال عدم وجود الصفحة المطلوبة.
حاول أن تتميز ببساطة تصمميها ( استخدم الفرونت بيج مثلاً )، وأن توضح من خلالها للزوار بأنهم ما زالوا في الموقع الصحيح ولكن الصفحة التي تم الوصول إليها غير صحيحة، بالإضافة إلى وجود رابط فيها يؤدي إلى الصفحة الرئيسية للموقع، ويمكنك أن تضيف أيضاً رابط لصفحة خريطة الموقع، وإذا كان يوجد لديك محرك بحث في الموقع قم بإضافته في الصفحة أيضاً.

10.قم بإنشاء صفحة تحتوي على خريطة الموقع.
خريطة الموقع هي صفحة بسيطة مع روابط نصية لأقسام الموقع المختلفة مرتبة حسب التصنيف المستخدم في موقعك. معظم الزوار يستخدم خارطة الموقع إذا وجدت في الموقع.

11.حاول أن يكون حجم كل صفحة أقل من 60 كيلو بايت.
صفحات الموقع تتكون من نص، صور (GIF , JPEG , PNG) وأدوات أخرى مثل الفلاش وغيرها.. إذا أنتظر الزائر أكثر من 10 ثواني لعرض الصفحة، فإنك غالباً ستخسر معظم الزوار، صحيح أن سرعة الانترنت تتزايد كل يوم لكن المودم القديم ما زال منتشراً بكثرة لذا حاول أن لا يتجاوز حجم الصفحة 60 كيلو بايت.

12.لا تقم بمحاذاة وسطية لكل شيء في صفحات الموقع.
تخيل أنك تقرأ كتاباً جميع سطوره مكتوبة في منتصف الصفحة ! أعتقد أنه سيكون مملاً جداً.

13.لا تعتمد على JavaScript كثيراًً في موقعك.
بعض الإحصائيات أظهرت أن 10% من الزوار لا تعمل عندهم تأثيرات الجافا أو أنهم يعدون متصفحهم بحيث لا يعرضها. وأغلب مصممي المواقع يستخدمونها في تصميم القوائم، وبذلك لن تظهر هذه القوائم عند نسبة الـ 10%.
هذا لا يعني أن لا تستخدمها إطلاقاً، ولكن حرصاً على أن لا تُفَوِت عليك نسبة الـ 10% اجعل روابط أخرى في أسفل موقعك أو أنشئ صفحة خريطة الموقع.

:idea:
:court:

[أبوجهاد]

قبل البدء أود التذكير بنقطتين مهمتين في التصميم، وهي:
1. حاول قدر المستطاع أن تكون تصاميمك بسيطة وواضحة للزوار.
2. النقطة الواضحة لك لا تعني بالضرورة أنها ستكون واضحة لجميع الزوار.


الجزء الثالث

1. لا تستخدم ألواناً كثيرة في موقعك، حاول أن لا يزيد عدد الألوان عن لونين أو ثلاثة على الأكثر، وبذلك تُميز تصميمك عن الآخرين بهذه الألوان.

2. استخدم خاصية ' alt ' لجميع الصور في موقعك، كما في المثال أدناه:

<img src='images/dhfaf.gif alt = "Welcome To dhfaf" border="0" >

فعندما تضع مؤشر الماوس على الصورة سيظهر النص المكتوب والذي هو عبارة عن توضيح للصورة.

3. إذا كنت ستستخدم الصور كروابط فحاول أن تكون خاصية Border = " 0 " لأنه بذلك لن يظهر إطار أزرق حول الصورة لأن الرابط الأزرق سيعطي منظراً غير جميل لها.

4. عند عملية تنسيق النصوص لا تستخدم الوسمين <h5> و <h6> لأنهما سيجعلان النص أصغر من الافتراضي لمستعرض المواقع وبكل صراحة ستكون قراءة النص المكتوب صعبة جداً.

5. لا تستخدم كلمات كثيرة تكون مكتوبة بالتنسيق الغامق (Bold) في مقالاتك. إجعل هذه الخاصية مقتصرة على الكلمات المهمة أو العناوين.

6. لا تستخدم كلمات كثيرة تكون مكتوبة بالتنسيق المائل (Italic) في مقالاتك. إجعل هذه الخاصية مقتصرة على الكلمات المهمة أو العناوين.

7. الروابط التي تكتبها يجب أن تتميز بالشكل التالي:

<a herf = " http://www.dhfaf.com/>ضفاف</a>

أي كما تلاحظ أنها مختومة ب (/) " يقولون أنها تفتح بشكل أسرع ... و الله أعلم ".

8. لا تستخدم الصور كخلفية لموقعك لأنها أصبحت موضة قديمة جداً.

<body background = " my.gif ">

وبذلك يكون انتهى الموضوع
ولكنه أكيد مفتوح للنقاش مع الأخوة
وإضافة تعليقاتهم المفيدة بإذن الله..




:1power:

[أبوجهاد]

أعتقد كذا كفاية
لكن للعلم فقد تم نشر المقال سابقا في المواقع التالية :
1. نادي النيوك العربي.
2. منتدى الويب العربي.
3. مجتمع مطوري المواقع.

ولكن بمناسبة حصولي على عضوية في سوالف أحببت أن أشارككم بهذا المقال
تحياتي
أبو جهاد

[أبوجهاد]

للرفع للفائدة

[ssamri.net]

بارك الله فيك أخوى أبو جهاد .

[badmoon]

جزاك الله كل خير على ترجتمك .. !!

[المصمم 2005]

بارك الله فيك ... جهد جميل .
تحياتي

[أبوجهاد]

شكرا لمروركم ولكلامكم الجميل
أتمنى أن تكونوا استفدتم مثلي

[Abdullah Alhoshan]

يرفع للفائدة ..