آموزش HTML بصورت گام به گام از مبتدی تا پیشرفته

بهمن
30

درس سیزدهم آموزش HTML

html-code-training درس سیزدهم آموزش HTML

در این درس با چند اصل دیگر برنامه نویسی از جمله فارسی سازی، فارسی نویسی و استاندارد یونیکد (جزو استاندارهایی است که برای Encoding متن ها استفاده می شود.) آشنا می شوید. همچنین با متاتگ http-equiv و شناسه  dir آشنا می شوید.

 

یو‌نیکد چیست؟

به طور خلاصه و با صرف نظر از بعضی از پیچیدگیها می‌شود گفت یونیکد مجموعه‌ای بسیار بزرگ از کاراکترهای مختلف است. این مجموعه تقریباً تمام کاراکترهای مورد استفاده در کامپیوتر در جهان را در خود دارد. از حرف سین الفبای فارسی گرفته تا حروف الفبای چینی و انواع و اقسام علامت‌ها و حتی خط میخی فارسی باستان.

مهمترین خاصیت یونیکد این است که به هر کدام از این کاراکترها یک شماره‌ یکتا اختصاص می‌دهد که به آن کد یونیکد آن کاراکتر می‌گویند. کد یونیکد فارسی U+06CC است در حالی که کد یونیکد عربی U+064A است.

وقتی یک پرونده ذخیره می‌شود این کدها هستند که ذخیره می‌شوند نه شکل کاراکترها. بنابر این تأثیر این مسأله این است که اگر پرونده‌ای با قالب یو‌نیکد ذخیره شود و در هر کجای دیگر دنیا که از یونیکد استفاده می‌کند باز شود، همان کاراکتر درونش قرار خواهند داشت.

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس دوازدهم آموزش HTML

html-code-training درس دوازدهم آموزش HTML

در این درس با معنا و مفهوم استایل شیتها آشنا می شویم. استایل شیت در واقع راه میانبر در برنامه نویسی وب است که با تعریف الگو و فایلهای خاص از نوشتن کدهای تکراری جلوگیری می شود و به همین دلیلدر بین طراحان سایت پرطرفدار می باشد.

 

استایل شیتها ( Style Sheets )

در نسخه جدید(4) HTML امکان جداسازی کامل فرمت دهی از ساختار صفحات HTML فراهم شده است. در این نسخه توصیه می شود که تمامی اطلاعات مربوط به نمایش و ترازبندی به فایلهائی مجزا از صفحه HTML منتقل شوند. بخشی از صقحات HTML که مربوط به نمایش، ترازبندی و فرمت دهی است، استایل شیت یا "Style Sheet" نامیده شده و معمولا به صورت فایلی مجزا درون بخش <head> صفحات HTML معرفی میگردند. در این درس به صورت بسیار خلاصه با روشهای مختلف استفاده از استایل شیتها در صفحات HTML آشنا خواهید شد.

 

چگونگی استفاده از استایل شیتها:

مرورگرها از روی استایلهای تعریف شده توسط استایل شیتها به فرمت دهی و نمایش اطلاعات درون صفحه HTML می پردازند. تعریف و استفاده از استایل ها در صفحات HTML به سه روش مختلف ممکن میباشد:

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس یازدهم آموزش HTML

html-code-training درس یازدهم آموزش HTML

 در این درس با مفاهیم فرمها، تگ Input، کد HTML، وروديهای Radio Buttons، وروديهای Checkboxes، تگهای فرم آشنا خواهید شد. امیدواریم پس از آشنایی با این مفاهیم گامی بلندتر برای طراحی وب سایت بردارید.

 

فرمها ( Forms )

از طريق استفاده از عنصر <form> و چند تگ مرتبط قادر به دريافت اطلاعات از بازديدکنندگان صفحاتتان و يا تبادل اطلاعات بين صفحات مختلف خواهيد شد. با کمک اين گروه از تگ ها قادر به نمايش باکسهای ورود اطلاعات متن (text fields) ، چک باکسها (check-boxes) ، راديو باتونها (radio-buttons) و ... شده و همچنين امکان گذاشتن دکمه های ارسال (submit button) و يا reset را خواهيد داشت. اين فصل با شرح تگ های form و input و ... به چگونگی ايجاد ارتباط با بازديدکنندگان و گرفتن اطلاعات از آنها بصورت لاتين و يا فارسی خواهد پرداخت.

