Important rules for designers/coders to make people want to hire and recommend you - GoFuckYourself.com

brandonstills · 06-30-2008, 11:25 PM

As a programmer I frequently have designers deliver files to me or I take over projects from a webmaster long gone. I frequently run into similar situations in which designers and coders don't consider how their work will be used further down the line and it causes work to take much longer than it should for future people.

When working in a team environment (or just in general) please keep the following things in mind. They are the difference between a project taking a few days and taking weeks and even months. Following them is the difference between having coworkers recommend you for a project because you are a joy to work with and them asking if someone else can be hired.

1) If the files will need to have code added to them and will eventually be called *.php don't name them *.html. Coders will have to rename EVERY file and update EVERY link on EVERY page and repeat the process EVERY time the designer gives him something new when the code has already been integrated. Name them *.php to begin with.

2) If there is a header and footer that will be the same on every page, put them in a file called header.php / footer.php and include it. Don't repeat the same thing on every single page. If there are changes that need to be made someone is going to have to go through and update 30 pages just to make 1 change. If there is a change made by the designer and the code needs to be reincorporated the programmer has to repeat the whole process again. Something that should take a few hours now takes days.

Copy and paste the common bit into a file, e.g., header.php.

Then instead of repeating the same HTML you can now use <?php include 'header.php'; ?>

That's it, just one line.

I believe Dreamweaver has a template feature that lets you change it once on your end, but please be considerate to people further down the line and people taking over the project later on.

If you need to be able to execute php code locally look into something like XAMPP. It's easy to install.

3) Whenever possible, use relative paths and avoid the trailing '/' at the beginning of an HREF or SRC attribute. Sometimes domains change, they get moved to sub domains, or have to be moved to another directory. Don't use <img src="http://www.thedomain.com/images/theImage.jpg"> use <img src="images/theImage.jpg">. Notice there is no trailing '/' in front of images.

4) Use CSS whenever possible, especially for layout (as opposed to tables). Having to modify things nested 5 tables deep is extremely confusing, time consuming and prone to errors.

5) Make sure your HTML is valid. Run it through a validator tool. I've seen pages where there are opening tags (table, tr, td, div) but no closing tags. It's near impossible to modify the more complex pages without spending hours to make a simple change or throwing everything away and completely rewriting it.

6) I'm surprised I even have to mention this one. If you are using some kind of hierarchy, don't copy the same exact files into every single sub folder. E.g., if each model has a sub folder with an .html page in it, don't copy the nav-banner.jpg into every single sub folder. There should only be 1 nav-banner.jpg on the server, not 1 for each sub folder. Have the HTML use a relative path to refer to it.

7) Deliver the final .PSD files to the owner even if they don't know what to do with them or don't ask for them. Explain what they are for and why they should hold on to them. They may hire someone later down the road and if changes need to be made they basically have to redo the entire site.

8) If the owner is non-technical and you are doing a lot of the server administration give him a summary detailing his login information and where you put things. Don't assume since he forwarded you an email from the host he understands it. Having it summarized will make it much easier for them and will prevent delays in him giving that information to future people.

9) If there are other people working on the project get in contact with them and ask them how they like things delivered and if they like things done in a certain way. This is especially true if the owner doesn't really know the terminology the different people are using. Things get lost in translation and frustrations happen further down the line when things don't get properly communicated and they aren't what someone expected.

10) If you know multiple people are working on different parts and will probably use the same folder names (e.g., 'images') or things will end up in the same folder make yours unique. If your company is called My Design Company use 'MDC_images' or maybe 'MDC/images' instead of 'images'. If it's for a tour use 'tour_images' or put all your stuff into a sub directory called 'tour'.

11) Keep design images stored in a different folder than demo content images. E.g., if the owner gives you some photos to use on the tour and you know he will change them out later on don't co-mingle them with the design images, put them in a separate folder. This is especially important if images might be named the same as some of your design images.

I'm sure there are many other things, these are just a few of them I have run across. If anyone else has further recommendations I'm sure we'd all love to hear them.

Tempest · 07-01-2008, 12:00 AM

Keep in mind that this list is just one persons perspective.. Other coders will have things they agree and disagree with..

For example:

