Aqua-Soft Forums

[help]small, Fast, And Organized Code....

I am pretty good with HTML and javascript. And I was wondering... How do all of you uber 7331 web coders keep you code FAST, SMALL and ORGANIZED.

I use Visual Studio .Net 2001 to code in HTML mostly. Its pretty fast and gives you a rough layout of the page in IE. Plus it has a good CSS maker. I write most/all of my HTML by hand. Visual Studio has color coding which I find helpful PLUS it seperates a lot of things with tabs and will give me helpful tips like "the 'center' tag is outdated, for full compatibility please use more modern tags"

So.... any tips... And yes! Notepad is my best freind!

#178911

Originally posted by ihartmacz@Jun 18 2004, 10:29 PM

uber 7331 web

wow, you mean 1337?

// Lou

#178912

Dreamweaver does the bulk. I do CSS additions and tweaking. I throw any other stuff (a la PHP) in by hand (and done by hand). Maybe I'm odd, but I don't have the time to do everything by hand. Especially when there's tools available to do the boring stuff for you.

@Lou; Maybe he means "teel" or "teal" for some very strange reason?

#178928

Originally posted by es.xxi@Jun 19 2004, 12:23 AM

Dreamweaver does the bulk.

Indeed it does. It adds alot of bulk as well.. often generating code that is defenitely not "FAST, SMALL and ORGANIZED." as was requested.

Really, the best way to do that is the way you already do -- by hand, and with experience. The cleanest, smallest, quickest code always comes by hand. As far as organization goes, that's really up to how you code. I do a lot of intending in my code, keeping things well seperated as to what's in which element, and so on, and I generally order my things in the code the way I'd expect them to appear in a browser that doesn't support CSS (as I pretty much use all CSS for my positionings, which makes the position of elements in the code pretty much a moot point to browsers which support it).

Honestly, cleaner code with less bulk comes with experience and practice, that's all I can say, really. :P

#178938

Haha, here is my experience for a website I am making:

(Look at the source codes)

Dreamweaver Stylee

Hand Stylee

:canadian:

#178939

Originally posted by dav@Jun 19 2004, 01:35 AM

Haha, here is my experience for a website I am making:

(Look at the source codes)

Dreamweaver Stylee

Hand Stylee

:canadian:

I don't know too much about XHTML or CSS but that is a shocking difference for sure. :o

#178961

Originally posted by dav@Jun 19 2004, 05:35 AM

Haha, here is my experience for a website I am making:

(Look at the source codes)

Dreamweaver Stylee

Hand Stylee

:canadian:

:blink:

I thought a program makes code slopier if anything. DAMN am I glad I use dreamwever. :lol: Love it. Easy to use. Fast. Free...(ERR I mean shareware!) and looks damn cool. AND know we know it makes code shorter. The app is DAMNED smart.!! :P

#178963

Always do it by hand, in a good text editor - there are no programs out there that can really make decent style/XHTML decisions on your behalf - Dreamweaver et al. make good attempts but they just can't, by their very nature, be smart enough to keep your code as organised and streamlined as you could by hand.

I'd personally suggest looking at some web-design related blogs for good ideas/suggestions...

Those are some of my favourites, but there are literally hundreds of thousands out there...

Also worth checking are places like A List Apart...

#179063

 

   

 

   

     

       

href='http://index.php' target="_blank">

     

     

       

<?php include("include/topnav.htm"); ?>

     

   

     

       

         

 

       

     

     

     

       

         

<?php $category = "1";

include("post/show_news.php");

?>

         

<?php include("include/nav.htm"); ?>

       

     

   

   

 

 

#179289

Originally posted by Globox@Jun 19 2004, 06:44 PM

I donno', you may not like DreamWeaver's output, but it sure doesn't do anything like FrontPage, etc.

I kinda' like it...

code...........

Yeah, But that page would be much smaller if you cut all the code from the "style" tage and put it all in a nice uber CSS file.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Globox | Pixel Brat v1.0</title>
</head>
<body>
<table width="850" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr valign="top">
    <td width="50" height="100%" background="img/left.gif"> </td>
    <td height="100%" bgcolor="#FFFFFF"><table width="750" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td><a href="../../unavailable.html"><img src="../../unavailable.html" width="750" height="150" border="0"></a></td>
      </tr>
      <tr>
        <td height="30" align="right" valign="middle" bgcolor="#000000"><?php include("include/topnav.htm"); ?></td>
      </tr>
    </table>
      <table width="100%"  border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td height="20" background="img/shadow.gif"> </td>
        </tr>
      </table>      
      <table width="100%" height="99"  border="0" cellpadding="0" cellspacing="0">
        <tr valign="top">
          <td><?PHP $category = "1";