توجه داشته باشيد که برای پردازش اطلاعات دريافتی از کاربر بايد با يکی از زبانهای cgi از قبيل ASP، perl، PHP، CFM ، JSP يا Java آشنائی داشته باشيد.


فرمها (Forms)

تمامی عناصر و تگهائی که تاکنون ديده ايد فقط به نمايش اطلاعات پرداخته اند و هيچکدام به گرفتن و اخذ اطلاعات از کاربر نپرداخته اند. فرمها که با تگ <form> معرفی ميشوند، طراح سايت را قادر به جمع آوری و اخذ اطلاعات از بازديدکننده سايت خواهند کرد. عنصر فرم و گروهی از عناصر و تگهای درون آن به دريافت و ارسال اطلاعات به سمت وب سرور کمک خواهند کرد. ( تمامی تگهای مربوط به فرمها درون تگهای <form> و <form/> قرار ميگيرند. )

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس دهم آموزش HTML

html-code-training درس دهم آموزش HTML

آشنایی با هریک از مفاهیم برنامه نویسی html کمک موثری است به پیشرفت شما برای نوشتن کدهای html، این درس شما را با نحوه نمایش انواع فهرستها شامل فهرستهای مرتب (ordered) ، نامرتب (unordered) و فهرستهای تعریفی (definition lists) و تگ های مربوطه یعنی li ، ol ، ul ، dl ، dt و dd آشنا خواهد کرد.

 

فهرستهای نامرتب (unordered list)

فهرستهائی هستند از یک یا چند قلم اطلاعات که معمولا با دایره ای کوچک و سیاه رنگ در شروع نمایش داده میشوند. یک فهرست از نوع نامرتب با تگ <ul> شروع شده و هر رقم اطلاعات با تگ <li> مشخص میگردد.

 

HTML code

نمایش توسط مرورگر

<ul> <li>Red</li> <li>Blue</li> <li>Green</li> </ul>
  • Red
  • Blue
  • Green
 
<ul dir="rtl" > <li>قهوه</li> <li>شیر</li> <li>چای</li> </ul>
  • قهوه
  • شیر
  • چای
 

 

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس نهم آموزش HTML

html-code-training درس نهم آموزش HTML

تا به اینجا با مفاهیم زیادی از زبان برنامه نویسی html آشنا شدید. در این درس با برخی علائم در علم برنامه نویسی html آشنا می شوید. لطفا با دقت درس امروز را دنبال کنید.

 

Character Entities

در استاندارد HTML گروهی از نويسه ها (Character) دارای معنی خاصی بوده ( مثلا نويسه < شروع يک تگ و نويسه > انتهای يک تگ را نشان ميدهد. ) و برای نمايش آنها در صفحاتتان مستقيما قابل مصرف نميباشند. در اين فصل با فهرست اين نويسه ها آشنا شده و نحوه درج آنها را با کمک Character Entities فرا خواهيد گرفت.

 

Character Entities


در HTML بعضی از نويسه ها دارای معنی خاصی بوده و برای نمايش آنها در صفحاتتان بايد از برابرهای خاصی استفاده کنيد. يک character entities از سه قسمت تشکيل ميشود:

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس هشتم آموزش HTML

html-code-training درس هشتم آموزش HTML

برخی تگ ها تنها مختص ایجاد تغییرات بر روی متن نوشته های وب سایت ما هستند. در این درس با این تگ ها آنا خواهید شد و خواهید دید که چگونه با تغییرای کوچک می توان متن سایت را تغییر داد.

فرمت دهی ( Formatting )

گروهی از تگ های HTML به فرمت دهی و تعيين شکل نمايش متون ( مثلا ضخیم یا bold بودن، مورب یا ايتاليک بودن ) میپردازند.(به یاد داشته باشد که در نسخه 4 HTML این خواص به استایل شیتها محول شده است.) در اين درس با اين گروه از تگهای formating آشنا خواهيد شد:

 <b> , <big> , <code> , <del> , <em> , <i> , <ins> , <kbd> , <pre> , <s> , <samp> , <small> , <strike> , <strong> , <sub> , <sup> , <tt> , <u> , <var>


