What resolution to design for?

What is considered the standard resolution that the majority of people use on their computer displays these days?
What size should a web page being designed to work nicely in all the major browsers on both Mac and PC?
Thanks.

There is no one size fits all answer to this. The web is accessed by a wide variety of mobile, desktop and laptop devices these days. Decide who your target audience is and build for that demographic. If your server offers meaningful stats, you can see which res. the majority of your site visitors have and build accordingly. Be sure to shave off about 30px for browser chrome. If you don't have web stats, get Google Analytics.
Related thread -
Web Page Width Most Used by Web Designers:
http://forums.adobe.com/thread/503725?tstart=60
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Similar Messages

What inspires a design for your personal/fun websites?

What personally do you do or experience that gives you inspiration in the design aspect of a website you build just for fun? Do you look at other websites and see their layout? Do you talk to friends? Draw something? I'm simply curious as I kinda hit a rut -- that is, I noticed a majority of the sites I've done are nearly the same layout. There's no real pizzaz, if you will, to the actual design aspect of it all.
Well, that or my disgusting lack of skill in Photoshop, Illustrator, and Flash

This is a very vague topic to discuss! Creativity - is the keyword. When/ Where/ How/ What is something we should figure out.
Personally, I follow the diamond principle. What > Why > How > What Else in every design initiative I take up.
What is it that has to be built/ made for this project? Brainstorm and shortlist many ideas, finalize on one. Also ask yourself why are you finalizing on the one you just did and why not the other concepts? Once you have an answer that justifies your choice, proceed.
Why am I doing this project the way I'm doing it? Many reasons - what is in it for me? Financially & for my love for design. The first one pays your bills. 2nd one helps you set benchmarks of your work. No two work that you take up should be the same. In fact, the 2nd work you take up should always be better than the 1st. Not always the case though - your 2nd client may not pay you the same that your 1st client did. Time crunches. Lack-of-creative-juice. Many. Also, this may be a good time you sit back and ask yourself if you're sure that you're not just doing it for 'making money'. To me, that is always secondary. Satisfaction in what you do is foremost in putting you on the right track on being a 'good designer'.
How will I do this project? Resources required, role clarity, paper sketch - actual design, wireframes, mock-ups - basically making sure everything you need (including little details) are all concrete before you begin. At no point during the project you want to look back and say 'Oh, I missed out on that! How am I going to move forward?'.
What Else can I do to: a. make this client happy so he stays with me on long-term projects, b. improvise this project to ensure it is a big plus in my portfolio, c. recommend to the client about making it better, d. help the client understand how he can plan his roadmap to improvement?
That said, the layouts - if they're the same in the work you do, it is either a mental-block that you've created for yourself or a standard you've set for yourself. It cant be that bad. All it takes is a few tweaks, lots of coffee, lots more of sleep. As a creative guy myself for almost a decade, I think the best way to overcome a 'creative-roadblock' is to have a good night's rest - I know it is very difficult to get. But when you do have a chance, take that break. You deserve it and it works wonders!
Coming to your other point, it aint wrong to take a look at other websites/ others' work as long as you don't do a Cmd + X/ C, Cmd + V. But, it's always good to get good inspiration from people whom you think 'inspire'.
Finally, you must take into consideration that a FOB designer, a 'wannabe' designer and an expert designer - all have 1 thing in common. The tools they have access to. Fine, some can't afford expensive calibration devices or super-expensive design tablets. But, as a designer, 2 major elements are your creativity and the softwares that bring them to life. They're common. Like you said, I use Photoshop, Illustrator, Fireworks, Flash & Dreamweaver myself - day in day out. These softwares are standard, the tools they offer are also standard. What differs is how each one uses it and leverages its functionality to bring to life what they pictured in mind. If this still doesn't work, there's something fundamentally wrong with their 'creativity' or 'creative ability'. No offense here, but this is the fact!
Off the head, I'd also like to share with you a website that I've fallen in love with in the past 4 months. I visit it almost once every week! Beautifuly made. www.blacknegative.com - jQuery is king and this site is a standing proof!
Also, I've recently been inspired by a TED bestseller Simon Sinek. His concept is very similar to mine. Of course, not mine - but a world standard roadmap building concept that I mentioned here - What, Why, How, What Else. Simon talks about it in terms of companies that excel vs companies that fell - How great leaders inspire action - marketing concepts per se. You may want to take a look at his video here - http://www.ted.com/talks/simon_sinek_how_great_leaders_inspire_action.html
PS: Creativity is not limited to 'design'. It's everywhere. We just have to capitalize.
Cheers,
ST

