Crisp ,Sharp, Bright Shiny Graphics for web?

Hello all...I hope you guys will answer my question..How to create nice looking professional crisp sharp bright shiny images in Adobe Photoshop and Fireworks..What actualy do i have to consider...?Generally my designs are not crispier and it always saddens me..

azsmatswabi,
I would suggest your posting in the forum(s) of the application(s) you create the artwork in, and that you post images (using the Camera icon to avoid delay by queueing).
Is Illustrator out of the question?
Depending on the nature of the images, you may consider saving for the web as PNG, GIF, and JPEG.

Similar Messages

4 questions on export/importing graphics for Web and Photoshop.

Hi, I have 4 questions here, and if you can answer one or more, I'd be happy!! :-)
1. In general, can there be a loss of quality when I export a file from Illustrator CS3 to Photoshop CS3, and then re-import it into Illustrator?
My guess is that you can switch applications with one single file, but you have to know what you're doing (any advise? I'm working with files that contain both text with either illustrated graphics or photos).
2. When I switch applications like that, which one is the final application I should save my final work from (for use in print and web)? Does this matter at all? (Example: I have text created in Illustrator. I export it into Photoshop and add a filter, and maybe a blured-layer of the the whole graphic.)
3. After completing the steps in the example above, and I do re-import it all back into Illustrator, the image appears with horizontal path-like blue lines, that let me slice the photo/text if I wanted to. Why does it do this and how do I get rid of those blue lines?
4. When exporting a file for web, what options are you setting for .gif and .jpg in order to NOT see its white background/frame around graphic?

1. Yes. The artwork will be rasterized to a fixed resolution in Photoshop. When re-imported it may appear the same, but it will have limited resolution on output, whereas Illustrator vector art has no (or infinite) resolution.
2. Depends on the artwork and what the client or printer has requested. If you can keep the text editable in Illustrator (blur and some Photoshop filters are available) then you'll have a more versatile and resolution independent file than you would if you switched to Photoshop. In the end, if the resolution of you art is adequate, it's up to you which is better for you to work with, based on your skills and experience. Keep all working files so you can make changes to artwork imported from one program into another.
Some features you might enjoy: You can place Illustrator files into Photoshop and make them Smart Objects. They remember they are Illustrator files and can be edited in Illustrator at any time. Rotate, scale, or distort the artwork in Photoshop and it is re-rendered a the PSD file's native resolution. In CS3 you can add filters to Smart Objects while keeping the vector data intact.
3. I have read about this, but as I'm not fully up on CS3 and don't have it installed on my main system I can't help.
4. To not see a white background for JPEG use a different matte colour. JPEGs cannot be transparent, so some colour must show where you want transparency. for GIF, the same applies, but you can turn on transparency. The artwork will be transparent, but the matte colour will determine how the anti-aliased edges are rendered. Use a matte colour that's as close to your expected background as possible or choose None. PNG 24 supports 8-bit transparency, which looks best of all, but is not supported by MS Internet Explorer versions 6 or lower.

Converting illustrator graphics for web

what is the best way to convert Illustrator CS6 artwork for use on a website? I've tried Save for Web > PNG24 but the results are still not great when viewed in Preview or on my web browser.

Many thanks once again Jake. Your point about creating the image at the exact size as for final use is the information I had been looking for. I had suspected this to be the case but could never find any reliable confirmation on forums/google etc, so thanks for that. I've also just noticed that when creating a new file there is an option to increase the ppi resolution to 300, which seems to be an obvious solution to achieving sharper images. Thanks once again for your help, Jake

Graphic for web , aspect ratio 16/9 to be displayed in any monitor

