Resizing for the web

Similar Questions

• Best app for the batch processing of photos for the web?

  I would like to know what is the best application for batch processing photos for the web quickly and easily. I'm a web editor and often need to resize, compress, or crop several photos and would like a quick way to configure the basic parameters and processes for example 20 pictures at once. Basically, I'm looking for something with the ability to FastStone Photo Resizer (I'm on a Mac and cannot use FastStone). I remember an once suggested graphic designer LightRoom - would that be a good idea or Adobe has something else? Or maybe not Adobe at all?

  PhotoShop seems heavy for this purpose: it is ideal to make the photo woth that much at the time, but less large to do less with many pictures at once. I know that I can implement some sort of macro-thingie, but I would like to be able to quickly change settings such as the percentage of compression or the width in pixels.

  I don't need a lot of editing tools, mostly just work in pixels, resizing, compression or cropping and save for the web in .jpg and .png - and Mac.

  I hope someone here can guide me in the right direction.

  Hi eval

  I think the best thing for you is Adobe photoshop elements, cover in simple not expensive and all what you want

  Photo Editor software & tools | Adobe Photoshop Elements 14

  concerning

• I need to create combinations of text and images for the web. How to do this in elements or do I need Photoshop for this feature?

  I need to create combinations of text and images for the web. How to do this in elements or do I need Photoshop for this feature?  Please advise!

  slynn5236 wrote:

  I need to create combinations of text and images for the web. How to do this in elements or do I need Photoshop for this feature?  Please advise!

  You can do in PSE.

  1. Do the math to see how much space you'll need on your canvas to the image and text.
  2. Navigate to the file queue > new.blank. Enter the width & height, background color, resolution 72 px / in. It is your canvas, and in the layers palette will be the background layer.
  3. Copy and paste the image. It turns on a separate layer
  4. Activate the tool move, position the image and resize if necessary
  5. Activate the text tool, and then type your text. It will be on a separate so layer
  6. Position the text.
  7. Flatten layers and go to file > save for web. I'm usually on the long side about 800 px. Don't forget to check "constrain proportions". Adjust the quality slider to suit. You will probably want the type of JPEG file for web work.

• What are the recommended settings for the export of photos for the web?

  I am a photographer, if the images would be used for my blog... and still need of decent looks.
  They are also the images that I approach clients, again, they need for decent, but would be the right size for the web.
  I played a bit, and when we maintain quality"to 100%, but the setting at 72 dpi, the image remains the same size at 300 dpi.
  So I got the quality up to 50%, but even slight vignetting seemed absolutely horrible. (Highly visible sections of different colors.)
  So now I'm stuck.
  72 dpi and 300 dpi made no difference in size (cannot explain this one.)
  100% quality seemed fine but was too big for the web.
  50% quality was mediocre at best.
  Any suggestions? What is the standard practice?
  Thanks in advance.

  I would use a quality of 70-80 and also resize the image under 'Image size' for example, you pick a long edge of (for example) 1200 pixels.

  The ppi (dpi not) makes absolutely no difference, it's completely out of words and useless in this situation, as you found it. Just ignore it.

• Best way to prepare images ProPhoto RGB for the Web?

  My working to Edit my RAW files color space is ProPhoto RGB. My master files are saved as ProPhoto RGB 16 bit layered PSD files. I am aware of the many ways to prepare my images for the Web, but it is better to properly view my work on a web site?

  
  

  «Save for Web...» "of Photoshop is easy, but it's also good work like resize manually,"Convert to Profile"(sRGB), then" save under... ". "an 8-bit JPEG? I noticed "Save for Web...» "its color space designated as"Untagged RGB", while the manual method is"sRGB"will create a file w. Any difference? Thank you.
  

  Were you not satisfied by the answers you got this question on Luminous Landscape forum? I will repost mine here:

  ---

  You should always incorporate the profile. With the notable exception of Internet Explorer (which seems to be a lost cause), most browsers now manage well of color management. At least Safari and Firefox both do.

  Save for Web in Photoshop always band profile with default settings, you will need to check the "embed color profile". This setting sticks. Personally, I think it's well past time to change this default, but that's it.

  While you're there, check "Convert to sRGB" and set to "use the embedded profile. This shows you the image with full color management (using the monitor profile to display). Here still SFW uses an obsolete default from the old days, when browsers were not color management.

  If you use a range wide screen a few special considerations come in and in Firefox, a manual adjustment has be activated (color management mode 1) *.

  Regarding resizing, I have no particular opinion. SFW seems to do well. But you should do a final sharpening after resizing, that needs to be done in Photoshop anyway, so he can probably handle resizing too. Construction while some actions and you are ready.

  Firefox users should enable this setting in all cases, regardless of monitor they use. What it does is assign sRGB to any untagged material. This allows full color management chain, instead of just go directly to the screen unmanaged. IOW, even color management on hardware untagged, so long as it is created in sRGB with sRGB numbers.

• scale of a project for the web

  Hello

  I designed a greeting card that is 1022.23x1021px

  I need this scale because I want to do a page soon for a future website entry

  In what dimensions I need to scale all of the work (drawing/text) up and down to be seen on the 4: 3 and 16: 9 monitors?

  There are the standard size smartphone and tablets too, I guess, I need to create multiple work plans?

  As I explored Dreamweaver CS6 I noticed that the dimensions are indicated in mode 'design' at the bottom of these devices, perhaps I could use them?

  Thank you

  Just in case a Visual will help you, here is a quick tutorial on the scaling for the web:

  (1) go to the file > save for Web

  

  (2) this will open a dialog box with many options for recording.

  The area marked as "A" is where you choose the type of file for your image, which, as said by John, would be a .gif file or a .jpg file, or a .png if your document contains transparency.

  The section marked 'B' is where you can easily resize your document. Unless you click on the screen next icon size boxes, your image will be automatically kept for its proportions when you enter a new value for the height or width. Also, be sure to check the option "Clip for work plan" If you get all additional items that may be persistent in your work space.

  

  I also agree with John when he says to redial in a work plan in the dimensions desired of your final image for the web. And you are right in terms of multiple work for different devices. In the screenshot below, I have a work plan in the dimensions of your original document (1022 x 1021) and one for the dimensions of the screen of the iPhone. This makes it really easy to alter compositions based on the dimensions and proportions of the various devices.

  

  Here is a link on the preparation of graphics for multiple devices: http://codebycoffee.com/2010/12/08/preparing-graphics-for-multiple-mobile-platforms/

  I hope this helps! If you need more web help, feel free to post in the Dreamweaver forum!

• Save two-dimensional image od for the web

  Hello

  I made the script (with your help ) to export images for the web with dimensions 300 x 300 px. Now, I want my script to resize more than files that I get two files one 300 x 300 and another 66 x 66 px. I'll post my script and you ask hel find me the bug

  And another question. My script exports the file name + jpg, but it also keeps orginal extension if I get IE. FileName.psd.jpg

  can you help me solve this in my script... else is very well...

  Thank you

  Voah

  Edit:

  At the time of meen I managed to solve the problem, so here's the new script

  But I still have one thing I want to do. I have to manually do folder "300 x 300 and '66 x 66' or my script stops." How coud I do this script make sure files? (inputFolder/300 x 300 / and inputFolder/66 x 66 /)

  Save current preferences dialog

  var startDisplayDialogs = app.displayDialogs;

  Save preferences of current unit

  var originalRulerUnits = preferences.rulerUnits;

  preferences.rulerUnits = Units.PIXELS;

  var inputFolder is Folder.selectDialog ("select input file");.

  var outputFolder is Folder.selectDialog ("select output folder");.

  ProcessImages();

  function ProcessImages() {}

  var filesOpened = 0;

  If (inputFolder == null | outputFolder == null)

  {

  If (inputFolder == null) {}

  Alert ("no source folder selected");

  }

  If (outputFolder == null) {}

  Alert ("no output folder selected");

  //      }

  }

  else {}

  List of files of the var = inputFolder.getFiles ();

  for (var i = 0; i < fileList.length; i ++) {}

  If (instanceof file in the list of files [i] & &! fileList [i] .hidden) {}

  Open (fileList [i]);

  ResizeImage();

  filesOpened ++;

  }

  // }

  }

  Return filesOpened;

  }

  function ExportPng (filePrefix, fileSuffix) {}

  Try

  {

  var app.activeDocument = docRef;

  var Nomdoc = app.activeDocument.name.slice (0, -4);

  saveOptions var = new ExportOptionsSaveForWeb();

  saveOptions.quality = 70;

  saveOptions.format = SaveDocumentType.JPEG;

  saveOptions.optimized = true;

  docRef.exportDocument(File(app.activeDocument.path+'/300x300//'+docName+'.jpg'), ExportType.SAVEFORWEB, saveOptions);

  }

  catch (e)

  {

  Alert ("error when you try to save the image.") \r\r"+ e);

  return;

  }

  };

  funkcija export 2

  function ExportPng2 (filePrefix, fileSuffix) {}

  Try

  {

  var app.activeDocument = docRef;

  var Nomdoc = app.activeDocument.name.slice (0, -4);

  saveOptions var = new ExportOptionsSaveForWeb();

  saveOptions.quality = 70;

  saveOptions.format = SaveDocumentType.JPEG;

  saveOptions.optimized = true;

  docRef.exportDocument(File(app.activeDocument.path+'/66x66//'+docName+'.jpg'), ExportType.SAVEFORWEB, saveOptions);

  }

  catch (e)

  {

  Alert ("error when you try to save the image.") \r\r"+ e);

  return;

  }

  };

  ResizeImage() function

  {

  If (app.documents.length > 0) {}

  var app.activeDocument = docRef;

  var n = docRef.pathItems.length;

  If ((n>0) & & (docRef.pathItems [0] .name! = "Work path")) {}

  docRef.pathItems [0] .makeSelection ();

  docRef.selection.invert ();

  docRef.selection.clear ();

  docRef.selection.deselect ();

  }

  };

  function fitImage() {}

  var app.activeDocument = docRef;

  docRef.trim)

  var docWidth = docRef.width.as ("px");

  var docHeight = docRef.height.as ("px");

  If (docWidth / docHeight > 4.8)

  {

  docRef.rotateCanvas (315)

  docRef.trim)

  }

  ElseIf (docHeight / docWidth > 4.8)

  {

  docRef.rotateCanvas (45)

  docRef.trim)

  }

  If (docWidth < docHeight)

  {

  docRef.resizeImage (undefined, UnitValue(270,"px"), 72, ResampleMethod.BICUBIC)

  }

  ElseIf (docWidth > docHeight)

  {

  docRef.resizeImage (UnitValue (270, "px"), undefined, 72, ResampleMethod.BICUBIC)

  }

  Else if (docWidth == docHeight)

  {

  docRef.resizeImage (UnitValue(270,"px"), UnitValue(270,"px"), 72, ResampleMethod.BICUBIC)

  }

  docWidth = docRef.width.as ("px");

  docHeight = docRef.height.as ("px");

  If (docWidth < docHeight)

  {

  docRef.resizeCanvas (UnitValue(300,"px"), UnitValue(300,"px"), AnchorPosition.MIDDLECENTER);

  }

  ElseIf (docWidth > docHeight)

  {

  docRef.resizeCanvas (UnitValue(300,"px"), UnitValue(300,"px"), AnchorPosition.MIDDLECENTER);

  }

  Else if (docWidth == docHeight)

  {

  docRef.resizeCanvas (UnitValue(300,"px"), UnitValue(300,"px"), AnchorPosition.MIDDLECENTER);

  }

  };

  var app.activeDocument = docRef;

  var docRef.activeHistoryState = savedState;

  fitImage();

  app.displayDialogs = DialogModes.NO;

  ExportPng (file ('.jpg ',' '))

  docRef.resizeImage (UnitValue(66,"px"), UnitValue(66,"px"), 72, ResampleMethod.BICUBIC);

  ExportPng2 (file ('.jpg ',' '))

  docRef.close (SaveOptions.DONOTSAVECHANGES);

  docRef = null;

  }

  Reset the application preferences

  app.displayDialogs = startDisplayDialogs;

  preferences.rulerUnits = originalRulerUnits;

  Does that help?

  main();
  function main(){
  var originalRulerUnits = preferences.rulerUnits;
  preferences.rulerUnits = Units.PIXELS;
  var inputFolder = Folder.selectDialog("Select the input folder");
  if(inputFolder == null) return;
  var fileList = inputFolder.getFiles(/\.(jpg|tif|psd|png)$/i);
  var outputFolder1 = Folder(inputFolder + "/300x300");
  if(!outputFolder1.exists) outputFolder1.create();
  var outputFolder2 = Folder(inputFolder + "/66x66");
  if(!outputFolder2.exists) outputFolder2.create();
  for (var a in fileList){
  open(fileList[a]);
  var Name = decodeURI(activeDocument.name).replace(/\.[^\.]+$/, '');
  app.activeDocument.trim(TrimType.TRANSPARENT);
  FitImage(300,300);
  var saveFile = File(outputFolder1 + "/" + Name + ".jpg");
  SaveForWeb(saveFile,70);
  FitImage(66,66);
  var saveFile = File(outputFolder2 + "/" + Name + ".jpg");
  SaveForWeb(saveFile,70);
  app.activeDocument.close(SaveOptions.DONOTSAVECHANGES);
  }
  preferences.rulerUnits = originalRulerUnits;
  }
  function FitImage( inWidth, inHeight ) {
   var desc = new ActionDescriptor();
   var unitPixels = charIDToTypeID( '#Pxl' );
   desc.putUnitDouble( charIDToTypeID( 'Wdth' ), unitPixels, inWidth );
   desc.putUnitDouble( charIDToTypeID( 'Hght' ), unitPixels, inHeight );
   var runtimeEventID = stringIDToTypeID( "3caa3434-cb67-11d1-bc43-0060b0a13dc4" );
   executeAction( runtimeEventID, desc, DialogModes.NO );
  }
  function SaveForWeb(saveFile,jpegQuality) {
  var sfwOptions = new ExportOptionsSaveForWeb();
     sfwOptions.format = SaveDocumentType.JPEG;
     sfwOptions.includeProfile = false;
     sfwOptions.interlaced = 0;
     sfwOptions.optimized = true;
     sfwOptions.quality = jpegQuality;
  activeDocument.exportDocument(saveFile, ExportType.SAVEFORWEB, sfwOptions);
  }
  