#1 - I don't necessarily agree with that. In this day and age, adding script to a page does not mean it has to be .php. In fact, some hosts already have .html set to effectively be php pages. IMO "scripts" should be .php.. Sites themselves should be .html even if they're basically generated via scripts. Directory type sites could be php, but nowadays everyone is using mod_rewrite so that the underlying code can be php but what the surfer sees is .html.

#3, having the domain in urls on the page has some benifits. The coder should have an initialization module that gets called for every page that sets a variable to something like "baseurl".. Then all the links on the page can insert that variable. A good coder will be able to swap out hardcoded domains within a few minutes to an hour depending on the qty.

But overall it's a decent list. #6 is so common it's scary.. Always see that with real noobs. The other thing I really hate is all the files, images etc. that gets put on sites that are no longer used and no one purges them.. Takes a long time to figure out whether they're really required or not.

Babaganoosh · 07-01-2008, 12:05 AM

Show your programming prowess and write a function that condenses all of that into a single paragraph.

k0nr4d · 07-01-2008, 12:12 AM

Quote:

Originally Posted by brandonstills

As a programmer I frequently have designers deliver files to me or I take over projects from a webmaster long gone. I frequently run into similar situations in which designers and coders don't consider how their work will be used further down the line and it causes work to take much longer than it should for future people.

When working in a team environment (or just in general) please keep the following things in mind. They are the difference between a project taking a few days and taking weeks and even months. Following them is the difference between having coworkers recommend you for a project because you are a joy to work with and them asking if someone else can be hired.

1) If the files will need to have code added to them and will eventually be called *.php don't name them *.html. Coders will have to rename EVERY file and update EVERY link on EVERY page and repeat the process EVERY time the designer gives him something new when the code has already been integrated. Name them *.php to begin with.

2) If there is a header and footer that will be the same on every page, put them in a file called header.php / footer.php and include it. Don't repeat the same thing on every single page. If there are changes that need to be made someone is going to have to go through and update 30 pages just to make 1 change. If there is a change made by the designer and the code needs to be reincorporated the programmer has to repeat the whole process again. Something that should take a few hours now takes days.

Copy and paste the common bit into a file, e.g., header.php.

Then instead of repeating the same HTML you can now use <?php include 'header.php'; ?>

That's it, just one line.

I believe Dreamweaver has a template feature that lets you change it once on your end, but please be considerate to people further down the line and people taking over the project later on.

If you need to be able to execute php code locally look into something like XAMPP. It's easy to install.

3) Whenever possible, use relative paths and avoid the trailing '/' at the beginning of an HREF or SRC attribute. Sometimes domains change, they get moved to sub domains, or have to be moved to another directory. Don't use <img src="http://www.thedomain.com/images/theImage.jpg"> use <img src="images/theImage.jpg">. Notice there is no trailing '/' in front of images.

4) Use CSS whenever possible, especially for layout (as opposed to tables). Having to modify things nested 5 tables deep is extremely confusing, time consuming and prone to errors.

5) Make sure your HTML is valid. Run it through a validator tool. I've seen pages where there are opening tags (table, tr, td, div) but no closing tags. It's near impossible to modify the more complex pages without spending hours to make a simple change or throwing everything away and completely rewriting it.

6) I'm surprised I even have to mention this one. If you are using some kind of hierarchy, don't copy the same exact files into every single sub folder. E.g., if each model has a sub folder with an .html page in it, don't copy the nav-banner.jpg into every single sub folder. There should only be 1 nav-banner.jpg on the server, not 1 for each sub folder. Have the HTML use a relative path to refer to it.

7) Deliver the final .PSD files to the owner even if they don't know what to do with them or don't ask for them. Explain what they are for and why they should hold on to them. They may hire someone later down the road and if changes need to be made they basically have to redo the entire site.

8) If the owner is non-technical and you are doing a lot of the server administration give him a summary detailing his login information and where you put things. Don't assume since he forwarded you an email from the host he understands it. Having it summarized will make it much easier for them and will prevent delays in him giving that information to future people.

9) If there are other people working on the project get in contact with them and ask them how they like things delivered and if they like things done in a certain way. This is especially true if the owner doesn't really know the terminology the different people are using. Things get lost in translation and frustrations happen further down the line when things don't get properly communicated and they aren't what someone expected.

10) If you know multiple people are working on different parts and will probably use the same folder names (e.g., 'images') or things will end up in the same folder make yours unique. If your company is called My Design Company use 'MDC_images' or maybe 'MDC/images' instead of 'images'. If it's for a tour use 'tour_images' or put all your stuff into a sub directory called 'tour'.

11) Keep design images stored in a different folder than demo content images. E.g., if the owner gives you some photos to use on the tour and you know he will change them out later on don't co-mingle them with the design images, put them in a separate folder. This is especially important if images might be named the same as some of your design images.

I'm sure there are many other things, these are just a few of them I have run across. If anyone else has further recommendations I'm sure we'd all love to hear them.

I gotta say, I disagree on some of this.

1) I prefer to just be given a couple of html files written in tableless css and derive my own templating system from this.

2) It takes about 5 minutes to make a header and footer.php. I prefer to do it myself so I know its done right. Find the content area, everything about it goes in header.php, everything below it goes in footer.php. Done.

3) I love it if people do this, because most scripts nowadays require seo friendly urls, thus using mod_rewrite. If they don't start every img src with a /, i have to go through and do it so that the images aren't all broken everywhere.

BV · 07-01-2008, 12:42 AM

Some very good advice. I'm guilty of many of them at some point in my career, and even now.

I still use too many tables.

It's hard to teach and old dog new tricks.

\\

Ecchi22 · 07-01-2008, 01:02 AM

Nice tips or *rules* whatever you call them ;)

Deej · 07-01-2008, 01:16 AM

nice set of tips...

brandonstills · 07-01-2008, 01:16 AM

Quote:

#1 - I don't necessarily agree with that. In this day and age, adding script to a page does not mean it has to be .php. In fact, some hosts already have .html set to effectively be php pages. IMO "scripts" should be .php.. Sites themselves should be .html even if they're basically generated via scripts. Directory type sites could be php, but nowadays everyone is using mod_rewrite so that the underlying code can be php but what the surfer sees is .html.

This is true, however .html is often output from a dynamic system as a cached version so you would be firing up the php interpreter needlessly, increasing server overhead and slowing down the site if it had a lot of traffic. If you look at the Ruby on Rails .htaccess you will see that if it's .html or .jpg or some other static file it serves it up instantly (especially useful if you use a fast http server like nginx) and if it's not then it runs it through it's routing rules and does the dynamic part.

Quote:

#3, having the domain in urls on the page has some benifits. The coder should have an initialization module that gets called for every page that sets a variable to something like "baseurl".. Then all the links on the page can insert that variable. A good coder will be able to swap out hardcoded domains within a few minutes to an hour depending on the qty.

I use baseurl in my code, problem is you need to substitute what you are given and add it. Problem is you have to change it. If it was done right, there wouldn't be a need to change anything at all.

Quote:

But overall it's a decent list. #6 is so common it's scary.. Always see that with real noobs. The other thing I really hate is all the files, images etc. that gets put on sites that are no longer used and no one purges them.. Takes a long time to figure out whether they're really required or not.

I've seen it here and there, surprising that you say it's common. Definitely scary then.

Yes, purging old stuff is definitely nice. Nothing like taking 8 hours to download a site when in reality it should only take 20 minutes if you delete all the old crap that nobody knows what it is and that's not doing anything. lol

Zorgman · 07-01-2008, 02:30 AM

Quote:

Originally Posted by k0nr4d

2) It takes about 5 minutes to make a header and footer.php. I prefer to do it myself so I know its done right. Find the content area, everything about it goes in header.php, everything below it goes in footer.php. Done.

That's what we do with TEVS. h.php and f.php. Makes it so much easyer if you have tons of files and even if you don't. Editing 1 file and it changes the whole site saves so much time.

JamesK · 07-01-2008, 03:13 AM

Nice tips for new designers.

RedShoe · 07-01-2008, 03:25 AM

#7. This should be branded on every webmasters, designers, hosts, and their children and grandparents foreheads for many generations to come.

As a video editor, I can't tell you how many times I've asked for the original PSD's to construct animations based on the design, and what do I get??? A flattened PSD file.

Tempest · 07-01-2008, 03:28 AM

Quote:

Originally Posted by RedShoe

#7. This should be branded on every webmasters, designers, hosts, and their children and grandparents foreheads for many generations to come.

As a video editor, I can't tell you how many times I've asked for the original PSD's to construct animations based on the design, and what do I get??? A flattened PSD file.

Add font files to that as well... Pretty useless if they use some font that you don't have or can't find.

tranza · 07-01-2008, 06:49 AM

Thanks for sharing!

brandonstills · 07-01-2008, 11:31 AM

Quote:

Originally Posted by k0nr4d

3) I love it if people do this, because most scripts nowadays require seo friendly urls, thus using mod_rewrite. If they don't start every img src with a /, i have to go through and do it so that the images aren't all broken everywhere.

mod_rewrite is slow. Especially for images which are requested extremely frequently compared to their php/html counterparts. It's fine to do that for low end sites, but for anything that gets a lot of traffic you are going to be taking up server resources needlessly. I don't see what advantage adding / in front of an image src can have. SEO is for pages, not images, there's no indexable content in images.

plus · 07-01-2008, 07:59 PM

wow.. that's something useful tips

07-01-2008, 03:13 AM	#10
JamesK hi Industry Role: Join Date: Jun 2002 Posts: 16,731	Nice tips for new designers. __________________ M3Server - NATS Hosting

07-01-2008, 03:25 AM	#11
RedShoe 赤い靴 call me 202-456-1111 Industry Role: Join Date: Feb 2001 Location: The Valley Posts: 14,831	#7. This should be branded on every webmasters, designers, hosts, and their children and grandparents foreheads for many generations to come. As a video editor, I can't tell you how many times I've asked for the original PSD's to construct animations based on the design, and what do I get??? A flattened PSD file. __________________ SPECIALTY COSTUMES • PROPS • FX Superheroes • Monsters • Robots PM for details For any manufacturing needs. Adult or otherwise. aka BonsHigh on Insta Bonsai weed plants

07-01-2008, 06:49 AM	#13
tranza ICQ: 197-556-237 Join Date: Jun 2003 Location: BRASIL !!! Posts: 57,559	Thanks for sharing! __________________ I'm just a newbie.

07-01-2008, 07:59 PM	#15
plus Confirmed User Join Date: Oct 2004 Posts: 180	wow.. that's something useful tips __________________ http://www.8plusfolio.com ICQ 481056793 E-Mail [email protected]

06-30-2008, 11:25 PM	#1
brandonstills Confirmed User Join Date: Dec 2007 Location: Chatsworth, CA Posts: 1,964	Important rules for designers/coders to make people want to hire and recommend you As a programmer I frequently have designers deliver files to me or I take over projects from a webmaster long gone. I frequently run into similar situations in which designers and coders don't consider how their work will be used further down the line and it causes work to take much longer than it should for future people. When working in a team environment (or just in general) please keep the following things in mind. They are the difference between a project taking a few days and taking weeks and even months. Following them is the difference between having coworkers recommend you for a project because you are a joy to work with and them asking if someone else can be hired. 1) If the files will need to have code added to them and will eventually be called .php don't name them .html. Coders will have to rename EVERY file and update EVERY link on EVERY page and repeat the process EVERY time the designer gives him something new when the code has already been integrated. Name them *.php to begin with. 2) If there is a header and footer that will be the same on every page, put them in a file called header.php / footer.php and include it. Don't repeat the same thing on every single page. If there are changes that need to be made someone is going to have to go through and update 30 pages just to make 1 change. If there is a change made by the designer and the code needs to be reincorporated the programmer has to repeat the whole process again. Something that should take a few hours now takes days. Copy and paste the common bit into a file, e.g., header.php. Then instead of repeating the same HTML you can now use <?php include 'header.php'; ?> That's it, just one line. I believe Dreamweaver has a template feature that lets you change it once on your end, but please be considerate to people further down the line and people taking over the project later on. If you need to be able to execute php code locally look into something like XAMPP. It's easy to install. 3) Whenever possible, use relative paths and avoid the trailing '/' at the beginning of an HREF or SRC attribute. Sometimes domains change, they get moved to sub domains, or have to be moved to another directory. Don't use <img src="http://www.thedomain.com/images/theImage.jpg"> use <img src="images/theImage.jpg">. Notice there is no trailing '/' in front of images. 4) Use CSS whenever possible, especially for layout (as opposed to tables). Having to modify things nested 5 tables deep is extremely confusing, time consuming and prone to errors. 5) Make sure your HTML is valid. Run it through a validator tool. I've seen pages where there are opening tags (table, tr, td, div) but no closing tags. It's near impossible to modify the more complex pages without spending hours to make a simple change or throwing everything away and completely rewriting it. 6) I'm surprised I even have to mention this one. If you are using some kind of hierarchy, don't copy the same exact files into every single sub folder. E.g., if each model has a sub folder with an .html page in it, don't copy the nav-banner.jpg into every single sub folder. There should only be 1 nav-banner.jpg on the server, not 1 for each sub folder. Have the HTML use a relative path to refer to it. 7) Deliver the final .PSD files to the owner even if they don't know what to do with them or don't ask for them. Explain what they are for and why they should hold on to them. They may hire someone later down the road and if changes need to be made they basically have to redo the entire site. 8) If the owner is non-technical and you are doing a lot of the server administration give him a summary detailing his login information and where you put things. Don't assume since he forwarded you an email from the host he understands it. Having it summarized will make it much easier for them and will prevent delays in him giving that information to future people. 9) If there are other people working on the project get in contact with them and ask them how they like things delivered and if they like things done in a certain way. This is especially true if the owner doesn't really know the terminology the different people are using. Things get lost in translation and frustrations happen further down the line when things don't get properly communicated and they aren't what someone expected. 10) If you know multiple people are working on different parts and will probably use the same folder names (e.g., 'images') or things will end up in the same folder make yours unique. If your company is called My Design Company use 'MDC_images' or maybe 'MDC/images' instead of 'images'. If it's for a tour use 'tour_images' or put all your stuff into a sub directory called 'tour'. 11) Keep design images stored in a different folder than demo content images. E.g., if the owner gives you some photos to use on the tour and you know he will change them out later on don't co-mingle them with the design images, put them in a separate folder. This is especially important if images might be named the same as some of your design images. I'm sure there are many other things, these are just a few of them I have run across. If anyone else has further recommendations I'm sure we'd all love to hear them. __________________ Brandon Stills Industry and programming veteran [email protected] \| skype: brandonstills \| ICQ #495-171-318

07-01-2008, 12:00 AM	#2
Tempest Too lazy to set a custom title Industry Role: Join Date: May 2004 Location: West Coast, Canada. Posts: 10,217	Keep in mind that this list is just one persons perspective.. Other coders will have things they agree and disagree with.. For example: #1 - I don't necessarily agree with that. In this day and age, adding script to a page does not mean it has to be .php. In fact, some hosts already have .html set to effectively be php pages. IMO "scripts" should be .php.. Sites themselves should be .html even if they're basically generated via scripts. Directory type sites could be php, but nowadays everyone is using mod_rewrite so that the underlying code can be php but what the surfer sees is .html. #3, having the domain in urls on the page has some benifits. The coder should have an initialization module that gets called for every page that sets a variable to something like "baseurl".. Then all the links on the page can insert that variable. A good coder will be able to swap out hardcoded domains within a few minutes to an hour depending on the qty. But overall it's a decent list. #6 is so common it's scary.. Always see that with real noobs. The other thing I really hate is all the files, images etc. that gets put on sites that are no longer used and no one purges them.. Takes a long time to figure out whether they're really required or not.

07-01-2008, 12:05 AM	#3
Babaganoosh ♥♥♥ Likes Hugs ♥♥♥ Industry Role: Join Date: Nov 2001 Location: /home Posts: 15,841	Show your programming prowess and write a function that condenses all of that into a single paragraph. __________________ I like pie.

07-01-2008, 12:42 AM	#5
BV wtf Industry Role: Join Date: Sep 2001 Location: Bikini State, FL USA Posts: 10,914	Some very good advice. I'm guilty of many of them at some point in my career, and even now. I still use too many tables. It's hard to teach and old dog new tricks. \\

07-01-2008, 01:02 AM	#6
Ecchi22 Too lazy to set a custom title Industry Role: Join Date: Nov 2005 Posts: 10,012	Nice tips or rules whatever you call them ;) __________________

07-01-2008, 01:16 AM	#7
Deej I make pixels work Industry Role: Join Date: Jun 2005 Location: I live here... Posts: 24,386	nice set of tips... __________________ Deej's Designs n' What Not Hit me up for Design, CSS & Photo Retouching Icq#30096880