Web Design

[Spart]

I'm thinking I might want to get into web design. I really don't know anything about what is required. Anyone here have any experiece in it? I am willing to learn anything that is required. Can anyone suggest any good reading material on it?

[Lyk31337]

Well, If you ever want me to show you something get Crossloop, from Crossloop.com and PM Me on xfire.

[Julia]

Do you have any experience with photoshop? When I was in grade 7 and 8 I used Paint Shop Pro, it's a really good program especially if you don't have a lot of experience. I still sometimes prefer it to photoshop.

You can pick up some html & css books at most bookstores. I had two back when I was about 12 or 13. They teach you the basics like tables and image codes, and image maps. I recommend getting one instead of using internet tutorials at first. After you learn the basics, go View>Page source on some web sites that you like the layouts of, and study the coding that they use. It seems a bit complicated, but you'll get the hang of it. There are some advanced books you can get too, of course. Not to mention the millions of tutorials you can find through searching.

Right now I'm planning on using a Javascript Image Map for my next site. They're so sweet. :D

Good luck!

P.S. Just a tip, always link to style sheets. (You'll know what I'm talking about later). I used to use separate coding on each page, but with the same info until I realized that I should just link.

Oh, and download NoteTab. I don't use it, but my dad does and it's apparently really useful.

[steamgear]

If you're going into web design. You're going to have to know what you want, generally, it's design.

Coding isn't necessarily a problem, as, you're going to want to team up with other people to make a stunning and, ultimately, successful web design.
Personally, I used to make unique spliced templates out of CSS, XHTML, Javascript, etc., but, I was the one that make the actual individual graphics. I don't know anything about coding, haha. Let me tell you, it's definitely a challenge to make a simple and yet effective design.

Surprisingly, there is a lot of sociology, psycho-analysis, and habitual patterns recognition that you have to be familiar with in order to get your message out, but still keep a good design.

If you want, you can refer to these website that give EXTREMELY good design practices, as well as resources:

