Essential web-dev tools, tips and sites for Mac

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

  1. macrumors 65816

    mrjamin

    Joined:
    Feb 6, 2003
    Location:
    Strongbadia
    #1
    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:
    http://www.danvine.com/iecapture/

    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

    http://www.danvine.com/icapture/

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

    MrJ
     
  2. macrumors 6502a

    Benjamin

    Joined:
    Oct 27, 2003
    Location:
    Portland, OR
    #2
    wow that is really neat, hehe :) i tired it with the site i just revamped.
     
  3. Moderator emeritus

    Rower_CPU

    Joined:
    Oct 5, 2001
    Location:
    San Diego, CA
    #3
    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
    (X)HTML
    CSS

    edit - Just found a decent primer on CSS-based designs:
    http://www.wpdfd.com/editorial/basics/index.html
     
  4. thread starter macrumors 65816

    mrjamin

    Joined:
    Feb 6, 2003
    Location:
    Strongbadia
  5. macrumors regular

    Joined:
    Jan 6, 2004
    #5
    Here's a nice little script from Patrick Gibson that makes setting up virtual hosting on OSX extremely easy:

    http://patrickgibson.com/news/andsuch/000091.php

    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

    kgarner

    Joined:
    Jan 28, 2004
    Location:
    Utah
    #6
    These are great for quick starting points for navigation and layout.

    List-O-Matic

    Layout-O-Matic

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

    mrjamin

    Joined:
    Feb 6, 2003
    Location:
    Strongbadia
    #7
    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.

    PHP:
    /*
    <form name="form1" id="form1" method="post" action="">
      Start: 
      <input type="text" name="start" /><br />
      Finish: 
      <input type="text" name="finish" />
      <br />
      <input type="submit" name="Submit" value="Submit" />
    </form>
    */
    <?php
    // if the Submit button's been pressed:
    if(isset($_POST['Submit'])){
        
    $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);
        
    mysql_num_rows($result);
        
    $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'];
            
    $i++;
        }
        
    // 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));
        
        print(
    "<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!

    MrJ
     

    Attached Files:

  8. thread starter macrumors 65816

    mrjamin

    Joined:
    Feb 6, 2003
    Location:
    Strongbadia
    #8
    HTML Area

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

    http://dynarch.com/mishoo/htmlarea.epl

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

    MrJ
     
  9. macrumors newbie

    Joined:
    Apr 13, 2004
  10. macrumors regular

    Joined:
    Apr 27, 2003
    Location:
    Bradford, UK
    #10
    Lynx

    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.

    http://www.delorie.com/web/lynxview.html

    --

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

    Knox

    Staff Member

    Joined:
    Jul 1, 2002
    Location:
    UK
    #11
    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. thread starter macrumors 65816

    mrjamin

    Joined:
    Feb 6, 2003
    Location:
    Strongbadia
    #12
    strange - sorry. Have replaced it with a ZIP file containing the SQL query instead :) its back in the original post.

    Hope that fixes it...

    MrJ
     
  13. Administrator

    Knox

    Staff Member

    Joined:
    Jul 1, 2002
    Location:
    UK
    #13
    Yup, works now, thanks.
     
  14. macrumors 6502

    encro

    Joined:
    May 6, 2002
    Location:
    bendigo.victoria.au
    #14
    I have found this OS X Finder contextual menu plugin extremely helpful:
    The Dimentionizer
     
  15. macrumors 6502

    encro

    Joined:
    May 6, 2002
    Location:
    bendigo.victoria.au
    #15
    boz1 likes this.
  16. macrumors member

    Joined:
    Jan 12, 2004
    Location:
    Minnesota
    #16
  17. macrumors 6502

    Joined:
    Aug 15, 2004
    #17
  18. mms
    macrumors 6502a

    Joined:
    Oct 8, 2003
    Location:
    CA
  19. Moderator emeritus

    Rower_CPU

    Joined:
    Oct 5, 2001
    Location:
    San Diego, CA
    #19
  20. macrumors 6502

    davecuse

    Joined:
    Feb 20, 2004
    Location:
    NYC
  21. macrumors newbie

    Joined:
    Sep 22, 2003
    Location:
    ATL
    #21
  22. macrumors 6502a

    snkTab

    Joined:
    Nov 13, 2004
    Location:
    Cincinnati, OH
    #22
    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

    atari1356

    Joined:
    Feb 27, 2004
    #23
    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

    HeWhoSpitsFire

    Joined:
    Aug 13, 2004
    Location:
    Oregon
    #24
  25. macrumors 6502

    davecuse

    Joined:
    Feb 20, 2004
    Location:
    NYC
    #25
    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.

    Drupal
    http://drupal.org

    FCK Editor
    http://fckeditor.com

    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.

    http://www.chami.com/html-kit/services/favicon/
     

Share This Page