Representative CSS



  • I inherited a half-'finished' system from a former employee... well, I knew she had her quirks, but I gave up trying to 'fix' her code as long as she was around to maintain it... ah, well.  Luckily her replacement inherited most of her stuff, but I got this one as it was high-profile (sorta) and I've been around longer.  It's a combination Job announcement/application/resume builder package.

    I could tell you about the 100+ lines of javascript validation code that never ran (because of a typo in a function that she obvious copied from some javascript site... and never actually called)

    I could tell you about the logic flaw that prevented anyone who just created an account from creating a resume - unless you were the first user in the system.

    But I think it is best summed up by a single line of CSS - scattered throughout various pages, of course, there was no .css file originally:

    .minitext {font-family:Rockwell; font-size:12pt;}



  • Let's see...

    1. Using a specific font, by name, without giving an actual "family" name (serif, sans-serif, monospace, etc.) - annoying, but not that bad
    2. Forcing an exact point size rather than using relative sizes - everybody does this
    3. The idea that 12 point is considered [i]miniature[/i] text - wtf? I'd hate to see how big [b]normal[/b] text is...


  • @Quietust said:

  • The idea that 12 point is considered miniature text - wtf? I'd hate to see how big normal text is...
  •  

    As a matter of fact... 12pt Rockwell is also how the style for BODY was defined...



  • @BlueKnot said:

    @Quietust said:

  • The idea that 12 point is considered miniature text - wtf? I'd hate to see how big normal text is...
  •  

    As a matter of fact... 12pt Rockwell is also how the style for BODY was defined...

     

    The root wtf is that she named the class after what it *looks like*, not what it *means*...a lot of CSS designers still don't understand this distinction. I see stuff like this all the time. It's a subtle way of confounding form and content.

     p.redBox {

        bg-color: blue; // customer wants the box to be blue instead of red

    }


  • @savar said:

    p.redBox {

        bg-color: blue; // customer wants the box to be blue instead of red

    }

     

    FWIW: 

    It's background-color not bg-color.

    CSS uses only /* C-style comments */ not the // C++ style comments.




  • @Zemm said:

    @savar said:

    p.redBox {

        bg-color: blue; // customer wants the box to be blue instead of red

    }

     

    FWIW: 

    It's background-color not bg-color.

    CSS uses only /* C-style comments */ not the // C++ style comments.


    Whatever, you missed his point entirely.

    He's stating that a lot of designers call things by what they look like rather than what they mean.  The fallicy he demonstrated was that the class was called "redbox" and later changed to blue.  It should have been called, Content_box or menu_box or something like that, color means nothing here, what is important is what this box does.



  • @KattMan said:

    Whatever, you missed his point entirely.
    I saw nothing in ZippoLag's post that implied that he missed the point.  In fact, he probably got it, then re-read it and said "wait that's not right."



  • @Quietust said:

    The idea that 12 point is considered miniature text - wtf?

    You'll understand when you get older.

     

     



  • @KattMan said:

    @Zemm said:

    @savar said:

    p.redBox {

        bg-color: blue; // customer wants the box to be blue instead of red

    }

     

    FWIW: 

    It's background-color not bg-color.

    CSS uses only /* C-style comments */ not the // C++ style comments.


    Whatever, you missed his point entirely.

    He's stating that a lot of designers call things by what they look like rather than what they mean.  The fallicy he demonstrated was that the class was called "redbox" and later changed to blue.  It should have been called, Content_box or menu_box or something like that, color means nothing here, what is important is what this box does.

     

    Just because I didn't explicitly mention getting the point doesn't mean I missed it. :-P

    I was just pointing out some minor CSS mistakes.

    I have been guilty in the past using what something "looks like" instead of what it "means" for the class name, but that was some years ago before I discovered the semantics of design. I've inherited some fairly dodgy code (HTML/CSS/PHP/etc) myself and have been working to clean it all up.


Log in to reply