• Prep file InDesign for the web.

  PSCS5, Mac OS 10.6.4

  I need to prepare a book cover created in InDesign display with online sellers (Angus & Roberton, Austraila, and Amazon for beginners). My first attempt and prepare the InD file for the web has failed. No file is available from each provider. Can you help me?

  The InD file is 8 "x 8", contains 2 images, 2 vectors of I and PS text. " PS files are set at 350 dpi (by record the print service bureau). The book is intended for the wet press 4 colours. The first set of wet proofs are superb, so I know I'm on the right track with color, related, etc. images management.

  My first approach when I tried it prepare for the web was to export the InD file in a JPEG file, open it in PS and save it as a .psd file before making any changes. After you convert the color in RGB, I resize to 3 "x 3" at 72 dpi, then saved as a JPEG file with a new name. "  I think that the resizing and resolutoion is where I was wrong. But I am at a loss for the right way forward and what parameters to use for the image size and resolution.

  What is the procedure I should I have followed to prepare the cover over a picture for the web? Here is the image exported in JPEG format at 150 dpi.

  Thanks in advance.

  Toni

  

  Toni...

  I'm doing print and web and often take a page ID to an image.

  What I do...

  1. Export Indesign to PDF. (Use any standard PDF job option you have, same PDFX1a)
  2. Drag the PDF Photoshop > open 300 PPI and no matter what the dimensions are already present.
  3. If necessary, crop and flatten the image in Photoshop. (PDFx1a will be cropped and flattening will offset any transparency in the PDF file.)
  4. In Photoshop > file > save for Web > dimensions of the input image I need in the box dialog SFW
  5. Click Save.

  What's been sent by others is correct. There is no PPP/DPI for the web. The only thing that matters is the width and height. If you want you can test to show you. Create 2 images - one to 100 x 100 pixels and 300ppi and the other to 100 x 100 pixels and 72 dpi. Save the two images for the web, and then open the pictures stored in a browser... they are the same size and look identical.

  Export to PDF from ID, you get a crisp, clean the PDF.

  By dragging the PDF to PS, you get a purified PS image. If you export a jpg of ID and then save a jpg of PS that you create artifacts due to the re-registration of a compressed format (jpg).

  Using save for Web to create the final image all the superfluous image data are robbed and you get a basic, clean and crisp image to the size entry in the SFW.

  There are other roads, you can take, but for me this five-step process gives the best results in all cases.