What resolution is needed for 2m x 2m sign?

I'm designing something that's intended for a sign of 2metres x 2metres.
What sort of resolution do you think I'd need to start it at?
Also, if I've already done a design - one of far lower resolution - is there any way to convert it to a higher one, or will it just distort? I'm assuming it will, but this isn't really my area of expertise!
Thanks,
James

It really depends on how you want the printed sign to look. For a sign that big, my guess is that it will be viewed from afar, rather than up close. In that case, you could easily get away with 150 dpi—perhaps even lower, depending on the look of the sign. Hope that helps.

What resolution - JPG's for 500x s.s. ...?

Ok; I've finally got my slide-show collection together. They're all jpg's. Now how do I control/determine their resolution so as to limit their file sizes..?
I'd set them up in PhotoShop(CS2). One of who's options is jpg quality when saving. This isn't a very precise resolution indicator - just a slider.
I've got photos in a rectangular layout with a s.s. max of 500 px on the long side.
What sort of pixel density might I try aiming for.?
How to find the balance between decent quality for those with high-speed, and reasonable access speed for those with dial-up..?
Or,,, how does I do dis..?
Any help greatly appreciated.!

If your images are 500 x 375 (if you are using 4:3 aspect ratio), that is your pixel density. The quality slider when you are saving the jpegs is for the amount of compression, which decreases the file size the lower the number, but also adds noise - like halos around text and such.
Your image size is perfect as far as the resolution. If you are using Photoshop, I love to use the "Save for web..." in the file menu. It opens up a window where you can tweak further. At the top there are tabs where I like to look at the 2-Up view to see the original vs the edited (I am using CS1, so it might be a bit different in your version).
On the left you can select the file type and amount of compression, etc. For jpegs, you can choose the compression amount from the drop down menu below the file type. I always play with it to find a balance between the smallest file size possible while retaining image fidelity. You can see the file size at the bottom of each image's window.
I also like to try .png format just to compare file sizes to the jpegs. If you want to know more about the .png format got to Wikipedia and read all about it.
Once I have found my balance, I hit the Save button and save the file to and "Edited for web" folder I created so I don't lose my originals. I've found that this feature of Photoshop is the one I am using the most lately since I manage 2 websites. I'll even use it to lower the file sizes for keynote presentations or emails - any program where file size is an issue.
Hope this helps. Good luck!

What Resolution To Crop For Photo Display On Widescreen TV? Please Help

Hello,
I'm having great difficulty trying to crop my photos for display on a widescreen TV.
The resolution of the TV is 1920x1080, and when I crop to those dimensions I get the black letterbox bars on top and bottom of the screen when I display my photos on the TV.
What specific XXXX x XXXX numbers should I use when I crop in order to display my photos from edge to edge on the TV without the black letterbox bars?
Also, could you please specify the proper ratio number to enter into Lightroom for the same purpose? Apparently Lightroom requires a ratio number as opposed to pixel numbers in the dialog box. When I enter 16 : 9, the resulting crops display the black letterbox bars when viewed on the TV.
I've searched the net and read many discussions about pixel aspect ratios and dimensions and square pixels, etc., and I am totally confused because I should be able to achieve my goal with a 16:9 ratio, but no matter what I do I end up with the letterbox bars when displaying my photos on the widescreen TV.
Thanks very much in advance!

You'll need to describe just how you're getting those images onto the TV I think, for people to be able to answer this reasonably.
Is the TV plugged-in to the computer's video card? Or are you making a video that you're displaying off a DVD or similar?
-Noel

I'd like to use Time Capsule as Router and remove D-Link Router. Is that what it's designed for?