i have to realize an animation 15 sec as intro for a web page, what is best preset in motion to wirk with hdv? dvdpro?
and what is the right deliver format for web? ( web page maker asked me an AVI i don't have in compressor that extension, i am supplying an h264)

hi,
work in any preset you like. It depends on what footage you are using if any. You will just want to make sure its set to anamorphic so it will be 16 x 9.
When you deliver you can choose what size ( ie width and height in pixels) to output at.
As has been discussed here recently avi is a container for many different flavours of codec. I would ask the web page man to be more specific ( and not to choose an avi style but thats my opinion ). Compressor doesnt save as this so you will have to save as some other format and then convert with a someother software. Unless there is a quicktime extension like Perian or flp4mac that handles it?
hth
adam

Scaling Graphics for Web

I have a question for all Web Designers / Developers. I typically like to create my web graphics large, due to flexibility, retina display etc. The problem lies when I need an image to fit a container. Resizing the image stretches the image horizontally or vertically, all proportion is lost. Content Aware Scale is an option I've tried but getting the dimensions correct for horizontal and vertical appears to be a hit or miss. Is there a solution to this dilemma ?

I have a question for all Web Designers / Developers. I typically like to create my web graphics large, due to flexibility, retina display etc. The problem lies when I need an image to fit a container. Resizing the image stretches the image horizontally or vertically, all proportion is lost. Content Aware Scale is an option I've tried but getting the dimensions correct for horizontal and vertical appears to be a hit or miss. Is there a solution to this dilemma ?

Colors turn neon when opening a previously saved for web graphic

Whenever I flatten and save a graphic for web and try to go back and reopen it, all of the colors go to a funny neon. It doesn't let me adjust the colors back completely either. It also happens when I open screenshots. Any idea why this is happening all of the sudden? It didn't used to do this and then just started. I haven't changed anything except maybe did an update to Photoshop. Any ideas?

I have my settings at custom. Color management is set to "preserve embedded profiles."
My working spaces are prophoto RGB for RGB and US Web Coated SWOP v2 for CMYK.
I haven't ever gone in and changed any of these before. Should I?

All graphics / vector in Save for Web are getting blurry / unsharp from Illustrator

All graphics / vector in Save for Web are getting blurry / unsharp from Illustrator. Same problem with save for web in Photoshop. Frustrating to be working as a designer and not be able to create sharp logos for mail sign, word templates, PPT templates etc etc. I purchased this Adobe Creative Cloud package in Sept, and are working on my Mac HD, OSX, Vers 10.9.4. I have been using the same programs on a PC for years and never had this same problem. Its frustrating!! What to do??

gif, jpg and png are pixel formats, so please clarify what the problem is supposed to be.
Screenshots or posted files might help.

Adobe media encoder CS4 - alised graphics and small black bars at 480x360 for web---HELP!

I recently installed the CS4 premiere software with Adobe Media encoder. I encode video for the web.
I have been a professional web video producer for over 10 years and have been using adobe products my whole career
My issues are:
1) I can not get clean edges on my graphics when exporting a flash video (.flv or .f4v) using "field order: progressive" as it should be for web output. All my graphics are high quality and I have tryed many formats (.eps, .psd, .gif ,jpg, .pnd) but once I change the field order drop down in the encoder settings to "(none) progressive" the graphics become alised...
2) My videos which are a size of 480x360 now have small black bars at the top and bottom after encoding the original down to 480x360. I have tried to crop the video so the bar go away but the whole video get fuzzy...WTF
I have spent so many hours reading and searching trying to fix these two issued and I am thinking that I am going back to my old software and discrediting the new adobe product every chance i get!!!!!!!!!!
I was previously using premiere pro 1.5, editing video and graphics and then exporting an uncompressed .mov file and then used Flash 8 Video Encoder to render a .flv file. This produced great video with crisp graphics.
PLEASE HELP

Stan,
I was using the on2VP6 codec at data rates from 275k to 400k with good results. -- with the new CS$ endcoder i am used h.264 at 500k to 700k, video quality looks good but the graphic overlays look like alised crap. In the encoder settings the edges of the graphics get jaged when I make the field order progresive...
I am starting with DV NTSC video at 720x480.
I am going to go back to my old work flow and test it. The settings are a bit different from premiere pro 1.5 to CS4 -- in 1.5 i could export out an unconpressed .mov with square px and then bring that large file to flash media encoder to create the .flv

Need help creating smooth graphic with transparency for web use

I have created a logo that is mostly white with white text and will appear over a textured background image. The logo contains text that I've converted to outlines. I've tried saving it as both a .gif and a .png, but when it's imported into iWeb, the outline of the graphic looks jagged and rastered. When viewed in Photoshop, it looks OK as a .png, but not great as the .gif.
I've tried saving it out as RGB, indexed color and greyscale, using PhotoShops "save for web" function or just saving it as 72dpi myself. I don't know how to get the edges to remain smooth. Any advice would be greatly appreciated.

Thank you J - here's the weird thing. I actually HAD saved it as a PNG24, and it looked fine on my machine. When I sent it to my client, who used it on his iWeb page, it looks jagged.
After I got your answer, I went to his iWeb page and downloaded the same background image he's using and imported it into a Dreamweaver page on my machine, and placed the same PNG logo over top - it looks as crisp and clean as a whistle. I have to assume that something's happening when he imports it into iWeb. Since I know zero about iWeb, I guess I will have to post another question on their forum, unless anyone knows what could be causing this.

