BMP Design to HTML

[Maxtr0sity]

Hey, I got a .bmp picture of a design with me and have no idea how to html it so I can use it on my site. Can anyone suggest any programs and how to go with it?

[mdipi]

i assume you know HTML...



< img src="source of image.bmp" alt text="This is my Picture">


that should be it. if that doesnt werk let me know.

take out the spaces...but if you have dreamweaver use that.

[mlk]

well there are several possibilites:
-either use photoshop (imageready) or Jasc Paint SHop Pro... Or any other soft to turn your bmp into either jpgs or gifs (or png), gaphics that will show in web broswers...

Next once you've got your images you need to put them together in an Html editor. It is possible to do it in text but a bit complicated to understand. YOu can use Macromedia's Dreamweaver or (free) Netscape Navigator... or other html progs....

Another solution is to import your bmp into flash an work with it...

Post your work if you need more help !

mlk

[Maxtr0sity]

well, mdipi's code didn't work for some reason, but anyways, does it have to do with image slicing?...lik cutting it into single pictures and putting them together in tables?..i hav dreamweaver MX and also paint shop pro...but doesn't have a good idea on how to go about this

[mdipi]

i didnt quite know what you wanted to do. hmm. i will let MLK take over on this thread cause he seems to understand i more than me.

[Maxtr0sity]

great...

[mdipi]

well he is not back so i will try it again. what exactly do you want to do? just add the pic?

[ahmed]

Well we designed the panels and the whole layout, and its just an image now. He needs to have each component of the layout (side panels, content, button, etc...) to be sliced/cropped and put into a table... :)

[mlk]

hehe yes it's all about image slicing... YOu can do in Photoshop but it takes time to understand... I personnaly use Jasc Paint Shop Pro 7 which does the slicing and puts your images into tables.

Keep in mind that you will most likely end up with your own tables and having to fill them by hand (put each picture into each cell)

Anyway post your bmp or any other image i'll try to fix something to show you what i mean...

[ahmed]

Originally posted by mlkdesign
Keep in mind that you will most likely end up with your own tables and having to fill them by hand (put each picture into each cell) i've tried doing that, but i ended up with the cell sizings screwed up.. :sleep:

got any tutorial for doing this on PS? :)

[mlk]

Im sorry as I said before I do use photoshop for creating images but I use way simpler progs to slice 'em up...
I think the magazine 'Computer Arts' had a tut on slicing...
http://www.computerarts.co.uk/tutorials/type/tutorial.asp?id=31863

try it im not sure it works

[ahmed]

thanks for the link :) i'll read up on it..

[mlk]

something else i wish to add:
- slicing up images can shorten the loading time (multiple little images)
- prevents people from 'stealing' your work, except if they take a screen shot.

It can be tricky with different browser so be careful about tables...

[Maxtr0sity]

sry, great job ahmed, ahmed designed it for me...alrit, how would i got about doing it in paint shop?...how can i slice so that its lik a text area?

[mlk]

how can i slice so that its lik a text area?

mmhh me not really get what you want.
What you want is some sort of text area surrounded by graphics...
Wait ill try ASCII art
_|_________|_
| text |
_|_________|_
| |

with the borders being images right ?

Anyway post some sort of draft of your image file ( i imagine you dont like posting the original)
ill try to illustrat what i mean ;-) !

[ahmed]

oh, here's the original thing, sorry for not posting it earlier :)

[mlk]

alright
you want text in each blank areas ?
And in the dark ones ?
Tell me ill fix something up quickly ;- ) !

[Maxtr0sity]

wel....the design i used before was all tables, and that was easy as hell to manage because everything is text based, i wanna mke something like that

[ahmed]

that would be great :)
the text is only gonna go in the white area in the middle and on the buttons

cheers

[Maxtr0sity]

yea...and some kind of basic placeholder for the buttons on the side panels

[mlk]

workin to it... my paint shop pro is screwed, however if you do have version 7 here is the slicing for your image which i was able to do:

http://mlkdesign.online.fr/misc/kirupa/slices.jsd

[mlk]

actually it worked...
however i have to work around the dithering in the images:
http://mlkdesign.online.fr/misc/kirupa/ahmed/help.htm

there nneeds optimizing - ill do it if i have time.. but it's getting late on this side of the globe and I still have Physics and Chemistry to do...
Ill work on it though...

Check the directory for pic name and sizes....

And i didnt have time to slices everything up so i butchered up'

[ahmed]

i get a 404 error in french or something :(

i dont have paint shop to view the file you attached, but i really appreciate the effort though :)
---------edit---------

oh now i see it. it's very different from what i was trying to do.. appreciate it :)

[mlk]

what was it you wanted to do ?

[ahmed]

i mean.. the way i tried to do this same thing was different and buggy :)

[Maxtr0sity]

ahmed is gonna take ova for a while then...:)...i'll bb tomorrow...and i'll install psp...gj ahmed..