10 Principals to Successful Web Design (Smashing Magazine) (http://www.smashingmagazine.com/2008/01/31/10-principles-of-effective-web-design/)

[O2zi3]

Unless you are a coder this is all too much.....Just learn to use something like dreamweaver. Then you can concentrate on the actual design rather than the coding of said design. I am a complete noob but as soon as I see posts like:

"I used to make unique spliced templates out of CSS, XHTML, Javascript, etc., "

My eyes glaze over and I open a bottle of wine

[Devils Reject]

The Gimp is a good alternative to photoshop and paint shop pro.. Plus its free

[Lyk31337]

The Gimp is a good alternative to photoshop and paint shop pro.. Plus its free

The Gimp is horrid compared to PS.

[hitman47]

PS is free as well, at least for 30 days. And if you were to have horribly illegal and malicious intentions, you could still PM me for moar info.

EDIT:

BTW, I want to get into doing some HTML as well, my friend has been doing some for the past few weeks and it sounds and looks nice. Also I'm also pretty familiar with photoshop.

[yanney]

Photoshop. But if youre serious about it, lrean to use illustrator. Its more professional and its vector format. Which means you can zoom in on anything and it wont get pixelated.

[raperofzenoob]

Actually making the drawing or logo or whatever you want is only half the problem,
you have to be creative enough to think about what to do first.

and if you are then get every single Adobe CS3 thing you can :D

Well I can tell you that in the summer I work as a web layout sorta person, what I do is ai get screenshots from the designer of what the website is supposed to look like and I cut them up and do whatever I need to make it into a functional web page, plus it pays well like 100-400$ a site

[DaDominator]

Right now I'm planning on using a Java Image Map for my next site. They're so sweet. :D

Oh, and download NoteTab. I don't use it, but my dad does and it's apparently really useful.

Wow....Java Image Map??? Are you retarted? Sorry, but I have lost all respect for you as a designer. NEVER EVER USE Java unless your working with a full scale application. Any Image Map you do with Java could be done 1000 times better using either Javascript or Flash. Plus it will be way more compliant.

NoteTab is okay but I prefer PHPDesigner 2008 (It's for HTML and CSS too, supports FTP right in it, live browser viewing, and lets you set breakpoints).


Spart, I'm impressed. Web design is an awesome hobby or career choice. I started doing simple HTML sites when I was 11 and moved into PHP by the time I was 14. Now I'm 17 and have a part-time job with a local web development company (pays really really good too). I'd suggest honing your skills and then posting an ad on Craigslist seeing if anyone will hire you (that is after you master HTML/CSS and some PHP).

With Web design for personal sites it really doesn't matter what it looks like but when you move into commercial sites you need to always be COMPLIANT. That basically means that your code is well organized so even a nub could understand it. On top of that, your code works in pretty much ever browser back to IE 5.5 (I use vmware for testing browsers, or there's browsershots.org).

But before I talk about compliance, we need to get you started in basic website construction. I'm sure you've seen HTML before. It basically looks like a bunch of simple little tags. This isn't the only part to web design. There are several things steps to a page design before you get to HTML.

First, you'll normally start with a hand sketched layout of the site on paper, this might describe any of the functions of the site or even some of the content. But it's mainly to give you a rough idea of what the site is going to look like. If you were going to do a PHP site, you'd probably also make a list of all the PHP functions you are going to use/create.

Now that you have your rough sketch, your going to open up Photoshop CS 3 (I'm picky). You must use Photoshop, all other programs suck in comparison. I don't care about Gimp, Paintshop Pro or all of those other cheap knock offs. Photoshop is where it's at. All the pros use Photoshop so there's no sense in getting acquainted with something else. In Photoshop, create a blank document that has dimensions of something like 1000x1200. Most sites these days use centered layouts (even zomgstuff). When you design your site, you'll want to make sure that it fits in 800x600 browsers (as crappy as that res is). Thankfully, the day is coming where everyone will be 1024x768. But in the mean time, try not to make your site wider than 800 pixels (unless its a liquid layout, meaning it expands with the browser).

After you've done your pretty little design in Photoshop, your going to need to slice it up. There are two ways to slice. The first way is to slice your design up and export the design as HTML/Images. The second, better way is to only slice it up into images and then layout it out in HTML yourself.

Wow, just realized that I pretty much wrote a whole tutorial on how to get started. Anyways here's a link to a tutorial that will teach you some more about slicing: http://www.sitepoint.com/article/design-website-photoshop

I would suggest downloading (from somewhere) the ebook versions of sitepoints books on web design. For the most part they are well written and fairly compliant. Although there are better more applicable books out there, I feel that Sitepoint's books will give you the best start.

Well Spart, happy designing.

[Brandon]

Me and Spart can learn together. I have somewhat knowledge of web design and coding and such.

[yanney]

If you need help. IM me on AIM: burnbabyburn383

i have experience. And I can help you with photoshop.

[Spart]

Wow I didn't expect a response this detailed from anyone :D. Thanks a ton. I'll LEGALLY PURCHASE photoshop when I get home and I'll pick up some books from the mall next time I go to the mall and I'll update this thread. Thanks so much. ♥♥♥

[Julia]

Wow....Java Image Map??? Are you retarted? Sorry, but I have lost all respect for you as a designer. NEVER EVER USE Java unless your working with a full scale application. Any Image Map you do with Java could be done 1000 times better using either Javascript or Flash. Plus it will be way more compliant.


I hope you do know what I'm talking about. Similar to this:
http://www.milonic.com/menusample4.php

Oh crap, I just reread my post. *script.

[KR]

Get really good with Photoshop first and then learn ImageReady. Using those two programs it makes it really easy to develop an amazing looking web site that just needs some HTML coding to put together. Http://pixel2life.com has a lot of tutorials. I'd suggest first learning basic HTML + Photoshop and ImageReady and then after that move onto JavaScript and PHP to make dynamic sites.

[DaDominator]

phew....Your good. Javascript > Java for image maps.

[steamgear]

Spart,

Another quick suggestion.
To make some really good designs without actually coding such templates, you could use Adobe Bridge, Adobe Contributer, and Adobe After Effects (just to make some nice candy colored stuff). I got in touch with my old boss and he gave me the heads up on the upcoming 'HTML 5', so, if you're going into web design now, it's definitely a great time :]

Good luck!

[Haze]

If you are going to make a site be sure to use CSS for your styles and not <fawnt> every time you have some text!

w3schools (http://www.w3schools.com/) is a great place to start learning

if you are looking for a good text editor that's very efficient I would go with Crimson Editor (http://www.crimsoneditor.com/)

[DaDominator]

HTML 5 won't be properly implemented until 2010 though. I say screw it for now.

[yanney]

A quick way to make a site without knowing HTML is to make a web design, cut it into slices(search pixel2life) then open in imageready and save it as an HTML document.

it will save it as index.html and save all the images to an images folder

[DaDominator]

A quick way to make a site without knowing HTML is to make a web design, cut it into slices(search pixel2life) then open in imageready and save it as an HTML document.

it will save it as index.html and save all the images to an images folder
GAH! No!

Don't do that. The worst thing to do is start with bad habits like that. Imageready exports absolute CSS/HTML, this is hard to work with and causes issues later on.

[yanney]

Lol, im just saying its a good start point.

[DaDominator]

Better to start out compliant then to have to switch over later.

[Spart]

I went out and "Purchased" Photoshop CS2 9.0 (♥♥♥ Paradox). I'm gonna try doing some sig tutorials and stuff to get the hang of the features.

[Lyk31337]

Spart, If you want me to show you something before I head to the movies get on xfire, ill show you whatever you want. (Crossloop.com)

[Spart]

I can't work on it this weekend as I have to go to my moms. I played around with it for a few minutes and downloaded some nice brushes.

[TacoGrease]

Wow....Java Image Map??? Are you retarted? Sorry, but I have lost all respect for you as a designer.

Sorry, I've lost all respect for you because you do not know how to spell "retarded."

[Haze]

Sorry, I've lost all respect for you because you do not know how to spell "retarded."

its a pun for poptarts.:crazy:

[minig25]

I suggest (and this is how I learnt)
Go to www.w3schools.com, its free its also amazing and the standard lastly it explains everything very well

I think GIMP is an amazing alternative to photoshop because its free and you can still add everything in etc... And it has quite a few default gradients and patterns.

This is what I suggest you do.
any help need contact me on xfire (minig25)

~~Mini_G25

[hitman47]

I suggest (and this is how I learnt)
Go to www.w3schools.com (http://www.w3schools.com), its free its also amazing and the standard lastly it explains everything very well

I think GIMP is an amazing alternative to photoshop because its free and you can still add everything in etc... And it has quite a few default gradients and patterns.

This is what I suggest you do.
any help need contact me on xfire (minig25)

~~Mini_G25

Lawl, photoshop is pretty free too. If you don't know what I mean, don't ask publicly. I've used GIMP, and it just can't compare to PS.

[Epok]

Wait...so no one uses CS3 except me?

I use all the CS3 ones. All "purchased".

[Scorp]

Wait...so no one uses CS3 except me?

I use all the CS3 ones. All "purchased".
I don't use CS3 because I don't know how to "purchase" it.
Can you PM me and tell me how you "purchased" it ?

[hitman47]

Wait...so no one uses CS3 except me?

I use all the CS3 ones. All "purchased".

I have "purchased" CS3 master collection and its awesome, so youre not the only one

[DaDominator]

I LEGALLY own Photoshop CS3....I "purchased" the rest of the master CS3 collection *online*

[NoLuck]

Hello Spart

I have some good experience with making websites for people. I would be more then glad to help you if you ever need it or just show you some tutorials that will help you out a lot as it did for me.

Contact me
XFire: mrtim90
AIM: mrtim90
Steam: ZtNoLuck & L33TNeSS

[DaDominator]

Do you have a portfolio?

[NoLuck]

Do you have a portfolio?

I actually don't sorry. I reformatted and lost all of my work idiot me.