Beginning Website Design and Development

[monke]

Here are a few links to get you started:

Tutorials and Resources
Coding Help
w3schools (http://www.w3schools.com/)
alistapart (http://www.alistapart.com/)
Good-Tutorials (http://www.good-tutorials.com)
VTC Traning Videos (http://www.vtc.com/products/internet.htm)
HTML Dog (http://www.htmldog.com/)
Zend PHP Tutorial (http://devzone.zend.com/node/view/id/627)
HTML Home Page (http://www.w3.org/MarkUp/)
Pixel2Life (http://www.pixel2life.com/)
Web Design from Scratch (http://www.webdesignfromscratch.com/)

CSS Tips and Tricks
quirksmode (http://www.quirksmode.org/)
Learning CSS (http://www.w3.org/Style/CSS/learning)
CSS Tips and Trends (http://www.designmeltdown.com/)
CSSEdit (http://www.macrabbit.com/cssedit/)
Free CSS Templates (http://www.freecsstemplates.org/)

Developers
opensourcecms (http://www.opensourcecms.com/)
Wed Developers Handbook (http://www.alvit.de/handbook/)
webmonkey (http://www.webmonkey.com/)
MySQL Administration (http://www.mysql.com/products/tools/administrator/)
MAMP (http://www.mamp.info/en/home/)
XAMPP (http://www.apachefriends.org/en/xampp.html)

Browser Fixes
Internet Explorer PNG Fix (http://www.twinhelix.com/css/iepngfix/)
Dean Edwards IE7 (http://dean.edwards.name/IE7/)

Colour Schemes
Adobe Kuler (User Submitted Colour Schemes) (http://kuler.adobe.com/)
Colour Match (http://colormatch.dk/)
Colour Matcher (http://meddle.dzygn.com/tests/colors/)
COLORlovers (http://www.colourlovers.com/)

Programs
Blogging
Word Press (http://wordpress.org/)
Word Press Themes (http://themes.wordpress.net/)
MarsEdit (http://ranchero.com/marsedit/)
pMachine (http://www.pmachine.com/)
Text Pattern (http://www.textpattern.com/)
Type (http://typo.leetsoft.com/trac/)

Designing/Coding
iWeb (http://www.apple.com/ilife/iweb/)
RapidWeaver (http://www.realmacsoftware.com/rapidweaver/index.php)
HyperEdit (http://www.tumultco.com/HyperEdit/)
BBEdit (http://www.barebones.com/products/bbedit/index.shtml)
Adobe Products (http://www.adobe.com/web/main.html)
Dreamweaver (http://www.macromedia.com/software/dreamweaver/)
GoLive (http://www.adobe.com/products/golive/main.html)
Text Wrangler (http://www.barebones.com/products/textwrangler/index.shtml)
TextMate (http://www.macromates.com/)
SkEdit (http://www.skti.org/skEdit.php)
xScope (http://www.iconfactory.com/xs_home.asp)
Freeway (http://www.softpress.com/index.php)
Smultron (http://www.tuppis.com/smultron/)

FTP/SFTP
Transmit (http://www.panic.com/transmit/)
Cyberduck (http://cyberduck.ch/)
Interarchy (http://www.interarchy.com/main/)
Fetch (http://www.fetchsoftworks.com/)
Captain FTP (http://captainftp.xdsnet.de/)

Others
Link Popularity Check (http://www.marketleap.com/publinkpop/default.htm)
Internet Explorer for OS X (http://www.kronenberg.org/ies4osx/)
CushyCMS (http://www.cushycms.com/)

Hosting
Dream Host (http://www.dreamhost.com/)
A Small Orange (http://www.asmallorange.com/)
Has Web (http://hasweb.com/)
Neureal (http://www.neureal.com/)
Aplus (http://www.aplus.net/)
Media Temple (http://www.mediatemple.net/)
Lunar Pages (http://lunarpages.com/)
TJR Networks (http://www.tjrnetworks.com/)
Myacen (http://www.myacen.com/)
ICDSoft (http://www.icdsoft.com/)
Vivicalhosting (http://www.vivicalhosting.com)

Buying Domains
Web Names and Hosting (http://www.webnames.ca/)
Go Daddy (http://www.godaddy.com/gdshop/default.asp)
eNom (http://www.enom.com/)

Photo Editing/Manipulation
Gimp (http://www.gimp.org/)
Photoshop (http://www.adobe.com/products/photoshop/main.html)
Seashore (http://seashore.sourceforge.net/)


If anyone else has any links that they like/use, please post them.

[ChrisWB]

This is an awesome idea! Why not add links to some commercial products like Dreamweaver (http://www.macromedia.com/software/dreamweaver/) and GoLive (http://www.adobe.com/products/golive/main.html)?

Also, Gimp (http://www.gimp.org/) is very useful for photo manipulation, as is the more professional Photoshop (http://www.adobe.com/products/photoshop/main.html).

[monke]

Thanks ChrisWB,
I accidently forgot to add those in, but they are in now.

As other suggest links, I will post them.

[blythy]

Link Popularity Stats:
http://www.marketleap.com/publinkpop/default.htm

[Mitthrawnuruodo]

Seashore (http://seashore.sourceforge.net/), a nice, free image manipulator. A bit early in development, but I'm sure a certain MR member will get it right. He's promised "one day it will be as good as MS Paint"... ;) :D

[Flowbee]

VTC has a large library of software training videos available online for $30/month. Some videos are better than others, but overall it's a good way to learn the basics of most popular apps (especially if you learn better by demonstration than by reading).

http://www.vtc.com/products/internet.htm

[radiantm3]

How can that list not have the best editor on the mac platform? :cool:

You have to add Textmate (www.macromates.com).

[radiantm3]

SkEdit also deserves mention for those who need code hinting.

http://www.skti.org/skEdit.php

[superbovine]

once this is all updated, make this a guide in the wiki section.

[Peyton]

I use lunarpages.com for hosting they really are great. They add features all the time, almost no downtime.

Check em' if you need em'

[steelphantom]

HTML Dog (http://www.htmldog.com) is a great resource for learning XHTML and CSS. It pretty much covers all the bases when it comes to this stuff.

[monke]

Updated again and added the 'Buying Domains' section.

[summer sky]

wow! sooo happy to find this collection of info and resources as am trying to teach myself web design... thx :)

[homerjward]

what about a link to a color scheme help site? i use http://www.siteprocentral.com/html_color_code.html

[bwanac]

http://www.webdesignfromscratch.com/

I find the above site to be very helpful.

Beginners should read this when they really want to make a site that really does its job.

[monke]

Updated, once again, thanks for the links.

[theappleguy]

Great idea for a thread iNeedtoSwitch. :) Here are a few of my own suggestions:

Hosting: TJR Networks (http://www.tjrnetworks.com) and Myacen (http://www.myacen.com)
FTP: Interarchy (http://www.interarchy.com/main/)
Domains: eNom (http://www.enom.com)

:)

[ZoomZoomZoom]

http://devzone.zend.com/node/view/id/627

Best PHP tutorial I've found. I've had a great time going through it, and I'm definitely going to apply what I've learned.

[Yvan256]

Textwrangler! It's the best and it's free! But why is it in "Blogging"?!

As for hosting, I'm using PowWeb for yvan256.net, never had any real problem and they're not too expensive. The storage size and bandwidth/month are extremely huge too.

[iMeowbot]

Learning CSS (http://www.w3.org/Style/CSS/learning) at the W3C.

HTML Home Page (http://www.w3.org/MarkUp/) also at W3C: specifications, tutorials, you name it.

[monke]

Updated once again. :)

[treycopeland86]

this is the ultimate resource and should be added....

http://www.alvit.de/handbook/

[monke]

Thanks for the link, great handbook by the way.

[monke]

Added IE fix, CSS Tips and Trends, CSSEdit, MySQL Administration and iWeb. :)

[MacsomJRR]

This is an excellent resource for web-related stuff. I'll be back! Thanks!

[asencif]

This is a great sticky. I would like to pose a question to all you Web Develpers out there. I am presently looking into becoming a Web Developer/Programmer and know HTML and Javascript. Now I have been starting some PHP, however in this Web 2.o era, What do you guys recommend one's route be as far as languages/technologies are to learn?

I know there is so many web technologies out there that it gets ridiculous like Ajax, Jakarta, Python, etc. So any tips?

[monke]

This is a great sticky. I would like to pose a question to all you Web Develpers out there. I am presently looking into becoming a Web Developer/Programmer and know HTML and Javascript. Now I have been starting some PHP, however in this Web 2.o era, What do you guys recommend one's route be as far as languages/technologies are to learn?

I know there is so many web technologies out there that it gets ridiculous like Ajax, Jakarta, Python, etc. So any tips?

I would start your own thread on this. You'll probably get more responses. :)

[richmon22]

a great tutorial site is p2l (http://www.pixel2life.com). it has a bit of everything from everywhere!

[tutubibi]

More color matching tools:

http://colormatch.dk/
http://meddle.dzygn.com/tests/colors/

Not sure if anybody mentioned www.freecsstemplates.org (http://www.freecsstemplates.org/), number of great and free templates there.

[angelneo]

How about adding MAMP and XAMPP, for developers' quick and easy way of getting a server running.

MAMP (http://www.mamp.info/en/home/)
XAMPP (http://www.apachefriends.org/en/xampp.html)

[tominated]

http://dean.edwards.name/IE7/ ! it lets you do stuff with css that normally only works in firefox, safari, etc.

[smellslikedan]

O-WH appears to no longer be a hosting service. You might want to take the link down unless you meant to link to "funny adult videos" ?

[monke]

Thanks for all the links. Got rid of the O-WH link too. :)

[RedTomato]

how about some links to the business side i.e.

- how to write a request for tenders (like I'm currently doing),
- how respond to tender requests,

- how to write progress reports
- how to ensure disablity access

- how to work with companies that hire you to do a website (what they exprect from you, progress stages, contract negotations etc)

- examples of model contracts

[azpalmprincess]

Thanks for all that info...I'm gonna be busy for days! I should have been on here for a long time. Glad I found this.:)

[monke]

Added http://kuler.adobe.com/.

[snickelfritz]

Hosting:
http://www.icdsoft.com/

[giganten]

ies4osx (http://www.kronenberg.org/ies4osx/) is a good program to test your design's in ie on the mac.

[vijay mohan]

wow great links i think these links would be help me in starting my new project.
Thanks a lot.

[a1016neo]

Do you have freewebs.com ???

[Apple]

Which host do you feel is the most mac friendly from the hosting list?

[raythemoneyman]

Thanks for taking the time to put together what is probably the best single source of HTML, CSS, etc. tools anywhere. ;)

[monstordh]

I used to use Cyberduck exclusively for ftp, but it has gotten bulky and unreliable. I have been using FireFTP (http://fireftp.mozdev.org/), a Firefox plugin and it has worked like a charm. Very smooth and responsive.

As for the IE 6x PNG fix issue, the coolest (and best) thing I've seen is DD_belatedPNG (http://dillerdesign.com/experiment/DD_belatedPNG/) by Drew Miller. The only PNG fix I know of that does not require a transparent GIF.

I think you might want to also include a list of opensource CMS apps, my personal favorite being Drupal (http://drupal.org).

Great stuff. Wish I had this when I started! :-)

[Melrose]

I use Eleven2.com (http://www.eleven2.com) for hosting. They've been just about fantastic. Cheap, reliable and fast response on customer service.

Just thought I'd tack this on since no one's mentioned it yet. I'd recommend them regardless, but I do have an affiliate link if you want to spread the love.

[webconferencing]

I use three different hosting services. All of them have their own plus and minus points. I choose web hosting based on how I want to use the site.

[Laslo Panaflex]

http://www.panic.com/coda/ <--- I use this exclusively, got a great workflow going now.

http://www.smashingmagazine.com/ <--- Great site, new posts daily, lots of web related stuff there.

[sebgreen]

JEdit is a great free editor.

Dreamweaver is a great app. Allows beginners and advanced users to create amazing sites

[designgenies]

Here are a few links to get you started
Great work dear......it will really help everyone who is beginner in web design field.....thanks for that.....!!!!!!!

[designgenies]

great information...it will help us out to update our knowledge...good stuffs

Thanks

[Padaung]

I'm a big fan of Freeway - http://www.softpress.com/index.php
Express version is good for my needs, but the Pro version looks very comprehensive. It is similar to Rapidweaver I guess, but I much prefer its user interface. And it's made by a British company :)

When I do need to delve into the code I've been using smultron - http://www.tuppis.com/smultron/

PS Even though Cyberduck is free, I don't think it is still worth using. I couldn't get it to work reliably (multiple attempts to upload), and neither could my sister with her website. We have both now purchased Fetch and are far more sane for it!

[Cteve]

I am a convert to Joomla and I think that anyone starting out with web design should consider using a CMS. They can be a bit daunting but if you invest a few hours getting to grips with the one you finally choose, you will be able to build great sites in no time.

This is a great place to start: opensourcecms.com (http://opensourcecms.com/)

As I said I have used Joomla to build a few sites now, so I could offer advice to anyone who wants to give it a try.

[dmmcintyre3]

I use byethost (http://byethost.com) for hosting.

[angelwatt]

Smashing Magazine came out with a nice write-up for newbs to web design that talks about all of the web related terminology/jargon (http://www.smashingmagazine.com/2009/05/21/web-design-industry-jargon-glossary-and-resources/) that you can run across. It would likely be helpful for those new to the field.

[nomade]

To test your web site on various version of IE on Windoz :

http://www.ipinfo.info/netrenderer/

[roamy]

I think you forgot all the good technologies

1. WebObjects
2. Ruby on Rails
3. Netbeans Visual Web

And if you want to just make a static site Create by Stonedesign is really good

[JGruber]

here are a few I use.

Domains - namecheap.com - used them for 6 years now
Hosting;
site5.com - been with them for 5 years
liquidweb.com - been with them for 7 years

[wfoster]

Web Hosting and Domain Registering:
FastHosts (http://fasthosts.co.uk)
Heart Internet (http://heartinternet.co.uk)

Blogging:
Tumblr (http://tumblr.com)

Programming:
Coda (http://panic.com/coda/)
CSSEdit (http://panic.com/cssedit/)

[shawnwilliams]

Hello to all.
The links which you provided here are very useful in web designing and in development.
I used Dreamweaver for designing and Photoshop for editing photo. And they are best for web designing and development. And for image also seashore can be use.

[Not Available]

Hello to all.
The links which you provided here are very useful in web designing and in development.
I used Dreamweaver for designing and Photoshop for editing photo. And they are best for web designing and development. And for image also seashore can be use.
I'm sorry, my DW CS4 is expensive and buggy, so no, they're not the best combination.

Instead, get yourself GIMP and CoDA, learn to use them, and you've made enough savings for that MBP launching next year :)

Just my ¢2

[roamy]

I'm sorry, my DW CS4 is expensive and buggy, so no, they're not the best combination.

Instead, get yourself GIMP and CoDA, learn to use them, and you've made enough savings for that MBP launching next year :)

Just my ¢2

well actually try FLUX you will probably be a lot happier

[miknos]

It doesn't matter what application you use. A good web designer can make a good website using ANY text editor. To start:

Learn HTML and CSS: There's thousands of places. I recommend htmldog.com (http://www.htmldog.com/).
Manipulating images: I use Photoshop. Pixelmator (http://www.pixelmator.com/) is a great alternative. If you are short on cash try Gimp (http://www.gimp.org/).
Animations: Sorry flash developers but Flash sux! I have many reasons but the first it's because it kills battery life (cpu hog). That's why iPhones don't have it. Flash is widely used today because of video. Newer browsers support html5, so I think big websites like Youtube are going to push that transition (like it did with IE6). Websites (the good ones) use javascript for animation. They don't hog the cpu and are very small, specially when used in jQuery (http://jquery.com/).

Web Development tool? There's many options. The ones I tried:

- CODA (http://www.panic.com/coda/): I love it! Great user interface, It's fast, stable and complete.
- Textmate (http://macromates.com/): Probably the best code editor but I still prefer CODA.
- Dreamweaver: Adobe is adding "new features" making it bloated. Editing CSS is a nightmare and it hurt my eyes watching the default letters in code editor.
- Flux (http://www.theescapers.com/): There's a screencast in developer's website showing how easy is to create a website. I noticed when your webpage gets big, the application get a little unresponsive.
- Espresso (http://macrabbit.com/espresso/): Seems nice like CODA but I called it a beta. Check out in a year to see for an improvement.
- Rapidweaver (http://www.realmacsoftware.com/rapidweaver/): Good when you want to create a website and you have no idea how to do it. It's not expensive but you have to buy many "add-ons".

For CSS: CSSedit (http://macrabbit.com/cssedit/) is the best tool but I can do everything I want without problems in CODA.
----------------------------------------------------------

So you have plenty of options. For me CODA and Photoshop get the work done.

[macsrules]

Best way to have a Mac on a budget:

http://www.insanelymac.com/forum/


Best way to add IChat style feature to your website:

http://www.meebo.com/

Best way to use Meebo with a Chat Application(Adium) on your desktop:

http://adium.im/

Instructions on how to set Meebo up with Adium:

http://www.wiseguydigital.com/wiseguy-digital-blog/adiumx-meebome.html

Best file sharing application:

http://www.vuze.com/

Best free, open source QuickTime component that adds native support for many popular video formats:

http://perian.org/

Best free software addition that plays Window Video's in Safari:

http://www.telestream.net/flip4mac-wmv/overview.htm


Best website to keep updated on the latest Mac products and technologies:

http://theappleblog.com/


Best website for information on tons of Mac software:

http://www.farawaymac.com/

Best Software Tutorial Site on the website bar NONE!

http://www.lynda.com/

Best way to host your own server and get around the blocks that most service providers like Cox Cable block, I.E. port 80.

http://www.dyndns.com/

Best Application for playing weird codex video's

http://www.videolan.org/vlc/

Best way to filter what you and your employee's are able to access through your web connection. Through Router or Computer:

http://www.opendns.com/

Best two free website Video Conferencing added to your web pages for your customers to access you through:

http://www.tokbox.com/

http://www.oovoo.com/

Best Free Open Source do it yourself phone system:

http://www.trixbox.org/

Best way to get a phone number and call or have anyone in the US call you for just around $30 dollars a year.

http://www.skype.com/

Best way to see new software and what others think about this new software:

http://osx.iusethis.com/

Best way to control two Mac's from one computer:

http://www.abyssoft.com/software/teleport/