azizsoft
18-11-2012, 08:14 PM
http://img835.imageshack.us/img835/6807/21948207.png
وبعــــــــــــــــــــــ ــــــــــد
الاخوة مشرفي وأعضاء منتدى طريق الاحتراف
أهلا وسهلا ومرحبا بكم وأسعد الله أوقاتكم بطاعته ومحبته .
دروة لغة HTML
http://icons.iconarchive.com/icons/graphics-vibe/developer/256/html-icon.png
سنتكلم فى دورتنا الاولى عن لغة HTML ، من المؤكد انك سمعت عنها يوما ما وان لم تسمع عنها فقد سمعت الان! ، و سوف
تتعلمها ان شاء الله مع قليل من التركيز والارادة , لغة HTML تعتبر هى الخطوة الاولى بل نقطة البداية لجميع لغات الويب الاخرى
ان شاء الله ستكون دروتنا مختلف عن باقى الدورات ، لن نستخدم شعارات مثل لسنا الوحيدون ولكننا الافضل ، ولكن سنحرص
على ايصال المعلومة بصورة مباشرة ولذيذه سواء فى هذه الدورة او غيرها من الدورات وسنحرص ايضا على التركيز على ما سيفيدنا فى تصميم المواقع .
لن استطرد فى سرد متى تم اختراعها ؟ ومن المخترع ؟ وكيف تم ذلك ؟ وهل فى الشتاء ام فى الصيف ؟
فلسنا فى حصة تاريخ وهذه المعلومات موجودة بوفرة فى ويكبيديا او غيرها من المواقع .
[1] مقدمة وبعض الاساسيات فى لغة HTML
سنتكلم فى هذا الفيديو عن الاتى
متطلبات الدورة ؟
ما هى لغة HTML ؟
كيف تكتب صفحات HTML ومما تتكون ؟
ما هى الأوسمة Tags ، و الخصائص Attributes ، والعناصر Elements ؟
كيف نضيف عنوان لصفحة HTML ؟
http://www.youtube.com/watch?v=Ct0wyyA_Xqw&feature=player_embedded
[2] المزيد من الاوسمة
سنتكلم فى هذا الفيديو عن المزيد من الاوسمة مثل
أوسمة لكتابة الفقرات .
أوسمة للتحكم بأشكال النصوص .
كيفية كتابة التعليقات داخل صفحة HTML .
http://www.youtube.com/watch?v=6o_fhC-4c94
[3] القوائم ، الروابط ، الصور
سنتكلم فى هذا الفيديو عن
اوسمة القوائم بانواعها الثلاثة .
الروابط وبعض الخصائص المستخدمة فيها .
الصور وبعض خصائصها .
http://www.youtube.com/watch?v=9J0j7XeYa5I
[4] الجداول Tables
سنتكلم فى هذا الفيديو عن
اوسمة الجداول Tables .
اوسمة الصفوف Rows واوسمة الخلايا Data cells .
خصائص اضافية مثل rowspan و colspan .
اوسمة اضافية للتحكم بهيدر وفوتر ومحتوى الجدول .
http://www.youtube.com/watch?v=R2ivFHK-ZbU
[5] الفريمات والاى فريم Frames & Iframe
سوف نتكلم فى هذا الفيديو عن
ماهو الفريم والاسمة الخاصه للتحكم به وطرق عرضه سواء رأسيا أو افقيا .
ماهو الاى فريم والاوسمة الخاصه به وخصائص اضافية لاخفاء السكرولينج والحدود .
http://www.youtube.com/watch?v=5qWx6Pq8RnU
[6] المزيد من الاوسمة
سنتكلم فى هذا الفيديو عن
الكلمات الوصفية والاوسمة الخاصه .
ما الفرق بين الوسم span & div .
ما الفرق بين الخاصية id & class .
أوسمة العنواين .
http://www.youtube.com/watch?v=kYAWpKtLC7o
[7] النماذج Forms
سنتكلم فى هذا الفيديو عن النماذج بالتفصيل وبعض الخصائص الاضافية لها والحقول المستخدمة داخلها ، الشرح سيكون فى جزئين
الجزء الاول من النماذج
http://www.youtube.com/watch?v=s1facVlbE9A
الجزء الثانى من النماذج
http://www.youtube.com/watch?v=2opySNggsAQ
[8] لغة xHTML
سنتكلم فى هذا الفيديو عن التالى
ما هى لغة XHTML ؟
كيف يمكن تطبيق XHTML ؟
كيف يمكن التاكد من التوافق مع المعايير القياسية ؟
http://www.youtube.com/watch?v=0Ssjp1Sv-5w
[9] مراجعة سريعة على لغة HTML
فى هذا الفيديو سيتم مراجعة سريعة على لغة HTML وعلى ما سبق دراسته فى صورة مجمعه وبسيطه.
http://www.youtube.com/watch?v=pQoi98Yo99M
ملاحظة : يوجد خطأ بالفيديو فى كتابة كود الميتا الكود الصحيح بالاسفل
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
[10] تجميعة مكتوبة تحتوى على اهم ما تم دراسته فى لغة HTML .
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ar" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="وصف عن الموقع" />
<meta name="keywords" content="كلمات وصفية عن الموقع" />
<meta name="author" content="اسم مؤلف او مصمم الموقع" />
<title>عنوان الصفحة</title>
</head>
<body>
<!--وثيقة مجمعة للغة html -->
<p>I learn HTML in Trickat.com</p>
i have been learned HTML & XHTML <br /> i will learned css <hr />
<strong>trickat.com</strong>
<big>trickat.com</big>
<del>trickat.com</del>
<ins>trickat.com</ins>
<em>trickat.com</em>
<small>trickat.com</small>
<br />
<h1>دورة تعلم لغة html</h1>
<h2>دورة تعلم لغة html</h2>
<h3>دورة تعلم لغة html</h3>
<h4>دورة تعلم لغة html</h4>
<h5>دورة تعلم لغة html</h5>
<h6>دورة تعلم لغة html</h6>
<br />
<a href="http://google.com" target="_blank" title="هنا جوجل" >اضغط هنا لدخول جوجل</a>
<br />
<img src="trickat.png" alt="تركات" />
<br />
<ul>
<li>العنصر الاول</li>
<li>العنصر الثانى</li>
<li>العنصر الثالث</li>
</ul>
<br />
<ol>
<li>العنصر الاول</li>
<li>العنصر الثانى</li>
<li>العنصر الثالث</li>
</ol>
<br />
<table border="1" cellpadding="10" cellspacing="20">
<tr>
<th>السبت</th>
<th>الاحد</th>
</tr>
<tr>
<td>كرة قدم</td>
<td>سباحة</td>
</tr>
</table>
<br />
<table border="1" cellpadding="2" cellspacing="2">
<tr>
<th colspan="2">السبت</th>
</tr>
<tr>
<td>كرة قدم</td>
<td>سباحة</td>
</tr>
</table>
<br />
<table border="1" cellpadding="2" cellspacing="2">
<tr>
<th rowspan="2">السبت</th>
<th>الاحد</th>
</tr>
<tr>
<td>سباحة</td>
</tr>
</table>
<br />
<iframe src="http://google.com" width="500px" height="500px" frameborder="0" scrolling="no"></iframe>
<br />
<frameset cols="20%,80%">
<frame src="a.html" />
<frame src="b.html" noresize="noresize" />
</frameset>
<br />
<frameset rows="20%,80%">
<frame src="a.html" />
<frame src="b.html" noresize="noresize" />
</frameset>
<br />
<form action="signup.php" method="post/get">
<input type="text" name="name" value="your name" /><br />
<input type="password" /><br />
<input type="checkbox" checked="checked" /><br />
<input type="radio" checked="checked" /><br />
<input type="file" /><br />
<input type="image" src="trickat.gif"/><br />
<input type="submit" value="ارسال" /><br />
<input type="reset" /><br />
<input type="button" /><br />
<input type="hidden" /><br />
<br />
<select>
<optgroup label="دول عربية">
<option>مصر</option>
<option selected="selected">السعودية</option>
<option>الامارات</option>
</optgroup>
<optgroup label="دول اوربية">
<option>ايطاليا</option>
<option>المانيا</option>
<option>فرنسا</option>
</optgroup>
</select>
<br />
<textarea name="comments" rows="10" cols="30"></textarea>
<br />
<fieldset>
<legend>نموذج دخول</legend>
<label for="nn">الاسم:</label>
<input type="text" name="name" value="your name" id="nn" />
<br /><br />
<label for="ss">الباسورد:</label>
<input type="password" name="password" id="ss" />
</fieldset>
</form>
</body>
</html>
:abc_087:فهرس الدورة كاملة (http://www.abc4web.net/vb/showthread.php?p=217265#post217265) :abc_088:
أتمنى لكم الفائدة من هاته الدورة الرائعة
والسلام عليكم ورحمة الله وبركاته
http://img138.imageshack.us/img138/8206/rabhi.gif
وبعــــــــــــــــــــــ ــــــــــد
الاخوة مشرفي وأعضاء منتدى طريق الاحتراف
أهلا وسهلا ومرحبا بكم وأسعد الله أوقاتكم بطاعته ومحبته .
دروة لغة HTML
http://icons.iconarchive.com/icons/graphics-vibe/developer/256/html-icon.png
سنتكلم فى دورتنا الاولى عن لغة HTML ، من المؤكد انك سمعت عنها يوما ما وان لم تسمع عنها فقد سمعت الان! ، و سوف
تتعلمها ان شاء الله مع قليل من التركيز والارادة , لغة HTML تعتبر هى الخطوة الاولى بل نقطة البداية لجميع لغات الويب الاخرى
ان شاء الله ستكون دروتنا مختلف عن باقى الدورات ، لن نستخدم شعارات مثل لسنا الوحيدون ولكننا الافضل ، ولكن سنحرص
على ايصال المعلومة بصورة مباشرة ولذيذه سواء فى هذه الدورة او غيرها من الدورات وسنحرص ايضا على التركيز على ما سيفيدنا فى تصميم المواقع .
لن استطرد فى سرد متى تم اختراعها ؟ ومن المخترع ؟ وكيف تم ذلك ؟ وهل فى الشتاء ام فى الصيف ؟
فلسنا فى حصة تاريخ وهذه المعلومات موجودة بوفرة فى ويكبيديا او غيرها من المواقع .
[1] مقدمة وبعض الاساسيات فى لغة HTML
سنتكلم فى هذا الفيديو عن الاتى
متطلبات الدورة ؟
ما هى لغة HTML ؟
كيف تكتب صفحات HTML ومما تتكون ؟
ما هى الأوسمة Tags ، و الخصائص Attributes ، والعناصر Elements ؟
كيف نضيف عنوان لصفحة HTML ؟
http://www.youtube.com/watch?v=Ct0wyyA_Xqw&feature=player_embedded
[2] المزيد من الاوسمة
سنتكلم فى هذا الفيديو عن المزيد من الاوسمة مثل
أوسمة لكتابة الفقرات .
أوسمة للتحكم بأشكال النصوص .
كيفية كتابة التعليقات داخل صفحة HTML .
http://www.youtube.com/watch?v=6o_fhC-4c94
[3] القوائم ، الروابط ، الصور
سنتكلم فى هذا الفيديو عن
اوسمة القوائم بانواعها الثلاثة .
الروابط وبعض الخصائص المستخدمة فيها .
الصور وبعض خصائصها .
http://www.youtube.com/watch?v=9J0j7XeYa5I
[4] الجداول Tables
سنتكلم فى هذا الفيديو عن
اوسمة الجداول Tables .
اوسمة الصفوف Rows واوسمة الخلايا Data cells .
خصائص اضافية مثل rowspan و colspan .
اوسمة اضافية للتحكم بهيدر وفوتر ومحتوى الجدول .
http://www.youtube.com/watch?v=R2ivFHK-ZbU
[5] الفريمات والاى فريم Frames & Iframe
سوف نتكلم فى هذا الفيديو عن
ماهو الفريم والاسمة الخاصه للتحكم به وطرق عرضه سواء رأسيا أو افقيا .
ماهو الاى فريم والاوسمة الخاصه به وخصائص اضافية لاخفاء السكرولينج والحدود .
http://www.youtube.com/watch?v=5qWx6Pq8RnU
[6] المزيد من الاوسمة
سنتكلم فى هذا الفيديو عن
الكلمات الوصفية والاوسمة الخاصه .
ما الفرق بين الوسم span & div .
ما الفرق بين الخاصية id & class .
أوسمة العنواين .
http://www.youtube.com/watch?v=kYAWpKtLC7o
[7] النماذج Forms
سنتكلم فى هذا الفيديو عن النماذج بالتفصيل وبعض الخصائص الاضافية لها والحقول المستخدمة داخلها ، الشرح سيكون فى جزئين
الجزء الاول من النماذج
http://www.youtube.com/watch?v=s1facVlbE9A
الجزء الثانى من النماذج
http://www.youtube.com/watch?v=2opySNggsAQ
[8] لغة xHTML
سنتكلم فى هذا الفيديو عن التالى
ما هى لغة XHTML ؟
كيف يمكن تطبيق XHTML ؟
كيف يمكن التاكد من التوافق مع المعايير القياسية ؟
http://www.youtube.com/watch?v=0Ssjp1Sv-5w
[9] مراجعة سريعة على لغة HTML
فى هذا الفيديو سيتم مراجعة سريعة على لغة HTML وعلى ما سبق دراسته فى صورة مجمعه وبسيطه.
http://www.youtube.com/watch?v=pQoi98Yo99M
ملاحظة : يوجد خطأ بالفيديو فى كتابة كود الميتا الكود الصحيح بالاسفل
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
[10] تجميعة مكتوبة تحتوى على اهم ما تم دراسته فى لغة HTML .
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ar" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="وصف عن الموقع" />
<meta name="keywords" content="كلمات وصفية عن الموقع" />
<meta name="author" content="اسم مؤلف او مصمم الموقع" />
<title>عنوان الصفحة</title>
</head>
<body>
<!--وثيقة مجمعة للغة html -->
<p>I learn HTML in Trickat.com</p>
i have been learned HTML & XHTML <br /> i will learned css <hr />
<strong>trickat.com</strong>
<big>trickat.com</big>
<del>trickat.com</del>
<ins>trickat.com</ins>
<em>trickat.com</em>
<small>trickat.com</small>
<br />
<h1>دورة تعلم لغة html</h1>
<h2>دورة تعلم لغة html</h2>
<h3>دورة تعلم لغة html</h3>
<h4>دورة تعلم لغة html</h4>
<h5>دورة تعلم لغة html</h5>
<h6>دورة تعلم لغة html</h6>
<br />
<a href="http://google.com" target="_blank" title="هنا جوجل" >اضغط هنا لدخول جوجل</a>
<br />
<img src="trickat.png" alt="تركات" />
<br />
<ul>
<li>العنصر الاول</li>
<li>العنصر الثانى</li>
<li>العنصر الثالث</li>
</ul>
<br />
<ol>
<li>العنصر الاول</li>
<li>العنصر الثانى</li>
<li>العنصر الثالث</li>
</ol>
<br />
<table border="1" cellpadding="10" cellspacing="20">
<tr>
<th>السبت</th>
<th>الاحد</th>
</tr>
<tr>
<td>كرة قدم</td>
<td>سباحة</td>
</tr>
</table>
<br />
<table border="1" cellpadding="2" cellspacing="2">
<tr>
<th colspan="2">السبت</th>
</tr>
<tr>
<td>كرة قدم</td>
<td>سباحة</td>
</tr>
</table>
<br />
<table border="1" cellpadding="2" cellspacing="2">
<tr>
<th rowspan="2">السبت</th>
<th>الاحد</th>
</tr>
<tr>
<td>سباحة</td>
</tr>
</table>
<br />
<iframe src="http://google.com" width="500px" height="500px" frameborder="0" scrolling="no"></iframe>
<br />
<frameset cols="20%,80%">
<frame src="a.html" />
<frame src="b.html" noresize="noresize" />
</frameset>
<br />
<frameset rows="20%,80%">
<frame src="a.html" />
<frame src="b.html" noresize="noresize" />
</frameset>
<br />
<form action="signup.php" method="post/get">
<input type="text" name="name" value="your name" /><br />
<input type="password" /><br />
<input type="checkbox" checked="checked" /><br />
<input type="radio" checked="checked" /><br />
<input type="file" /><br />
<input type="image" src="trickat.gif"/><br />
<input type="submit" value="ارسال" /><br />
<input type="reset" /><br />
<input type="button" /><br />
<input type="hidden" /><br />
<br />
<select>
<optgroup label="دول عربية">
<option>مصر</option>
<option selected="selected">السعودية</option>
<option>الامارات</option>
</optgroup>
<optgroup label="دول اوربية">
<option>ايطاليا</option>
<option>المانيا</option>
<option>فرنسا</option>
</optgroup>
</select>
<br />
<textarea name="comments" rows="10" cols="30"></textarea>
<br />
<fieldset>
<legend>نموذج دخول</legend>
<label for="nn">الاسم:</label>
<input type="text" name="name" value="your name" id="nn" />
<br /><br />
<label for="ss">الباسورد:</label>
<input type="password" name="password" id="ss" />
</fieldset>
</form>
</body>
</html>
:abc_087:فهرس الدورة كاملة (http://www.abc4web.net/vb/showthread.php?p=217265#post217265) :abc_088:
أتمنى لكم الفائدة من هاته الدورة الرائعة
والسلام عليكم ورحمة الله وبركاته
http://img138.imageshack.us/img138/8206/rabhi.gif