I currently use a D-Link Router and also have a 1st generation time capsule as use as a back up device. I've just purchased a new 2TB Time Capsule and would like to use it as my primary "only" router just after my cable modem, it that there primary design?
Currently I have a Cable modem with a Static IP address and then on the D-Link I've configured my NAS, Power Mac, iMac and Computers with all there own IP address. I've looked on the Time Capsule I have hooked up now and I'm not sure if the TC will let me do that.
I really should of researched before, but I'd just bought a mini mac with lion server and it talked about the ease of using TC with it and purchased before researching...

I've just purchased a new 2TB Time Capsule and would like to use it as my primary "only" router just after my cable modem, it that there primary design?
Yes, the Time Capsule is designed to connect directly to a modem.
on the D-Link I've configured my NAS, Power Mac, iMac and Computers with all there own IP address
You can set up "static" IP addresses for each of your network devices....IF....the Time Capsule is set up to be the "main"' router on the network.
Open AirPort Utility and click Manual Setup
Click the Internet icon
Click the DHCP tab below the icons
The DHCP Reservations box will allow to you assign a specific IP address based on the MAC address or AirPort ID of each device.
Devices could be assigned IP addresses in the 10.0.1.x range or 192.168.1.x range depending on your preference.

[N95] What resolution to use for contact-tumbnails...

Can some1 tell me how big the pic should be for my contact-tumbnails?
(resolution)
Thanks...
"Wham, Bamm, thank you Man!!"

you can put in any resolution and it will resize it

What are best uses for Fireworks?

I've been working with dreamweaver, flash and photoshop for years, but have avoided Fireworks because I could make a nav bar some other way, in flash or just use mouse-overs in Dreamweaver. Now I bought the CS5.5 upgrade and it includes Fireworks which now I am totally unfamiliar with. Could you tell me what I can use Fireworks for to help my small home-based website building business?
Thank You,
Ken

Fireworks' workflow is better suited to Web development, than Photoshop or Illustrator. That's what it was designed for.
For example, I will make different layers for different content areas. I might have a layers for the background, the header, the footer, and any placeholding content text I want to include just to see how it would look. Layers in Fireworks allow you to organize the content of a Fireworks document in ways that I don't think you can do as easily in Photoshop. This makes it easy to concentrate on one area while having the other areas locked or hidden.
Also, with FW, you have a hybrid bitmap and vector graphics program. It can do some of what both Photoshop and Illustrator can do, so you spend less time moving between applications. It's easy to manipulate and composite bitmaps and vectors in FW. (Naturally, you should use the tool that is best suited for a particular task: complex photo editing should be done in Photoshop and complex illustrations created in Illustrator.)
Like LInda, I will mock up my designs in FW. I slice and export my images, then build page templates in DW based on the mockup.

What Screen Resolution should I Design For?

Hi,
For APEX applications in public sites, what should be the proper screen resolution should I design for? Also, when I put something like a chart in a region, the size of the chart is always fixed. Therefore, it may not fit a particular screen size. I am wondering what should be the proper screen resolution I should target for - considering different desktop monitors and tablets?
Thanks.

