Thursday, January 14, 2010

Bad HTML - img tag

<IMG style="WIDTH: 710px; HEIGHT: 207px" height=830 alt="" src="https://www.somesite.com/UploadedImages//red%20banner%20with%20sign.jpg" width=1946 border=0>

Developer was wondering why image was getting stretched and asked me to take a look. Always make sure your coder knows what s/he is doing.
See how many errors you can spot and then scroll down. Have in mind that this is from a newsletter sent in email.















  1. Tag name is uppercase.
  2. CSS is uppercase.
  3. Values not quoted.
  4. HTML width and height different from CSS width and height.
  5. https instead of http.
  6. Extra slash in url.
  7. Tag not closed.
  8. Pointless inline CSS.
  9. alt not set.
Posted by at 2:40 PM
Labels:

3 comments:

  1. Since we are talking about newsletter we aren't talking about xHTML so not so many problems here:

    - Tag name uppercase is ok, because there's no email that is perfect xHTML anyway, HTML 4 lets you use any case.
    - CSS uppercase - not sure i know how it's supposed to be in HTML 4...
    - Values don't need to be quoted in HTML 4
    - https vs http - not an error, just waste of processor time
    - extra slash is perfectly ok as long as server supports it
    - again tag doesn't have to be closed in HTML 4
    - pointless CSS? What do you mean?

    So my conclusion is that only item 4 is real problem the rest is acceptable even though not perfect
    ReplyDelete
  2. Pointless css because it's trying overwrite html values for width and height instead of just changing those values manually. That's what was causing the problem btw.

    Uppercase is ok, but, it's not the current standard and looks ugly. So is quoting variables, which was done for some but not for others.
    The whole thing, while not intrinsically wrong, is very sloppy and badly done.

    The rest of the html looked just as bad with multiple nested tags instead of css, nested tables, a lot of nested tables, for styling.
    And a lot of duplicate inline css on top of that.

    There are a lot of things that are "acceptable" and that would "work". Except you're supposed to have respect for your work and for your client.

    Here's a good example I keep seeing with inserts based on checkbox and related tables.
    1. Loop through values and create a query for each insert.
    2. One query with insert from related table where id in list of ids submitted in form.

    Both acceptable, but only one of them looks elegant.
    ReplyDelete

Subscribe to: Post Comments (Atom)