• الرئيسية
  • تعرف علي
  • اتفاقية النشر
  • اتصال
  • خدمات
  • تابع خلاصات المدونة

« قواعد selector على منصة jQuery
تخصيص أوامر ie بطريقة جديدة و مريحة »
4

توجيهات عامة لاستعمالات أفضل للخطوط

فبراير
22

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

انواع الخطوط

طبعا لا أحد يلزم علينا انواعا معينة من الخطوط ، ولكل أنواعه و مجموعته المفضلة من هذه الخطوط ، باستثناء القواعد التي تكلمنا عنها بالنسبة للغة العربية ، لكن ، عادة حتى تحصل على واجهات متناسقة و جدية نوعا ما ، حاول أن تجعل كل صنف معين من صفحتك بخط معين ، مثلا لو اخترت للعناوين خط times new roman فحاول أن لا تغير الخط في نفس التصنيف وهو العناوين ، كذلك الحال لو استعلمنا خط tahoma في التدوينات ، فمن الخطأ جعل خط آخر في محتوى الصفحات ، ببساطة لأنها من نفس تصنيف التدوينات ، ألا وهو المحتوى

الأحجام

كنت قد نبهت عن هذا في التدوينة التي أشرت إليها في الموضوع الأول ، لكن هنا سأنبه على العناصر التي بداخلها عناصر أخرى ، داخل العناوين اجعل حجم h1 هو أكبر الأحجام ، و h6 هو أصغرها حتى يعطي للزائر انطباعا أوليا من ناحية الأولوية

الألوان

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

التغيير

لا تجعل كل الصفحة بنوع واحد من الخطوط ، فللتغيير حلاوة ، ولكن حاول ألا يطغى هذا التغيير ليصل إلى مهرجان من الأنواع داخل صفحتك

تنسيق المحتوى

عادة انحراف المحتوى إلى اليمين أو الشمال من المبتعد ، غالبا ما نستعمل

text-align: justify;

للتنسيق بين جميع الحواف و المعادلة بينها ، كما في أوائل الفقرات حاول استعمال

text-indent: 10px;

10px مثال فقط ، حيث تبعد السطر الأول عن هذا التسيق قليلا لنعلم الزائر بأماكن بداية الفقرات

الكلمات الهامة

نعم ، لتثير انتباه الزائر بأن الكلمة الفلانية مهمة بالنسبة له ، حاول استعمال بعض الخصائص لتثير هذا الانتاه ، مثل

font-style: italic;

أو

font-weight:  bold;

على حسب الموقع ، يمكنك ادخال خلفية لون بسيطة ، او سطر معين ، فقط لا تحاول تغيير حجم النص لأنك ستقع في حرج تداخل الكلمات و عدم الانتظام بين السطور

التنسيقات

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

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

انشر هذا المقال
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • Live
  • MySpace
  • TwitThis
  • Yahoo! Buzz
  • FriendFeed
  • LinkedIn
  • Ping.fm
  • StumbleUpon

هذه التدوينة نُشرت في الإثنين, 22 فبراير, 2010 عند 4:03 م و مصنفة تحت تصنيف تطوير. يمكنك متابعة أي تعليقات عبر رابط RSS 2.0. يمكنك ترك تعليق, أو تعقيب من مدونتك.
الوسوم :استعمال, توجيهات, خطوط, قواعد

    لتكون على علم بآخر المواضيع و المقالات المضافة في fez-soft blog يمكنك الاشترك في :
  • خلاصات المقالات
  • خلاصات التعليقات
  • متابعة الكاتب على twitter
  • القائمة البريدية : بمجرد أن تضع بريدك الالكتروني و تشترك ، سنصلك قائمة بآخر المواضيع المضافة في المدونة تلقائيا إلى بريدك الالكتروني .
متابعة معلومات عن المقال
« قواعد selector على منصة jQuery
تخصيص أوامر ie بطريقة جديدة و مريحة »