How to use chart engine for web dynpro java(EP) for Graphics generation.

Hi Frndz..
now lookiing out for different types of dynamic graphics generations according to my requirment, n i saw the followiing blog
Testing BusinessGraphics in Web Dynpro for Java
Itz very nice to see that we can generate planty of types, but here our server is EP 7.0(not CE 7.1) and i gone thru these links also
http://help.sap.com/saphelp_nwmobile71/helpdata/en/86/243f403f0a9354e10000000a155106/frameset.htm
http://help.sap.com/saphelp_nwmobile71/helpdata/en/0b/79553b066d9414e10000000a114084/frameset.htm
https://help.sap.com/saphelp_nw04/helpdata/en/0c/95c83956852b51e10000000a114084/frameset.htm
here it seems to be Chart Engine n Chart Designer is mainly for BSP(R3), how best we can use this for web dyn pro java.
Thanks in Advance
Regards
Rajesh

hi
if you want to use BusinessGraphics in WebDynpro java you have to configure IGS.
IGS Configuration
https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/4846ac90-0201-0010-099d-d3b4e271849c
Business Graphics docs.
https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/3261cd90-0201-0010-268c-d8d72e358af6
ChartDeigner Usage
http://help.sap.com/saphelp_nw04/helpdata/en/18/d4d43fb9490c65e10000000a114b1d/frameset.htm
Generating Gantt chart using web dynpro business graphics

Is Fw really better for web graphics?

Ok, so I've downloaded the Fw trial to see how it's better
for web graphics than Photoshop. With Photoshop the usual problem
is that I have to mess around to turn on/off layers, copy parts of
images into new images to export transparent logos, tabs etc. so I
hoped that Fw have some intelligent slice system for one step
exports. Unfortunately I haven't been able to find it. Maybe I'm
wrong but it seems to me that Fw has a very primitive flat slicing
system, no overlapping is possible. So for a very basic example if
I have a background graphics on the top of the page that I want to
export (not the entire page) and a logo *on* it that I want to
export as a transparent png or maybe just as a jpg including the
background, it's impossible, because the logo slice will divide the
page into rectangles no matter what. I don't care about
HTML/CSS/whatever I just want to export overlapping graphic parts
in one simple step by properly defined slices. Looks like I
couldn't find the one step solution I hoped for in Fw. Am I missing
something?

I. G. wrote:
> Ok, so I've downloaded the Fw trial to see how it's
better for web graphics
> than Photoshop. With Photoshop the usual problem is that
I have to messing
> around to turn on/off layers, copy parts of images into
new images to export
> transparent logos etc. so I hoped that Fw have some
intelligent slice system
> for one step exports. Unfortunately I haven't been able
to find it. Maybe I'm
> wrong but it seems to me that Fw has a very primitive
flat slicing system, no
> overlapping is possible. So for a very basic example if
I have a background
> graphics on the top of the page that I want to export
(not the entire page) and
> a logo *on* it that I want to export as a transparent
png or maybe just as a
> jpg including the background, it's impossible, because
the logo slice will
> divide the page into rectangles no matter what. I don't
care about
> HTML/CSS/whatever I just want to export overlapping
graphic slices in one
> simple step by properly defined slices. Looks like I
couldn't find the one step
> solution I hoped for in Fw. Am I missing something?
>
>
>
>
>
In a word. Yes. It's designed to work with screen graphics,
and handles
both vector and bitmaps well at the same time. It's got quite
a few
more web-centric workflows than Photoshop.
Fireworks CS3 supports multiple pages. Each page supports
it's own web
layer, so you have much more control over slices and can
avoid the
problems of overlapping slices this way.
Overlapping slices don't work because it's impossible for FW
to
determine which one is the most important - and should be
sliced in whole
>>So for a very basic example if I have a background
> graphics on the top of the page that I want to export
(not the entire
page) and
> a logo *on* it that I want to export as a transparent
png or maybe
just as a
> jpg including the background, it's impossible, because
the logo slice
will
> divide the page into rectangles no matter what.<<
I'm not clear on what you're trying to do here as you seemed
to have
left some information out. Assuming you want a repeating
background
image and as separate slice for the logo.
Draw a slice that covers the width of your background, by
however many
pixels tall you need. Either lower on the page or on a
separate page
plave the logo and slice it as well. As you are not concerned
about the
html or CSS it's pretty straightforward from there. Just
export the
slices, and tell FW not to include unsliced areas. In your
html, set you
background image as a background image and your logo either
as an inline
image or as a background image within another containing div.
HTH
Jim Babbage - .:Community MX:. & .:Adobe Community
Expert:.
http://www.communityMX.com/
CommunityMX - Free Resources:
http://www.communitymx.com/free.cfm
.:Adobe Community Expert for Fireworks:.
Adobe Community Expert
http://tinyurl.com/2a7dyp
See my work on Flickr
http://www.flickr.com/photos/jim_babbage/