include("post/show_news.php");
?></td>
          <td width="200" valign="top"><?php include("include/nav.htm"); ?></td>
        </tr>
      </table>
    </td>
    <td width="50" height="100%" background="img/right.gif"> </td>
  </tr>
</table>
</body>
</html>

Would look like this

#179320

Originally posted by ihartmacz@Jun 19 2004, 08:04 PM-->
QUOTE(ihartmacz @ Jun 19 2004, 08:04 PM)
Yeah, But that page would be much smaller if you cut all the code from the "style"  tage and put it all in a nice uber CSS file.

<html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>Globox | Pixel Brat v1.0</title></head><body><table width="850" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">  <tr valign="top">    <td width="50" height="100%" background="img/left.gif"> </td>    <td height="100%" bgcolor="#FFFFFF"><table width="750" border="0" align="center" cellpadding="0" cellspacing="0">      <tr>        <td><a href="../../unavailable.html"><img src="../../unavailable.html" width="750" height="150" border="0"></a></td>      </tr>      <tr>        <td height="30" align="right" valign="middle" bgcolor="#000000"><?php include("include/topnav.htm"); ?></td>      </tr>    </table>      <table width="100%"  border="0" cellspacing="0" cellpadding="0">        <tr>          <td height="20" background="img/shadow.gif"> </td>        </tr>      </table>            <table width="100%" height="99"  border="0" cellpadding="0" cellspacing="0">        <tr valign="top">          <td><?PHP $category = "1";include("post/show_news.php");?></td>          <td width="200" valign="top"><?php include("include/nav.htm"); ?></td>        </tr>      </table>    </td>    <td width="50" height="100%" background="img/right.gif"> </td>  </tr></table></body><!--QuoteEBegin
[b]

Would look like this

Sure, but it's just one page and I chose to have it inbeded :]

#179873

gotcha!

#179880

Originally posted by babypapichulo@Jun 19 2004, 12:45 AM

:blink:

I thought a program makes code slopier if anything. DAMN am I glad I use dreamwever.  :lol:  Love it. Easy to use. Fast. Free...(ERR I mean shareware!) and looks damn cool. AND know we know it makes code shorter. The app is DAMNED smart.!! :P

The dreamweaver is the bloated one :lol: The shorter one is the one by hand! :D

#179886

If you really want bloated coding, FrontPage >.

#179888

For me, its TopStyle Lite and Notepad!

#179893

Originally posted by dav@Jun 21 2004, 08:41 AM

The dreamweaver is the bloated one  :lol: The shorter one is the one by hand!  :D

What do you mean by "bloated?"

If you mean longer, then yes, because DW organizes code, whereas if you do it by hand you have to organize it or not. But if you mean adding exta/useless tags etc, you're mistaken.

#179969

What about MS Word HTML? The cleanest code i have ever seen!

NOT!!!

The are like 50 lines of code that do nothing!!

#180000

I agree with Globox.

I would use Dreamweaver, and look over the code to see if there's anything I don't like.

-nightcrawler1089

#180013

Originally posted by Globox@Jun 21 2004, 12:30 PM

What do you mean by "bloated?"

If you mean longer, then yes, because DW organizes code, whereas if you do it by hand you have to organize it or not. But if you mean adding exta/useless tags etc, you're mistaken.

I was saying that by hand I used only 28 lines, as opposed to the 200 or so that Dreamweaver used... By hand is the way to go in my opinion. :D

If Dreamweaver works for you, goodie :canadian:

#180020

I recommend Html Kit for those of you who feel capable of coding my hand, It's great :)

#180040

Yeah, but what exactly is the point of keeping your code neet ?

You never see it except when you edit the damn thing.

#180049

Originally posted by ifido@Jun 21 2004, 04:10 PM

Yeah, but what exactly is the point of keeping your code neet ?

You never see it except when you edit the damn thing.

That's the point. So you are not confusied by anything. It makes it easier for you to read it. Youwouldwanteverythingtobesquishedtogetherdoyou?

#180054

Ofcourseyoudon'twantanythingsquishedtogether.Whywouldyouwanttodothat?

I can't stand Microsoft products, so don't everyone jump on me at once regarding the next remark!

I have heard that newer versions of FrontPage don't produce as much bloated code as the older ones? Or did I hear wrong?

-nightcrawler1089

#180066

Originally posted by dav@Jun 21 2004, 02:14 PM

I was saying that by hand I used only 28 lines, as opposed to the 200 or so that Dreamweaver used... By hand is the way to go in my opinion.  :D

If Dreamweaver works for you, goodie  :canadian:

True, but it doesn't add anything. It simply organizes it, and gives it more "space." It's not like they are two different documents, they're just written in different ways. It's all about what works, though.

#180449