Photoshop :: Slicing Images - Better Way Than Tables?
May 24, 2004
I recently redesigned my website using an image which was sliced using imageready and then put back together using tables.
I was told that tables were okay for this but I should have used css, surely I owuldn't have to do an absolute position for each small segment of the interface - can anyone describe how this technique may work and is it better than using tables?
slicing web images (navs, UIs, ect.) and exporting them to HTML files.
I know when you create slices in ImageReady and Save Optimized As..., they are exported in HTML and are put together with tables. Now, my question is:
Is there any way to export them as HTML, but then have them pieced together with "tableless", CSS design? For example, instead of aligning everything up by way of using tables, is there a way to align everything by way of using CSS?
about slicing web images (navs, UIs, ect.) and exporting them to HTML files.
I know when you create slices in ImageReady and Save Optimized As..., they are exported in HTML and are put together with tables. Now, my question is:
Is there any way to export them as HTML, but then have them pieced together with "tableless", CSS design? For example, instead of aligning everything up by way of using tables, is there a way to align everything by way of using CSS?
recently in photoshop i have been designing web layouts and theres one thing i need help on. I was wondering if anyone could post a good slicing tutorial that clearly explains how you can the html contents to your site, for expample once you've made a content box, how then do i slice it so that i can add text inside the box and the box can also get bigger the more text that is added. Any help with this will be appreciated . Also one little problem i seem to be having is that when i use the fill tool and fill inside a cut out (marching ants) it always overlaps the edges of the lines and looks like its been blurred,anyone know why this happens?
i did all my images, layout and text with photoshop... so i started slicing the images into jpegs and text blocks... now my problem is when i select no image in the slice tool and it ask to enter the text it messes up the whole page.. and it puts a white background on it... how do i get rid of the white background? (the text is over color) and also how do i prevent it from pushing all the other stuff over and messing that up?
how to configure the export of image slicing and stuff. Basicly, I need a tutorial that'll teach me from slicing of images, configuring (like text image to text in html), and exporting.
I am working on 2D game and I have been using GIMP to make the images and textures. I am finding an error when slicing these images. Ive tried it on multiple computers at home and at work and i always get this error when slicing this image.
I tried slicing a different image and it worked fine...so recreated this image and tried slicing and get the same error... so whatever the issue is, i accidentally repeated it..
Error is below... when i try to slice the two error windows come up
I have been reporting this problem in PhotoPaint for many years now, and was hoping it might be fixed with the 64 bit implementation. Sadly, it still does not work. Certainly this cannot be such an impossible problem to resolve.
The last version when it worked was with release 12, which I kept around for quite a while until I switched to a new system. I have tried it on each release of PhotoPaint since then, and it has failed on X3, X4, X5 and now it still fails in X6.
It works with smaller images, but when the image is greater than some 3000 to 4000 pixels wide, the results are totally scrambled..
I know the basics of Photoshop so you can say I'm not a newbie but I find myself using it in ways I never have before. I'm in CS3 and I have to be able to slice up .psds for the web, I know about user slices, smart guides, naming slices, optimizing and saving for the web but the one thing I cannot figure out is the very beginning steps in doing this. For instance, let's say someone sends me an image of a webpage that is in any other format but a .psd. Reason I bring this up is tutorials always start with layered documents already in a .psd format and I need to know how to save the slices I make as layers from scratch. Now I'm looking at a (example) .tiff image of a doc I need to slice up so first thing I would do is to save as a .psd correct? or not? NOW here's where I'm missing information as I have tried to save the main image as a .psd file and when I go slice layers out of it and name the layers they do not show up in the palette, they are saved as part of the background.
i have made something in photoshop. i need to slice it, unaware of how to slice thigns in photoshop i did it in macromedia fireworks, the only problem is i used a photo in my design and its got sky in it the sky now has a few different blue shades rather than one smooth picture. fireworks saved them as gifs which is wat i would expect but not the quality has gone down quite alot with the photo!
how exactly do you slice and save the images for a webpage. I already made my template. A not so good one, but now that im done making it, how do i go about slicing it?
I have just made a header for a site with links and everything already on it. Now, what would be the easiest way to save the image in order to make those links? Do I slice up the header and save all the links seperately so that I just add HTML to them, do I take it to Image ready? What?
I am looking to slice a website up in Photoshop, I have created my design in photoshop for 800 x 600. I think this size is wrong as i haven't allowed for the scroll bar in the browser...
I notice i can use the slice tool, or slice from layers etc.
What about place holders i have left for "pure" text which of course i will enter in my html editor? But i should imagine i want it to export with the text place holder in the html file otherwise the html with the graphics are not going to line up?
Also i have created a box with rounded corners, i presume i should only be exporting the four corners and using some trickery to lower file size..
I want to select just two parts of this image to make clickable - in this case it would be the black part of the 'S' (the top part), and the white part of the 'S' (the bottom part).
Photoshop Image Ready only seems to let me create rectangular or square shaped slices - I have seen this done on other websites where differently proportioned shapes and slices have been created?
I have a psd file and there are a bunch of caption bubbles all on their own layer. How can I easily slice each bubble to their own new .png image file? All the bubbles are spaced nicely and they don't overlap.
Is there a way to auto slice an image in image ready when I have made the grid, so they save all the ares into different files instead that I have to save everyone indivitualy?
creating the slices (attaches is the design in photoshop). In particular I'd need some clues on correctly creating the rounded rectangle around the main content. (I'd like to use a fixed layout).
I've seen that there's a technique to define the four corners and repeat the main element so that the rectangle can be adapted to the dimension of the content.
how do you slice a circular object so that it can become a frame and that I can place a object inside it, I used the selection tool in image ready and created a slice from the selection but it slices a square that includes the circle.
I have created an image in Photoshop that I want to use as my website front end, but I have a few questions:
1. How do I go about putting the hyperlinks into my navigation menu?
2. I want to use the blank space I have left as a frame, what would be the best way to do this? I was thinking of creating the layout of frames in dreamweaver then slicing and inserting the slices into the individual frames? then filling the centre frame the same colour as the front end so it belnds in.
I am not sure if slicing is the correct word. Basically, I have a rectangular image and I would like to slice of the edges diagonally and turn the rectangular image into a parallelogram. Then I would like to put some stripes (possibly use the line tool) on the image.
slicing in photoshop? i've created a layout already i dont understand the slicing process. i looked at a few tutorials on it, still dont get the point and how it applies to dreamweaver...
also, can slicing be free-form (like slicing perfectly around a circular object)?
I created a simple site layout with navigation tabs on either side of the primary content area. Something along the lines of this:
Logo|||||||||||||||||
|nav| (content) |nav|
|nav| (content) |nav|
|nav| (content) |nav|
|nav| (content) |nav|
The site wasn't as hard to create as I first anticipated, however I ran into a problem.
The layout looks great as long as content in the primary table cell (inbetween my two nav bars, and below the site banner) remains within the guidelines of the layout.
If content is longer than the layout the entire table is stretched vertically so that there are gaps between each navigation button.
i have selected SAVE FOR WEB AND DEVICES and have then selected the slice tool. i click and drag to draw a slice but it does not create a slice. as i am clicking and dragging i see the marching ants showing the area i have selected. when i let the mouse button go it just dissappears and no slice.i am using ps cs4