Creating graphics

[MsWicked]

I started creating websites with FrontPage more than a year ago and have learned so very much! I am now creating pages for small businesses and groups in my area and getting paid for it.

I have learned how to create banners, buttons and bars for use in Frontpage but now I want to do more. I am currently working on getting even more familiar with html since I am no longer satisfied with the limits of FrontPage, however, what I really want to do is create the graphics that you see used on templates such as this one;

http://www.webplatestogo.com/WPTG/C516/index.html

Usually the top and left side appear to be one big graphic although I believe they are often (always?) a top, corner and side graphic. Sort of like an upside down L.

So tell me, how do you know what size to make your graphic? Is it all done in tables and if so, how do you know what size to make your table?

If anyone knows of any tutorials on this PLEASE let me know. I have PaintShopPro 6, PhotoStudio and Adobe PhotoShop 6.

Thanks in advance. You have no idea how long I have searched for SOMETHING that would help me get started.

[Ddr]

Hi MsW

I started in Front Page 98, too, but left if for other tools that allowed for greater freedom and creativity. I use Dreamweaver for assembling the pages quickly, Fireworks and/or Photoshop to create the elements of the graphical interface.

I will preface this post the same way I do most of them. I am a dabbler, and not an expert on anything web related. What I do is set a design goal then learn the process to create it. So if anyone finds errors in what I say, please feel free to correct me.

I looked at that link you liked (I liked it too) and checked the source code to confirm what they did. They used tables... lots and lots of tables. When I build in tables I start with the size specified as a percentage of the page instead of an absolute size in pixels. As I start to see things develop, I might switch to pixels if there is a reason to size a frame element to hold a particular graphic, like they way the buttons are fixed on that page you like. You asked about what size to make elements. Sometimes it helps to look at the source code of others....for instance, the buttons in the site you gave as an example are set at 122 pixels wide and 28 pixels high. If you like that size, then start from there and experiment.

If I was doing it, I would generate the backgrounds and the other elements of the graphic interface in Photoshop and import them as gif files. Doing a page as sophisticated as the one you chose as an example takes some practice and a really good understanding of how tables work.

Another way to go about things is to use dhtml and layers. More attributes can be added to dhtml layers by using javascript.

Layers and tables are pretty big topics. There is way to much to discuss in general terms here. I am a book person, so I cant point to much on the web for you, but "Sam's Teach Yourself Javascript in 24 Hours" and "How to do Everything with HTML" by James H. Pence (Osborne/McGraw Hill, 2001) are very good books.

If you have specific questions, post them, I will be happy to help if I can

Dale

[MsWicked]

Hi Dale!
Thanks for taking the time to respond to me. I'd really like to be able to design a site "layout" and create custom graphics too. Then, and only then, would I feel that the site was truly mine. Might seem kinda silly but what an accomplishment!

I dont really understand the perccentage thing you were speaking of. I am also a book person and might need to read a book or tutorial or something before I can get a grasp on the concept. But, if it involves math, I'm sunk! Math never was my strong point. :(

Sams are good books. I have the one for PaintShopPro. And as for you "dabbling".... it sounds to me like you're in a bit deeper than that! :)

As before, if you come across a site that explains the table process a bit, please think of me and send me the link, will you?

[Ddr]

Hi again MsW

I cant get too longwinded now (how odd for me, *lol*) but here are a couple of links to check out. The first is the HTML Goodies site. Dr Joe Burns is no longer associated with the site, but his tutorials are still up there. His stuff is great:

http://www.htmlgoodies.com/tutors/tbl.html

This next one has more info:

http://www.charm.net/~lejeune/tables.html#TABLE03

And this last one is a bit dry and technical, but the entire site seems to be packed with info:

http://www.w3.org/TR/REC-html40/struct/tables.html#h-11.2.2


Hope this helps you a bit

Dale

[MsWicked]

Thanks for the links. I already went to the first one and took some notes as I was reading so now I have a better understanding of tables, the codes and their functions. I read through the second one but will need to re-read that one a couple more times and added the last one to my bookmarks. Its way over my head right now! :)

I'm going to take out a piece of paper, draw out a site, then try to create it using tables, images, backgrounds, etc.


Wish me luck! Betcha I'm gonna need it! Haha

[Ddr]

MsW

Here is another site that might be of interest. Check out the link to "Table Sizing" down at the bottom of the page.

http://www.killersites.com/tutorial/




Happy tabling

Dale