معربا عن تكنولوجيا المعلومات

وضع معدات الشكل في الأعلى

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

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

وW3 المواصفات HTML "تنص أيضا على أن لا بد لي CSS تدرج في القسم الرئيسي من صفحة HTML. at the bottom of the page, so it's best not to use it. لاحظ أيضا أنه في IE @import سلوك نفس باستخدام <link> في أسفل الصفحة، لذلك فمن الأفضل عدم استخدامه.

تجنب استخدام ميزات مستعرض معين

المرشحات: استخدام فلتر يزيد من استهلاك الذاكرة ويتم تطبيقها لكل عنصر، وليس في صورة، لذلك يتم ضرب هذه المشكلة. أيضا، فلاتر هي الملكية آي إي، وبالتالي لا تعمل على النحو المنشود في المتصفحات الأخرى. إذا كنت تريد خلفيات شفافة أو الانحدار، واستخدام 1Pixel مع الصور.
التعبيرات: تعبيرات CSS هي سمة لطيفة في المغلق، لكنه لا يزال ميزة معينة آي إي. أيضا، من المهم أن نلاحظ أن هذه التعبيرات هي تقييم تمريره عندما يتم تقديم الصفحة وتغيير حجمها، وحتى عندما يقوم المستخدم بتحريك الماوس فوق صفحة. وغني عن القول هذا يمكن أن تؤثر على أداء موقعك. وبالتالي في كلمات بسيطة، وتجنب استخدام تعبيرات CSS، إلا إذا كنت تشعر إيجابياته، يزن أكثر من سلبيات لها "

الخارجى كنت CSS

وسوف تستخدم CSS خارجي يؤدي إلى سرعة تحميل من صفحات لأن الملفات جافا سكريبت والمغلق يتم مؤقتا من قبل المتصفح. الحصول على تحميل CSS مضمنة في مستندات HTML في كل مرة يطلب من وثيقة HTML. وهذا قد يقلص في الواقع عدد من طلبات HTTP التي كنه يزيد في وقت لاحق من حجم وثيقة HTML. CSS خارجي يتم مؤقتا من قبل المتصفح، يتم تقليل حجم المستند HTML دون زيادة عدد طلبات HTTP.

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

حقيبتك ملف CSS

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

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

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

بالنسبة للبعض منا مطوري الفقراء، الذين لا تزال هناك حاجة إلى رمز CSS التي يجب أن تعمل أيضا في IE6، ويمكن من الامم المتحدة وتوفر "مين ارتفاع"، يثبت وجود سدادة تظهر في وقت ما ... متأكدا اليأس.

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

حل 1: استخدام المأجور نؤكد [ ... اقرأ المزيد ]

.box1 {
min-height: 200px;
height:auto;
_height:200px;
}

HTML: -
<div class="box1">Some dynamic content with variable height ...</div>

---

الحل 2: استخدام المأجور المغلق محدد سمة

.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}

HTML: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>


وهاك المغلق محدد سمة يستفيد من حقيقة أن برامج التصفح في وقت سابق من IE6 ثا تجاهلت atribute-محدد. لاحظ شرط آخر تقسيم الحاويات مع "someclass" الطبقة =. فقط presense السمة فئة لهذا التقسيم، يتجاوز ارتفاع مرة أخرى إلى السيارات للأوبرا، وموزيلا MSIE7 وفي وقت لاحق. IE6، والذي لا يعتمد محددات atribute، يتجاهل ذلك.

عرض تجريبي للالإختراق مين ارتفاع عن IE6

إذا كنت تستخدم XML و XSL، ثم قد جئت عبر وقت واحد، عندما يكون لديك للعب مع حولها سمات وقيم العقد XML في كنت XSL. هم الكثير من المواقع التي تحتوي على معلومات ينضب طويل حول هذا الموضوع، ولكن لا شيء وجدت كانت مختصرة ودقيقة ... وليس هذا البرنامج التعليمي XML / XSL، ولكن محاولة مني لوضع معا نوعا من الغش قائمة ...

العينة XML أننا سوف نعمل مع يشبه هذا ...

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="food.xsl"?>
<food>
<fruits type="tropical">
<item name="mango" moreinfo="http://www.mango.com">Mango is the king of fruits</item>
<item name="banana" moreinfo="http://www.banana.com">Banana once a day , keeps the doctor away</item>
<item name="orange" moreinfo="http://www.orange.com">Orange is the color and rich in vitamin C</item>
<item name="Papaya" moreinfo="http://www.papaya.com">Papaya - Hot when raw, cold when ripe</item>
</fruits>
</food>

بحيث يتيح البدء في تحويل XML اعلاه باستخدام XSL

مثال 1: عرض قيمة في اختيار سمة

<xsl:value-of select="/food/fruits/item[@name='orange']" /><br />
to get more information about <a href="{/food/fruits/item[@name='orange']/@moreinfo}" target="new" ><xsl:value-of select="/food/fruits/item[@name='orange']/@name" /> </a>

والنتيجة تبدو وكأنها HTML

Orange is the color and rich in vitamin C,
to get more information about <a href="http://www.orange.com" target="new">

مثال 2: من خلال التكرار وعرض جميع أسماء السمة XML وقيمها

<xsl:for-each select="/food/fruits/item/@*">
attribute name : <xsl:value-of select="name()"/>,
attribute value : <xsl:value-of select="."/> <br />
</xsl:for-each>

والنتيجة تبدو وكأنها HTML


attribute name : name, attribute value : mango
attribute name : moreinfo, attribute value : http://www.mango.com
attribute name : name, attribute value : banana
attribute name : moreinfo, attribute value : http://www.banana.com
attribute name : name, attribute value : orange
attribute name : moreinfo, attribute value : http://www.orange.com
attribute name : name, attribute value : Papaya
attribute name : moreinfo, attribute value : http://www.papaya.com


مشاهدة هذا الفضاء، وسوف أظل تحديث هذه مع النتائج الجديدة ...