sina salehifard 29 اردیبهشت 1393 24 7890 بازدید آموزش HTML
فیلم آموزش قواعد و نکات اصولی در کدنویسی HTML

یکی از مهمترین مباحث در زمینه ی آموزش طراحی سایت، رعایت قواعد و نکات اصولی کدنویسی html است. همانطور که قبلاً در فیلم آموزشی معرفی سرویس validator کنسرسیوم وب بیان کردیم، مطمئناً اگر قواعد کدنویسی را رعایت نکنید، کدهای شما در W3C نامعتبر خواهند بود. در این فیلم آموزشی html، شما با روش های نامگذاری تگ ها، صفات و فایل هایی که در وب برای آپلود یا آدرس دهی استفاده می کنید، آشنا خواهید شد.

فیلم آموزش قواعد و نکات اصولی در کدنویسی HTML

برای دانلود فیلم آموزشی و اسنیپت های آموزش مربوطه از لینک های زیر استفاده کنید :

دسترسی به این بخش مخصوص اعضاست. شما می توانید به رایگان عضو شوید و به این بخش دسترسی داشته باشید. ورود / عضویت

دسترسی سریع :

متن فیلم آموزش قواعد و نکات اصولی در کدنویسیHTML

در html قواعدی هستند که باید آن را رعایت کنید تا کد های شما استاندارد باشند :

قواعد اول :

برای معتبر بودن کدها در Html باید تگ ها و صفات را با حروف کوچک بنویسید و از نوشتن حروف بصورت بزرگ خودداری فرمایید. به عنوان مثال اگر ما تگ p را به صورت زیر بنویسیم (بزرگ بنویسیم)

<P>سلام آنلاینر</P>

 

یا اگر صفت class را به صورت زیر بنویسیم (بزرگ بنویسیم )

<p CLASS="intro">سلام آنلاینر</p>

و با http://validator.w3.org کدهای خود را تست کنیم، می بینیم که کد های ما استاندارد نیستند.

قواعد دوم:

برای نوشتن کلاس یا آیدی نمیتوانیم بین کلمات فاصله (space) ایجاد کنیم. ایجاد فاصله در classها به معنای ایجاد یک کلاس مجزا است. به عنوان مثال :

<p class="intro message">سلام آنلاینر</p>

اگر نام کلاس خود را اینگونه وارد کنید به معنی این است که دو class برای تگ p اعمال کرده ایم، یکی intro و یکی message .

برای جداسازی نامها می توانید از گزینه های زیر استفاده کنید :

  1. جدا سازی با dash
    <p class="intro-message">سلام آنلاینر</p>
    
  2. جدا سازی با underscore
    <p class="intro_message">سلام آنلاینر</p>
    
    
  3. جدا سازی با camelcase
    
    <p class="IntroMessage">سلام آنلاینر</p>
    

یعنی حروف اول هر کلمه را بزرگ بنویسیم.

نکته : در وب وقتی فایلی را میخواهیم آپلود کنیم یا به آن آدرس بدهیم، نام فایل نباید دارای کاراکتر space باشد و باید از روش های جداسازی بالا استفاده کنیم :


<link rel="shortcut icon" href="http://onliner.ir/favicon-onliner.png" />

نکته : در صفاتی مانند alt و title و … میتوان مقادیر را با فاصله از هم جدا کرد، چون مقادیر صفات، متن دلخواه هستند.

قواعد سوم :

ما باید توجه داشته باشیم که بعضی سیستم عامل ها در بزرگی و کوچکی کلمات تفاوت می گذارند، به عنوان مثال اگر ما یک عکس به نام Favicon-onliner.png داریم نمی توانیم در سیستم عامل لینوکس در هنگام آدرس دهی از favicon-onliner.png استفاده کنیم زیرا سیستم عامل لینوکس تک تک کاراکترها را جدا تفسیر می کند و case sensitive است.

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

دسترسی سریع :