Hi,
sky123 wrote:
For APEX applications in public sites, what should be the proper screen resolution should I design for? The resolution is not the only problem. Users can use CTRL+ and CTRL- to dynamically zoom in / out the page!
Also, when I put something like a chart in a region, the size of the chart is always fixed. Therefore, it may not fit a particular screen size. I think it is OK to have some elements with a fixed size, like charts and images, while the rest of the page resizes itself. Charts are a problem because I don't think you can give them a "width=100%" as you can do with images. I think it depends on your audience. If only 5% of users will see the page in a small screen, you should use a big chart, and vice-versa. Or have two charts, one big and one small, and dynamically hide/show them based on the screen size?
If you use Apex 4.2, it has very interesting themes. For instance, I was surprised to see how fluid this page I created was:
http://apex.oracle.com/pls/apex/f?p=65861:3:0::NO::P3_ROWID:AAjQ4rAGlAAAADUAAB
If you make the browser window narrow enough, the order items region will move underneath the customer orders region... Cool! :)
(using CTRL+ to make the page bigger doesn't do the trick though...)
Luis

What screen resolution are all of you designing for?

I realize a liquid layout is ideal, but even liquid layouts have an "ideal" resolution the design is built around.
What minimum width are you guys designing for? (ie, 960px for 1024px resolutions)

BobLevine wrote:
Depending on the design I use anywhere from 950 to 1000 pixel widths.
Bob
Thanks for your answer. Mind if I pick your brain regarding these choices?
By my calculations (using latest Windows + latest IE, which represent the majority) the window border occupies 8px on each side.I just measured it a few seconds ago.
The scrollbar occupies an additional 17 pixels on the right side.
Total : 33px of the horizontal viewable area is taken up by the browser.
This would mean that when catering to 1024 screens - which you clearly are - the sweet spot would be 1024 - 33 = 991 pixels max with a borderless design (ie, margin:0 on the body).
Knowing this, why would you ever use 1000px wide? If you were catering to 1280, then you'd want 1280 - 33 = 1247 pixels max. Or are you referring to centered designs that don't scroll?
Is there a conscious and calculated reason why you'd limit yourself to 950px when you've got 40 more to work with, or why you'd unnecessarily force a horizontal scrollbar on all 1024 screen resolutions by designing @ 1000px?

What should the resolution and design size be for an 8' Wide by 2' Tall sign graphic?

I am creating a graphic for an acrylic sign, and the dimensions are 8' wide by 2' tall. What size should my design be to work within Photoshop CS6? Pixels or inches? Resolution? I don't want to lose resolution between design and actual print. Please help. Thank you.

If you intend to have it printed by a commercial shop, I would ask them what they would recommend.

I've just bought a Macbook Pro 15" and I'm trying to use Photoshop, but the resolution its displaying the images at for 100% are too small. I have to design for the web, so need to be intricate with detail, but I'm finding it adjusts the resolution of the

I've just bought a Macbook Pro 15" and I'm trying to use Photoshop, but the resolution its displaying the images at for 100% are too small. I have to design for the web, so need to be intricate with detail, but I'm finding it adjusts the resolution of the image right down. (I mean you can see the image clearly, but it's too small to edit). When I look at Safari and see a web page at 100% it's clear, but the same page displayed in Photoshop CC appears 50% of the size (even though it says it's 100%) If I move the application window to another screen it adjusts it correctly – leaving all the pallettes, menus and tools correctly sized as they are on the retina display Is there some way to adjust the way Photoshop CC displays images so it is more consistent with what you actually see? There doesn't seem to be any answer on the Adobe forum, so hopefully someone here can shed some light. MacBook Pro with Retina display, 15", OS X Yosemite (10.10.2), Photoshop CC 2014

I tested both ways. With "open in low resolution" ckecked the size of the images is cool, but it is low-resolution including Photoshop appearance.
If "open in low resolution" is unckecked the appearance is good but the very small size.
See the image below. It has 650 x 732 px, 72 dpi. The font of the text "Neste aniversário ..." is with 18pt.

What resolution should i take for a movie to be played on 70X20 LED display?

I am working on an animated video that will be played on 70X20 Feet LED display. What resolution should i take?

size of the screen is 80640 X 23040 (in pixels)
You are going to need a monster to playback something like that. Are you sure? The max comp size in AE is 30,000 pixels. Your specs claim a requirement for 80,640 which is about 20 4K displays.
The data rate for a comp that is 42 times wider than HD would be crazy and probably require an array of high end server grade machines and fiber optics to push even 20 fps video through the system.
As I said before, you MUST contact the manufacturer for their exact media specifications.

What Resolution for Slideshow Pictures?

At what resolution should I be scanning pictures for a slideshow to be edited in iMovie?
Many thanks.

Hi awp:
I think that Dan Slagle's site may be just the ticket:
http://www.danslagle.com/mac/iMovie/video/2003.shtml
Sue

What resolution are photos optimized for ipod display? (post computer sync)

From what I've read here, iPod touch forces photos sync'ed from a computer through a optimization step for display on the iPod (and TV). Full-resolution images can only be stored on iPods that have "enable disc use" mode (which iPod touch does not have), and even that mode on older iPods could not be viewed/displayed on the iPod itself.
Just curious...
1) what resolution finally ends up on the iPod side (not sure if it is the same as older iPods)
2) if the zooming feature on the touch goes beyond the optimized photo resolution to the point of interpolation to fill in the blanks
Thank you ahead of time for your insight.

Anyone know?

What resolution to design for?

Similar Messages

Maybe you are looking for