7 اشتباه رایج برنامهنویسان در کدنویسی HTML و CSS
فناوری های جدید به افراد اجازه طراحی پروژه های پیچیده و جذاب را می دهند. اما وقتی صحبت از HTML و CSS می شود بسیاری از تازه کارها هنوز هم اشتباهات مشابهی در نوشتن کد HTML و CSS مرتکب می شوند.
بهم ریختگی CSS
یکی از اشتباهات مشترک و معمول کاربران در نوشتن کدهای CSS، استفاده از ساختاربندی نادرست است. بیشتر کاربران و برنامه نویسان بر محتوا و عناصر دیداری وبسایت متمرکز هستند تا اینکه استایل ها را به صورتی منطقی سازمان بدهند. معمولا تازه کارها CSSشان را به صورتی که خودشان تشخیص می دهند می نویسند. در نتیجه اینکار، کاربران و برنامه نویسان بعدی در یافتن کدهای مورد نظر دچار سردرگمی می شوند.
نکته اول در نوشتن CSS این است: همیشه کدتان را سازماندهی کنید. اینکار باعث حفظ زمان و تسهیل روند کاری می شود. چطور بایستی اینکار را کرد؟ پیشنهاد میکنم که CSS خود را مطابق ساختار کد HTML که با آن کار می کنید سازمان دهید. مثلا:
- header
- body
- sidebar
- footer
اشتباه در قراردهی بلاک عناصر
یک اشتباه رایج در ساختمان وبسایت های HTML، به سازماندهی کد آن مربوط می شود. مثلا، یک عنصر HTML را می توان به صورت Block یا Inline نمایش داد. و مشکل هم از همینجا شروع می شود. بسیاری از کاربران، عناصر block را داخل عناصر inline قرار می دهند.
برای اجتناب از این اشتباه، به خاطر داشته باشید:
- عناصر block، ساختار سندتان را ایجاد می کنند. مثل پاراگراف ها و divها
- عناصر inline به blockها تعلق دارند، مثلا تگ ها.
عناصر inline همیشه در blockها جای می گیرند اما عکس این قضیه صدق نمی کند. هیچگاه نبایستی عناصر block را در اجزای inline جای دهید.
ننوشتن DOCTYPE
برای تازه کارها، DOCTYPE به مرورگرهای مختلف، نسخه فعلی HTMLتان را معرفی می کند. بدون DOCTYPE، نمیتوانید از اعتبار کد اطمینان حاصل نمایید. وقتی خبری از DOCTYPE نباشد، مرورگر شروع به حدس زدن میکند. در نتیجه، نتیجه کارتان در کدنویسی ممکن است چیزی نباشد که تصورش را می کردید.
برای اجتناب از این مشکل، بایستی گام های زیر را بردارید.
- از DOCTYPE استفاده کنید، فرقی ندارد که از چه نسخه HTML بهره می برید.
- همیشه این عبارت را در اولین خط از کدتان قرار دهید.
- مراقب باشید DOCTYPE را به همین صورت تایپ کنید، حروف کوچک باعث ایجاد خطا می شود.
- از ابزارهای آنلاین تایید اعتبار کد HTML برای یافتن حفره های ممکن استفاده کنید.
نادیده گرفتن متن ALT
وقتیکه با ساختمان یک وبسایت HTML کار می کنید، مسایل زیادی معمولا نادیده گرفته می شوند. یکی از این موارد، خصوصیت ALT است. به خاطر داشته باشید که هر تصویری که به محتوای وبسایت اضافه می کنید بایستی یک متن ALT داشته باشد. اما چرا؟
- متن ALT چیزی که در تصویرتان وجود دارد را توصیف می کند.
- تگ های IMG حتما بایستی این خصوصیت را داشته باشند.
- کاربران و بیشتر صفحه خوان ها از این ALTها برای درک محتوای تصویر استفاده می کنند.
- وقتیکه به درستی از این ALTها استفاده شود، متون ALT به اسپایدربات ها اجازه ایندکس بهتر محتوایتان را می دهند.
اشتباه در انتخاب کدبندی نویسه
همانطوری هم که از نامش برمیآید، اشتباه رایج بعدی در هنگام انتخاب کدبندی نویسه رخ می دهد. خلاصه داستان این است که هیچ اهمیتی ندارد که وبسایتتان برای چه منظوری ساخته شده، هر صفحه وب بایستی مجموعه کاراکتری تعریف شده ای داشته باشد. نکته در این است که این مجموعه ها به مرورگرها می گویند که صفحه شما از چه نوع کاراکترهایی در صفحه تان استفاده کرده اید.
واضح است که مجموعه کاراکتری بسته به زبان وبسایت متغیر است. یعنی اینکه صفحات انگلیسی با صفحات به زبان چینی از مجموعه های نویسهای کاملا متفاوتی استفاده می کنند. با توجه به این مسایل، شما نمی توانید کدبندی کاراکتری را پشت گوش بیاندازید. اینکار به مرورگرها و دستگاه های کمکی می گوید که چه نوع داده ای بایستی خوانده و نمایش داده شود.
نادیده گرفتن تگ های ساده
همیشه به یاد داشته باشید که تمام محتوای تگ head (مثلا title، meta، style) بایستی داخل تگها head باشند.
- <head>
- <head/>
فراموش کردن بستن تگ ها
یک اشتباه رایج دیگر و البته نه آخر در کدنویسی HTML، جایی شروع می شود که تازه کارها فراموش می کنند که تگ های باز شده را ببندند.
5 / 5. 1
1 دیدگاه
به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.
مطلب مفیدی بود. تشکر از شما