• How can I change my mood Message in Skype for the Web?

  How can I change my mood message in Skype for the Web?

  People of good news: you can now change your mood message in Skype for the Web

  Just click on the picture at the top left of your profile, and then click the small icon of pencil next to the message of change in activity.

• Possible security for the Web-based Configuration

  My colleagues and I found something very interesting today... Despite having configured the FTP security settings (which have been confirmed to set up and in funcitoning. I can't open an FTP session to our remote target without specifying a username admin and the password) If you open the configuration tool based OR web in a browser, you can send via FTP to and from the target using the file remote browser without being connected to all! Everyone knows this?

  Apparently, these permissions are separate from FTP, but you can define these special permissions on the page of the security configuration for the web-based configuration utility.

• Data for the Web service control

  Hello

  I have jdeveloepr User 12.1.3, I WSDL soap, I create the data control for the web service from the WSDL, the problem is when creating data controls the separate parameter that the method, for example, below it is the method that I call the setNotificationAction name and the parameter IN (P_ACTION, P_NOT_ID, P_PASSWORD_ERP, P_TOKEN (, P_USER_ID P_USER_ID_ERP), as below, why the separate parameter that the method?

  Note that I try the binding WSDL SOAP UI and its ok and works as expected.

  

  Resolved by changing the typesList.add (Object.class) at typesList.add (GenericType.class)

• What is the best export for the web?

  What is considered the best export from Adobe Illustrator CC 2015 for the web these days? I know that PNG has the color a bit better than JPEG files. How about SVG?

  What is your recommendation?

  Thank you

  For modern websites of today, vectors are now better saved in SVG. As long as you use the last CC 2015, use file > export to create the SVG (which is newer than the file > save under). It will yield a smaller SVG files.

  Better, photos are saved in JPEG format.

  PNG are not "keep color" better. The JPEG and PNG24 support millions of colors, but a JPEG will be able to compress photographic details better, if you end up with a file of faster loading.

  For HTML Email SVG is not appropriate, so I use PNG or GIF instead (whichever is smaller) to the line drawings in general I want to save it as SVG.

• save multiple files for the web in JPEG max at a resolution of 800%

  I had more than 200 created illustrator files. They all have the same dimensions. I wanted an adobe illustrator script that saves all files for the web in jpeg.

  Export options must be max.resolution of all files should be increased to 800%.

  I think it's the reasoning

  Open a folder with all the files

  loop through each file

  Save for web each in jpeg format to the quality of resolution and up to 800%

  the names of all jpeg files should be the same from these illustrator files (if possible)

  I will be very thankful to you if you could help me

  Best regards,

  Hassan Ali

  As far as I understand your request it is also possible with a simple action in batch mode.

• Color changes during the recording of the PSD to JPEG (safe for the web) in PS CS5 working in sRGB

  As I secured it for the web a PSD file, jpeg version of the same file changes slightly color - I opened the two files in PS CS5 to compare.

  File initially processed in Lightroom 6 and converted to sRGB for export.

  I worked in the sRGB color space in Photoshop.

  When exporting I secured for the web. I tried both options checked including the color profile and convert to sRGB.

  I tried to save to the web as a PNG and color remained the same, she only moves for JPEG files.

  You can't really see the difference in color with a naked eye, but be specific. I don't understand why he would change when I work in the color space is sRBG. Please help this is driving me crazy!

  JPEG compression can change the values, even quite spectacular on single pixel level. You have the selector of color set to "sample point"?

• How can I save my picture for the web and devices?

  How can I save my picture for the web and devices?

  I can't find the option when I want to save the image

  Hi jacquelineb,

  What version of Photoshop are you using?

  If you are using the latest version of CC, please consult export images Adobe Photoshop for mobile and web. Tutorials Photoshop Adobe CC

  Let us know if that helps.

  Kind regards

  Assani