Viewing Automatic @2x images!

Automatic @2x images!



User: Damon Z. 11 years ago
Please make it so I don't have to think about making them myself, that is just retarded. Let me drag ONE image with enough resolution for both onto the page and then EverWeb does the rest. It's details like this that make me miss iWeb. I want to be able to focus on DESIGN not duplicating files and changing the filenames.

(or at least let me duplicate and rename files in the Assets window)

(and would be good if there also was an "open in external editor" option in assets window)

Last edit 11 years ago
User: Roddy 11 years ago
Assuming you have an image with a high enough resolution to qualify as "retina", how long does it take to duplicate it, add @2x to the file name, double click the original to launch it in Preview.app, click "Adjust Size" in Tools, divide the width by two, click OK, save and drag then into Assets?

If you can't spare 30 seconds per image, I'm sure there's an AppleScript for doing just that!
Quote:
It's details like this that make me miss iWeb.

iWeb never had retina capability.
Quote:
let me duplicate and rename files in the Assets window

What good would that do? How is this going to produce two images of different resolution?
Quote:
an "open in external editor" option in assets window

You can open any image in the Assets List in Preview by clicking the "eye" icon. That way you can reduce the resolution of the original within EverWeb rather than use the method described above.
Quote:
that is just retarded

Hmmm!

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Damon Z. 11 years ago
Well, to clarify:

I want to be able to have one high resolution picture that I can drag into EverWeb, then resize it to my heart's content and when I publish I want EverWeb to sort out the rest.

I don't want to have to think about stuff like that, it should be totally unnecessary.

When I start designing a webpage, I have no clue how big various images are gonna be. And when I found out (by moving, resizing, rotating, whatever) I don't want to have to redo the files.

My personal reason that I loved iWeb was that it was a one-stop-shop. I lot of that is missing in EverWeb.
User: Roddy 11 years ago
There seems to be some confusion about image size and resolution.

Images are displayed on a web page using an HTML <img> tag. At its simplest it would look like this...

<img src="image-name.jpg" alt="alt text">

If the image is 1200px x 900px then that's the size it will appear on the web page - whether we want it or not. To control the size some styles are added...

<img src="image-name.jpg" alt="alt text" style="width:600px;height:450px;margin:0;padding:0;border:none" alt="alt text">

Now the image will be displayed at 600px x 450px but the image file size still remains the same. In other words, the 1200 x 900px image has been squeezed into a 600 x 450px container. The net effect is to give a resolution which is twice that of an image which has a file size of 600 x 450px. This is how "retina" works.

The above situation is obviously not efficient in terms of page download time so the @1x image should be imported at the same size that it will appear in the browser.

If a retina quality image is required, a second image needs to be imported at the higher resolution and be named "image-name@2x.jpg". Provided that there is some means to make the switch - such as retina.js - the higher resolution @2x image will be displayed on retina screens.

It may also be worth your while having a look at this topic.

Last edit 11 years ago

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Paul-RAGESW 11 years ago
iWeb did not have support for high resolution, retina images. Everweb can actually do what you want. You can drag a single image with @2x at the end of the file name and EverWeb will create the retina and standard version for you. No need to resize in an external editor.

Remember, images can not be scaled up without losing quality, only scaled down. As well, many people may want graphics optimized for each resolution. Not just scaled down.

-------------------------------
Paul
EverWeb Developer


Post Reply
You must login or signup to post.