How to save vector work sharp for web?

Hello guys, I need all your help!
I am trying to import a full color vector work from illustrator into an iPad.
The original illustrator file is about 10MB and I am trying to achive size that is under 128K.
I used "save for web" but result is not sharp enough at all.
Is there a better way to save without loosing much detail and still keep the size small from illustrator?
Should I import to photoshop first to save? I am just throwing ideas.
Thanks,
W.

I have finally figure out how to save files in smaller size with out loose much quality but now I am encounter with the another issue.
Files' (JPEG) typefaces are sharp and legible look perfect on iPad, when the same file (JPEG) imported to iPhone, the typeface was not able to read.
iPad is much bigger than iPhone. Images work perfect for iPad in theory it shouldn't have lack pixel issue.
It really beats me. I don't know how to figure this out. If you have any idea, please let me know your insight.
Thanks,
W.

Creating Graphics destined for Web & Television

I am having issues with creating graphics for a video destined for both web and tv.
Because I am going to DVD, the video needs to be interlaced (I will get best quality on my interlaced video assets). I created interlaced graphics and everything is great. Now, in order to deliver this video to the web, I must de-interlace the video. The problem with de-interlacing is that the video looks fine, but the graphics get ugly stairstepping on them.
What is the best way to get smooth clean graphics when the video is destined for both web and television?

The biggest issue is that I must create the video as interlaced because I am working with multiple interlaced source materials. The video is then going to DVD as well as web. It makes sense for me to have the final video be interlaced so I can preserve the full quality of my source materials and get smooth movement on a television monitor.
How do I then deliver this video to the web with clean graphics? I must deinterlace for the web and I am losing half the resolution of my video. The deinterlacing makes my graphics stairsteppy and ugly.
Anybody have a suggestion?

IBook for Graphic and Web Design

Hello,
I'm thinking of buying my sister's iBook (since she doesn't really use it). I was talking to a mac rep about using the iBook for Graphic and Web Design purposes and I wanted to get other people's opinions on how Adobe Creative Suite and Dreamweaver have performed in other people's iBooks.
Thanks!

Running a lot of applications simultaneously, or a few high processing type applications such as Adobe's is what takes up RAM. OS X utilizes Hard Drive available space to make up for memory (RAM) deficiencies. This will "slow down" a system's ability to manage the files. So if you like to multiple applications opened at the same time, buy more RAM. Personally, 1 gb ought to be the minimum for today's systems.
By contrast, a computer's processor, including logic board, video board, etc. are the engine of the system. The iBook has a small engine. So no matter how much RAM you feed it, it's still going to operate like a small engine. If you want more processing power, you would need to purchase a more powerful notebook (eg Power Book) or a more processor oriented machine such as the Intel iMac or Mac Pro.

Macmini among the latest i5 or i7 are they appropriate for web/graphics/software development

Macmini among the latest i5 or i7 are they appropriate for web/graphics/software development?
Can operate with ease with Adobe Creative Cloud cs6 Apps? Also with xcode or Eclipse etc IDEs?
Also can get carried easily, and is 240/110V voltage Europe/USA?
MACmini server have all abilities of macmini client plus more, hence, can run Adobe Creative Cloud cs6 Apps, xcode & Eclipse?

Electrical and Operating Requirements
Line voltage: 100-240V AC
Frequency: 50Hz to 60Hz, single phase
http://store.apple.com/us/browse/home/shop_mac/family/mac_mini/select
Realize that only the Middle Mini has a real Graphic card.
http://news.softpedia.com/news/What-You-ll-Need-to-Run-Adobe-CS6-Mac-System-Requ irements-267982.shtml
http://prodesigntools.com/products/adobe-cs6-system-requirements.html

Crisp ,Sharp, Bright Shiny Graphics for web?

Similar Messages

Maybe you are looking for