در این پست از وب سایت یک لرن قصد داریم به بررسی اصول و استاندارد های کدنویسی در html بپردازیم . همانطور که میدانید کدنویسی و یادگیری آن تنها یک بخش از طراحی وب است و برای اینکه طراحی های شما بی نظیر باشد باید سعی کنید استاندارد کدنویسی کنید . استاندارد نویسی نیز قواعدی برای خود دارد که سعی میکنیم در طول چند جلسه برای شما بگوییم . فراموش نکنید که استاندارد بودن کدهای شما نقش نسبتا مهمی را در سئوی وبلاگ و وب سایت شما دارد .
برای ادامه آموزش به ادامه مطلب مراجعه فرمایید …
در این جلسه و چند جلسه آینده درباره استاندارد نویسی در html و در جلسات بعد درباره ی اساندارد نویسی در css نکاتی را ارائه خواهیم کرد
اصول و استاندارد های کدنویسی در html
اعتبار سنجی
بهترین راه برای اینکه بدانید کد های شما تا چه حد استاندارد است یا نیست باید توسط یک اعتبار سنج , اعتبار صفحه ی خود را بسنجید برای سنجش اعتبار سایت های فراوانی وجود دارد که به صورت مجزا در یک پست اشاره خواهیم کرد ولی مهم ترین سایت برای اعتبار سنجی سایت زیر میباشد .
http://validator.w3.org
سایت بالا معروف ترین و معتبر ترین سایت برای اعتبار سنجی میباشد و نکات و مشکلات موجود در قالب شما را به طور کامل بیان میکند .
دستور Doctype بر اساس نسخه html
html در نسخه ها و ورژن های مختلفی ارائه شده است که شما باید برای معتبر بودن صفحه خود از آخرین نسخه ان استفاده کنید
یک نمونه مهم دستور doctype است که استفاده از ان اجباری نیست ولی برای شناخت مرورگر و استاندارد نویسی الزامی است .
شما باید برای استاندارد نویسی بروز ترین نسخه ان را استفاده کنید به عنوان مثال دستور doctype زیر و دستور های مشابه بروز نمیباشند .
<!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">
شما باید در سند های خود از doctype زیر استفاده کنید که مربوط به html5 میباشد.
<!DOCTYPE html>
تگ های خالی و غیر خالی
در زبان html برخی تگ ها خالی هستند و برخی تگ ها غیر خالی
تگ های غیر خالی :
تگ های غیر خالی به دسته ای از تگ ها میگوییم که تگ باز و بسته دارند مثلا :
<p> متن پاراگراف </p> <strong> متن پر رنگ </strong>
تگ های خالی یا تگ های خالی تک قسمتی یا تگ های یکتا به دسته ای از تگ ها میگوییم که تگ بسته ندارند که در اینجا به دو صورت نوشته میشوند , که یک صورت آن استاندارد و دیگر صورت ان غیر استاندارد میباشد .
گونه غیر استاندارد ان را در نمونه زیر ببینید
وب سایت یک لرن <br> <img src="">
و حالا نمونه استاندارد را در نمونه زیر ببینید
وب سایت یک لرن <br /> <img src="" />
تفاوت گونه استاندارد و غیر استاندارد در این است که گونه استاندارد قبل از علامت < یک / به همراه دارد و همچنین قبل از / یک فاصله به همراه دارد . در نتیجه برای تگ های خالی شما باید قبل از < یک / و قبل از / یک فاصله به وجود اورید .
با تشکر که این مقاله را تا اینجا مطالعه کردید
منتظر قسمت های بعدی باشید …
با تشکر
ببخشید این سوال جا افتاد:
2-خب بعد از اینکه مثلا ما یک قالب یادگرفتیم بنویسیم خب حالا بعدش چه کار کنیم؟
باید بریم هاست و دامین بگیریم؟
سلام من از ب بسم الله دارم شروع می کنم هنوز هیچی نمی دونم بجز تگ هایی که داخله فیلم هاتون دیدم چن تا سوال برام پیش اومده
1-خب ما که همه چیز رو داریم داخله تگ ها می نویسیم ینی مدیر سایت هم لازمه که کدنویسی ها رو بدونه؟اگه آره پس چطوری سایت می فروشن به کسایی که آشنایی با این کد ها ندارند؟
ضمنا اگه می شه لطف کنید طریقه به سمت راست آوردن کادر div رو بگید من هر چی می زنم align=”right” یا مثلا می زنم dir=”rtl” گوشش بدهکار نیست
کدهامو میذارم لطفن کمکم کنید ممنون
Untitled Document
.rounded
{
border:2px solid #a1a1a1;
padding:10px 40px;
background:#dddddd;
width:300px;
border-radius:25px;
-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}
با سلام
منظور سوال اول رو اصلا نفهمیدم اگه لطف کنید واضح تر بگید بهتر میتونم جواب بدم
برای اینکه شما کنترل div رو در اختیار داشته باشید راه های زیادی دارید ولی بهترین راه برای اینکه اون رو به سمت راست شناور کنید استفاده از دستور زیر در استایل های اون div هست
و در مورد سوال بعدی شما باید هدف تون از یادگیری طراحی قالب روشن باشه مثلا طراحی قالب یادمیگیرید تا برای سایت خودتون قالب طراحی کنید. شما بعد از اینکه طراحی قالب یاد گرفتید میتونید یه وب سایت راه بندازید یا شروع به یادگیری زبان های دیگه بکنید
موفق باشید !
منظورم این هستش که خب ما مطلبی رو هم بخوایم به سایت اضافه کنیم با استفاده از تگ p اضافه می کنیم
خب من به سلامتی ی قالب قشنگ نوشتم تگ هاش رو هم درست به کار بردم و خوب شده حالا باید نصبش کنم روی هاست(که البته هنوز درست نفهمیدم چطوری-“که از موضوع حرف الانم هم خارج هستش”-)بعد که نصب شد کسی که مالک سایت هست هر چند وقت یک بار مطلب جدیدی ارسال می کند این مطالب جدید چه جایی در تگ ها دارند؟
ینی منظورم این هست که مثلا من یک قالب نوشتم که 2تا divداره یکی راست یکی وسط و هر کدوم با یک خواص ظاهری ای
حالا مالک و مدیر سایت که یک مطلب ارسال می کنه چطور باید مشخص بشه که داخله کدام div باشه , و با چه خواص ظاهری ای؟
با سلام
ببینید مراحل کلی طراحی قالب به این صورت هست
1- طراحی قالب در فتوشاپ
2- تکه تکه کردن فایل ها در فتوشاپ
3- کدنویسی html و CSS
4- ترجمه به سیستم مورد نظر ( وردپرس و جوملا و …)
این چهار مرحله است که جواب سوال های شما در مرحله چهار هست شما وقتی یه قالب رو طراحی کردید باید توابع و تگ های مورد نظر سیستم مدیریت محتوا رو وارد کنید تا فراخوانی بشه مثلا شما میاید یه قسمت رو مختص محتوای پست قرار میدید و تابع مربوطه رو براش وارد میکنید وقتی مدیر سایت یک مطلب رو در پنل ارسال میکنه در داخل اون تابع با خاصیت معرفی شده توسط شما قرار میگیره
و ایا نیاز هست شما برای هر پست یه تگ div جداگانه قرار بدید ؟ خیر نیاز نیست در مرحله چهار موقع تبدیل چیزی به نام حلقه وجود داره که در داخل اون پست ها تکرار میشه
حالا شما فعلا html و css رو فرا بگیرید بعد ها برید سراغ قالب نویسی و ترجمه و ….
موفق باشید !