Photoshop to dreamweaver viewable in all aspect ratios

after importing a photoshop designed site into dreamweaver how do you convert all tables/images to percents?
I designed a website in photoshop and exported it for web and devices. Now I want to make the website available for all aspect ratios. In order to do that I need the table containing the images to be a fixed percent such as 95% height and width and ALL the images and tables inside the site to be correct proportions to be able to scale with the website to be able to expand and contract and be viewable on all aspect ratios! How do I do this in dreamweaver?!??!?!

after importing a photoshop designed site into dreamweaver how do you convert all tables/images to percents?
If this page is to be displayed on the web, the answer is you don't. Using Photoshop (or FW) HTML as a real-world web page is a dreadful mistake. That code is intended for, and only designed to be useful for rapid prototyping, i.e., creating demonstration pages that are used in controlled environments. When used on the web (i.e., a non-controlled environment), such pages develop gaps and breaks between layout elements and generally fall apart unexpectedly.
How do I do this in dreamweaver?!??!?!
DW has no such 'Easy button'. To convert a table-based layout containing images to what you are describing would require careful and tedious manual modification to the code. In addition, browsers are not particularly smart at enlarging images (using only a pixel doubling method to do so). This causes photographic images to degrade in cosmetic appearance quite rapidly, particularly when you exceed the pixel content of the original image. Of course, you could always start with the highest quality, largest dimension image you have for each such image, but then your page would likely weigh more than Manhattan when you finished.
In other words, there aren't great ways to achieve what you are asking for.

Similar Messages

Is pixel aspect ratio in TIFs not supported

Hallo,
I generated 200 TIFs with a Photoshop script that I wanted to use as slides in an Encore DVD project.
After importing the TIFs into Encore I recognized that the were too small. Though when I opened them in Photoshop they had the correct pixel aspect ratio for a PAL DVD and the correct size (720 x 576 pixels).
I then saved those TIFs as PSDs again and imported those into Encore. Suddenly they were shown in the correct width.
So my question is: Does Encore DVD not support pixel aspect ratio in TIFs?
Regards,
Christian Kirchhoff