نحوه ديدن سورس کدهای HTML (HTML Source)

اگر ميخواهيد که سورس یا اصل کدهای HTML صفحات وب را ببينيد کافی است که در منوی View مرورگرتان حالت Source يا Page Source را انتخاب کرده و مرورگر کد HTML را درون اديتوری باز کرده و قابل ذخيره توسط شما برای استفاده های بعدی ميباشد.

اگر صفحه مورد نظر از مجموعه فريمها (Frameset) استفاده کرده باشد برای ديدن سورس کد اصلی فريمها کافی است که ابتدا با کمک روش بالا به مشاهده سورس کدهای HTML پرداخته (لازم به توضيح است که در اين حالت فقط تعاريف کلی فريمها قرار دارند.) و سپس برای ديدن کد HTML اختصاصی هر صفحه بايد پس از "Right Click" روی هر صفحه "View Source" کرده و کد HTML هر فريم را جداگانه ببينيد.

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس هفتم آموزش HTML

html درس هفتم آموزش HTML

تگ Description

این متاتگ هم مانند تگ keywords بسیار لازم و ضروریست. در این کد شما می توانید توضیح مختصر و مفیدی را در مورد صفحه مورد نظر ارائه دهید. این توضیح باید گویای فعالیت و محتوای وبلاگ و یا وب سایت باشد.

<meta content=" توضیحات مربوط به محتوا و فعالیت وبسایت و یا وبلاگ">

 

تگ KEYWORDS

این تگ یکی از اصلی ترین و رایج ترین تگهایی است که وجودش در یک صفحه اینترنتی به شدت لازم است. شما باید کلمات کلیدی را که مربوط به محتوای وبلاگ یا وب سایتتان می شود در این تگ بگنجانید تا موتورهای جستجو صفحات شما را بیابند. فراموش نکنید که نوشته های موجود در این تگ در صفحه اینترنتی نمایش داده نمی شوند و همین طور استفاده بیش از هزار کاراکتر در این تگ مجاز نیست.

<meta content="کلمات کلیدی ">

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس ششم آموزش HTML

html-code-training درس ششم آموزش HTML

همه ما با اهمیت وجود تصاویر در سایت آشنا هستیم. با نوشتن کدهایی خاص به راحتی می توان تغییراتی روی تصاویر ایجاد کرد.در این درس به اهمیت این کدها برای تغییرات در تصاویر سایت آشنا می شوید.

 در اين درس با تگ img ، شناسه src و alt ، تگهای Map و Area و چگونگی نمايش تصاوير و همچنين تنظيم محل آنها در سندهای HTML آشنا خواهيد شد.

 

تگ img و شناسه src يا source

در زبان HTML تصاوير را با کمک تگ <img> تعريف ميکنند. تگ <img> از نوع تگهای خالی است، بدين معنا که فقط دارای يک يا چند شناسه و attribute بوده و دارای تگ انتهائی يا <img/> نيست.

مهمترين شناسه برای درج و تعريف يک تصوير src يا source نام دارد و مقدار اين شناسه آدرس يا URL تصوير ميباشد. تصاويری که مرورگر در يک صفحه وب نمايش ميدهد ميتوانند در همان دايرکتوری صفحه HTML، در ديگر دايرکتوريهای همان سايت و يا در فضای بيکران وب قرار داشته باشند.

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس پنجم آموزش HTML

colors درس پنجم آموزش HTML

نقش رنگ در انتقال فهم و درک یک مطلب بسیار زیاد است. رنگ ها علاوه بر زیبایی نقش بسیار مهمی در انتقال مفهوم اطلاعات دارند. المان های رنگی یکی از مهمترین قسمت های یک وب سایت محسوب می شوند و در زبان HTML به راحتی می توان از رنگ ها برای شخصیت دادن به بساری از المان های استفاده کرد. مثلا می توان رنگ عنوان متن را با رنگ متن پاراگراف متمایز کرد و یا رنگ پس زمینه نوشته یا یک جعبه در HTML را با رنگی خاص به نمایش در آورد.

