1. Welcome to the new MacRumors forums. See our announcement and read our FAQ

Essential web-dev tools, tips and sites for Mac

Discussion in 'Web Design and Development' started by mrjamin, Apr 1, 2004.

  1. macrumors 65816


    Ok, here it is. Can someone sticky this thread? Figured it'd be good to get a definitive list of useful sites and apps for web-dev on the mac.

    I'll start:

    real-time screen shots of websites in various Windows browsers - just submit your site and it'll bring up screenshots of how it looks in IE5, IE5.5, IE6, Opera and FireFox


    ...does the same, but for windows users wanting to check how Safari behaves

  2. macrumors 6502a


    wow that is really neat, hehe :) i tired it with the site i just revamped.
  3. Moderator emeritus


    Good thread idea, mrjamin. :)

    Here's a couple more good ones:
    MOZiE - compare Mozilla and IE rendering side-by-side (PC app)
    Multi-IE - Run IE5, IE5.5 and IE6 side-by-side (PC only)

    And of course the validators...always validate your pages! ALWAYS!!! :p

    edit - Just found a decent primer on CSS-based designs:
  4. macrumors 65816


  5. macrumors regular

    Here's a nice little script from Patrick Gibson that makes setting up virtual hosting on OSX extremely easy:


    Combine this with Apache/MySQL/PHP running locally and you are set :). I set up client sites as virtual hosts under 'Sites' and then access them by pointing a browser at http://clientsite/.
  6. macrumors 68000


    These are great for quick starting points for navigation and layout.



    I have used these on all of my sites as a basic starting point and then adding my own stuff to customize.
  7. macrumors 65816


    Distance between 2 UK postcodes

    Here's some very handy code (used with the attached SQL file) which will work out an approximate "as the crow flies" distance between 2 UK postcodes. You need to configure your DB connection info a few lines in.

    <form name="form1" id="form1" method="post" action="">
      <input type="text" name="start" /><br />
      <input type="text" name="finish" />
      <br />
      <input type="submit" name="Submit" value="Submit" />
    // if the Submit button's been pressed:
    $db mysql_connect("host","username","password"); // set your db host/username/password info here
    mysql_select_db("dbname"); // your db Name
    $pc[0] = strtoupper(strrev(substr(strrev(str_replace(" ","",$_POST['start'])),3))); // extract the first half of the first postcode 
    $pc[1] = strtoupper(strrev(substr(strrev(str_replace(" ","",$_POST['finish'])),3))); // extract the first half of the second postcode 
    $sql "SELECT * FROM `postcodes` WHERE `postcode` = '$pc[0]' || `postcode`  = '$pc[1]' LIMIT 2"// select the postcodes and the X/Y info from the DB
    $result mysql_query($sql);
    $i 0;
    // load the x/y stuff into an array
    while($postcodes mysql_fetch_array($result)){
    $postcode[$i]['x'] = $postcodes['x'];
    $postcode[$i]['y'] = $postcodes['y'];
    // work out the difference in X and Y for the postcodes
    $xDiff $postcode[0]['x'] - $postcode[1]['x'];
    $yDiff $postcode[0]['y'] - $postcode[1]['y'];
    // do some pythagorus to work out the distance between the 2
    $distance = ($xDiff $xDiff) + ($yDiff $yDiff);
    $distance sqrt($distance);
    // convert the result of the above to KMs
    $KMdistance round(($distance 1000));
    // convert KM to miles
    $Mdistance round((0.621371 $KMdistance));
    "<p>The distance between $pc[0] and $pc[1] is $Mdistance miles, or $KMdistance km</p>\n");

    The SQL file also contains relevant longitude and lattitude info for each postcode. I'm not sure how up to date they are, but there are around 3000 lines in it so its fairly comprehensive!

    I wrote the PHP myself, I know it could be optimised but it was a quick script I wrote to use the postcode DB i found, just playing around for my own amusement!


    Attached Files:

  8. macrumors 65816


    HTML Area

    Looking for a free WYSIWYG Textarea element replacement? Check this out:


    Its awesome. Its in beta at time of writing, but still very good.

  9. macrumors newbie

  10. macrumors regular


    Lynx emulator. Great for checking general accessibility for people using text browsers and, more importantly, screen readers. If it still all makes sense in Lynx then you're doing good.



    Oh, almost forgot, A List Apart. Should be required weekly reading for anyone who uses (or likes to tinker with) CSS :)
  11. Administrator


    Staff Member

    Ooh cool - i've got a heavily geographical based UK site, so finding the closest city would be really handy. The SQL file you attached seems to be cut off though - it only goes down to row 110, postcode B9.
  12. macrumors 65816


    strange - sorry. Have replaced it with a ZIP file containing the SQL query instead :) its back in the original post.

    Hope that fixes it...

  13. Administrator


    Staff Member

    Yup, works now, thanks.
  14. macrumors 6502


    I have found this OS X Finder contextual menu plugin extremely helpful:
    The Dimentionizer
  15. macrumors 6502


  16. macrumors member

  17. macrumors 6502

  18. mms
    macrumors 6502a

  19. Moderator emeritus


  20. macrumors 6502


  21. macrumors newbie

  22. macrumors 6502a


    Safari - O'reilly
    Digital version of (complete)books by O'reilly press, macromedia press, microsoft press, cisco press, sun, que, sams.

    it cost money but there is a free trial. i'm using it now. really good content wise. i don't really like reading on the screen a lot though.
  23. macrumors 68000


    css Zen Garden - I find this site pretty inspirational. It's an amazing gallery of designs all using the same HTML, but different CSS... basically shows you how much you can control with CSS.

    enkoder - a Mac OS X app that takes an email address (or some other text/html) and converts it to a javascript - preventing the email address from being harvested by spammer robots/spiders. Their Dimensionizer contextual menu plugin also seems like it would be useful but I haven't tried it.

    Apple's Web Page Development: Best Practices has some good info.
  24. macrumors member


  25. macrumors 6502


    I just wanted to add a few more helpful tools that I've been using lately. I've become a huge fan of Drupal as a CMS, especially when used in conjunction with FCK Editor. They make a great combination.


    FCK Editor

    And I just stumbled across a great resource for creating favicon.ico files from pretty much any image format, from a web based interface (for free). I just tried from a .png file that I neglected to reduce in size first, and it turned out well.


Share This Page