4 من التعليقات لـ “توجيهات عامة لاستعمالات أفضل للخطوط”

  1. iMezied قال:
    22 فبراير 2010 عند 4:15 م

    معلومات بسيطه لكنها مهمه وتعمل على اعطاء رونق للشكل العام وتناسقه
    كل الشكر لك عزيزي
    وتدوينه موفقه ان شاء الله

    ردرد
  2. abdallh قال:
    22 فبراير 2010 عند 5:53 م

    جميل ماتفضلت به اخي العزيز

    لكن توجد هناك مشكلة ازلية في الخطوط العربية
    ألا وهي :
    اختلاف نظم التشغيل يشكل اختلاف في انواع الخطوط

    مثلا ً الخطوط العربي في ماك تختلف عن الويندوز بشكل كبير
    فبدل الخط Aril تجد في الماك الخط Gezapro .. فما الحل ؟

    واعتذر عن الاخطاء الأملائية :)

    ردرد
  3. Fez-Soft قال:
    22 فبراير 2010 عند 7:04 م

    مرحبا أخي ، بالنسبة لنظام الماك خاصة كنت قد تكلمت عن استعمال أي شيء اردنا ان يظهر عليه فقط في أواخر هذه التدوينة
    باستغلال نظام التعليقات
    موفق

    ردرد
  4. aajli قال:
    23 مارس 2010 عند 6:31 م

    ما شاء الله عليك اخي محمد
    بارك الله فيك على التدوينة المميزة وننتضر الجديد بفارغ الصبر..

    ردرد

إكتب تعليقك

اضغط هنا لإلغاء الرد.

إذا أردت أن تظهر صورة بجانب اسمك في التعليق ، شارك في خدمة Gravatar .

  • Donate

    إذا أعجبتك المدونة و رأيت أنك قد استفدت منها و تريد أن تدعمني ، يمكنك أن تشتري لي أحد الكتب التي أحتاج قراءتها ، من Amazon .
  • تصنيفات

    • css , xhtml
    • JavaScript
    • Photoshop, Flash, illustrator
    • PHP
    • تطوير
    • عام
  • مواقعي

    • SetCode
    • Fez-Soft Portfolio
    • مدونة محمد شاطر
  • الأرشيف

    • يوليو 2010
    • يونيو 2010
    • أبريل 2010
    • فبراير 2010
    • يناير 2010
    • ديسمبر 2009
    • نوفمبر 2009
    • أكتوبر 2009
    • سبتمبر 2009
    • أغسطس 2009
    • يوليو 2009
    • يونيو 2009
    • مايو 2009
  • كلمات مفتاحية

    alert Application Assembler confirm css div html html4 html5 javascript jquery media opacity PHP prompt screen Top xhtml أفكار إخفاء إظهار استدعاء تأثير ترقيع تسريع تصميم تطبيق تفصيل تنسيق توافق توزيع ثلاثي أبعاد حقوق روابط زجاجي صفحات عميل فكرة قائمة قالب قواعد متفرعة مشاريع مصمم مطور
  • روابط

    • مدونة يزيد

© Fez-Soft Blog

    All right reserved , Theme By Fez-Soft , RSS posts , RSS comments .
  • تعرف علي
  • اتفاقية النشر
  • خدمات
  • اتصال
  • الرئيسية
عن Fez-Soft
mohammed chater مرحبا ، اسمي محمد شاطر ، Mohammed chater , أعرف تحت مسمى Fez-Soft, طالب و مصمم و مطور تطبيقات ، من فاس المغرب . . يمكنك أن تتعرف علي اكثر من هنا ، أو متابعة حسابي على twitter ، ستجد في هذه المدونة دروسا تطويرية للمستوى المتقدم في تصميم الويب ، و البرمجة بالـ JavaScript , يمكنك متابعتها من خلال الخلاصات ، كما يمكنك أن تراسلني من هنا ، لو دعت الضرورة لذلك ، آمل ان يكون وقتك في المدونة لك ، لا عليك .
الأكثر زيارة
  • فضلا .. لا تستعمل Framework css
  • الخطوط العربية : قواعد ، أفكار و حيل
  • SetCode خدمة جديدة تطل على عالم المطورين
  • ترقيعات css ، الجمل الشرطية ، بالتفصيل الممل
  • قائمة أفقية ، مع تحديد title بـ jQuery بطريقة فريدة
  • تطبيقات hover على عناصر text و ليس صور
آخر التعليقات
  • كمال  : السلام عليكم استفسار بسيط واعتقد انه مهم ومفيد ن...
  • صلاح الإمام  : جزاك الله كل خير ع الطرح الرائع...
  • مفيد  : رائع منذ فترة و انا ابحث عن هذه المعلومات...
  • عبدالله  : شكرا لك على جملة النصائح...
  • ندى  : شكراً لك .. ولكن مشاكل الترميز توتر الشخص !...