با رنگ ها می توان در وب سایت جلب توجه بازدیدکننده را رقم زد و این موضوع در طراحی سایت بسیار مهم است

در این درس با کد رنگها و اهمیت آن در زیبایی سایت بیشتر آشنا می شوید. برای رنگی کردن زمینه سایت یا قسمتهایی از آن یا حتی نوشته سایت از این کد ها می توان استفاده کرد.

 

در زبان HTML رنگها بر اساس ترکیب سه منبع نوری قرمز (Red)، سبز (Green) و آبی (Blue) تعریف میشوند و هر منبع نوری شدتی بین 0 تا 255 را میتواند داشته باشد. در این استاندارد نور سفید رنگی است حاصل از تداخل سه منبع نوری با شدت کامل یعنی 255 و رنگ سیاه حاصل تداخل سه نور با شدت 0 خواهد بود.(در واقع هر نقطه رنگی يا پیکسل بر روی صفحه مانیتور حاصل برخورد سه اشعه نوری قرمز، سبز و آبی ساخته شده توسط لامپ تصویر میباشد.)
توجه داشته باشید که مطابق تعریف ذکر شده امکان استفاده از 256 x 256 x 256 یا حدود 16 میلیون (16,777,216) رنگ مختلف وجود داشته و در شناسه های مختلف به یکی از سه روش زیر قادر به تعیین رنگ متن یا ناحیه ای خواهید بود:

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس چهارم آموزش HTML

html-code-training درس چهارم آموزش HTML

در این درس با کدهایی آشنا می شویم که برای متن های وب سایتمان باید از آنها استفاده کنیم. با استفاده از این کدها می توانیم فونت مورد نظر را به متن خود داده و به زیبایی سایت خود کمک کنیم. سایت هایی با فونت زیبا معمولا پرطرفدار از سایت هایی هستند که فونت بسیار بزرگ و یا کوچک دارند.


قلم ها ( HTML Fonts )

در این درس یاد خواهید گرفت که چگونه نوع قلم، اندازه و رنگ نوشته ها در صفحات HTML تعیین میشوند.
با وجودی که هنوز بعضی از کسانی که از HTML استفاده می کنند از تگ <font> برای تعیین نام و نوع قلم، رنگ و اندازه متون استفاده میکنند ولی در استاندارد 4 HTML و همچنین XHTML از تگ <font> پشتیبانی نمی شود و استفاده از Style Sheet ها به عنوان جایگزین معرفی شده است.

 

تگ <font>

در نسخه های 3.2 و قبلی تر زبان HTML از تگ <font> برای تعیین نام قلم، رنگ و اندازه متون استفاده میشود. در این تگ شناسه face نام قلم ، شناسه size انداره قلم و شناسه color معرف رنگ متن خواهد بود. مثالهای زیر کاربرد تگ <font> قدیمی را نشان میدهند.

 

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس سوم آموزش HTML

html-code-training درس سوم آموزش HTML

درس سوم آموزش اچ تی ام ال را شروع می کنیم. در این درس می خواهیم دربازه پس زمینه در صفحات وب به شما آموزش بدهیم. پس زمینه در صفحات وب می تواند بصورت رنگ، طیف رنگی و یا یک تصویر گرافیکی باشند. از شما دعوت می کنیم تا با ما باشید با آموزش Background در HTML

 

 پس زمينه ( Background )

در اين درس با چگونگی تعيين تصاوير و رنگ پس زمينه (Background) آشنا خواهيد شد. رنگ و يا تصوير پس زمينه عامل بسيار مهمی در طراحی صفحات HTML بوده و استفاده از رنگ و يا تصوير مناسب نقشی تعيين کننده در خوانا بودن صفحات دارد.

رنگ و تصوير زمينه در صفحات HTML:

تگ <body> دارای دو شناسه مهم برای تعيين رنگ و تصوير پس زمينه ميباشد. پس زمينه یک صفحه HTML، رنگ و يا يک تصوير ميتواند باشد.

ادامه مطلب
1
برچسب شده در:
بهمن
25

درس دوم آموزش HTML

htmltraining درس دوم آموزش HTML