Bill.
My Apologies.
What I mean is a Subpicture Highlight image, as used by Scenarist & Maestro and an option in DVD-Lab Pro.
Instead of importing a PSD, with all it's layers, what we do is this:
1 - Create a 720x480 0.9 PAR background image in Photoshop. This will be the background of the menu, and should be a full 24 bit colour image. Usually saved as a TIF file but in some apps can be a bitmap. Sonic insist on a TIF.
2 - Create the Subpicture Highlight image. This is what will become the button artwork. You have 4 colours:
White (Background)
Black (Main
Red (Highlight 1)
Blue (Highlight 2)
Save as a 2-bit indexed TIF file, with a maximum of 4 colours. Black must be 0,0,0 in RGB, same applies for other colors - they need to be pure colours.
3 - Create a button image if there are complex shapes in the SPHL. This will create the actual buttons. Not always needed, as you can also create buttons from the SPHL.
When I need to use these, I then load the external background, and import the SPHL over the top, and assign the buttons. Everything works really well doing this process. Not as elegant as a PSD import, I grant you - but a lot less room for error with "hidden" buttons etc.

How to crop by aspect ratio, not pixels or inches

I really haven't understood the crop tool. Sometimes it crops by aspect ratio, and other times it uses the absolute pixels you specify in the width and height options in the crop box. It's not clear at all. What am I doing wrong?
Say I have an image that's 1000 x 1000. I want to crop it with a 3:2 aspect ratio. So if I type width 3 height 2 the aspect ratio is OK, but when I OK the crop I get left with an image 3 pixels wide and 2 pixels high. Not what I wanted at all. I want an image 1000 pixels wide and 667 pixels high.
Why does photoshop not have a crop by aspect ratio (no resampling) instead of a crop by absolute pixels or inches? Thanks

Why does photoshop not have a crop by aspect ratio (no resampling) instead of a crop by absolute pixels or inches? Thanks
Select the Marquee tool
Style: Fixed Ratio
Width: 3 Height: 2
Drag out the desired Marquee
Image > Crop

Aspect ratio of imported clip

Hello,
When I import a clip (Apple Pro Res HD 1280x720, 25p) into FCPX I do not have a correct aspect ration. The image is a 4/3 ratio into 16/9 ratio.
I have not this problem in FCP7, all aspect ratio are correct.
Have you an idea how to edit this correctly into FCPX?

The aspect in QT7 is ok but when I open the same file with QTX it looks like in FCPX... :-/
QT7:
QTX:

How to check for different crop aspect ratios

The problem I'm having is that I have hundreds of images that I need to send to a photo print lab. Before sending off my images I have to make sure they all will fit correctly for 8x10 prints (5:4 aspect ratio) and other ratios but I need to keep them cropped in my camera's default 3:2 aspect ratio for people who want to buy 4x6 prints.
So what I do when I open all my images in Bridge's Camera RAW browser is fit and crop any images that need cropping but using the 3:2 aspect ratio. I then need to check to see if my crop will work as an 8x10 crop picture so that nobody's heads are cut off, etc. The problem Bridge is giving me is that when I crop the first time it doesn't allow me to check another crop without losing the original first crop. For example, I do my first crop as an 3:2 aspect ratio and then when I click on 5:4 to check for 8x10 prints it resizes the crop area which lets me check the crop for 5:4 but when I go back to 3:2 it doesn't go back to the original crop so I have recrop the original crop from memory. Is there any way to solve this problem? Basically crop it twice without loosing the first crop so that I can go back.
Also is there any way to quickly click on all aspect ratios like 5x7, 8x10, etc and have the crop centered in the image so that I can quickly check if anything is cut off? My lab is a high volume automated photo lab so they crop by using the center of each picture and I can only give them one image per person. Most of my images don't need cropping because I try to do it in camera but I have to check to see if they will fit for other crop sizes. Currently Bridge makes me create the crop size manually and then visually center the crop over my image. I would prefer quick buttons that when clicked on will show me what the crop will look like in different crop ratios. Is there anyway to do that?
Thanks for any help you can give me

You might want to try this in Adobe Lightroom (it uses the same Camera Raw
engine as PS and Bridge).
In the develop mode you can use the crop tool with presets and custom
options that works faster and has an easier and better history tool to
retrieve your original crop setting than Camera raw in Bridge and PS has to
offer.
I would prefer quick buttons that when clicked on will show me what the crop
will look like in different crop ratios. Is there anyway to do that?

Clips lose pixel aspect ratio setting after relinking

hi there,
after reopening a project from a backup drive I had to relink all my media.
no problem with that...
but after relinking all aspect ratios were lost. files are 2048x1536 anamorph (manually) set to an aspect of 1.33 and then scaled down to 1920x1080.
generally all settings were intact - the aspect ratio setting however was not. all clips had a square pixel setup after relinking.
is this a bug?
thanks!

hi there,
after reopening a project from a backup drive I had to relink all my media.
no problem with that...
but after relinking all aspect ratios were lost. files are 2048x1536 anamorph (manually) set to an aspect of 1.33 and then scaled down to 1920x1080.
generally all settings were intact - the aspect ratio setting however was not. all clips had a square pixel setup after relinking.
is this a bug?
thanks!

Maintaining Photoshop aspect ratios in After Effects

Hi there,
I'm new to adobe programs...
I'm having a problem when i try to import a 720 x 540 photoshop image into After Effect at the same ratio. After establishing the same settings, my image in AE is slightly cut off at the sides (along the width), as if pillarboxed just barely. There's an outline around the image that seems like it maybe be closer to the 720 X 540 aspect ration, but i don't know how to make the image fill it up.
Any suggestions?

I your AE comp is 720 X 540 square pixels and your Photoshop file is 720 X 540 square pixels then the frame sizes match. If your AE comp is NOT square pixels or your Photoshop file was set to a non square pixel aspect ratio then AE will make the adjustments and you will see some distortion.
You need to learn about pixel aspect ratios and you need to make sure that the source footage is properly interpreted. 720 X 540 is the old standard for NTSC 4:3 square pixels and it will fit perfectly in a 720 X 486 rectangular pixel composition if you're using a pre CS version of AE. The new standard for NTSC square pixels with a 4:3 picture ratio is 720 X 534. This will translate perfectly into a 720 X 486 frame. Unfortunately DV video and most DVD formats are limited to 720 X 480 so 6 scan lines are lost. The playback device strips them off anyway so there not really missed.
To make your life easier just always plan on using the standard presets for your compositions and make all of your artwork square pixels. AE will properly interpret any DV footage you may import and will maintain a completely distortion free workflow. You can then use the Adobe Media encoder to render your deliverable DV or DVD product.
I hope this clears things up a bit. Pixel aspect ratios confuse everyone at first.

Understanding aspect ratios in FC and Photoshop

Hi all. Two questions regarding aspect ratio:
1. I'm editing with footage from a Canon MK2 camera. My computer tells me the footage is 1920 X 1080 but it looks 16/9. Why is that?
2. When I make a still (Tiff) in Final Cut from the same footage and bring it into Photoshop, it says image size 1440 X 1080, but it looks 4:3. Why? What is the best way to get the picture back into 16/9 - a. change image size to 1920 X 1080 b. leave image size as is and change pixel aspect ratio to HDV 1080 (1.33), or c. some method I haven't tried? Methods 1 and 2 appear to fix the problem and the results are practically identical. But I'm confused about the process and would like to understand these numbers.
Thanks in advance for help.

1. Because 1920:1080 = 16:9 (1920/16=120 120x9=1080)
2. Because your sequence settings are 1440x1080 which is anamorphic.
b makes the most sense to me as a fix.

How do i transform a layer with maintain aspect ratio through scripting in Photoshop?

Hi,
How do i transform a layer with maintain aspect ratio through scripting in Photoshop? I am expecting your reply.
thanks,
Rajiv.s

I don't think your talking apples to apples. First I do not know of any Maintain Aspect Ratio icon in Photoshop. The only icon I think associated with transform is the anchor point icon in the option bar for transform. I think you may referring to the constrain check box in the image size dialog which you can check when resample is checked. Image size effect all layers in the document and the documents canvas size. The document canvas size will be changed to the values in the images size dialog and all layers will be transformed by percentage the canvas was changes while maintaining the layers position over the canvas and the layers I think may be cropped so only pixels over the canvas remain.
I do not know if you know that layers can be any size and have aspect ratios different then the documents canvas.
In your case it sounds like your describing a template that has a canvas size that is 2000px wide be 3000px high a 2:3 portrait aspect ratio. Your image file has a landscape aspect. If you place that image into your template place would by default transform the image so the image would fit within the 2000px by 3000px canvas size there would be a white border top and bottom. You could transform that smart object layer to it actual pixels size activeDocument.activeLayer.resize(100,100, AnchorPosition.MIDDLECENTER); then calculate the size you want to transform its height to. By retrieving the canvas size and the layers boundaries. Divide the canvas height pixel size by the layers pixel height size should give you the percentage you need to use. Make sure you set the ruler units to pixels so your working with pixel values for the canvas and layer size values. The resulting layer will be larger then canvas size keeping the anchor point centered will result in the canvas size masking off both sides. In effect cropping you landscape to a portrait. Note cropping a image from one orientation to the other changes the composition drastically.
If your trying to make a composit like collage you may want to look at my Photoshop Collage Toolkit it will fit images to fill a 2000px by 3000px area http://www.mouseprints.net/old/dpr/PhotoCollageToolkit.html
You could also do centered 2:3 crop that is resized to a 3000px

Slightly distorted aspect-ratio (and missing alpha channel) when copy/paste from Photoshop

Maybe this is an old topic (but I didn't find anything on google or this forum):
When I copy images from Photoshop to Flash, the aspect ratio of the bitmap gets distorted. A 728x90 Bitmap becomes 727.6x90 (and so on...). The dpi is set on exactly 72 on both programs. Is there any way to JUST get a 1:1 pixel copy? (except using another program like Irfanview as a "man-in-the-middle")
Although I selected "32 bit color w/alpha" in the clipboard settings of Flash, the alpha channel seems to get discarded when copying from Photoshop. Shouldn't it at least work with Photoshop? I mean, it's an Adobe product after all and maybe the most commonly used together with Flash.
Would just be nice if a copy-paste between PS and FL was an easier thing.
I know there can also be a pixel-aspect somewhere (like used for video productions and wide-screen), but I didn't find settings for that anywhere.
I still use Flash Professional CS5.0

I'm on windows7 with CS5.5 and transparency and size are copied over just fine. You answered what would be my first question, 72dpi. How about the image mode. Are you using RGB 8bit?
I've had lots of issues with the OS not handling transparency very well also, such right-click on an image on a website that you know is a PNG and has transparency, then paste it into photoshop, the transparency isn't saved.
The route that always works (but is a PITA) is of course to save it as a PNG with transparency and just import it.

How do I restore all images in a collection to original imported aspect ratio?

Typically I select all images in a catalog, resize the first image to 640x480. I then right click on the first image (all images are still selected) click on Develop Settings, Sync and choose to sync only the aspect ratio. All images are then cropped to 640x480 like the first image, which I then export to a folder.
I then need to restore all images to the original aspect ratio for building a slideshow to export to my website. I've followed the same procedure i.e. selected all images, click on the first image, change aspect to original, right click on first image and sync aspect ratio for all images.
The problem is that the rest of the images do not return to their original aspect ratio but revert to 4x6 aspect ratio instead of the original size when imported. I've changed the lock to unlocked and tried both but still no result. Now I have to select each image individually, open the crop dialog and choose custom to get it back to the imported aspect ratio.
How do I batch restore all images in a collection to the aspect ratio when imported?

Rotating an image is adjusting its crop rotation and crop size. You originally said you wanted things back to import state which presumably was full resolution w/o any adjustments to ratio, size, or rotation. If you are wanting to do things in the middle of your other processing I'm less sure what to tell you.
Taking a crop that you have at 3:2 and setting it to 4:3 shrinks in the longer sides, and resetting the ratio to 3:2 shrinks down the shorter top and bottom--this is how it always works, because a crop box is not ever expanded by setting the ratio to something different, and changing the ratio back and forth like that makes the crop-box smaller and smaller.
Are you having an issue because you want to fiddle with the crop in the middle of other processing every time, or is this a special case because you've moved on in your processing after asking your question some time ago?
If you routinely need to do this, an easier way might be to export the images at the 3:2 crop, then reimport those JPGs, change the crop on those JPGs, only, then re-export them a second time, and be done with them. This sounds like you're making proofs?
If you are making proof-sized images at a different ratio? Why not just export the 3:2 images at a smallish size, perhaps with a watermark and not have to worry about making them 4:3 ratio?
Another alternative would be to print the images to JPGs instead of a printer, and set the paper size to a 4:3 ratio and turn on the Fill option--which will chop of the long sides automatically as it prints them.

Photoshop Elements 5.0 - won't let me change image aspect ratio. Box is greyed out. Have reinstalled

I've been using Photoshop Elements 5.0 for years. As of today, it won't let me change image aspect ratio. Box is greyed out. Have reinstalled the program with no change

Where in photoshop elements 5 are you seeing the "Box" geyed out?
Or how are you trying to change the image aspect ratio?

How to capture frames in Premier Pro to edit in Photoshop with correct aspect ratio.

I am using Premier Pro and Photoshop CS5 in Creative Studio CS5. I have read and understand several help articles on square and rectangular pixels used for various video aspect ratios. I am using the camera button on the bottom right of the Program monitor to captue a frame and save as a jpg file. When I open the jpg file in Photoshop to edit for a DVD disc cover using the Elliptical Marquee Tool with a fixed ratio of 1 to 1, the result is not the circular image I need but wider. This must be an aspect ratio conversion that I am missing. I have seen conversions that correct this by lengthening the height but the image is also lengthened and thus results in a distiortion.
How do I correctly deal with this aspect ration conversion between Premier Pro and Photoshop without distortion?

This is most likely a PAR (Pixel Aspect Ratio) issue. With SD (Standard Definition) Video, you can have Standard 4:3 w/ PAR = 0.9, Widescreen 16:9 w/ PAR = 1.2, or a non-standard 4:3 w/ PAR = 1.0 (rounded PAR's for NTSC).
In Ps, you have the ability to adjust the PAR, under the Image menu from the Toolbar. For use on a DVD, you would choose a PAR of 0.9 if you have Standard 4:3, or 1.2 for Widescreen 16:9.
With the PAR adjustment, to match your Video footage, you should then be able to get what you want, without the distortion. Also, note that one can change how the PAR displays in Ps. By default, it will be Square Pixels, or PAR = 1.0, and you should get an info message that the display is not showing the exact PAR. This can also be changed in Ps.
For more discussion on PAR, see this article: http://forums.adobe.com/message/3456609#3456609
Good luck,
Hunt

Pasting from Illustrator to Photoshop doesn't maintain aspect ratio

I have vector artwork that is not aligned to a pixel grid in Illustrator. In CS5, I would be able to paste the vector object as a smart object into Photoshop file that was larger than the illustrator image and resize larger while holding shift to keep the ratio the same.
However with Creative Cloud, if I have a square in Illustrator that happens to be 17.3px by 17.3, then paste to Photoshop in a file that has a larger canvas than the paste, I get uneven horizontal and vertical ratios (width = 18; height = 17). It seems to overestimate the width and make it appear fatter horizontally (which is the wrong aspect ratio). This is very noticeable when vector objects (like perfect circles and small icons) get scaled up in Photoshop.
I have tried unchecking and checking "Snap Vector Tools and transforms to Pixel Grid" but this doesn't seem to fix it.
The only way I've been able to get this ratio to be kept is to create a new document with the size automatically changed to clipboard dimensions (which are the desired 17x17). When you paste as smart object, it now uses the correct aspect ratio.

When you paste an object into Photoshop take a look at your options bar to see if the Maintain Aspect Ratio button is checked. I'm guessing that it isn't which is why Illustrator objects are being pasted at different heights and widths. As you can see in the image below, a perfect circle from Illustrator is being placed in Photoshop at 100.05% and 99.44%. By checking the link button between the two percentages the numbers get locked to the same percentage so that the object is pasted in at the correct dimensions.

Text and aspect ratio for creating it in Photoshop

Hi there,
I am doing something that will be displayed via a laptop. I am making titles and text blocks in photoshop, because the text feature in FCE looks quite bad with scrolling or animated texts. I am confused about the aspect ratio. For something that is going to be played on a laptop>projector, would i create the text in 720x480 OR 740x540. Thanks for your help, i really appreciate it.
Karen

Karen,
If you will be viewing on a TV or burning a DVD, you need to account for the rectangular pixels of that output. If you will be using Quicktime to view the movie to a projector, you will need use a different aspect ratio.
So: TV/DVD
Create image at 720x540
Add text
Image Size, unclick Constrain, size to 720x480
Add to FCE. Go to Motion:Distort:Aspect Ratio:0
Quicktime:
Create image at 720x480
Add to FCE - Image will look sqeezed, but will be fine in QT.
Personally I would use the text creators in FCE. Remember, text will look BAD until it is rendered and output. Preview on Canvas is not good.
Hope this helps.

Photoshop to dreamweaver viewable in all aspect ratios

Similar Messages

Maybe you are looking for