Font Size

SCREEN

Profile

Layout

Menu Style

Cpanel

چرا کدنویسی تمیز در طراحی وب اهمیت دارد ؟

زیرا وب در حال تغییر و تکامل است واینکه سایتی بسازیم که بتواند با این تغییرات همگام شود  ضروری و مهم می باشد . پاک کردن نشانه گذاری ها یا clean markup  و ساختن وب با استاندارهای پایه ای علاوه بر کمک به ایجاد سایتی که بتواند با این  تغییرات وب , توسعه پیدا کند , در طولانی مدت در زمان و هزینه ها صرفه جویی خواهد کرد .

از آنجایی که وب در حال گسترش هست تکنولوژی های به کار رفته در آن هم در حال توسعه هستند ,  از انجایی که ما با HTML مدت زمان زیادی است که همراه هستیم HTML توانسته طرفدارای خاص خودش را داشته باشد . ابتدا javascript  سپس css و xml و اخیرا ajax .  در حال حاضر firefox , safari , opera و chrome  بصورت کامل از HTML5 پشتیبانی می کنند در صورتی که هنوز IE در این زمینه عقب مانده است .

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

 

معنای داشتن clean markup ؟

clean markup  به معنای  رها بودن از هرج و مرج و بی نظمی و داشتن استاندارد های منطبق و به کار بردن تگ ها و ساختارهای هر زبان برای هدف درنظر گرفته شده . Clutter-free در HTML استفاده پراکنده از تگ ها را ایجاد می کند و قسمت های خارجی و غیر اصلی را حذف می کند و کار را با تعدادی نشانه گذاری اگر لازم باشد انجام می دهد و استفاده از صفات غیر ضروری مانند inline css  اجتناب می کند و سند را به صورت سازمان دهی شده و ساختار یافته شده باقی می گذارد .

همچنین clutter-free در css از تکرار جلوگیری می کند و از مزیت ارث بری یا inheritance بهره می برد و کلاس ها را در زمانی که ممکن باشد دوباره استفاده می کند . Standards-compliant یا تطبیق با استاندارد ها به معنای این است که صفحه شما برا اساس کنسرسیوم شبکه جهانی وب برای html , css و xml  معتبر باشد و برای چک کردن کردن خطاها می توانید از ابزار W3C validators  استفاده کنید که با استفاده از این ابزار خطاها را تصحیح کنید تا زمانی که کاملا خطاها برطرف بشود .                

هر پروژه زمان تحویل دارد و مشتری  خاستار راه اندازی زودتر سایتشان هستند به عنوان یک توسعه گر وب و طراح  برای انجام کارها  سریعتر و با کیفیت تر تحت فشار هستید و ممکن است این سوال پرسیده شوند که چرا به Clean markup و یا standard -compliant با توجه به اینکه وقت زیادی می برند نیاز است ؟ در حال حاضر وب سایت شما در حال کار کردن است . بله مطمئنا کار می کند فقط برای این زمان و برای شما … سال دیگه چطور ؟ در مورد مرورگر جدید چطور ؟ آیا هنوز با این شرایط جدید سایت شما هنوز کار می کند ؟

آیا فکر می کنید موتوهای جستجو قوی با یکسری کدهای بدون ترتیب و نامنظم کار می کنند ؟ مسلما نه کاملا براساس کنسرسیوم شبکه جهانی وب هستند پس در نتیجه اگر می خواهید سایت شما هم در موتورهای جستجو  با رتبه بالا ظاهر شود سایت شما هم باید براساس همین استاندارد بنا شده باشد .

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

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

 

توسعه پذیری , دسترسی , ترجمه و تصحیح در آینده

امروزه بیشتر افراد از موبایل برای جستجو و گردش در وب استفاده می کنند و این تکنولوژی روزبه روز در حال توسعه و پیشرفت می باشد . تکنولوژی کمکی برای خواندن صفحات برای افراد نابینا و همینطور دستگاه های رابط برای افراد معلول خیلی عمومیت پیداکرده است بنابراین اگر شما این آیتم ها را در نظر نگیرید ترافیک زیادی را از دست خواهید داد . افراد متعددی از گوشه های مختلف دنیا با زبان های مختلف از سایت شما دیدن می کنند و سایت شما را به زبان خودشان ترجمه می کنند . clean markup و standards-compliance   برای اطمینان از انجام تمامی این سناریوها در نظرگرفته شده است .

 

باید ها و نبایدها :

باید : تگ ها را همانطور که هستند بکارببرید به عنوان مثال تگ h1 برای اولین و بالاترین عنصر در صفحه به کاربرده شود و بعد h2 و h3  فقط یک تگ h1 در هر صفحه باید باشد .

باید: برای شناسه ها و کلاس های css از نامگذاری های معنا دار استفاده کنید که کسی غیر از شما  هم متوجه بشود .

باید : از ویژگی inheritance در css به خوبی استفاده کنید . به عنوان مثال اگر شما یک نوع فونت را در عنصر اصلی مشخص کردید در عناصر زیر یا فرعی یا child نیازی به مشخص کردن دوباره انها نیست مگر اینکه عنصر فرعی یا child  نیاز به نوع دیگری از فونت باشد این کار باعث می شود که صفحه استایل شما مرتب باشد و سریعتر بارگذاری شود .

باید : صفحات وب HTML , CSS  و XML  را کاملا چک کنید که عاری از هرگونه خطا باشد و همچنین به خطاهای ایجاد شده توجه کنید .

باید : کدهای تولید شده WYSIWYG را دوباره چک کنید و اگر لازم بود آنها را پاک کنید آنها یکسری کدهای بی مصرف تولید می کنند که در زمان لود تاثیر زیادی بر صفحه وب می تواند داشته باشد .

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

نباید : فقط به این اتکا نکنید که چون صفحه لود می شود و در حال کارکردن است . کدها درست انجام شده و براساس استاندارد های تعیین شده می باشد .

 

 

به نقل از سایت مدرسه وب ایران

 

 

کتب و جزوات