For this step by step i'll sow you what i need to do, and i'll be doing the doujinshi page.
I uploaded the image i created in photoshop in to the image directory of my server. To make life easier i made that match with dreamweaver, so there is less coding for me to change.
I have to upload each image individually or in small batches. The amount of images needed will vary depending on the page design.
I then create a new "file" on my server and call it doujinshi.htm. In my case i had already done this step the first time i create the site.
There i will paste the changes i did to the page in dreamweaver.
The htm files are the files where all the coding is written. The browsers read this coding a can construct the web site by following that coding.
But for that i need to locate the background coding as t he changes i did in photoshop involve only the background. I won't be changing the text at all except move it around so it fit into the design.
By looking at the web site in on a bigger screen, the web site now looks messy and unconstructed but as the picture is a background, you can scroll around the page without any worry.
Here's the changed coding. This coding will tell the browser to look for the image doujinhiBG.jpg and set it as the background. It also tell it that any part that isn't filled in by the image must be black and the background image must be centered.
However, because i originally designed the website for a different background, i'll no doubt have trouble with the text.
As i thought it didn't work as planed therefor i need to change things around. This image was taken before i realized i need to shift my background image to the center.
I had to change the text around, including the colour and bring it down a little more down the page. I'm still not fully happy with it but it's something i'll sort out in time.
In the image above is the coding i used to link my button to the page. This is telling it to open a page when clicking on that image. I took this image before i changed the page linking and ialso forgot to remove the border around the button.
I feel I will have a problem with the screen sizes because my web site works fine on my 15 inch screen but not on the 12 inch. I need to work out how to make the background images fit the browser size.
By looking on google i have found this piece of coding that may do the job but it doesn't work for background images
After a bit of research, i found this long piece of coding that may do the job. thought this piece of coding is very complicated and i don't feel that it needs to be that much of coding for such a simple action, so i searched some more and found an other piece of coding that looks more promising.
However for this piece of coding, i think i'll need to recreate the background image.
I've tried all the bits of coding i found and i can't get them to work. They all take away the background and in some cases, change the background colour.
I think that i'll have to recreate the background image and make it a bigger size and then try some new coding.
I've found this piece of coding (highlighted here)that i can use to make my background resize it self in different browsers. I still need to recreate my background images.
I could also possibly use this coding, and i think i will because i understand this coding better than the previous one.
Here's my coding now modified. I have to wait for the server to catch up with my changes to see if it has worked or not. I still haven't made a new background because i want to see if i can get it to work before i make a new one.
Unfortunately i can get it to work so i'm going to have to redesign a bigger background image.
This screen shot is from the webpage as it is. What i think i need to do is make a background that i am sure will be bigger than all the browser and some how make it have the layout of the image above.
0 comments:
Post a Comment