Creating websites is a complicated process and many coders can develop bad practices while creating them. Here’s 5 things not to do while web coding.
Use a transitional doctype
Using the HTML 4.01 “loose” doctype or the XHTML 1.0 Transitional doctype is a bad way to start a website. Instead, code with the strict doctype. Some validation errors are silenced with the transitional doctypes and can cause problems later on.
Write the CSS and HTML simultaneously
When making a website, you should always fully write the HTML markup before even starting on the CSS. If you write them at the same time you can often lose your train of thought and it could take longer than it should to code the website.
Use tables for the layout
Tables were never meant to be used for the layout. Not only do tables make your markup ugly but they render slowly and make your code hard to maintain. Do not use tables for your layout!
Make classes and IDs with capital letters
The CSS can become terribly hard to maintain if you have some capital letters in your classes & IDs. Just don’t do it.
Make inline JavaScript and CSS
Writing JavaScript and CSS in the HTML files is a bad idea, since every time you go to a page you have to re-download the CSS and JavaScript if they’re not external. If they are external browsers can cache them and will not have to load them again.
I hope you enjoyed these tips. Am I missing something? Leave a comment below telling me what it is.
9 Comments
- Table layout : who REALLY care ? Most forum, CMS and all do use table layout. Table layout are sometime the best solution… And to be honest there is no real alternative. I know all that div stuff… I use them. But the real fact is that you don’t have a good flow elastic layout right now in HTML/CSS.
- You can’t first code HTML, then CSS, because even basic CC is part of the layout and basics of your web site.
- Capitals Letters : it’s about the convention you use.
- Inline javascript CSS : agree but there are cases when it’s okay.
At the end of the day, what count is the result you can see on screen, not the plumbing anyway.
-Most forum systems (such as vBulletin and Invision Power Board) have stopped using tables in their latest major release. Tables make such ugly markup.
-Then you haven’t planned your website out.
-I find that lowercase letters is the norm, and it’s easier to look up class names that way. I hate it when people have class names like “.BackGround” (And yes I see it quite frequently)
-No comments.
“The CSS can become terribly hard to maintain if you have some capital letters in your classes & IDs. Just don’t do it.”
Care to expand on this? I tend to use camelCase for my class names and ids.
You might use “camelcase” at one piece of code and “camelCase” at another by accident. By not using capitals, this can’t happen since you know it should always be “camelcase”.
Fair point. Personally, I think the increased readability makes up for it. I think misspelling “prefixmenuelement” is just as easy as getting the capitalization in “prefixMenuElement” wrong. Surely your don’t write all your method and variable names using no separation of words? Or is this a CSS class/id thing only?
You’d run the risk of encountering the classic expertsexchange issue: is it “experts’ exchange” or “expert sex change”?
Well, I agree with “frode” that camelCase is better as a norm both for readability and maintainability. Its easier to find mis-typed classes and simpler to make sense. However I agree that CSS class names with CAPS and Sentencecase are painful and sometimes misleading. Nevertheless some programmers with “OO” backgrounds landing into web-design, frequently get into this kinda trouble.
Anyone who thinks its acceptable to use tables for layout shouldn’t be designing websites.
I agree with your major points although I think there are times that tradeoffs have to be made. For example, it is often difficult to get approval to modify existing websites and correct all of the invalid html if the website is using transitional.
However, I don’t agree with the html and css not being allowed to be written at the same time. I usually draw a wireframe on a paper/napkin/etc before I proceed to quickly build a prototype in notepad++. I often have a tab open devoted to the css file, and another to the html file and switch between them as needed. I find this keeps me on task and keeps me easily in my programming/design mode.
What are your thoughts?
3 Trackbacks
[...] Read the list and get other great html tips and tricks: 5 Things Not to Do While Web Coding [...]
5 coisas a não fazer quando cria sites e aplicações para a Web…
Criar websites e aplicações web é um processo muito complicado, e muitos desenvolvedores podem seguir práticas até certo ponto erradas quando entram para a área de webdevelopment. Aqui estão 5 coisas que não deve fazer quando desenvolve aplicações web….
5 cosas que no debes hacer al desarrollar un Sitio Web…
HTML Tricks ha publicado una pequeña lista de las cinco cosas que no debes hacer cuando desarrolles en HTML/CSS. 1. No uses un DOCTYPE transicional Usar el doctype de HTML 4.01 o XHTML 1.0 transicional no es una buena forma de empezar a codificar tú si…