يجري الإعداد علي قدم وساق لوضع مواصفات جديدة للغة HTML، اللغة المسئولة عن تصميم صفحات الويب. وقد أطلق علي الإصدارة الجديدة القادمة HTML5. الإصدارة الحالية هي HTML4.01. الهيئة العالمية المسئولة عن وضع مواصفات لغة HTML تسمي بال(World Wide Web Consortium) المختصرة بالأحرف(W3C)-w3c.org ولأن معرفة تصميم الويب أصبحت ذات أهمية قصوي، حتي لغير المتخصصين في المجال، فقد رأيت ضرورة إلقاء الضوء علي إصدارة HTML5. فالأمر يعني الجميع: مستخدمين – مصممين- ومطورين. وبالرغم من أن إصدارة HTML5 القادمة لن تكون جاهزة بصورتها النهائية قبل العام 2014، لكن كل إصدارات المتصفحات الجديدة أصبحت جاهزة للتعامل معها،،،كما أن العالم كله أصبح مشدوهاً ومهتماً بأمرها غاية الإهتمام. وقبل الخوض في المميزات غير المنظورة التي ستقدمها الإصدارة الجديدة HTML5--أود إلقاء الضوء علي المفاهيم الأساسية للغة HTML،وتصميم صفحات الويب،حتي تعم الفائدة للجميع متخصصين وغيرمتخصصين! ما هي HTML؟ HTML هي اللغة المسئولة عن تنسيق صفحات الويب وت######## العناصر فيها. والكلمة إختصار لعبارة(Hypertext Markup Language). والعبارة نفسها تتكون من شقين(Hypertext) و(Markup Language ) Hypertext (هايبر تكست) تعني النصوص المتشعبة المتفاعلة. البادئة (Hyper) تعني أكثر أو فوق؛ والحقيقة أن محتويات صفحات الويب هي (أكثر) من مجرد نصوص، فهناك الصور،وهناك الملتيميديا من صوت وفيديو، وهناك الوصلات التشعبية.....و(أكثر)...! أما الشق (Markup Language ) فيعني لغة التوسيم المستخدمة لتنسيق وإنشاء ال Hypertext! ولغة HTML تحتوي علي أوسمة محددة ومعروفة (Well Known Tags)توضع بين علامتي <>. فمثلاً لإضافة سطر جديد فإننا نكتب:<br>، ولعمل خط أفقي فإننا نكتب: <hr>. وهذا النوع من الأوسمة يطلق عليه وسم وحيد(Standalone Tag). النوع الآخر من الأوسمة يطلق علية وَسْم حاوِي(Container Tag)؛وله بداية ونهاية ويؤثر فقط علي المحتويات الموجودة بين بدايته ونهايتة. فمثلاً الوسم <p> يستخدم لإدارج فقرة جديدة،ويأخذ هذا الشكل: <p> تكتب الفقرة هنا </p>. نلاحظ أن نهاية الوسم هي نفس بدايته فقط مسبوقة بعلامة / بواسطة لغة HTML نستطيع التحكم الكامل في ت######## النصوص-الوانها-ونوع خطوطها؛ووضع الصور،وإدارج الوصلات التشعبية و(أكثر). كما أننا نستطيع إستخلاص البيانات من الزائر بعمل نماذج التعبئة بعناصرها المختلفة من نصوص (Text)،قوائم منسدلة(Combo Box)، عناصر صح-خطأ(Check Box)، وعناصر الخيار من متعدد(Radio Buttons)، الخ. يتم تفسير لغة HTML بواسطة برامج متخصصة تسمي بالمتصفحات(Web Browsers)، أشهر هذه المتصفحات هي إنترنت إكسبلولر(Internet Explorer)، فيرفوكس(Firefox)، قوقل كروم(Chrome)، أوبَرا(Opera)، الخ..كلٍ بمميزاته المختلفة. والحرب مستعرة بين الشركات المنتجة لهذه المتصفحات كلٍ يحاول جذب أكبر عدد ممكن من المستخدمين..! ولايوجد متصفح كامل،فننصح،هنا، بعدم الإعتماد علي متصفح واحد،،فيجب تنزيل أكثر من متصفح حتي يتسني للمستخدم الإستفادة القصوي من تلك الشبكة الساحرة...! عند تحميل صفحة الويب بواسطة المتصفح،،فإنه يقوم بتفسيرها وإنشاء عناصرها ثم عرض الصفحة للزائر خلال رمشة عين(قبل أن يرتد اليك طرفك). والشئ الحاسم في سرعة عرض صفحات الويب هو وسيلة الإتصال بالإنترنت وسعتها؛ وليس نوع المتصفح!. ولإضفاء مزيد من التفاعلية والقوة علي صفحات الويب، صممت لغة خصيصة لهذا الغرض وهي لغة "جافا سكربت"(Java Script)؛ وهذه الأخيرة هي لغة نصية يتم تفسيرها وتنفيذها بواسطة المتصفح. وهي موجهة لعناصر صفحة الويب التي أنشأها المتصفح. من أهم إستخدامات لغة "جافا سكربت" هي التحقق من مُدخلات المستخدام(User Input Validation) قبل إرسالها للسيرفر، إضفاء الحركية علي عناصر الصفحة(مثل الصور المتحركة أو النصوص البراقة متغيرة اللون). وبمرور الأيام وشدة الطلب، إكتسبت لغة "جافا سكربت" الكثير من القوة الإضافية، حيث يستطيع الزائر إرسال بياناته دون الحوجة الي إعادة تحميل كل الصفحة؛فيما يعرف بتكنيك أجاكس(Ajax Technique). جدير بالذكر أن لغة "جافا سكربت" هي ليست لغة "جافا"، فهما لغتين مختلفتين تماماً،،فالأولي-"جافا سكربت"- متخصصة ،فقط، لمعالجة عناصر صفحة الويب ولا توجد خارج المتصفح،،والثانية-لغة "جافا"- هي لغة متعددة المهام توجد ،تقريبا، في اي مكان حتي بسيارة صديقك...!
(عدل بواسطة mekki on 01-22-2012, 02:01 PM) (عدل بواسطة mekki on 01-22-2012, 02:34 PM)
01-22-2012, 01:55 PM
mekki mekki
تاريخ التسجيل: 06-15-2003
مجموع المشاركات: 3434
إذا ما هو الجديد الذي ستقدمة الإصدارة الطفرة:HTML5؟؟؟ عناصر HTML التي يتم تنفيذها مباشرة بواسطة المتصفح، تسمي عناصر الدرجة الأولي(First Class HTML Elements) ؛والمعني يدل علي وجود عناصر درجة ثانية(علي الأقل)،،وهذا هو الواقع بالضبط...! فلا يستطيع المتصفح عرض الفيديو والصوت مباشرةً ؛ حيث لا توجد عناصر، من الأصل، تقوم بهذه الأغراض في الإصدارة الحالية للغة HTML(HTML4.01)..! لعرض محتويات الفيديو والصوت تتم الإستعانة ببرامج خارجية يطلق عليها عناصر الدرجة الثانية(Second Class Elements). ومن أهم هذه الوسائل برامج تُسمي (البَلَكَات)(Plug-Ins)،ومن الإسم نفهم أنها برامج خارجية مساعدة وليست جزء أصيل من لغة HTML!. أشهر هذه البَلَكات هو برناج الفلاش(Macromedia Flash)،الذي يستخدم لعرض فيديوهات اليوتيوب وما شابة. ومن هذه البَلَكات منتج منافس للفلاش انتجته شركة ميكروسوفت يسمي "سيلفر لايت" لكنه لم يجد الشعبية التي وجدها الفلاش. يتم إدارج هذه البلكات عبر وسم خاص للغة HTML هوالوسم <embed>؛ ويتيح لنا هذا الأخير إختيار البَلَك المطلوب بصورة مباشرة أو غير مباشرة. الصورة غير المباشرة تقتضي ان يفحص المتصفح إمتداد الملف المرسل،،فمثلاً لملف بالإمتداد (.rm) ،يبحث المتصفح عن برنامج الريال بلير(Real Player) ل(تلعيب) المحتوي!. وسواء إن كان الإدارج مباشر أو غير مباشر،،ففي جميع الأحوال يجب أن يكون البرنامج الخارجي المطلوب مثبت علي جهاز المستخدم،،وإلا فالسماع والمشاهدة سُديً...! البلَكات نفسها لها إصدارتها المختلفة ويجب علي المستخدم التأكد دوما من انه يملك الإصدار الأخير حتي يستطيع التمتع بكل مزايا هذه الشبكة الساحرة...!
HTML5 والإراحة من كل هذا العناء والي الأبد: الشئ الحاسم الذي أضيف في الإصدارة الطفرة(HTML5) هو إمكانية (تلعيب) الفيديو والصوت مباشرة بواسطة المتصفح عبر أوسمة جديدة أضيفت في الإصدارة 5. فلا حوجة ،في المستقبل القريب، للبلكات الخارجية مثل الفلاش والسيلفر لايت. كما أضيفت دوال جديدة للغة "جافا سكربت" يستطيع بواسطتها مطور الويب التحكم كلية في كيفية (تلعيب) الفيديو والصوت. فمواصفات HTML5 قدمت إضافات جديدة هامة للغاية، نذكر منها: - إمكانية (تلعيب) ملفات الفيديو والصوت مباشرة بواسطة المتصفح عبر عناصر جديدة أضيفت للغة HTML، كما أضيفت دوال جديدة للغة جافا سكربت للتحكم في هذه العناصر الجديدة. - أستحدث عنصر جديد يسمي بالكانفس(Canvas)،،وهو عنصر موجة لكل معالجات الجرافيكس(Graphics) والحركة(Animation)، ومعالجة الصور(Image Processing). كما أضيفت دوال جديدة للغة جافا سكربت تتعامل مع العنصر الجديد(Canvas). هذا العنصر يتيح للمطورين إمكانات مهولة في تصميم صفحات ويب تحتوي علي مواد تعليمية، العاب، رسومات،،،،.........الي اللانهاية! - أستحدثت عناصر جديدة لإستخلاص البيانات من المستخدم(عناصر جديدة للنماذج) مثل المنزلق(slider) وعنصر الزيادة والنقصان(Updown). وبالطبع تطوير لغة "جافا سكربت" كي تتعامل مع هذه العناصر. - إضافة عناصر تتعامل مع الGPS(Geographical Positioning System)، وتمكين المتصفح من معرفة مكان جهاز المستخدم مباشرة وتوفير كل البيانات عبر لغة "جافا سكربت"! وهنا يستطيع مطور الويب إنشاء صفحات تتعامل مباشرة مع مكان المستخدم الجغرافي وبدقة كبيرة. وهذا النوع من التطبيقات سيكون ذي فعالية كبيرة في أجهزة مثل الموبايل والآي فون...! - إمكانية التعامل البرمجي مع الشبكات عبر دوال السوكت(Socket)التي أضيفت للغة "جافا سكربت" - و(أكثر)...!
(عدل بواسطة mekki on 01-22-2012, 02:16 PM) (عدل بواسطة mekki on 01-22-2012, 02:20 PM)
01-22-2012, 02:09 PM
mekki mekki
تاريخ التسجيل: 06-15-2003
مجموع المشاركات: 3434
إذا كيف تلتحق بركب الHTML5؟؟؟؟ غير مطلوب منك أي جهد سوي ترقية متصفحك لإصدارة متوافقة مع مواصفات HTML5!،،وعندها سيقوم المتصفح بباقي الدور، فالأوسمة الجديدة أصبحت جزء أصيل من لغة HTML،،وبالتالي تنفذ مباشرة بواسطة المتصفح دون الحوجة الي صداع البرامج الخارجية والبلكات!
ماهي أفضل المتصفحات المتوافقة مع HTML5؟؟ حسب الإحصاءات التي اتيحت لي، فإن متصفح إنترنت إكسبلولر الإصدارة 9 هو الأكثر دعما لمواصفات HTML5، وهو ينزل من هذه الوصلة: وصلة غير مباشرة: http://www.microsoft.com/download/en/default.aspx
كيف أعرف مستوي الدعم لإصدارة HTML5 من متصفحي الحالي: لمعرفة مستوي الدعم الذي يوفرة متصفحك لإصدارة HTML5، قم بزيارة هذا الموقع،، http://html5test.com/ وسوف يعطيك مستوي التوافقية في شكل نقاط
مع الأمنيات لكم بإستخدام مفيد ومثمر للشبكة العنكبويتة....!
مكي الأحمدي-خبير تطوير الويب
01-22-2012, 02:34 PM
عمران حسن صالح عمران حسن صالح
تاريخ التسجيل: 11-26-2004
مجموع المشاركات: 10159
HTML5 From Wikipedia, the free encyclopedia HTML5 (HyperText Markup Language)
Filename extension .html, .htm Internet media type text/html Type code TEXT Uniform Type Identifier public.html Developed by World Wide Web Consortium and WHATWG Type of format Markup language Extended from SGML Extended to XHTML5 Open format? Yes Website whatwg.org/html www.w3.org/TR/html5 XHTML5 Filename extension .xhtml, .xht, .xml, .html, .htm Internet media type application/xml, application/xhtml+xml Developed by World Wide Web Consortium and WHATWG Type of format Markup language Extended from XML, HTML5 Open format? Yes Website www.whatwg.org/specs/web-apps/current-work/mu...he-xhtml-syntax.html HTML HTML and HTML5 Dynamic HTML XHTML XHTML Basic XHTML Mobile Profile and C-HTML Canvas element Character encodings Document Object Model Font family HTML editor HTML element HTML Frames HTML5 video HTML scripting Web browser engine Quirks mode Style sheets Unicode and HTML W3C and WHATWG Web colors Web Storage WebGL Comparison of document markup languages web browsers layout engines for HTML HTML5 HTML5 Canvas HTML5 Media Non-standard HTML XHTML (1.1) v d e HTML5 is a language for structuring and presenting content for the World Wide Web, and is a core technology of the Internet originally proposed by Opera Software.[1] It is the fifth revision of the HTML standard (created in 1990 and standardized as HTML4 as of 1997)[2] and as of January 2012 is still under development. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.). HTML5 is intended to subsume not only HTML 4, but XHTML 1 and DOM Level 2 HTML as well.[2] Following its immediate predecessors HTML 4.01 and XHTML 1.1, HTML5 is a response to the observation that the HTML and XHTML in common use on the World Wide Web are a mixture of features introduced by various specifications, along with those introduced by software products such as web browsers, those established by common practice, and the many syntax errors in existing web documents. It is also an attempt to define a single markup language that can be written in either HTML or XHTML syntax. It includes detailed processing models to encourage more interoperable implementations; it extends, improves and rationalises the markup available for documents, and introduces markup and application programming interfaces (APIs) for complex web applications.[3] For the same reasons, HTML5 is also a potential candidate for cross-platform mobile applications. Many features of HTML5 have been built with the consideration of being able to run on low-powered devices such as smartphones and tablets. In December 2011 research firm Strategy Analytics forecast sales of HTML5 compatible phones will top 1 billion in 2013.[4] In particular, HTML5 adds many new syntactical features. These include the new
01-24-2012, 06:06 AM
mekki mekki
تاريخ التسجيل: 06-15-2003
مجموع المشاركات: 3434
الآن نريد ان نقطع التورتة وندخل في تفاصيل تطبيقات HTML5!. وحسب وجهة نظري أن الإضافات الأهم التي أضافتها HTML5! هي: - عناصر تلعيب الصوت والفيديو - عنصر الكانفس (Canvas) - التعامل مع نظام الإحداثيات الجغرافية(GPS) - ما يعرف ببرمجة السوكت(Socket Programming) أولاً،وقبل كل شئ، يجب أن نخبر المتصفح أننا نستخدم مواصفات HTML5، وهذا يتم عبر التصريح: <!DOCTYPE html> الذي يوضع في أعلي الصفحة.
تلعيب الصوت عبر العنصر audio الصفحة أدناه تستخدم العنصر الجديد audio لتلعيب الصوت. http://eschoolsudan.com/html5/audio.htm لمعرفة كيفية إدارج العنصر الجديد،عليك معاينة مصدر الصفحة.
02-03-2012, 09:39 AM
Zomrawi Alweli Zomrawi Alweli
تاريخ التسجيل: 08-04-2007
مجموع المشاركات: 3368
الاخ مكي جزاك الله خير ونفعنا الله بعلمك انا من المندهشين والمهتمين بهذا العلم ولا اعلم سر الاحرف والارقام التي تصاحب اي رابط هل ممكن شرح تفسيراتك القيمة على على عمل شرائحي او على طريقة ديمو كي تعم الفائدة وشكرا
02-03-2012, 11:49 AM
mekki mekki
تاريخ التسجيل: 06-15-2003
مجموع المشاركات: 3434
Quote: انا من المندهشين والمهتمين بهذا العلم ولا اعلم سر الاحرف والارقام التي تصاحب اي رابط
شكرا لك الأخ الكريم زمراوي،،فعلا انه شئ يفوق حد الدهشة،حتي نحن معشر المتخصصين تزداد دهشتنا يوما بعد يوم. عالم جميل من الإبداع والعطاء الإنساني اللامحدود،،علم زاهي أنسانا مرارات الساسة وعبطهم ووجودهم خارج مفردات التاريخ بالنسبة لسؤالك المرسلات الإضافية عبر عنوان الصفحة تُسمي بالبينيات(parameters)،مهمتها إرسال بيانات للسيرفر لطلب معلومات معينة. هذه البينيات تعرف بواسطة مبرمجي الموقع وهم وحدهم الذين يحددون أهدافها. فمثلاً في مقع صحيفة الصحافة، لطلب موضوع معين،يأخذ العنوان هذا الشكل: http://alsahafa.sd/details.php?articleid=40835 هنا إسم البينية(parameter) هو articleid ثم علامة تساوي(=) ثم قيمة البينية(40835). فترسل هذه البيانات للسيرفر فيقوم بإستخلاصها،معالجتها، ثم إرسال النتيجة في شكل صفحة ويب.
علي العموم انا تحت أمرك أن كنت تريد اي شكل من أشكال المعرفة المنظمة(أي في شكل دروس). مع فائق التقدير
الرسائل والمقالات و الآراء المنشورة في المنتدى بأسماء أصحابها أو بأسماء مستعارة لا تمثل بالضرورة الرأي الرسمي لصاحب الموقع أو سودانيز اون لاين بل تمثل وجهة نظر كاتبها
لا يمكنك نقل أو اقتباس اى مواد أعلامية من هذا الموقع الا بعد الحصول على اذن من الادارة