نظرات کاربران (24)



  1. monttaghemeh_karrar

    سلام و خدا قوت.

    فایل های 48 و 49 از آموزش جامع HTML با خطای (NOT F0UND) مواجه میشود،
    اگه ممکنه بنده رو راهنمایی کنید؟
    باتشکر

    • گروه آموزش طراحی سایت

      با عرض سلام و احترام خدمت شما
      لطفا مجدد اقدام به دانلود بفرمایید؛ مشکلی موقت بوده است که برطرف شده است.


  2. خیلی خوبه ، ایشالله این روند ادامه داشته باشه


  3. فوق العاده بود ممنون

  4. رضا

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

    • shams

      سلام.از طریق فرم تماس با ما رزومه تون رو ارسال کنید.

  5. مهدی

    از ویدیو های خوبتون ممنون
    لظفا در صورت امکان این چنین آموزش های فارسی رو در زمینه های لینوکس – ابونتو قرار بدید
    باتشکر فراوان

  6. گروه آموزش طراحی سایت

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


  7. عالی بود ممنونم

  8. گروه طراحی سایت

    با سلام و احترام
    لطفا بر اساس لیست صفحه ی http://onliner.ir/html-video-tutorials/ شماره و عنوان فیلم آموزشی ای که مشکل دارد را اعلام بفرمایید تا بررسی شود.

  9. فاطیما

    سلام
    اتفاقی این سایت رو پیدا کردم، فیلماتونو دانلود کردم چندتاشو دیدم خیلی خوووووووووووب بود. HTML5 هم آموزش میدین؟

    • گروه طراحی سایت

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

  10. رائیکا

    اینو یه بار دیگه هم گفتم واقعا اموزشاتون فوق العاده هستن خیلی خیلی ممنون هر چی تشکر کنم انصافا کمه

  11. hamed

    عالی عالی عالی عالی عالی

  12. رائیکا

    سلام یه سوال داشتم
    میشه داخل فایل php کدای html رو هم نوشت و کلا یک فایل درست کرد؟اگه اره کدوم روش بهتره این که جدا نوشته بشه یا اینکه هم php هم html با هم نوشته شه؟
    احتمال داره اموزش php رو هم تو سایت بذارید؟

    • گروه طراحی سایت

      سلام
      در مورد سوال تون، بله این کار رو میشه کرد، منتها اینکه کدوم روش بهتره، باید بگم که سوال اشتباه هست!
      ———
      آموزش های PHP را حتما خواهیم گذاشت. شما حتما در خبرنامه های پیامکی و ایمیلی عضو شوید تا از جدیدترین سرفصل های آموزشی و دوره های آموزشی باخبر شوید.

      • رائیکا

        ممنون

  13. رائیکا

    سلام اموزشاتون بی نظیرن واقعا که عالین خیلی ممنون
    گفته بودید یک سری تمریناتم میذارید اگه این طور بشه که خیلی خوبه.
    ممکنه اموزش جی کوئری و جاوا اسکریپت هم بذارید؟
    بازم ازتون ممنونم

  14. Mehrdad

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


  15. ایول


  16. کارتون عالیه من همشونو گرفتم خیلی ممنون باید بشیم خوب یاد بگیرم ..
    راستی یه سوال اگر من همه این آموزش ها رو ببینم میتونم html رو کامل یاد بگیرم یا هنوز ادامه داره؟
    اگر میشه آمزوش CSS رو هم کامل کنین D:
    خیلی ممنون …
    یه دنیا ممنون…

    • گروه طراحی سایت

      با تشکر از همراهی شما.
      فیلم های آموزشی سی اس اس حدود 80 مورد هستند که در حال انتشار هستند (تولید آن ها قبلا به اتمام رسیده است و در حال مونتاژ و انتشار هستیم)
      برای یادگیری حرفه ای نیاز به انجام یکسری تمرینات دارید؛ که ما در حال تدارک این تمرینات برای کاربران هستیم تا کاربران تمرینات مربوطه را انجام بدهند و سوالات شان را برایمان بفرستند. در حقیقت سورپرایزهای بزرگی ظرف دو هفته ی آینده برای کاربران مان داریم.

  17. hamed

    سپاس فراوان از شما

    سری html تکمیل شده ؟

    • گروه طراحی سایت

      بله، فعلا این سری تمام شده است تا سری های آینده و ویژه ای که برای html منتشر خواهیم کرد.