How Do I Code A Design?

[Bluebear 0]

Okey, so I saw another topic here regarding how to make a design. I know how to do that, so that is no problem. But I have always had some problems on how to code a design. I am tired of that I always need to use some sort of program, drag&drop webhost (like piczo) or use a free design I found online.

 

I have noticed that people need to "cut" the design in different parts, but I have never understood what way the do it. So I do not understand anything about this, and really need some help.

 

I will be happy for all help I get. Thank you so much!

[MiniK 0]

You don't necessarily need an image to make a design..you can use CSS. http://www.w3schools.com/css/

[truefusion 3]

Consider looking into my GIMP guides tutorial. In Photoshop and other image manipulation programs is a bit different, but same concept. Once you have cut the design out, you would either use a WYSIWYG editor or if you know HTML and CSS, then type out the coding yourself.

[Saint_Michael 3]

Also there are various websites that have templates that will cut down the time coding the website. I recommend this website as the layouts are bare bones which means you can everything else with in that website, and if you want to go to the CSS way of coding a website then I would check out this website as it has everything you need to know about CSS, AJAX, DOM, fonts, etc etc.

Although truefusion has a good point on designing your website through a graphics program he forgot to mention the amount of hours that you need to put into designing, slicing, and coding a graphics template, especially if your converting from tables to straight CSS. So if you plan to go that route expect to put in a lot of work into a design like that.

[Bluebear 0]

Thank you for all the help, some of it was quite helpful. :)And yes, I know that I don't necessarily need an image to make a design, but I want to do that. (I think) Personally, I like websites that have that.I guess I can try to learn by looking at other designs, maybe free ones I get online. So I can check out how they do it. But thanks alot, and a happy new year to all of you.

[notrog 0]

I found one way to make a sweet intro page with an image as the design - see the intro page to http://forums.xisto.com/no_longer_exists/ - my practice site - its a picture of mice - if you click on the brown one running in the wheel - it enters the site - but if you 'miss' the mouse - the mouse's shape is designated in the html by an image map created in the gimp - you can pretty much make your buttons and links shaped like puzzle peices if you want to using an image map - and using the gimp's image map plugin, you can do it simply quickly and easily, for free, and it looks good (i think). The image map plugin in the gimp can be found under filters>web>imagemap. You do have to draw the shapes on the image manually, but the tools are pretty easy, and its not too hard to figure out. Then you save it and it makes your front page for you based on that image and the shapes you drew on it.

-Notrog

[trontron 0]

The process of web design has changed quite bit now - for the good that is. Graphics designers usually create layouts and designs in photoshop. Then these templates are cut into pieces to be put into DIV tags usually in XHTML and the design details done in CSS. It is quite a lengthy process however it does allow you to think out side of the box and then try to make the design work but artists never want to think about functionality - they prefer having no boundaries. This makes the job of coders difficult but after spending some time thinking you can usually figure out how it would go together. I haven't come across any design that I have seem which I have have thought to be impossible - you just need to think logically. Here is a website of 39 services that turn Photoshopped designs to XHTML and CSS - link. If you are struggling and need help dont be afraid to send me a PM.