Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 16
  1. #1
    Member smedz28's Avatar
    Join Date
    Jul 2011
    Location
    Scotland, UK
    Posts
    41
    Member #
    28612
    Liked
    3 times
    Hi all,

    Following a tutorial I found I have created my first sample logo which I intend to use in a final header logo design, I saved 2 variations of it in jpg, gif and png format. Some of them understandably have lost a little of the quality. What I would like to know is that when creating graphics for my web page what would be the best file format to use? I am thinking along the lines of quality, file size and load times.

    Your help would be much appreciated

  2.  

  3. #2
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    PNG if it's transparent, JPG if it's not, and vectors if you're a graphics wiz. Don't bother with anythig else
    smedz28 likes this.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  4. #3
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    Like george said... JPG for images with no need for transparency, PNG if you need something in the transparent...

    since all browsers are limited to 72 DPI resolution... you can make sure your output files are 72 DPI ( anything over that is going to increase the size with no quality improvement)... also when creating JPG's... you can export them out at about 70% quality... without a noticeable loss in quality... but drops the files size drastically.... if you get below 60% quality... the images start pixelating.

  5. #4
    Member smedz28's Avatar
    Join Date
    Jul 2011
    Location
    Scotland, UK
    Posts
    41
    Member #
    28612
    Liked
    3 times
    Thanks guys, I take it any format of PNG will make it transparent, if I remember correctly there are different PNG values in photoshop, one of them being PNG-8 or something??

  6. #5
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Quote Originally Posted by smedz28, post: 215400
    Thanks guys, I take it any format of PNG will make it transparent, if I remember correctly there are different PNG values in photoshop, one of them being PNG-8 or something??
    I not sure about that... I thought there was just one png, but I could be wrong. It doesn't automatically make it transparent. It just doesn't automatically add in a white background like jpgs do.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  7. #6
    Member smedz28's Avatar
    Join Date
    Jul 2011
    Location
    Scotland, UK
    Posts
    41
    Member #
    28612
    Liked
    3 times
    right, so any white space in the background unless filled will be transparent. Thanks :0

  8. #7
    Member smedz28's Avatar
    Join Date
    Jul 2011
    Location
    Scotland, UK
    Posts
    41
    Member #
    28612
    Liked
    3 times
    Quote Originally Posted by Webzarus, post: 215379
    Like george said... JPG for images with no need for transparency, PNG if you need something in the transparent...

    since all browsers are limited to 72 DPI resolution... you can make sure your output files are 72 DPI ( anything over that is going to increase the size with no quality improvement)... also when creating JPG's... you can export them out at about 70% quality... without a noticeable loss in quality... but drops the files size drastically.... if you get below 60% quality... the images start pixelating.
    Forgot to ask how do I set the output to 72 DPI, what does DPI stand for....please excuse my lack of knowledge as I have just started on this

  9. #8
    Member smedz28's Avatar
    Join Date
    Jul 2011
    Location
    Scotland, UK
    Posts
    41
    Member #
    28612
    Liked
    3 times
    It's fine, I found it. It can be set in 'image'> 'image size' menu

  10. #9
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    DPI = dots per inch
    And in most programs, you can set the DPI (in the options) once you create a new file.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  11. #10
    Junior Member
    Join Date
    Aug 2011
    Posts
    1
    Member #
    28923
    Nice going there dude! We might try to work a reference to this one into the juggernaut design blog later next week.It's nice to see some of the work like that.
    [EDIT: Link drop removed by TheGAME1264]


Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 06:20 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com