Blabberbox » 42 » Web Design ResourcesShare on Twitter

Web Design Resources

December 9th, 2006 | Posted by pftq in 42 | #

Learning to web design from the ground up...

  This site was my first real attempt ever at coding a website from scratch. I started this with absolutely no clue as to what I was doing, and to be honest, I still don't really know what I'm doing.
  For those wondering, I use nothing but a simple text editor to type all my code - type the code, yes. You really can't "program" your site if you're using a click-and-drag interface. At most, I'd use Notepad2, which is the same as Notepad on Windows except with highlighting. Anything extra is cumbersome.
  The following are tutorial and resource sites in the order I found them. This site wouldn't be here if I didn't manage to find these. If you're just starting web design, you might want to bookmark a few of these.  Once you're done with those and want to learn actual programming languages like C or Java, check out Programming Resources, which is basically the rest of the path I took after these.

  If you come across more great web design resources, feel free to send them to me. Smiley
PageTutor's HTML Tutorial - This site is the perfect place to start for those completely new to web design - new as in no clue where to even start. The explanations are very well done and easy to understand. It won't teach you everything you need to know, but it gives you the basics so that you can understand what more advanced guides are talking about.
Tizag Tutorials - This one I probably use the most. The explanations are easy to understand on most topics. Reference pages are also available listing tags for HTML and CSS, which are quite useful.
Indenting with HTML - One thing you might notice is that you cannot indent in html. This site analyzes the alternatives so that you can decide what you want to do.
Common Fonts to All Versions of Windows and Mac - One thing with webdesign is that no one will see nice fonts you use unless they also have it on their computer. This is a handy list of what are generally safe fonts (everybody has these).
Tectite.com - Great PHP scripts, notably the FormMail, which is being used on this site for the Email function. Very easy to use and simple install.
Date and Time Format PHP - Handy list for formatting time displays in PHP.
A Simple Guide to .htaccess - List of ways to use the .htaccess file (found in root directory, or make your own) for your site, including redirects, blocking users, etc.
Search Engine Ranking Factors - Useful comprehensive tips on how to build your site to show up well on search engines.
In Search of a Perfect Plugin Technique - Comparisons of various ways to embed Flash while still keeping compliant to W3C standards.
PNG Transparency in IE6 - CSS code to fix PNG transparency in IE5.5 and IE6 browsers.
Adding Background Images to Emails - It turns out emails have yet another HTML standard that they follow (or lack of standard) so to get backgrounds to work in your newsletters, you have to use tricks and workarounds.
HTTP POST from PHP - It features a non-cURL solution to sending POST data directly (without forms) but the comments contain numerous alternative solutions as well.
Ruby in 20 Min - Get the gist of Ruby so you can then proceed to learn Rails.
Ruby Interactive Tutorial - An interactive walkthrough on various Ruby commands.
Rails for PHP Developers - Reference for common scripting bits converted from PHP to Ruby.


And Finally...

W3C Markup Validation Service - Check your page for errors before sharing it with the world wide web.
WDG HTML Validator - Checks your entire site for html errors in one go.
Browsershots.org - Gives you a screenshot of your page from a large variety of browsers (your choice).
IE Tester - If you no longer have IE6 (and you shouldn't), you install this to test how your page would look to those who still do have it.
Silktide - Analyzes your site and determines how well your site is built. Fields include design, accessibility, popularity, and more.
Favicon From Pics - Free tool for converting still images into a Favorites icon for your site. This is the icon in the address bar when someone views your site and the icon people see when they bookmark your site.
Port25 Email Verification - Useful for checking the SPF/DKIM/DomainKeys of your email setup.
Javascript Obfuscate - Tool for encrypting your Javascript source code enough to make it not easy to steal or copy.
Mozilla Observatory - for checking if your site has general security policies/headers set.
Last Updated Jun 2nd, 2020 | 1117 unique view(s)

Leave a Comment

Name: (Have an account? Login or Register)
Email: (Won't be published)
Website: (Optional)
Comment:
Enter the code from image: