What is the purpose of “Redesigning”?

The main purpose of a redesign is to be hip, or be “trendy”. If you see your competitors with new looking sites that are very visual and has a lot of functions, then surely in this generation, people are most likely going to view that site. And so, people/companies feel the need to update themselves so they can be in competition with everyone in addition to making their new site fit their brand and style as well as attending to their audience.

Sometimes people redesign in order to include a new addition to their community. If you run a ice cream store that recently acquired a cookie company, then most likely you want your site updated to match your new company.

Redesigning is a great thing to do to put a new life on an old site and give yourself a new image as well as giving your audience something to stare at.

Why design when you can replace/reuse?

What’s the use in designing when you can simply replace and reuse some old content, or old framework. It’s much easier and faster to redesign over something than to completely start from scratch. With this in mind, you already know what works, what doesn’t, what fits, what’s going to be a pain to code, and finally, you’ll know if it looks good since you can use the old site as a base.

As you may have seen on this site, there isn’t anything new other than a new background, the navigation moved down, and some shadows here and there. It’s the same site structure, but completely different look. Most people find it hard to design something new when in reality they can look at it in a different perspective and think of it as a redesign.

Redesigning in a Developer’s Mindset

The magic behind redesigning is the fact that you should keep the coding in mind at all times. When redesigning, you want to imagine how it’ll replace the code. Do they need to add something complicated, or can the extra pictures be just an extra div? As a designer and developer, it’s very easy for me to know and estimate how easy it is to code the new design and how complicated it’ll be because I’ve built the original base.

Redesigning in a Designer’s Mindset

When a designer tries to redesign, sometimes they don’t think about things like existing content, coding structure, etc… When they are told to redesign, they are opted to completely redesign it in order to surprise and give a whole new look. Pretty much a complete makeover. This leads to problems as it extends the coding process to a much longer period of time and not to mention a few graphical problems that may not be easy to fix with coding and so the redesigning process may have to be fixed.

Case Study: Soshified

Let’s look at this wonderful transition.

Soshified is a community forum based off a Korean female group called So Nyuh Shi Dae or SNSD for short. Originally, they’re design was simple at first. I can’t exactly remember what it was, however, the main thing, is they built it off from Invisionboard’s main framework which probably looks similar to this:

And their new redesign looks like:

Definitely a lot of features added than the normal look. Again, I’m not sure of their original layout so those features were probably already made, and they simply redesigned over it. From a normal person’s perspective, I’d think this was a whole new site and not an Invision board. And so remember, platforms are platforms. They run the site, but definitely not all looks the same. They may be structurally designed and layout the same, but the tip to redesigning are colors, placement, typography, and details.

What’s the verdict?

Was this completely coded from scratch and had a lot of problems, or was it a simply redesign pertaining to a few guidelines. That mystery will always be held by the designers and developer themselves.

Fooling the Audience (Clients)

And so designers/developers aren’t just designers and developers. The major talent that I believe we have is the skill to make an impression on the web whether it be a simple thing or a complicated thing. Not many people will know whether we took 5 minutes to do it or 5 hours to do it. In the end, it’s the end product that matters, and if it’s what people like, then our goal has been reached.

The New Direction and the Problems that existed

I’ve always wanted to just blog without any restrictions or worrying about being grammatically correct or having visuals. I wanted to blog about my day, blog about something I’ve seen or experienced, or talk about a topic that came up in my life. However, at the same time, I also wanted to really have a nice looking blog that can show off tutorials, resources, inspiration in a very simple and minimalistic style so that others can have another reason to visit my site. When I first began blogging, I thought going minimalistic was my style. However, it was quite odd for me to always write down the sites that are very heavily designed with lots of graphics and unique layouts to use as inspiration.

n.design studio by Nick La

the Oleg Blog by Oleg Kostuk

So how can I accomplish both?

Sometimes, the solution to a problem, is to just simply go both ways. I could not find any balance between my two state of minds. As a result, I’ve designed a certain look for my personal blog, and I’ve designed a certain look for the design section of my site. Normally, I’m not a big fan of doing that, but I’ve made the decision to stick with it and do it. Who cares what people think. I’m paying for my site’s domain, my host, my living…I can do whatever I want right?

So that’s the premise to my new outlook on my site. Personal, yet a source of knowledge to other designers alike.

The Slight Restriction to Redesign

For those thinking of redesigning, it’s actually more thoughtful than you may think. It’s not a matter of just making a new layout and then just coding. You have plenty of things to worry about. What about your old posts? What about your viewers? How about all those images that you’ve cropped just for the old layout? How are you going to organize all the plugins in your layout? How are you going to code it without making a mess?

With those questions in mind, you’re restricted in redesigning your site. That’s why when I started to redesign, I took screenshots of my old blog and used the old content to mockup a similar design, but as you can see I did a little change. I know I wouldn’t be up to re-cropping images, so I definitely had to find some way to keep my image sizes, but make my design more interesting. And so I went with drop shadows and a background to distinguish between posts and also the sidebar. To further add to that focus, I even darkened the shadows of the post when you hover over them.

As for navigation, I went for a more expanded view. I’d figure, if people want to see tutorials, they should just click on tutorials, the same with everything else. The major things you’ll see on this blog are Tutorials, Resources, and Inspiration (and also my journal). So there isn’t really a need for a dropdown showing all the categories that are in this site. If users are looking for anything particular, that’s what search bar is. I want to stick to a true minimalistic design and a laid back user experience. Again, if people are looking for photoshop tutorials, then they can just search for it and find it easy.

Development & Functionality

Another obstacle in the road is the development and functionality. How is this blog going to function, are there going to be new things implemented? The more features there are, the more development, research, and experiments (including the problems that will appear) there will be. I certainly didn’t want to over extend a simple blog. Of course, I see those other blogs out there with crazy jQuery effects, and sliders. To me, those are things I can certainly add in the future, but it’s not needed. Again, I opted for a simple look and functioning blog.

However, the only change in development that I’ve used was the change in wordpress frameworks. Prior to this design, I’ve used the Themeshaper’s Thematic Framework. Great framework, very flexible, great support and purely nothing wrong with it. I’ve even used it to design Vtension’s site as well and it’s still holding up (besides some minor fixes that I need to apply to it). So why did I change?

When designing or developing, it’s always best to design with a tool that you can use comfortably. Why use Joomla if you can do Wordpress? Why use Illustrator if you can use Photoshop? There isn’t really a rule to what you can use to design or develop something. If you’re familiar with something, use that. Don’t spend the extra time to learn something new just because you hear good things about it. (Exclude the fact that sometimes you do have to learn something new if it’s directed in a job to do something in Joomla or use a specific tool, etc..)

So I used my own wordpress framework temporarily named CLE Framework. It’s basically a blank wordpress template with my preferred way of layout, divs, id and class names, and certain functions I like such as dynamic body classes. By using my own framework, I was able to quickly code my layout design in a short period of time without having to do research or running into foreign problems that may exist with another framework.

Implementing the Design and One tiny/huge Problem

So how can I implement my design and see how it looks? I had in my mind to just do it on a subdomain, and hope everything looks nice when I activate the theme. However, I thought to myself, there must be a way for me to code my design using my existing content, so that I can see how it looks and adjust certain changes so that my content will fit without it looking messed up.

I’ve come across a plug-in called Theme Switch and it does just that. It allows you to switch themes in an instant and one of the best part of it is…you have the control of who sees it. And so, I made it so that the admin can only see a certain theme, and I was able to see the new theme and code it using my existing content. This saves a lot of time and trouble as I can fix a lot of things to match my content.

By doing this, I’ve found out a huge problem when it came to a certain page template….the Single Post Template. On my old layout, it was designed to contain a bigger image than the thumbnail, which happens to be a 80px difference, which means, the picture was extending way too far out of the Post containing div, and also even crossed over to the sidebar section. So I needed a fix for this, and remember, I didn’t want to re-crop pictures. So luckily the dynamic body classes came to help and I’ve designed the single posts page to have a different look, and function.

As you can see, the post body is bigger to contain the big images, and on the right you’ll have a list of options such as to Share the Post, or see Related Posts. This adds some easy to use navigation and user experience for those viewers that like to share the entry to their friends/followers and also browse for more topics that are related. (By the way, I’m using YARPP to display the Related Posts. Great Plugin and very customizable)

Everything’s Done, and Ready to be live

After I got the site to be about 90% done, I decided to let it live. The more I coded the more I just said, “Let’s just do it”. Again, my blog, my site, it’s time to just show it and let it live. If there are mistakes, there are mistakes. (I’m sure Internet Explorer has some major flaws, but I don’t use that browser, and you shouldn’t either). And there you have it. My process to redesigning my site to make it look different yet fit with my old layout. As you can see, I also designed the journal portion to be way different, and it has a different feel to it, which is what I’m aiming for.

Thanks for everyone that’s been patient with me, and thanks to those that motivate me to do this. Special thanks to Vtension for her advice on my designs and as inspiration for me to do this, and as always a great designer herself. I hope everyone enjoy the new outlook and direction, and if there are any feedbacks, suggestions, bugs, errors, feel free to let me know.

It’s time to become a hybrid.

What’s a Hybrid?

Now, I’m not talking about those new cars these days. A hybrid by definition (courtesy of Google) is a mixture of different parts into one whole thing. We’re not talking about just physical parts here, we’re talking about skills. So if you’re strong or knowledgeable in many different aspects, then you’re a hybrid. But you have to be careful thinking whether you’re a strong hybrid or a weak one.

You may be asking yourself…”What’s the difference?”

Let’s say, you’re strong in graphic design, and then randomly you’re strong in writing documents. Now, honestly, there isn’t much wrong with having those skills, but it’s definitely weak in the sense, you can’t apply the full potential of your graphic design skills to writing (although that can be debated). While on the other hand, if you were strong in graphic design, and then strong in web design, the two skills integrate with each other as you can use your principles in design to apply it to templates, and graphics that you would see on websites.

I believe that there is a correlation of skills that must be learned and taught efficiently to become a good hybrid. Designers would need to learn how to design websites, and code them. Modelers would have to learn how to model and texture everything instead of just being generalized in one field. Web developers should learn how to design and use photoshop to make templates for their own projects.

We want to make a person not just great in their one field of interest, but also good in the other fields related.

Why be a Hybrid?

Now, the most popular argument against hybrids and jack-of-all trades is this:

You’re just a jack of all trades. You know a lot, but you’re not an expert in any one of your skills.

True. I’m not going to argue. It’s obvious that a hybrid isn’t good in one skill when put into comparison of an expert in that field. However, that’s not what I’m telling you to be. I’m a strong believer that you must have ONE field that you are strongly happy to be in and know a lot about. However, what I am talking about is expanding that knowledge to related fields. For instance, if you’re a really good Programmer in C++, or some obscure language. Why be the best in that language, if you can also pick up other languages easily? Most programming languages contain or follow the same logic, keywords, and syntax. It’s almost stupid to just specialize yourself in one language. Here’s my argument to the above statement:

It is true that jack of all trades aren’t skilled in one whole field. However, that’s not the point. I want specialists to become hybrids. This doesn’t weaken their main skill. It strengthens it.

Why be a specialist? You’re only limiting yourself. A human brain has a capacity of probably 1-10 TB. Yeah, Google does wonders when trying to find information about the brain. However, that’s not helping my case, more just something intriguing to think about. If your brain is a computer like that, and we all know that brains are more complex in terms of the algorithms it uses to make your body function, there is no reason why you can not use that extra space to learn something new, or at least something related in your field so that it’s really not all that new (more like just adding an extra plugin to Photoshop).

The Advantages

So what’s this big advantage you get with being a hybrid? Your job search is more broad, and much easier. How? Let’s say, you’re a graphic designer. Obviously you want to get some jobs dealing with graphic design. Newsflash….You just limited yourself half the job market. From the trends I see, most people aren’t looking for just graphic designers. They want web designers, people that can maintenance websites, people that can manipulate photos, people that can code simple website, or create storyboards.

For me, my intention was a graphic design job. And where did I end up? I’m doing web design. Web design doesn’t just encompass graphic design and coding. You’d be surprised by the amount of stuff that entails in my job that I had to learn from my work, and by myself. Let’s list some examples. Remember, I’m just a graphic designer (technically not, I graduated from college with a BA in Game Design, so this is a prime example of how hybrids are)

Main Skill that I worked on
Photoshop (I don’t really call myself a graphic designer, but really the main skill I know is Photoshop)

Other skills I had to learn and be good in
Web Design
Print Design
XHTML/CSS
Illustrator
Flash Animation
Flash Website Programming
Javascript/Jquery
Wordpress
MovableType
Joomla
MySQL (How to make databases and import/export queries)
PHP (Basic coding)
Hosting Information/FTP (How to deal with it and get into people’s FTP)
and more on the way

You can definitely see a lot of skills that integrate and relate with one another, and overall they all build up a good library of information and turns you into a powerful tool that companies can use.

Honestly, from an employer’s point of view, if I can hire a person for $15 an hour, who would I chose? A person that knows how to do just Photoshop, or someone that knows how to do Photoshop, word processing, simple web programming, and a little of flash? As an employer, I’m going to get that hybrid, not only because he/she fulfills the spot that I need which is a Photoshop user, but I can abuse his/her other skills as well, and still only have to pay $15 an hour.

It’s a dirty trick by employers, but in today’s economy, they have to play smart with their money to grow their business. Plus, it’s not like you should feel abused. You should feel happy that you got the job, and you’re doing things you like to do. Not to mention, in the long run you’ll get raises and bonuses because of your hard work and skill set.

As the saying goes, your hard work pays off in the long run.

The Disadvantages

To all advantages, there are disadvantages. So what are disadvantages from being a hybrid? The obvious choice would be the whole good in all, great in none. For many college students and perhaps other people, that’s something you don’t want to get yourself into. You don’t want to go through college and through your life and say “Well, I’m pretty okay in a lot of things, but I’m not sure what I really want to do”. One day during your schooling or perhaps very late after your graduation, you need to sit down yourself and say, “Okay, I’m going for this, and going to strengthen that skill more than any”.

Trust me, I’ve been there.

My Experience

Based on my past, I wanted to do something dealing with programming even though I started graphics by making forum signatures back in my sophomore year in high school. I went to Collins College to pursue a degree in Game Design, most specifically programming games. However, I lost interest in it and felt like I wasn’t strong with it. I took visits with Career Services, and they analyzed my skill set and what I was really strong with. And overall, it lead to something dealing with design, and somehow it got to the point where I was aiming for doing interfaces for games. As I went through school more (this was about a term or so before graduation), I finally got some freelance jobs doing graphic design, and suddenly I fell in love doing it. And, I decided to go more broader than just interface design and just get into graphic design or really anything dealing with Photoshop (that’s pretty broad, right?).

And eventually, Career Services landed me a job with IntotheDarkroom based on my design skills. I really had no clue it was a web development firm. Of course I did my research of the company before I got there. During the interview, it went smooth, they asked about my skills, what I know, and such. A week later, I got a call for the job. And during my stay with this job, I learned a great amount from all my co-workers and have a fun time doing it. In addition, having a job that I love to do, gave me the incentive to even go home after work and learn even more in the field.

Conclusion

Whether you want to take the chance to become a hybrid or stick to what you’re doing, you do have to realize that it’s a fighting market out there. A lot of times in terms of designers and that industry, a designer is expected to know more than just Photoshop and Illustrator. Therefore to give yourself a better advantage in the job selection, you should expand your skills. I don’t want you to forget your main skill so you can concentrate on other things. Remember, keep it related and that’ll make your main skill so much stronger.

Got any comments, rebuttal, disagreements, or experience you would like to add? Feel free to comment below.

Subscribe and follow me on twitter @creativele for more updates and case studies.

In this sense, web designers and developers, graphic designers, and artists are pretty much spamming everything they have to get that presence online in the social media market.

Why should you join?

What is Social Media?

Twitter – Facebook – Myspace

What do they have in common? You’ve heard of them.

Social Media has been called the newest trend or revolution that has been influencing many people in the world. Whether you’re a teenager, a web designer, a CEO of a company, or even a parent, social media helps connect people from all over the world. Social sites such as Myspace, Facebook, and Twitter has been around for a long time. Some people were reluctant in signing up because of time issues, or mainly because they think it’s a waste of time.

It wasn’t until later in the times when more people started to use social media for more than what it was made for. Of the many uses, the most viral at the moment is marketing.

Social Marketing

Marketing – the commercial processes involved in promoting and selling and distributing a product or service.

Now, before you say that you’re not a company or you’re not selling something, in actuality you are: Yourself. I’m not saying, selling your physical self, but marketing yourself in a way to be known to other people. As a freelancer (whether design related or not) this is perfect since you can market yourself as a designer or developer to other people and perhaps you can make some connection with people that may need your service. Otherwise, other people simply use it as a popularity tool in some sort to make themselves more known in the world.

Personally, I’ve experienced a liking to the social media world. Being surrounded by constant news, articles, and people that all enjoy a certain subject makes me more aware of the trends that are going on and even learn a lot about my profession. Everyone has work to do, people have jobs, or people spend time with their family.

Where’s the time where you can research, experiment, or find resources?

What if you don’t know how to do something?

Social Media sites has all the news for you. People in their spare time would share what they find on the internet with their users. This is really helpful for me because I can get all the great design and coding news without putting effort into it. All I have to do is go on twitter, and I’m greeted with many tweets that are related to my field. In addition, I can even shout out something, and surely enough, people will answer. (Very sensitive thing to say because it also depends on who you follow or who follows you)

How do I start?

You start by signing up to social media sites or follow blogs. You need to be captivated into talking with other people whether by messaging them or commenting. It does not hurt you to ask a real professional on what suggestions they may have for solving a problem you may have. Start small. Don’t sign up to 5 different sites thinking you can get something big out of it. My suggestion is to start with Twitter. It probably is one of the best tools to use out there for contacting other people and getting resources. You can follow the same steps that I did with my twitter.

1. Sign up for an account. – http://twitter.com

2. Follow people that have interesting things to share. Search for what you want to know, or what you want to learn.

3. Follow your friends if they have one, have them follow you. Follow other people online.

4. It’s okay to follow a lot of people but not have a lot of followers. The purpose at the moment is to gather resources to be inspired and learn more about your field.

5. Once you feel like you’re ready, start “tweeting“. Give compliments to people’s articles, Retweet other people’s tweets. They’ll notice your nice gesture and even reply back or better yet, follow you back.

6. Golden rule applies. Treat others how you want to be treated. Don’t ignore people’s mention. If they took the time to mention you, mention them back. Have fun with it, have a conversation. DM some people with questions, and you’ll get answers. However, don’t be annoying and start spamming everything. People are turned off if you twitter unnecessary things.

And don’t just follow people, and re-tweet their stuff like a brain-dead person. Actually go to that link, read the article if it interests you. I only re-tweet things that interests me and something that I really recommend to other people. For example, if there was a Wordpress Plugin that I really like and I used it, then I’m going to recommend that to everyone.

Step 2

Rinse and repeat with other sites. Honestly the best way to be involved in social media is to twitter and maybe also facebook. Facebook seems more personal, in that it connects you with friends and families. Nevertheless it does help you market yourself as sometimes your friend will look up to your for advice, or a friend of that friend will need some service. Dedicate some time to just catch up with people, and don’t forget to dedicate time to actually reply to messages you may have gotten.

Blogging

I’ll keep this section short as I do want to make a post specifically for blogging. However, for now, I do want to promote the use of blogs. Blogging is probably the most trendy thing that’s happening now. Everyone blogs about everything whether it’s about design, art, tech stuff, beauty, etc.. Blogs will make a more personal touch with your audience or viewers. In addition, the information in blogs can be more useful than if you just went out and bought a book, and plus it’s free.

Find some specialty blogs that you’re interested in and participate. You’ll learn a lot and eventually will meet and network with people.

Statistics

You might have seen this video on youtube before, but I do want to share it to you. The statistics is pretty crazy in terms of how they compare it to the rest of the world.

Conclusion

I hope you enjoyed my post and experience with social media. I’ve been promoting myself and this blog for the past week, and I do enjoy the results that I get from working hard with sharing links, reading more about the design world, talking to people on twitter, and commenting on other blogs. I learn a lot, at the same time I get my stuff promoted. Whether I convinced you to join or not is not what this post is about. It’s more of making you aware of how powerful it can be and how useful it can be to better yourself.

Any comments or experiences you want to share? Any tips you want to give to other people? Comment below, or even twitter your feedback @creativele

So you already picked web design and development as something you want to do in the future, or maybe you just want to pick a hobby to pass your time away.  Either way, there’s always a few tools or resources that everyone needs to complete the job.  And in most cases it would be the same tools or just different versions of the tools that do the same thing.  When starting web design, the process ultimately comes down to 5 basic steps.

1.  Designing the Template
2.  Slicing the Template
3.  Coding the Template
4.  Filling the Content
5.  Final Clean-up

I will eventually go over those steps in future case studies and tutorials.

For now, we should concentrate on the tools that help us with those steps, and without further ado, here is the list of web design tools you should have in your arsenal.  If you have any other recommendations, feel free to comment below and share them.

Designing the Template

For designing a template, you need a graphics editing program. A program that can make gradients, boxes, shapes, etc… Here are the list of tools that I recommend.

1. Adobe Photoshop

Probably the most popular image editing program would be Adobe’s Photoshop line. The current version is Photoshop CS4, and may I add that it is quite expensive. However, the saying goes, you get what you paid for, and certainly after dishing out the money for a license gives you one of the world’s greatest editing program (sounds very exaggerated, but really, it’s that good). Photoshop is great not only for web design but for other fields and careers such as the art industry, photography, graphic design, print design, and pretty much anything that deals with pictures.

2. GIMP

So what if you don’t have Photoshop or the budget to afford it? GIMP is probably your next best bet. It has layers like photoshop, and a few other features. When I first tried GIMP when I was looking for other options since I couldn’t get my hands on Adobe Photoshop, I first thought the interface was really confusing (compared to Photoshop). However, lo and behold, someone has made a plug-in for GIMP that makes GIMP’s interface just like Photoshop which is very useful for those that may have to downgrade from Photoshop.

3. Need more options?

I recently stumbled over a post that I thought may be more helpful for others, and of course, I’m not into the whole copy and pasting other people’s hard written blog posts, so here are 19 more free image editors that you may like. Visit the site and see if there’s anything in there that may help you. There’s also more programs in that list that go beyond the tools needed for web design.

Also a reminder, you can slice your template with your graphic editor as well. No need to get a separate program for that.

Coding the Template

After you have your template designed whether it be a simple portfolio site or a complicated e-commerce site, it’s now time to code it. If you just want the most basic thing on the earth to code, then your computer already has it. Notepad. Since coding is just a language, all you need is a text editing program and you’re good to go. I would refrain from using editors that automatically format like Microsoft Word since they tend to add a lot of weird formatting that may conflict with your coding. Notepad, Wordpad, things like that is all you need. However, what if you would like some help with your programming or perhaps a more visual look to your code?

1. Notepad++

Notepad++ is a great editor for coding. It supports multiple languages and highlights certain syntax code words so it is easier to spot a mistake if you make one. It also has tabbing so you can open multiple files, and one of the good features I like about it is when you open it, it opens the last couple of files that you worked with on your last session. Very handy when you accidentally close it, or figuring out the next day on what you have to work on next. There is A LOT of features on Notepad++ that I don’t even use, but perhaps you will find a use for them sometime, or simply forget about them like me.

2. Scite

Scite is another text editor that I use a lot. I interchange with either programs. Honestly, there’s no difference except Scite doesn’t automatically open files in new tabs and it doesn’t save your last known session. However, it’s a lightweight program, that’s really nice to have.

3. Panic Coda

Since I’m also a Mac user, I can’t forget to give this program some credit. Panic Coda is probably one of the greatest code editors for the Mac right now. It is costly, starting at $99 but the price is worth it in my personal opinion. Although there’s a lot of alternatives, this is probably the most user friendly. You can connect to your files with your FTP information, upload, save files instantly, edit your files there, and even preview them. Very handy.

4. Mozilla Web Development Plug-ins and Add-Ons

Another method of editing code and seeing how it works would be using Mozilla Firefox’s plug-ins and add-ons. I’ve already listed some really good plugins for web developers in a previous post. Using those in combination with text editors to save to your ftp will result in faster coding. It may be quite obvious, but I’ll make sure I show you guys my process in editing code in a video cast later.

Other Useful Tools to have

There’s a lot of extra tools you might need to finish your development or make your design much more efficient. One important tool would be an FTP client. There are tons of FTP clients, and I’ve tried many of them and pretty much they all do what is needed for the most part. Some may have extra features or fancy interface, but all you need is a client that connects to your server or the client’s server, and you can upload and download from it. My favorite FTP programs would have to be either FireFTP which is an add-on for Firefox to use an FTP right in the browser or FileZilla which is a standalone client and supports multiple connections.

Here’s a link as well to even more web design tools you may or may not use, but personally here is my final list of web tools that are good for starters.

Since I use both Mac and PC, I’ll put what I use for both.

PC

1. Notepad++ (Text Editor)
2. Filezilla (FTP)
3. Mozilla Firefox Web Development Add-ons – Includes Firebug, Web Developer, etc..
4. Adobe Creative Suite CS4 (Photoshop, Flash, and Illustrator)

MAC

1. Panic Coda (Text Editor/FTP in one)
2. Filezilla (I use it sometimes for faster uploading)
3. Mozilla Firefox Web Development Add-ons – Includes Firebug, Web Developer, etc..
4. Adobe Creative Suite CS4 (Photoshop, Flash, and Illustrator)

Alright, so that’s definitely more than 10 and of course there may be better programs out there.  I wouldn’t waste my time with getting the advanced programs.  Wait until you’re comfortable with coding since the more you know, the more you’ll be able to use the extra features.  So don’t waste your time trying to research it all out. I’ve already done it for you. Come back for more case studies and resources for beginning web designers.

P.S I’d like to thank those that contributed to my comment and contribute for Haiti entry. A total of $5, but I’ll throw in another $5 to make it an even $10. I’ll do the transaction tonight and will post an update to that post later tonight. Thank you for your cooperation, and stay tuned for more ways to participate and even win some prizes.