در درس دوم آموزش زبان برنامه نویسی اچ تی ام ال شما را با المان ها و عناصر آشنا می کنیم. اینکه ما چطور به صفحه وب سایت بفهمانیم عنوان صفحه وب سایت ما چیست و یا این عبارت تیتر صفحه و این عبارت تیتر یک پاراگراف متنی است با این عناصر و المان ها انجام می شود.

 

عناصر ( Elements ) در HTMLa

یک فايل HTML متنی از نوع text است که از عناصر يا element ها تشکيل شده و برای ايجاد عناصر از تگ ها يا tags استفاده ميشود. در اين فصل با عناصر و تگ ها HTML آشنا خواهيد شد.

 

تگ های HTML

با کمک تگ های HTML عناصر يا Elements ساخته ميشوند.

ادامه مطلب
2
برچسب شده در:
بهمن
25

درس اول آموزش HTML

html-tag درس اول آموزش HTML

نحوه کارکرد وب چگونه است؟

اطلاعات صفحات وب داخل فایلهائی به نام Web Pages و یا متن های وب (HTML documents) قرار دارند. این فایلها یا صفحات ، روی Web Server یا کامپیوترهای سرویس دهنده وب ذخیره شده اند. برای دیدن صفحات وب از نرم افزاری به نام مرورگر و یا Web Browser استفاده می شود.

سرورهای وب یا Web Servers کامپیوترهایی هستند که با کمک استاندارد ارتباطی HTTP به تبادل اطلاعات با مرورگرها (web Clients) می پردازند. مرورگرهای وب را Web browsers یا web Clients هم می نامند .
دو مرورگر گوگل کروم و فایرفاکس جزو معروفترین مرورگرها محسوب می شوند. مرورگر Internet Explorer هم متعلق به شرکت مایکروسافت بوده وبصورت پیشفرض بر روی تمام ویندوزها هست اما دوستداران زیادی ندارد. مرورگر Firefox متعلق به شرکت Mozilla میباشد و مرورگر Chrome متعلق به شرکت Google بوده و بسیار محبوب و دوست داشتنی است. مرورگر Firefox دارای امنیت بیشتری بوده و بصورت open Source یا متن باز می باشد و نسبت به Internet Explorer محبوبیت بیشتری دارد.

 

یک فایل HTML چیست؟

HTML را "اچ تی ام ال" و یا HTML بخوانید.

HTML برگرفته از حروف اول Hyper Text Markup Language میباشد.

ادامه مطلب
1
برچسب شده در:
بهمن
24

فهرست آموزش HTML

html-training

حتما شما هم به عنوان یکی از دوستداران دانش برنامه نویسی وب، بارها نام زبان برنامه نویسی HTML را شنیده اید. دانشی که از سال 1980 رو به پیشرفت و توسعه می باشد. در واقع "اچ تی ام ال" مهم ترین زبان برنامه نویسی وب در سراسر جهان می باشد و حاصل کدنویسی تمامی طراحان در سراسرجهان به صورت خروجی کدهای HTML درآمده و در معرض نمایش کاربران درخواهد آمد. قدم اول برای طراحی وب سایت آشنایی با زبان HTML  می باشد.

قبل از هر چیز اجازه بدید ترس ما را از برنامه نویسی بریزیم و به شما مزده بدهیم که زبان برنامه نویسی HTML تنها در چند ساعت و نهایتا در دو سه روز قابل یادگیری است. پس همین الان شروع کنید، ما به شما قول می دهیم هفته آینده شما HTML را به خوبی میدانید!

 

فهرست دروس آموزشی زبان اچ تی ام ال HTML به شرح زیر است:

 

ادامه مطلب
2
برچسب شده در:

آموزش تضمینی کامپیوتر

واقعا فکر می کنید کامپیوتر را فقط در کلاس های آموزشی گران قیمت و یا با کمک استاد خصوصی می توان یادگرفت؟ کاربران وب سایت آموزش کامپیوتر نظر دیگری دارند! ما به شما تضمین می دهیم کامپیوتر برخلاف تصور شما بسیار ساده، شیرین و جذاب است و در هر سنی می توانید مهارت کار کردن با کامپیوتر را آموزش ببینید

عضو سایت نیستی؟ در کمتر از یک دقیقه عضو شو!

ورود به سایت