수안이의 컴퓨터 연구실

  • Mainpage
  • About Me
  • Tags
  • Metapage
  • Notice
  • Location
  • Keywords
  • Guestbook
  • Admin
  • Write an Article
  • Total | 1620702
  • Today | 82
  • Yesterday | 482

24 Articles, Search for 'Graphic'

  1. 2008/05/10 Graphics : Buttons / Icons / Logos / Photographs
  2. 2007/05/02 최고의 컴퓨터 그래픽 요소 모음
  3. 2007/05/02 JPEG(2) - JFIF (1)
  4. 2007/05/02 JPEG(1) - JPEG원리
  5. 2005/07/31 포토샵을 이용한 웹이미지 최적화
  6. 2005/04/21 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리
  7. 2005/04/21 스캔해상도와 선수, 출력해상도가 어떻게 다른가?
  8. 2005/04/21 이미지 해상도의 이해
  9. 2005/04/21 GIF파일과 JPG파일의 차이점
  10. 2005/04/21 TWAIN이란 무엇인가?
«Prev  1 2 3  Next»
Graphic2008/05/10 15:40

Graphics : Buttons / Icons / Logos / Photographs

Site : http://webdeveloper.econsultant.com/

Web services that create / edit / modify graphics.

  1. ACME Label Maker : Make a label graphic
  2. Background Image Maker : create a customized background image graphic
  3. Button Generator : customized 80×15 button generator at GraphicsGuru
  4. Button Maker : create customized micro buttons (80×15)
  5. Button Maker : customized 80×15 or 88×31 pixel button maker
  6. Button Maker :: Adam Kalsey : customized 80×15 pixel button maker
  7. Brilliant Button Maker by LucaZappa.com : customized 80×15 pixel button maker
  8. Cellsea : Free Web photo editor
  9. Create A Graph : Graphs and Charts creation service
  10. Create Fake Magazine’s covers : create customized magazine covers.
  11. CreatingOnline Free Online Photo and Image Editor : Nothing to download or install. No applets or activex. All editing is done via your browser.
  12. GIFWorks : online image/photo editing service
  13. ImageCrop.com : online image cropping service; upload and crop your photos, images, web graphics.
  14. Image Optimizer- GIF, JPG, and PNG : optimize your gifs, animated gifs, jpgs, and pngs, so they load as fast as possible on your site
  15. Image Splitter : splits an image into multiple parts for quick loading
  16. Sparklines : simple, word-sized graphics chart creation service
  17. Phixr : online image/photo editing service
  18. PXN8 : online image/photo editing service
  19. Resize2Mail : Online Image Resizer : online image cropping service; upload and crop your photos, images, web graphics.
  20. Snipshot (previously Pixoh) : online image/photo editing service
  21. Street Sign Generator : customized street sign
  22. Tile Machine 1.0 : 32×32, 16×16, 8×8 tile graphic generator service
  23. Typogenerator : large text/image poster graphic generator service
  24. Warning Label Generator : customized warning label
  25. Warning Sign Generator : customized warning sign

Web services that create / edit / modify text.

  1. ASCII Artist : This little program converts your picture to ASCII text art
  2. ASCII Generator : Generate a ASCII graphic from a word or text. Over 130 fonts.
  3. ASCII-O-Matic : is a web application that can convert an image into ASCII Art dynamically

Free Icons sets to use on your site.

  1. 2001: A Space Odyssey : zyotism
  2. Abstract Icons : idleware.de
  3. AgentX : macuserx
  4. Alien Mind : Yellow Icon
  5. Animauls : Studio Thought Crimez
  6. Balinese Souvenirs : Hoshino cYannel
  7. Basket Monsters 2 : miloszwl.com
  8. Batmobiles : The Iconfactory
  9. Bee Droids : Homepage
  10. BeetleX : Icon Products
  11. Bitcons : SomeRandomDude
  12. Body Care : RAD.E8
  13. Breakfast : RAD.E8
  14. Bugs : jandedesign.com
  15. Carribean Dreams : cedarseed
  16. Cheese Ikka : troyboydesign
  17. Chibi Björk : the sick girl
  18. Chipitis : mimionline
  19. Christmas 2003 : marvilla
  20. City Livin’ : liqachu
  21. Claus : macuserx
  22. Coffee Break : Shoffar.com
  23. Comics 0.1 : kapcom.net
  24. Complexgirl : Red Rocket Five
  25. Consumer Way : laksman.com
  26. Danger Mouse 2004 : Iconfactory
  27. Designer Icons : cedarseed
  28. Desktop Critters : Monsieur Merou
  29. Devil Icons : macuserx
  30. Dropline : Silvestre
  31. Dropline Etiquette : Silvestre
  32. Dropline Neu! : Silvestre
  33. Drunk Zoo : hellcat.it
  34. Drunkey Love : El73
  35. Easter : Monsieur Merou
  36. Eat Me : dlanham.com
  37. Eggs : laksman.com
  38. Equal Opportunity Cute Characters Union, LLC. (EOCCU) : Total Fury
  39. Fantastic Dream : Rokey.net
  40. Farm : flameia.com
  41. Feed Icons : Feedicons
  42. Felt Critters : Iconbulk.com
  43. Flags : Famfamfam
  44. Fluffy Icons : Hoshino cYannel
  45. Fluffy Xmas : Hoshino cYannel
  46. Freaks : macuserx
  47. Free Style : FastIcon.com
  48. Frosty the Snowman : Iconfactory
  49. Fruit : FastIcon.com
  50. Fruity Hearts : flameia.com
  51. Fulbo : laksman.com
  52. FunkAmals : Iconfactory
  53. Gallery 2 Web Icon Set : PaulArmstrongDesigns
  54. Ganato : Ganato
  55. Glass Animals : flameia.com
  56. Greyscale : E-lusion
  57. Gundam Mobile Fortune : The Iconfactory
  58. Guru Guru Medama : homepage
  59. Halloween Icons : bleu-corail
  60. Halloween Smilies : Design Mood
  61. Hamtaro : troyboydesign
  62. Happy Christmas : Iconfactory
  63. Hearts : The Iconfactory
  64. Helou (Arabic Sweets) : cedarseed
  65. Herbal Water : Saho’s Icon Room
  66. Homestar Runner : richd.com
  67. If I Were A Thief In The 24th Century… : widget : widget
  68. Ink : Warrior Poet
  69. Inside V.02 : JadeRing
  70. Invading your space : dlanham.com
  71. Jelly-Friends : flameia.com
  72. JolaKitty Christmas : digikitten
  73. Just Bees : Homepage
  74. Just Fruits : Monsieur Merou
  75. Kids : everaldo.com
  76. Kill Bill : Iconfactory
  77. Kiwiana : Website
  78. Leafy : Pumpkin Juice
  79. Lebanese Food : cedarseed
  80. Lord of the Rings : widget : widget
  81. LordApp : Fixicon
  82. MInimal Set : laksman.com
  83. Meiji - Pucca : richd.com
  84. Micons : bs-markup
  85. Miki’s World : kapcom.net
  86. Milk and Green : Strawbee
  87. Mini : Famfamfam
  88. Mini Fu : cedarseed
  89. Mini Robots : Hoshino cYannel
  90. Mondo Kin : ottokin.com
  91. Neu! : OpenTux
  92. New Zealand : Afterglow
  93. NuoveXT : Nuovext
  94. Nuvola : Icon-King
  95. Oh My Rabbit! : flameia.com
  96. Old Cartoons : homepage
  97. OmegaKitty : troyboydesign
  98. Organicons : Monsieur Merou
  99. Origami : pixelboard
  100. Panda Z : Iconfactory
  101. Parcheesi : Iconfactory
  102. Parrotdise : Softpedia
  103. Parrotdise : unusualmedia.com
  104. RBO : dlanham.com
  105. Rationale : Naked Gremlin
  106. Ricebowl : DeviantArt
  107. Sad Souls Icons : Sad Souls Ecard Site
  108. Samurai Set Vol. 1 : Homepage
  109. Sanscons : SomeRandomDude
  110. Scarygirl : scarygirl
  111. Science Project - Squeaker : troyboydesign
  112. Silk : Famfamfam
  113. Singapore Souvenirs : Hoshino cYannel
  114. Sky : Sky and Snow
  115. Sky and Snow Carnival Set : Sky and Snow
  116. Snappy Hour! : Iconfactory
  117. Snow : Sky and Snow
  118. Snowdome 2004 : Hoshino cYannel
  119. Snowfish : IconsDesigns
  120. Somatic : dlanham.com
  121. Somatic Extras Vol.2 : dlanham.com
  122. Squeaker Dock : troyboydesign
  123. Squee : macuserx
  124. Star Wars : everaldo.com
  125. Storm Riders : The Iconfactory
  126. Summertime Snacks : Iconfactory
  127. Sweet Shop : HYBRIDWORKS
  128. Sweetie : Sublink
  129. Tabachui : tabachui.com
  130. Take A Hike : The Iconfactory
  131. Talimans : cedarseed
  132. Tama Icons : Joohliah
  133. Tango : Tango-Project
  134. The Circus : Iconfactory
  135. The Lord Of The Rings: Armoury of the Third Age : Iconfactory
  136. These Icons Are Evil : The Fritz Saalfeld Connection
  137. Tiki Time! : Iconfactory
  138. Toye Funk : Studio Thought Crimez
  139. Transformers X Vol. 1 : Iconfactory
  140. Transformers X Vol. 2 : Iconfactory
  141. Underpants : Monsieur Merou
  142. Underwater : yegor.gilyov.com
  143. Valentine Hearts : Iconfactory
  144. VeGie : Monsieur Merou
  145. Vista-Inspirate : Gnome-Look
  146. WebControlIcons : IsFoundHere
  147. What What : What What
  148. Wrastlers : Studio Thought Crimez
  149. Xmas Gingerbread : flameia.com
  150. Yasis : Silvestre
  151. Yazooxmas 2 : wbchug.com
  152. Yazooxmas : wbchug.com
  153. Yong de Fool : Seewe
  154. Zooliah : joohliah.com
  155. Zootertagonoïdes : pattedemouche.free.fr

Galleries displaying logo graphics.

  1. Brandsoftheworld.com
  2. Designclub
  3. Fcklogo
  4. High Quality Football Logos
  5. La logoteca (Spain)
  6. LaLogotheque.com
  7. logoed
  8. Logoteca (Chile)
  9. Logotipai : logos in zipped files.
  10. logotypes.lv
  11. logotypes.ru
  12. Logotypes : made by designers for designers
  13. Nordic
  14. PortalPublicitario.com
  15. SportsLogos.Net
  16. Webchantier

Cheap stock photography sites.

  1. 123 Royalty Free
  2. AbsolutVision
  3. Alex Stock Photo
  4. BigStockPhoto
  5. Big White Box
  6. Can Stock Photo
  7. DIGITALstock
  8. Dreamstime
  9. Fotolia
  10. Gimmestock.com
  11. Intuitivmedia
  12. iStockphoto
  13. ScandinavianStockPhoto
  14. ShutterStock.com
  15. StockedPhotos
  16. Stockxpert

Commercial stock photography sites.

  1. Selfstock / 01ccd
  2. AbleStock
  3. Acclaim Images
  4. AGE Fotostock
  5. Agency
  6. Alamy Images
  7. All Images
  8. A Luna Blue
  9. artzooks
  10. Austral Int. Photo Library
  11. Banana Stock
  12. Bokelberg
  13. Bruce Coleman USA
  14. Comstock
  15. Cover
  16. Creatas
  17. Deadline Pictures
  18. Digital Vision
  19. Epictura Image Bank
  20. First Light
  21. Fotosearch Stock Photos
  22. fStop
  23. Getty Images
  24. GraphicObsession
  25. Highrezimages
  26. The Image Bank
  27. Image Farm
  28. Images.com
  29. Image Sourse
  30. ImageState
  31. ImagoPress
  32. Inmagine
  33. ImagePoint
  34. istockpro
  35. Jupiterimages
  36. Levendula
  37. Life Stock Photos
  38. liquidlibrary
  39. LuckyPix
  40. Masterfile
  41. Matton Images
  42. Millenium Images
  43. Mira
  44. MTP Network
  45. myLoupe
  46. Paradisal
  47. PhotoAlto
  48. Photodisc
  49. Photos.com
  50. PhotoSpin
  51. Photos To Go
  52. Photrick
  53. Picturesque
  54. PictureTank
  55. Pixibit
  56. Pixtal
  57. PlainPicture
  58. Premium Stock Photography
  59. PunchStock
  60. Quick Image
  61. RemotePhoto
  62. Robert Harding
  63. RubberBall
  64. Sharpe + Associates
  65. Stock.Photo
  66. Stock Photography Now
  67. Stockbyte
  68. Thinkstock
  69. Time Life Pictures
  70. Tipsimages.com
  71. Stone
  72. Untitled Organisation
  73. Veer
  74. Wonderfile
  75. Workbook
  76. World of Stock
  77. Yankee Image
  78. OzImages Stock Photography
  79. Corbis / Zefa

Specialized stock photography sites.

  1. 1000bananas.com : fruits
  2. 1000 Skies : skies
  3. Aerial Stock Photography :
  4. africanpictures.net : Africa
  5. AG47 Arsenal Fotográfico :
  6. Airliners.net : aviation
  7. AirPhoto : aerial
  8. AirTeamImages : aviation
  9. Alaska Stock : Alaska
  10. Agro-Slide-Bank :
  11. Berlin Downloads : Berlin
  12. BlueMoon Stock : 50+
  13. Blue Water : marine
  14. Buenos Aires Fotos :
  15. BuyModelPhotos.com : models
  16. Chilephoto : Chile
  17. Comesaña :
  18. Corner House Stock Photo :
  19. CSA Iimages :
  20. CubaPixel : Cuba
  21. Cut and Deal : casino, sports
  22. Doctor Stock : medical
  23. Everynight Images : lifesyle
  24. FoodPix : food
  25. Foodstock :
  26. FotosBank :
  27. Fotoscopio :
  28. Foxstock :
  29. GoodSalt : religious
  30. Rainbow Productions : nature
  31. Illustration Works :
  32. imagency.de : abstract 3D
  33. Imágenes Argentinas :
  34. Imagentina :
  35. Images.com :
  36. ImageZoo :
  37. Jason Hawkes : aerial
  38. JPS Viewfinder : travels
  39. Latinphoto : Latin America
  40. Latinstock Argentina | Focus :
  41. Laughing Stock :
  42. Life Art : medial
  43. London Downloads : London
  44. Natural Visions : nature
  45. Nature Picture Lib. : nature
  46. Nepal Photo : Nepal
  47. NHPA : nature
  48. New York Image : New York
  49. Oceans Image : marine
  50. Oceanwide Images : marine
  51. Pacific Stock : Hawaii, Pacific
  52. Panoramic Images :
  53. Alberto Patrian :
  54. Rafael Pereyra Foto Stock :
  55. Pete McArthur Stock Images :
  56. Queerstock : gay and lesbian
  57. Radiant Images : water sports
  58. Rustfetish : textures
  59. Science and Society :
  60. Seamless Photo Textures :
  61. SlovakiaPhotos.com :
  62. Stockart.com :
  63. StockBrazil : Brazil
  64. StockBucket :
  65. StockFood : food
  66. SurfPix : surf
  67. Texturama : textures
  68. Textures to the Max :
  69. theispot.com :
  70. Turner Photo : horticulture
  71. Weather Photography : weather
  72. WireImage : celebrities
  73. Zoomstock : automotive
  74. Affordable Illustration Source :
  75. The Wellcome Trust : medical
  76. Ukrainian Photobank :

Free stock photography sites.

  1. Yotophoto : Free image search engine
  2. Stock Exchange
  3. Morguefile
  4. Pixel Perfect Digital
  5. OpenPhoto
  6. Image After
  7. PDPhoto
  8. StockVault
  9. 49media
  10. Buzznet
  11. Our Media
  12. FreeFoto
  13. Creative Commons Search
  14. Wikipedia
  15. Gimp-Savy
  16. DHD Multimedia Gallery
  17. Free Photographs Network
  18. Free Stock Photos
  19. FreeImages
  20. BigFoto
  21. Geek Philosopher
  22. Barry’s Free Photos
  23. Holy Land Photos
  24. AarinFreePhoto.com
  25. PhotoRogue.com
  26. FreePhotos.com
  27. Free-StockPhotos.com
  28. tOfz
  29. FreeMediaGoo
  30. AMG Media | Free Photos
  31. Flickr | Creative Commons
  32. 9×13.de
  33. Aarin Free Photo
  34. AboutPixel
  35. Abstract Influence
  36. A Digital Dreamer
  37. Afflict
  38. Amazing Textures
  39. Amygdela’s atmosphere
  40. Animal Pictures Archive
  41. Apostroph | Freshpics
  42. Jay Arraich’s Free Photos
  43. ArtFavor | Photo Collection
  44. Bajstock
  45. Dns Fotografia Digital
  46. Blue Vertigo | Royalty free images
  47. Burning Well
  48. Cepolina Photos
  49. Creativity 103
  50. Dave Gurrea | Texutres
  51. ImageBase
  52. Demmy Onink | Photostock
  53. Designpacks
  54. DexHaus
  55. dieBlen
  56. Texture Bin 342
  57. EssEndEmmE | Stock Photos
  58. Farmphoto
  59. Fontplay | Free Photos
  60. FotoCommunity | License-free images
  61. FotoDatebank
  62. fotofree.org
  63. Fotogenica
  64. FotoImpact.ro
  65. Four Bees
  66. Free DPI
  67. Free Photos Bank
  68. Free Photo Station
  69. Free Photos Web
  70. FreePixels
  71. freerangestock.com
  72. Freewebpics.de
  73. FWS1
  74. Insecta
  75. Graphicsarena.com
  76. Plants of Hawaii
  77. Image Cafe
  78. Imageblowout
  79. Image Blowout
  80. ImageTemple
  81. Insect Images
  82. IronOrchid
  83. Ramblings & Roadtrips
  84. Patterns: pattern4u
  85. LIGHTmatter
  86. Mostly Flowers
  87. Litetek | Backgrounds
  88. LogoDesignweb | Public Domain Stock Photos
  89. Majestic Imagery
  90. Makayla Lauren
  91. Mayang | Free Textures
  92. Mega-Tex Studios
  93. MFX.de
  94. NPS | Yellowstone Digital Slide File
  95. NWYH Stock Images
  96. Tre-xtures
  97. OneOddDude.net
  98. particularities.net
  99. PhotoCase
  100. PhotoCase.de
  101. NOAA
  102. FEMA
  103. PhotoRack
  104. PictureQuest
  105. Picture Station
  106. Piotr.Pix
  107. Pixelbag.de
  108. Pixelquelle
  109. Pixsy |photos and videos from blogs and social networks
  110. The Photo Repository
  111. second.maadee.de
  112. Stockcache.com
  113. Studio25
  114. Stock.Xchang
  115. t8 | Free Stock Photos
  116. Texture King
  117. Texture Warehouse
  118. Tiggheart Galleries
  119. A View From The Nest
  120. Triparalbum
  121. Truly Free Stock
  122. Twice Pix
  123. unices.org
  124. UnProfound
  125. USDA
  126. Visipix
  127. WallpaperStock
  128. Woophy
  129. ZeitFuerDesign
  130. ZURBphotos
  131. Cromavista
  132. NASA : Earth from Space
  133. star29
  134. DHD Multimedia Gallery
  135. FWS2
  136. Google Images
  137. Creart
  138. Mandragora
  139. NASA
  140. Orange Trash
  141. PD Photo
  142. NPS Digital Image Index
  143. Fotobank
  144. PIX
  145. CNICE
  146. stock.diwiesign.com
  147. DeviantArt
  148. Texture.forrest.cz
  149. Where To Find Great Free Photographs

Clip art illustrations for blogs and sites.

  1. AIGA | Symbol signs : 50 passenger/pedestrian symbols
  2. ArtBitz : stock art elements and stock illustration
  3. .ar D : various clip art
  4. ArtFavor | Vector Clipart : various clip art
  5. braincorp | Vector Love : free clip art
  6. Creativ Collection : stock art elements and stock illustration
  7. Clipart deSIGN : professional resource for graphic professionals
  8. Vector Clip-Art : free clip-art at Russian site
  9. Designers Toolbox : envelopes clip art
  10. NASA DFRC : Dryden Aircraft Graphics Collection at NASA
  11. DigiAtlas : vector maps
  12. Pro Vehicles Outline : precise vehicle outline templates
  13. EduPlace | OutlineMaps : maps in pdf
  14. Gauchada.com : free clip art
  15. Havana Street : stock art elements and stock illustration
  16. LaLogotheque : logos and flags
  17. Logoclipart.com : various clip art
  18. Arcade Art Library : various free clip art
  19. Map Resources : adobe illustrator maps
  20. Monsterama : various free clip art
  21. Mountain High Maps : free mountain clip art
  22. MR clipart : stock art elements and stock illustration
  23. Xpeditions | Atlas : free national geographic maps
  24. N.Design Studio : free clip art
  25. Nuguerrilla : free clip art
  26. One Mile Up, Inc. : stock art elements and stock illustration
  27. Briar Press | Cuts & Caps : vintage images
  28. Open Clip Art Project (SVG) : user contributed clip art
  29. Planiglobe : make your own digital map
  30. Powerclip.ru : various clip art
  31. Rettungsdienst : coreldraw graphics art
  32. Sodipodi (SVG) : free SVG drawings
  33. Stock Aid : stock art elements and stock illustration
  34. Ultimate Symbol : stock art elements and stock illustration
  35. UN Cartographic Section : maps from UN
  36. Vector Art : stock art elements and stock illustration
  37. Vectors Workshop : various clip art
  38. Vectorportal.com : free various clip art
  39. Vectro. Vector ClipArt : free clip art
  40. Webchantier : free clip art
  41. Playing cards (SVG) : Deck of Playing cards in SVG
  42. Diana Todd | Vector Art : free clip art
  43. National Atlas Maps| USA : maps of USA
  44. picto.mania.ru : free clip art


"Graphic" 카테고리의 다른 글
  • Graphics : Buttons / Icons / Logos / Photographs (0)2008/05/10
  • 최고의 컴퓨터 그래픽 요소 모음 (0)2007/05/02
  • JPEG(2) - JFIF (1)2007/05/02
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
2008/05/10 15:40 2008/05/10 15:40
Posted by webdizen
Tags Button, GIF, Graphics, Icon, JPG, Logo, Photograph, PNG, Symbol, Web
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/3231

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2007/05/02 15:51

최고의 컴퓨터 그래픽 요소 모음

1. 최고의 듀얼 모니터용 바탕화면 사이트 모음 : Dual Monitor Wallpapers
2. 최고의 바탕화면 사이트 모음 : Best Wallpaper Sites
3. 최고의 아이콘 사이트 모음 : Best Icon Sites
4. 최고의 폰트 사이트 모음 : Best Font Download Sites
5. 최고의 포토샵 브러쉬 사이트 모음 : Best Photoshop Brush Sites
6. 최고의 웹디자인 용 작은 아이콘 다운로드 사이트 모음 : Best Small Icon Sites
7. 최고의 무료 클립아트 다운로드 사이트 모음 : Best Free Vector Clipart Download Site

"Graphic" 카테고리의 다른 글
  • Graphics : Buttons / Icons / Logos / Photographs (0)2008/05/10
  • 최고의 컴퓨터 그래픽 요소 모음 (0)2007/05/02
  • JPEG(2) - JFIF (1)2007/05/02
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
2007/05/02 15:51 2007/05/02 15:51
Posted by webdizen
Tags 듀얼 모니터, 바탕화면, 브러쉬, 아이콘, 클립아트, 포토샵, 폰트
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/2885

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2007/05/02 01:08

JPEG(2) - JFIF

출처 : http://php.chol.com/%7Emrjin

JPEG

JFIF :

지금까지 설명한 원리에 따라 JPEG 이미지가 저장이 되는데 JPEG 파일의 실제 구조는 어떠한지 알아보자. 이미 설명했듯이 JPEG 파일 구조란 JFIF(JPEG File Interchange Format)을 의미한다. JPEG 파일은 그림 1과 같이 여러 개의 블록으로 나뉘어져 있다.

SOI (Start Of Image)

APP0 JFIF Marker

추가 APP Marker (APP0 ~ APP15)

또는 주석 (COM) marker

DQT (Define Quantization Tables)

SOF (Start Of Frame)

DHT (Define Huffman Tables)

SOS (Start Of Scan)

스캔 데이터

EOI (End Of Image)

그림 1 JFIF의 구조

각 블록은 Marker에 의해 구분된다. Marker는 &HFF로 시작되는 두 바이트 데이터로 marker 하나로 끝나는 것도 있고 marker 뒤에 추가 데이터가 더 붙는 것도 있다. 추가 데이터가 더 붙는 경우 marker 뒤에 2바이트의 데이터 길이가 오고 그 다음 추가 데이터가 온다. 데이터 길이는 데이터 길이 필드를 포함한 길이다. 한가지 주의할 것이 지금까지 살펴본 그래픽 파일에서는 상위 바이트와 하위 바이트의 순서가 바뀌어서 저장되어 있는데 JPEG 파일에서는 그 순서가 뒤바뀌어서 저장되지 않는다는 점이다. 예를 들어 &H12 &H3F 순으로 저장되어 있다면 &H3F12가 아니고 &H123F를 가리키는 것이다.

JFIF에서 사용되는 marker는 표 1과 같다.

분류

값

심볼

설명

추가 데이터 없음

FFD0~FFD7

RST0~RST7

Restart marker

FFD8

SOI

Start Of Image

FFD9

EOI

End Of Image

추가 데이터 있음

FFC0~FFC2

SOF0~SOF2

Start Of Frame

FFC4

DHT

Deine Huffman Tables

FFDA

SOS

Start Of Scan

FFDB

DQT

Define Quantization Tables

FFDD

DRI

Define Restart Interval

FFE0~FFEF

APP0~APP15

Application specific data

FFFE

COM

Commnet

표 1 JFIF에서 사용되는 marker

JPEG 표준에는 이보다 더 많은 marker들이 정의되어 있으나 JFIF에서는 거의 쓰이지 않는다. 각 블록을 더 자세히 살펴보자.

SOI와 APP0 JFIF Marker : 파일의 맨 처음 오는 marker들로 주로 JFIF임을 확인하는 용도로 사용된다. 그 구조는 표 2와 같다.

이름

크기

설명

SOI marker

2

항상 FF D8

APP0 marker

2

항상 FF E0

Data length

2

추가 데이터 길이. 바이트 단위. 상위 바이트, 하위 바이트 순으로 저장되며 Data length 필드를 포함한 길이를 나타낸다.

Identifier

5

항상 4A 46 49 46 00. JFIF임을 나타낸다.

Major version ID

1

버전 번호.

Minor version ID

1

버전 번호.

Units

1

그 다음 오는 X, Y 해상도의 단위를 나타냄.

0 – 해상도 사용 안함
1 –
단위 인치 당 픽셀 수
2 – 단위 cm 당 픽셀 수

Xdensity

2

가로 해상도

Ydensity

2

세로 해상도

Xthumbnail

1

미리 보기 이미지의 폭. 미리 보기가 없으면 0.

Ythumbnail

1

미리 보기 이미지의 높이. 미리 보기가 없으면 0.

Thumbnail

가변

미리 보기 이미지. RGB 컬러 순으로 픽셀 데이터가 저장되어 있다.

표 2 SOI와 APP0 JFIF marker의 구조

추가 보조 Marker : APP0 marker 외에 미리 보기 이미지를 추가로 더 넣거나 주석을 달기 위해 몇 가지 marker가 더 올 수 있다. 보통 이들 marker들은 그림 이미지 자체에 전혀 영향을 주지 않으며 어플리케이션 프로그램에서 보조 자료로 쓰일 뿐이다. marker 뒤에 추가 데이터 길이 필드가 오는데 이를 이용해 다음 marker로 건너 뛸 수 있다.

DQT marker : DQT는 양자화 테이블(Quantization table)을 보관하는 블록이다. 표 3과 같은 구조로 되어 있다.

이름

크기

설명

DQT marker

2

항상 FF DB

Data length

2

추가 데이터 길이.

Quantization table

양자화 테이블. 최대 4개의 테이블을 가질 수 있다.

표 3 DQT marker의 구조

JFIF는 최대 4개의 양자화 테이블을 보관할 수 있다. 각각의 양자화 테이블 구조는 표 4와 같다. 테이블 값은 8비트 샘플링의 경우 1바이트, 12비트 샘플링의 경우 2바이트 크기를 가진다.

Table Identifier

1

상위 4비트 : 테이블 값 크기. 0= 1바이트. 1=2바이트.
하위 4비트 : 테이블 ID. 0~3 사이의 값을 가진다.

Table

64 또는 128

양자화 테이블. 8 x 8 테이블이 지그재그 순서로 저장되어 있다. (그림 5‑28 참고)

표 4 양자화 테이블의 구조

그림 2 양자화 테이블 값이 저장된 순서

SOF marker : SOF는 그림 이미지의 크기 및 샘플링에 관한 정보를 보관하고 있다. 표 5는 SOF 블록의 구조이다.

이름

크기

설명

SOF marker

2

항상 FF C0 ~ FF C2

FFC0 – baseline
FFC1 – extened sequential
FFC2 - progressive

Data length

2

추가 데이터 길이.

Sampling precision

1

샘플링 비트 수 8 또는 12

Image height

2

이미지 높이. 픽셀 단위.

Image width

2

이미니 폭. 픽셀 단위.

No fo components

1

Y, Cb, Cr 성분 수. 1 ~ 3.

Component specific

각 성분에 대한 정보.

표 5 SOF marker 구조

JFIF는 Y, Cb, Cr 세 가지 성분 중 하나 또는 3가지 모두를 저장할 수 있다. 각 성분에 대한 정보는 표 6과 같은 구조로 저장되어 있다.

이름

크기

설명

Component ID

1

각 성분을 구분하기 위한 ID. 0~255 사이의 값을 가질 수 있으나 JFIF에서는 Y는 1, Cb는 2, Cr은 3으로 고정되어 있다.

Sampling Frequency

1

상위 4비트 : 해당 성분의 가로 샘플링 주기 (1~4)

하위 4비트 : 해당 성분의 세로 샘플링 주기 (1~4)

Quantization table ID

1

해당 성분에서 사용할 양자화 테이블의 ID 0 ~ 3의 값을 가진다.

표 6 YCbCr 성분에 대한 정보

SOF는 JPEG 파일 안에 오직 하나만 존재할 수 있다.

DHT marker : DHT는 Huffman 코드 테이블을 보관하고 있는 블록이다. Huffman 코드 테이블은 AC 계수용, DC 계수용이 따로 보관되며 각각 최대 4개의 테이블을 가질 수 있다. 각 테이블의 구조는 표 7과 같다.

이름

크기

설명

DHT marker

2

항상 FF C4

Data length

2

추가 데이터길이.

Huffman table

Huffman table 구조 참고

하나의 Huffman table 구조

이름

크기

설명

Table ID

1

상위 4비트 : Table class. 0은 DC 1은 AC 테이블을 의미.

하위 4비트 : Table ID. 0 ~ 3의 값을 가진다.

Codelength Counter

16

코드 길이가 1 ~16인 코드의 개수를 보관하고 있다.

Symbols

가변

Huffman 코드 순서대로 코드가 가리키는 실제 데이터를 보관하고 있다. 전체 크기는 codelength counter의 총 합.

표 7 DHT marker

SOS marker : SOS는 각 성분들이 어떤 Huffman table을 사용할지 알려주는 블록이다. 그 구조는 표 8과 같다.

이름

크기

설명

SOF marker

2

항상 FF DA

Data length

2

추가 데이터 길이.

Component count

1

성분 개수

Scan description

각 성분이 사용할 Huffman table의 ID

Spectral selection start

1

DCT 를 최적화할 때 사용하는 값.

Spectral selection end

1

Successive approximation

1

표 8 SOS marker

Scan description은 성분의 개수만큼 있는데 각각의 구조는 표 9와 같다.

이름

크기

설명

Component ID

1

각 성분을 구분하는 ID

Huffman table ID

1

상위 4비트 : 해당 성분이 사용할 DC Huffman 테이블의 ID

하위 4비트 : 해당 성분이 사용할 AC Huffman 테이블의 ID

표 9 각 성분의 scan description

SOS가 시작되기 전에 최소한 하나 이상의 DHT, DQT와 하나의 SOF가 있어야 한다.

스캔 데이터 : SOS 바로 다음에 스캔 데이터 블록이 오게 되는데 스캔 데이터는 픽셀들의 색 정보를 샘플링-DCT-양자화-Huffman coding 과정을 거쳐 만들어낸 데이터이다. 이렇게 해서 만들어진 스캔 데이터를 다시 원래 픽셀 정보로 바꾸려면 역으로 Huffman decoding-역양자화(Dequantization)-IDCT-업 샘플링 과정을 거치면 된다.

Restart marker : restart marker (RST)는 유일하게 스캔 데이터 안에 존재하는 marker로 손상된 JPEG을 최대한 복원하기 위해 사용하는 marker이다.

SOS 이전에 DRI(Define Restart Interval) marker로 restart 간격을 정의를 한다. DRI marker의 구조는 표 10과 같다.

이름

크기

설명

DRI marker

2

항상 FF DD

Data length

2

추가 데이터 길이.

Restart interval

2

Restart 간격. 0이면 restart marker(RST)가 쓰이지 않음을 의미.

표 10 Restart marker

DRI에 정의된 restart 간격이 0보다 크면 그 간격만큼의 MCU 마다 RST marker가 놓이게 된다. 예를 들어 restart 간격이 N이라면 그림 3과 같이 N개의 MCU 데이터 마다 RST marker가 놓인다.

그림 3 RST marker

RST marker는 RST0부터 RST7까지 8개가 있는데 순차적으로 나타나며 RST7 다음에는 RST0이 다시 나오게 된다.

"Graphic" 카테고리의 다른 글
  • Graphics : Buttons / Icons / Logos / Photographs (0)2008/05/10
  • 최고의 컴퓨터 그래픽 요소 모음 (0)2007/05/02
  • JPEG(2) - JFIF (1)2007/05/02
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
2007/05/02 01:08 2007/05/02 01:08
Posted by webdizen
No Trackback 1 Comment

Trackback URL : http://www.webdizen.net/blog/trackback/2881

Leave your greetings.

  1. 바나나파이

    정말 많은 도움받고 갑니다. 이렇게 노력해서 공유해주신 자료 그냥 습득하고 가기 죄송해서
    감사하단 글이나마 남겨봅니다. 항상 행복하세요~

    2009/01/12 01:38 [ Permalink : Modify/Delete : Reply ]
[로그인][오픈아이디란?]

Graphic2007/05/02 01:07

JPEG(1) - JPEG원리

출처 : http://php.chol.com/%7Emrjin

JPEG

JPEG(보통 ‘제이펙’이라고 읽는다.)은 높은 압축 효율 때문에 GIF와 함께 인터넷에서 가장 널리 쓰이는 그래픽 파일 포맷이다. JPEG은 Joint Photographic Experts Group이라는 위원회에서 정한 그래픽 이미지 압축에 관한 표준을 의미한다. JPEG이라는 이름도 이 위원회의 이름에서 유래한 것이다. (이와 비슷하게 동화상 압축에 관한 표준이 만들어졌는데 그것이 바로 MPEG이다. MPEG은 Motion Picture Experts Group에서 만든 표준이다.) JPEG 표준은 ISO(국제표준화기구) 10918-1에 정의되어 있다. JPEG 표준은 그래픽 이미지 압축에 대한 표준만 정해놓았을 뿐 구체적인 구현 방법은 정의하고 있지 않다. 우리가 지금까지 살펴본 BMP, PCX, GIF 그래픽 파일들은 어떤 헤더 구조를 가지고 있으며 그래픽 정보를 어떻게 저장하는지 각 그래픽 파일 규격에 구체적으로 정의되어 있다. 하지만 JPEG 표준은 그래픽 파일 포맷에 대한 규격은 전혀 언급하고 있지 않다. 심지어 어떤 방식의 색상 체계를 쓰는지도 정의되어 있지 않다. 구체적으로 어떤 색상 체계를 사용하며 어떤 파일 포맷으로 그래픽 이미지를 저장하는지에 대한 규격은 JFIF(JPEG File Interchange Format)에 정의되어 있다. JFIF는 C-Cube Microsystems의 Eric Hamilton에 의해 만들어졌으며 누구나 사용할 수 있도록 public domain에 공개되어 있다. 우리가 흔히 접하는 확장자가 JPG인 JPEG 그래픽 파일은 대부분 JFIF로 되어있다. 사실 JFIF는 JPEG 위원회나 어떤 기구에 의해 표준으로 정해진 포맷은 아니다. 하지만 시간이 가면서 널리 쓰이다 보니 표준 아닌 표준이 되어 버렸다. JPEG 위원회에서 뒤늦게 SPIFF(Still Picture Interchange File Format)라는 파일 포맷 표준을 내놓았지만 이미 수 많은 JPEG 이미지 파일들이 JFIF로 되어 있기 때문에 그렇게 각광을 받지는 못하고 있다. 여전히 수 많은 그래픽 소프트웨어들이 JPEG 이미지 파일로 JFIF를 사용하고 있다. 우리가 살펴볼 JPEG 이미지 파일도 JFIF이다.

JPEG의 종류 :

ISO10918-1 표준은 그림 1과 같이 압축 방식, 코딩 방식, 샘플링 크기 등에 따라 JPEG 모드를 여러 개로 나누어 놓았다.

JPEG

Sequential

Progressive

Lossless

Hierarchical

Huffman

Arithmetic

Huffman

Arithmetic

Original

Lossless

JPEG-LS

8 bit

12bit

8 bit

12bit

8 bit

12bit

8 bit

12bit

그림 1 여러 가지 JPEG 모드

Sequential 방식은 그래픽 이미지 맨 위부터 아래로 순차적으로 데이터를 저장하는 방식이고 Progressive 방식은 GIF의 Interlaced 모드와 비슷하게 그래픽 이미지를 여러 번 스캔하여 점진적으로 이미지가 뚜렷하게 보이도록 하는 방식이다. GIF의 Interfaced 모드는 몇 줄씩 건너뛰면서 여러 번에 걸쳐 그래픽 이미지를 출력한다. 매번 출력 때마다 그 전에 비어있던 줄을 채워 넣어 그래픽 이미지를 완성한다. JPEG progressive 방식도 여러 번에 걸쳐 그래픽 이미지를 출력하지만 GIF처럼 그림의 일부만 출력하는 것이 아니라 일단 전체 이미지를 모두 출력한다. 단, 마치 포커스가 제대로 맞지 않은 사진처럼 흐릿한 이미지만 출력한다. 그 다음 출력 때 점점 포커스가 맞추어지는 것처럼 보다 더 명확한 이미지를 출력한다. GIF의 경우와 마찬가지로 전체 데이터를 다 전송하지 않고도 어떤 이미지인지 알 수 있게 하기 위해 이런 방식을 사용한다. Hierarchical 방식은 Progressive 방식의 보다 더 진보된 형태이다. 같은 그래픽 이미지를 표현하고 있지만 화질이 서로 다른 이미지를 frame 단위로 여러 개 저장하는 방식이다. 전송 속도가 느린 경우 원하는 화질의 이미지 frame만 전송할 수 있다.

Lossless 방식은 말 그대로 화질 저하가 없는 방식이다. 뒤에 설명하겠지만 JPEG은 높은 압축률을 구현하기 위해 사람 눈이 구분하지 못할 정도로 미세하게 데이터를 생략하는 방식을 사용한다. 그래서 BMP 또는 GIF 그래픽 이미지에서 JPEG 이미지로 변환을 하면 약간의 화질 저하가 있다. BMP --> PCX --> BMP 변환을 아무리 여러 번 수행해도 화질의 변화가 없지만 BMP --> JPEG --> BMP 변환을 수행하면 할수록 점점 화질 저하가 누적된다. Lossless 방식은 전혀 압축을 하지 않는 대신 화질의 변화를 주지 않는 방식이다. JPEG-LS 역시 화질의 변화 없이 저장하는 방식인데 원래 Lossless 방식과는 구현 방법이 다르다.

GIF 그래픽 파일에서 LZW 코딩 방식으로 데이터를 압축 저장하듯이 JPEG도 그래픽 데이터를 압축해서 저장하기 위해 Huffman 코딩이라는 압축 방식을 사용한다. Arithmetic 방식은 구현 방법만 다를 뿐 Huffman 코딩 방식과 똑같은 코딩 방식이다. Arithmetic 방식은 특허로 보호 받기 때문에 함부로 사용할 수 없다.

또한 JPEG 그래픽 이미지는 각 픽셀의 색상을 8비트 또는 12비트로 표현할 수 있다. 우리가 흔히 접하는 JPG 파일은 8비트로 색상을 표현한다.

이렇게 많은 종류의 JPEG 모드 가운데 가장 널리 사용되는 방식은 Sequential – Huffman – 8비트 방식이며 Progressive - Huffman - 8비트 방식의 JPEG 파일도 많이 쓰인다.

JPEG 파일의 원리 :

JPEG 파일, 엄밀하게는 JFIF 포맷의 원리와 구조에 대해 간단하게 알아보자. JPEG 파일은 그림 2와 같은 과정을 거쳐 압축이 된다.

그림 2 JPEG 압축 과정

Sampling은 RGB 색상 체계를 Y-Cb-Cr 색상 체계로 변환하는 과정이다. 이때 Cb, Cr 성분을 구할 때 일부 성분들은 생략되므로 압축의 효과를 가져온다. DCT는 샘플링된 데이터를 코사인 함수의 합으로 변환하는 과정이다. 이렇게 변환된 데이터에서 원래 데이터를 크게 변화시키지 않을 만큼 불필요한 성분들을 제거한다. 이 과정을 양자화(quantization)이라고 한다. 양자화를 거처 압축된 데이터는 Huffman 코딩이라는 압축 알고리즘을 통해 압축이 된다. 양자화 과정에서 한번 압축이 일어나고 Huffman 코딩에서 또 한번 더 압축이 일어나 압축 효율이 극대화되는 것이다. 양자화에 의한 압축은 원래 데이터를 일부 제거하기 때문에 JPEG 이미지의 화질 저하의 원인이 된다. Huffman 코딩은 Lossless 압축 방식이므로 JPEG 이미지 화질 저하와는 관련이 없다.

이렇게 압축된 JPEG 이미지를 복원하려면 위의 과정을 역순으로 행하면 된다. 먼저 Huffman 디코딩을 통해 압축을 풀어 양자화된 데이터를 얻어낸다. 양자화된 데이터는 역 양자화(de-quantization)을 통해 원래 DCT 성분으로 복원된다. 물론 양자화 때문에 완벽하게 100% 원래 성분들을 모두 복원할 수는 없으나 사람의 눈에는 거의 뜨이지 않을 정도로 복원이 가능하다. 복원된 DCT 성분들은 IDCT 변환을 통해 Y-Cb-Cr 데이터로 변환된다. 이렇게 해서 얻은 Y-Cb-Cr 데이터는 Up-sampling 과정을 통해 다시 R,G,B 색상 체계로 변환되어 원래 모습을 찾게 된다. 물론 100% 똑같은 이미지는 아니지만.

지금까지 설명한 과정들이 아마도 쉽게 들어오지 않을 것이다. 보다 더 자세하게 각 과정들을 설명하도록 하겠다.

색상 체계 : JPEG 파일이 사용하는 색상 체계는 Y-Cb-Cr 색상 체계로 앞에서 살펴본 YIQ 색상 체계와 비슷한 방식이다. Y는 밝기를 나타내고 Cb, Cr이 색상을 나타낸다. 원래 Y는 0에서 1사이, Cb, Cr은 –0.5에서 0.5 사이의 값을 가지지만 JPEG 파일은 Y, Cb, Cr 모두 0에서 255의 범위를 가진다. 다음은 RGB에서 YCbCr, YCbCr에서 RGB로 변환하는 공식이다.

Y = 0.299 R + 0.587 G + 0.114 B
Cb = - 0.1687 R - 0.3313 G + 0.5 B + 128
Cr = 0.5 R - 0.4187 G - 0.0813 B + 128

R = Y + 1.402 (Cr-128)
G = Y - 0.34414 (Cb-128) - 0.71414 (Cr-128)
B = Y + 1.772 (Cb-128)

JPEG 파일은 YCbCr 세 개의 성분 가운데 어느 한 성분(보통 Y성분)만 저장하거나 세 성분 모두를 저장할 수 있다. Y성분만 저장하는 것은 256 level gray 색상으로 저장하는 것을 의미한다. 실제 JPEG 파일에 Y,Cb,Cr 데이터가 저장될 때는 128씩 뺀 값이 저장된다.

Sampling : 지금까지 살펴본 BMP, PCX, GIF와 같은 그래픽 파일들은 한 픽셀의 색을 나타내기 위해 R, G, B 색상 체계를 사용하였으며 3가지 성분 모두 같은 비율로 저장되었다. 하지만 JPEG 파일에서는 Y, Cb, Cr이 서로 다른 비율로 저장될 수 있다. 예를 들어 매 픽셀의 Y 성분을 모두 저장하는 반면 Cb, Cr은 한 픽셀씩 건너 뛰면서 저장할 수도 있다. 이와 같이 전체 픽셀 가운데 일부 픽셀의 데이터만 선별하여 저장하는 방식을 sampling이라고 한다.

JPEG 파일은 샘플링하는 간격을 샘플링 주기(sampling frequency)로 나타내는데 샘플링 주기는 각 성분의 샘플링 간격의 역수비로 나타낸다. Y 성분은 매 픽셀 마다 샘플링하고 Cb 성분은 두 번째 픽셀마다 샘플링하고 Cr 성분은 네 번째 픽셀마다 샘플링한다면 YCbCr의 샘플링 주기는 4:2:1 이 된다. 사람의 눈은 밝기(Y) 성분에 더 민감하기 때문에 보통 Y 성분의 샘플링 주기가 더 크다. 물론 꼭 Y 성분의 샘플링 주기가 커야 되는 것은 아니다. 필요하다면 Cb, Cr의 샘플링 주기가 더 클 수 있지만 그런 경우는 거의 없다.

또한 가로 방향의 샘플링 주기와 세로 방향의 샘플링 주기가 틀릴 수도 있다. 즉, 가로 방향으로는 모든 픽셀의 데이터를 다 저장하고 세로 방향으로는 한 픽셀 씩 건너 뛰면서 데이터를 저장할 수도 있다. JPEG 파일이 허용하는 최대 샘플링 주기는 4이다.

JPEG 파일에서 주로 쓰이는 샘플링 주기는 2:1:1 또는 1:1:1이다. 이와 같이 각 성분의 샘플링 주기를 다르게 하는 이유는 화질의 크게 떨어뜨리지 않고 데이터의 양을 줄이기 위해서 이다. 가로, 세로 방향의 YCbCr 샘플링 주기를 각각 2:1:1로 하면 1:1:1로 하는 것보다 화질의 저하는 다소 있을 수 있으나 데이터 양을 반으로 줄일 수 있다. 이와 같이 일부 픽셀 데이터만 샘플링하는 것을 Down-sampling이라고 하고 반대로 down sampling된 데이터를 원래 픽셀 개수로 늘이는 것을 Up-sampling이라고 한다. 다운 샘플링하는 방법은 여러 가지가 있을 수 있다. 단순하게 일정 간격마다 건너 뛰면서 픽셀 데이터를 저장할 수도 있고 일정 간격 내의 모든 픽셀 데이터들의 평균을 저장할 수도 있다. 후자가 좀 더 나은 방식인데 어떤 방식으로 샘플링하느냐는 그래픽 소프트웨어와 같은 어플리케이션 프로그램에 의해 결정된다. 그림 3은 샘플링의 예이다. 첫번째 경우는 픽셀 모두를 샘플링하는 경우이고 두 번째는 한 픽셀씩 건너 뛰면서 데이터를 샘플링하는 것이고 세 번째의 경우는 4 픽셀의 평균을 샘플링하는 것이다. 이 세가지 경우 샘플링 주기는 2:1:1이다. 두 번째와 세 번째는 샘플링 주기는 같다. 샘플링 방식만 다를 뿐이다.

그림 3 샘플링의 예

DCT와 양자화 : DCT란 Discrete Cosine Transform(이산 코사인 변환)의 약자로 JPEG 압축 기술의 핵심이라 할 수 있다. DCT는 임의의 데이터 배열을 코사인 함수의 합으로 표현할 수 있다는 성질을 이용한 것이다. 예를 들어 임의의 데이터 배열 f를 코사인 함수의 합으로 표현하면 다음과 같다.

이때 코사인 함수의 진폭 F를 DCT 계수(DCT coefficient)라고 하고 새로운 배열 F를 구하는 것을 DCT라고 한다. DCT 계수는 다음과 같이 구할 수 있다.

DCT 계수를 이용해 원래 데이터 f를 구하는 것을 IDCT(Inverse Discrete Cosine Transform)라고 한다. N개의 데이터 f를 DCT로 변환하면 N개의 DCT 계수 F를 구할 수 있다. 예를 들어 표 1의 f와 같이 8개의 원소로 이루어진 배열이 있다고 해보자. DCT 변환을 하면 8개의 DCT 계수 F를 구할 수 있다. DCT 계수들 중 0차 계수는 다른 계수들과 달리 코사인의 함수가 아니기 때문에 DC 계수라고 하고 다른 계수들은 AC 계수라고 부른다. 보통 DC 계수 값이 AC 계수 값에 비해 크기 때문에 JPEG 파일은 DC 계수와 AC 계수를 서로 다른 방법으로 저장한다. 구체적인 것은 뒤에 다시 설명하겠다.

n

0

1

2

3

4

5

6

7

f(n)

10

9.59

8.07

8.15

11.02

14.04

13.51

9.28

F(n)

29.58

-3.22

0.24

4.40

-2.39

0.35

-0.44

0.08

표 1 DCT 변환의 예

DCT 계수 F를 이용해 IDCT를 수행하면 다시 원래 데이터 f를 구할 수 있다. IDCT를 수행할 때 높은 차수의 DCT 계수(n이 큰 DCT 계수)를 생략할 수도 있는데 이 경우 원래 데이터와 100% 똑같지 않지만 상당히 비슷한 값으로 복원해 낼 수 있다. 그림 4는 DCT 계수를 1개에서부터 8개까지 사용해 IDCT를 수행한 경우 복원된 값을 그래프로 보여주고 있다.

점선이 IDCT로 복원된 값이고 실선이 원래 데이터이다. DCT 계수를 많이 쓸수록 원래 데이터에 근접한 결과를 얻을 수 있음을 알 수 있다. 하지만 N=5, 즉 5차 DCT 계수까지만 사용해 IDCT를 해도 원래 데이터와 상당히 유사한 결과를 얻을 수 있다. 여기에 JPEG 압축의 비밀이 들어 있는 것이다. DCT 계수를 모두 다 저장하지 않고 일부만 저장하여도 나중에 복원할 때 원래 데이터와 상당히 유사한 형태로 복원을 할 수 있는 것이다. 이와 같이 DCT 변환된 데이터 중 일부를 버리는 작업을 양자화(Quantization)라고 한다. JPEG 이미지로 변환할 때 약간의 화질 저하가 생기는 이유도 바로 양자화 때문이다.

그림 4 IDT로 복원할 때 사용한 계수의 개수에 따라 복원 정도가 달라진다.

그러나 양자화가 만능은 아니다. 그림 5는 서로 다른 유형의 데이터를 DCT하고 N=5로 양자화한 것을 다시 IDCT로 복원한 것이다. 왼쪽 그림의 경우 거의 완벽하게 복원이 되었으나 오른쪽 그림의 경우는 제대로 복원이 되지 않았다.

그림 5 양자화가 적합한 경우와 그렇지 않은 경우.

양자화가 힘을 발휘하려면 데이터들의 변화가 되도록이면 적어야 한다. 그래서 색의 변화가 극단적으로 일어나는 도형 이미지를 JPEG 이미지로 만들면 자연스럽지 못한 것도 양자화 때문이다. 그림 6을 보자. 왼쪽 그림은 원래 이미지이고 오른쪽 그림은 JPEG으로 저장한 이미지이다. 도형의 모양과 색이 왜곡된 것을 볼 수 있다.

그림 6 JPEG 이미지로 저장할 때 데이터 손실이 생긴다.

그러나 사진의 경우 색의 변화가 심한 부분이 적기 때문에 양자화를 해도 화질의 저하가 그리 크지 않다. 그래서 JPEG은 사진 이미지에 보다 더 적합한 포맷이다.

앞에서 살펴본 DCT, IDCT는 1차원인데 실제 JPEG 이미지에서는 2차원 DCT, IDCT를 사용한다. 샘플링한 픽셀 데이터를 8x8 블록으로 나누어 각 블록마다 2차원 DCT를 수행한 뒤 양자화를 거쳐 데이터 양을 줄인다. 2차원 DCT, IDCT는 다음과 같이 정의된다.

위의 식을 간단하게 행렬로 표시하면 다음과 같다.

JPEG에서는 N은 항상 8이며 f, F는 8x8 행렬이다. 변환 행렬 M은 다음과 같이 정의된다.

MT 는 행렬 M의 Transpose 행렬로 행렬 의 행과 열을 서로 뒤 바꾼 것이다. 즉, MT (i,j)=M(j,i)이다.

JPEG 파일 안에는 8x8 크기의 Quantization table이라는 것이 보관되어 있는데 이 테이블을 이용해 8x8 DCT 계수를 양자화한다. DCT 계수를 1대1로 대응되는 quantization table 값으로 나눈 뒤 반올림 해주면 양자화된 DCT 행렬을 얻을 수 있다. 이렇게 양자화된 DCT 행렬은 대부분의 값이 0이 된다. 양자화된 DCT 행렬을 다시 원래 상태로 돌리려면 단순히 quantization table 값을 곱해주면 된다.

Interleave와 non-interleave 방식 : JPEG 파일은 DCT를 수행하기 위해 샘플링 데이터들을 8x8 크기의 블록으로 나누어야 한다. 이렇게 나뉘어진 8x8 크기의 데이터 블록을 Data Unit이라고 부른다. 가로 세로 샘플링 간격이 1 x 1 픽셀이라면 8 x 8 픽셀 블록이 하나의 데이터 유닛이 되고 가로 세로 샘플링 간격이 2 x 2 픽셀이라면 16 x 16 픽셀 블록이 하나의 데이터 유닛이 된다. 한 데이터 유닛의 픽셀 데이터를 샘플링하여 DCT 계수를 구하고 양자화를 한 뒤 저장을 한다. 그림 이미지의 위에서부터 아래로, 왼쪽부터 오른쪽으로 가면서 샘플링-DCT-양자화를 반복한다.

Y,Cb,Cr 중 한 가지 성분만 저장할 때는 단순하게 (8 * 가로 샘플링 간격) x (8 * 세로 샘플링 간격) 픽셀 씩 나누어 DCT를 수행해 맨 오른쪽 윗부분부터 순차적으로 저장하면 된다. 하나 이상의 성분을 저장할 때는 조금 복잡해 진다. Y, Cb, Cr 각 성분의 샘플링 주기가 모두 같을 때는 하나의 8 x 8 블록 내에 있는 Y, Cb, Cr 데이터를 순차적으로 저장하고 그 다음 8 x 8 블록의 Y, Cb, Cr 데이터를 순차적으로 저장한다. 샘플링 주기가 다를 때는 샘플링 주기가 가장 작은 성분을 기준 블록으로 삼고 이 블록 안의 Y, Cb, Cr 데이터를 순차적으로 모두 저장한 뒤 그 다음 기준 블록의 Y, Cb, Cr 데이터를 저장한다. 이 기준 블록을 MCU(Minimum Coded Unit)이라고 한다. 이와 같이 여러 개의 성분을 번갈아 가면서 저장하기 때문에 하나 이상의 성분을 저장할 때를 Interleaved 방식이라고 한다. 반면에 하나의 성분만 저장할 때는 Non-interleaved 방식이라고 한다. 그림 7은 Non-interleaved 방식으로 저장하는 예이다.

그림 7 Non-interleave 방식

그림 8은 Y, Cb, Cr의 샘플링 주기가 2:1:1인 경우 interleaved 방식으로 저장하는 예이다. Y성분은 모든 픽셀에서 샘플링하고 Cb, Cr 성분은 한 픽셀씩 건너 뛰면서 샘플링한다. 따라서 Y의 8 x 8 블록은 8 x 8 픽셀로 이루어져 있지만 Cb, Cr의 8 x 8 블록은 16 x 16 픽셀로 이루어져 있다. 즉, MCU는 16 x 16 픽셀로 되어 있으며 각 MCU 별로 Y, Cb, Cr 성분을 저장하게 된다.

그림 8 Interleave 방식

첫번째 MCU 블록에서 Y1, Y2, Y3, Y4 블록의 순으로 Y 데이터를 저장하는데 각 데이터 유닛의 크기는 8 x 8 픽셀이다. 다음 16 x 16 픽셀의 Cb, Cr 데이터(Cb1, Cr1)를 순차적으로 저장하면 첫번째 MUC 블록의 저장이 끝이 난다. 그 다음 두 번째 MCU 블록에서 Y5, Y6, Y7, Y8 블록 순으로 Y 데이터를 저장하고 Cb2, Cr2 데이터를 저장한다. 이런 방식으로 맨 마지막 8번째 MCU 블록까지 저장한다.

Interleaved 방식이던 Non-interleaved 방식이던 항상 MCU 의 배수 크기로 저장을 해야 한다. 따라서 그림 이미지 크기가 정확하게 MCU의 배수 크기가 아니면 실제 크기보다 더 크게 저장이 된다. 물론 복원할 때 원래 그림 이미지 크기에 맞게 불필요한 부분을 잘라낸다. MCU 크기에 맞지 않는 블록에서는 비어있는 부분은 보통 마지막 픽셀을 중복해서 채워넣는다.

JPEG 파일에는 각 성분의 샘플링 주기에 대한 정보와 그림 이미지의 크기에 대한 정보만 있을 뿐 MCU의 크기, 개수에 대한 정보는 저장되어 있지 않다. 따라서 다음과 같은 공식으로 MCU의 크기와 개수를 계산해 낼 수 있다.

MCU 폭 = 최대 샘플링 주기 * 데이터 유닛 폭(항상 8)
MCU 높이 = 최대 샘플링 주기 * 데이터 유닛 높이(항상 8)
가로 방향 MCU 개수 = (이미지 폭 + MCU폭 – 1) / MCU 폭
세로 방향 MCU 개수 = (이미지 높이 + MCU높이 – 1) / MCU 높이

Huffman Coding : 샘플링-DCT-양자화를 거친 데이터를 바로 그냥 저장하는 것이 아니고 한번 더 압축을 해서 저장을 한다. GIF 파일에서 LZW 코딩을 했듯이 JPEG 파일에서는 Huffman 코딩이라는 방법을 써서 압축을 한다. Huffman 코딩의 원리는 간단하다. 보통 한 픽셀 데이터의 길이는 8비트로 고정이 되어 있는데 Huffman 코드는 데이터의 빈도수에 따라 그 길이가 다르다. 빈도수가 많은 코드일수록 길이가 짧기 때문에 길이가 고정된 경우보다 전체 데이터의 크기가 작은 것이다.

Huffman 코드를 만드는 방법은 여러 가지가 있는데 JPEG 파일은 코드 길이(Code length)를 이용한 방법을 쓰고 있다. 알고리즘은 다음과 같다.

1. 데이터 배열에서 각 데이터들의 빈도수를 구한다.
2. 데이터들의 빈도수를 이용해 코드의 길이를 구한다.
3. 코드 길이를 이용해 Huffman 코드를 구한다.

예를 들어 다음과 같은 데이터 배열의 Huffman 코드를 구해보자.

BABDAGBFBDBDBABGGBCDBGBDBGBEFGFFGBFG

데이터의 종류는 A에서 G까지 7가지 이고 각 데이터들의 빈도수는 다음과 같다.

데이터

빈도수

데이터

빈도수

A

3

B

13

C

1

D

5

E

1

F

5

G

8

이를 이용해 코드의 길이를 구한다. 먼저 각 데이터들의 코드 길이를 나타내는 변수를 하나씩 할당해주고 모두 0으로 초기화한다. 다음 가장 빈도수가 작은 데이터 두 개를 골라 합친다. 그리고 각 데이터의 빈도수의 합을 새로운 빈도수로 넣어주고 코드 길이를 1씩 증가시킨다. 아래의 예에서는 빈도수가 1인 C와 E를 합쳐주고 코드 길이를 1씩 더했다. 새로운 테이블에서 다시 가장 빈도수가 작은 데이터 두 개를 골라 합치고 코드 길이를 1씩 증가시킨다.

이 작업을 모든 데이터가 다 합쳐질 때까지 반복한다.

이제 최종적으로 남은 코드 길이가 Huffman 코드의 길이가 된다. 빈도수가 높은 데이터일수록 코드 길이는 작다는 것을 알 수 있다. 다음 알고리즘을 이용해 Huffman 코드를 구할 수 있다.

HuffCodeCount = 0
CurrCodeLength = CodeLength(0)
i = 0
Do While i < NoOfCodes
  Do While CodeLength(i) = CurrCodeLength
   Code(i) = HuffCodeCount
   HuffCodeCount = HuffCodeCount + 1
   i = i + 1
  Loop
  HuffCodeCount = ShiftLeft(HuffCodeCount)
  CurrCodeLength = CurrCodeLength + 1
Loop

이 알고리즘을 한 스텝씩 따라가보면 그림 9와 같은 결과를 얻을 수 있다. 아래 첨자 2는 2진수임을 나타낸다.

그림 9 Huffman code 만들기

마지막 테이블이 최종적으로 구한 Huffman 코드 테이블이다. 이 코드 테이블을 이용해 데이터 배열의 각 데이터들을 Huffman 코드로 바꾸어 주면 압축이 된다. Huffman 코드는 코드마다 길이다 다르기 때문에 한 바이트 안에 여러 개의 코드가 들어갈 수도 있고 두 바이트에 걸쳐 하나의 코드가 들어갈 수도 있다.

얼마나 압축을 할 수 있는지 한번 살펴보자. 원래 데이터들은 A부터 G까지 7가지 이므로 3비트로 표현한다고 해보자. 총 데이터 개수가 36개이므로 전체 데이터 배열의 크기는 3 x 36 = 108 비트이다. 데이터 배열을 Huffman 코드로 표현하면 B는 1비트 코드로 표현할 수 있으며 B의 개수는 13개이므로 13비트가 필요하다. G의 개수는 8개이며 3비트로 표현할 수 있으므로 24비트가 필요하다. 이런 식으로 필요한 모든 비트 수를 계산하면 표 2와 같이 총 89비트가 필요하다. 따라서 압축 효율은 89/108 = 89.8%가 된다.

데이터

코드 길이

개수

필요한 비트 수

B

1

13

13

D

3

5

15

G

3

8

24

F

3

5

15

A

4

3

12

C

5

1

5

E

5

1

5

합

36

89

표 2 압축 효율

Huffman 코드로 압축된 데이터를 원래 데이터로 복원하는 것은 더 간단하다. 압축된 파일 안에는 Huffman 코드 테이블을 함께 저장한다. Huffman 코드 테이블을 참조하여 원래 데이터로 바꾸기만 하면 된다. 예를 들어 앞에서 살펴본 데이터 배열의 첫 4개의 데이터를 Huffman 코드로 표현하면 다음과 같다.

BABD ... -->  0112 1002 1002 ...

그런데 Huffman 코드는 길이가 가변이기 때문에 어디에서부터 어디까지가 하나의 코드인지 쉽게 구분이 가지 않는다. 하지만 Huffman 코드를 잘 살펴보면 해답을 찾을 수 있다. 서로 다른 코드는 코드의 맨 앞부분이 서로 중복되지 않는다는 특징을 가지고 있다. 예를 들어 B를 가리키는 코드는 02인데 02로 시작되는 코드는 하나도 없다. 마찬가지로 1002로 시작하는 코드는 D밖에 없다. 따라서 코드 길이 순서대로 코드 테이블을 검색하여 최초로 일치하는 코드가 나오면 그 코드가 바로 찾으려는 코드가 된다. 위의 예에서 첫번째 비트 데이터는 02인데 Huffman 코드 테이블에서 02으로 시작하는 코드는 B 밖에 없으므로 첫번째 비트가 B를 가리키는 Huffman 코드임을 알 수 있다. 그 다음 비트는 12인데 코드 길이가 1인 코드는 02밖에 없으므로 그 다음 비트를 읽어봐야 한다. 그 다음 비트는 12인데 코드 길이가 2인 코드는 없으므로 또 다음 비트를 읽어야 한다. 그 다음 비트까지 읽으면 지금까지 읽은 코드는 1112이 된다. 하지만 Huffman 코드 테이블에는 1112코드는 존재하지 않는다. 따라서 또 다음 비트를 더 읽어와야 한다. 그 다음 비트까지 읽으면 11102이 되는데 11102은 Huffman 코드 테이블에 존재하며 A를 가리킨다. 두 번째 코드를 찾은 것이다. 그 다음 비트는 02인데 02은 B를 가리킨다. 세 번째 코드도 찾았다. 마찬가지로 Huffman 코드 테이블에 존재하는 코드가 나올 때까지 다음 비트들을 읽는다. 그러면 그 다음 코드는 1002가 됨을 알 수 있고 1002는 D를 가리킨다.

JPEG 파일에서 Huffman 코딩 : JPEG 파일에서는 DCT-양자화를 거친 데이터를 Huffman 코딩 방식으로 압축을 한다. Huffman 코드의 최대 길이는 16비트로 제한되어 있다. DCT 계수 가운데 DC 계수와 AC 계수를 따로 분리하여 코딩하고 필요에 따라 YCbCr 성분 별로도 따로 코딩을 한다. Huffman 코딩은 서로 같은 데이터가 많을수록 압축 효율이 좋기 때문에 이렇게 서로 비슷한 성분들끼리 분리하여 코딩을 하는 것이다.

보통 DC 계수의 크기는 AC 계수의 크기보다 크며 양자화된 AC 계수는 대부분이 0이다. AC 계수끼리 묶으면 대부분의 데이터가 0인데 보다 압축 효율을 높이기 위해 0으로 된 데이터들은 PCX 파일에서 사용한 Run-length encoding 방식으로 압축을 한다. 즉, 데이터 자체를 저장하는 것이 아니라 0의 개수를 저장하는 것이다. 0이 아닌 AC 계수와 DC 계수는 Huffman 인코딩을 하는데 값 자체를 인코딩하는 것이 아니고 인접한 값과의 차이를 인코딩한다. 예를 들어 DC 계수 배열이 122, 123, 124, 125, 126 이런 식이라면 실제 값이 아닌 인접한 값과의 차이인 122, 1, 1, 1, 1을 인코딩하는 것이다. 이렇게 하면 서로 똑같은 값들이 많아지기 때문에 값 자체를 인코딩할 때보다 훨씬 더 압축 효율이 높아진다. 이런 이유 때문에 인접한 픽셀들끼리의 변화가 적은 사진 이미지가 도형 이미지보다 압축 효율이 좋다.

"Graphic" 카테고리의 다른 글
  • 최고의 컴퓨터 그래픽 요소 모음 (0)2007/05/02
  • JPEG(2) - JFIF (1)2007/05/02
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
  • 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리 (0)2005/04/21
2007/05/02 01:07 2007/05/02 01:07
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/2880

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/07/31 19:40

포토샵을 이용한 웹이미지 최적화

Staff 10/01/2000

이미지가 없다면 월드 와이드 웹(WWW: the World Wide Web)이 무슨 소용있을까? 이 특강에서는 GIF형식과 JPEG형식을 구분하는 방법과 두 파일 형식의 기능을 향상시키는 방법을 배운다.

시장에는 그래픽을 다루는 프로그램들이 많이 있지만 전문 디자이너들은 어도비 포토샵(Adobe PhotoShop)을 선택한다.

하지만 많은 사람들이 포토샵에 있는 복잡한 기능들을 보고 많이 좌절한다. 이런 현상을 기능충격이라고 부른다. 포토샵을 마스터하는 데는 어려움이 많지만 일단 시도를 해야 한다.

시간과 노력을 들이다보면 점점 잘하고 있는 자신을 발견할 것이고 머지않아 별 노력 없이도 멋진 이미지를 만들 수 있을 것이다.

그것을 염두에 두고 포토샵에서 웹 이미지를 최적화시키는 방법을 찾아보자. 포토샵은 특히 개인 웹사이트 개발하는데 유용하다. 여기에서는 공동(모두 가지고 있는) 클립아트를 쓸 것이다.

포토샵에는 웹 그래픽을 매력적으로 만들어주는 수십가지 도구들이 있다.

하지만 웹 이미지를 만들기 전에 한가지 기억할 것이 있다. 프로젝트를 확실히 성공시키기 위해서 해야 될 가장 중요한 일 중 하나는 적당한 파일 형식으로 가장 쓰기 쉽게 이미지를 저장하는 것이다.

웹 그래픽에 사용할 전송 형식을 결정하다보면 대체로 GIF와 JPEG 두 개로 정해진다. 다행히 포토샵은 이 두 가지 형식으로 이미지를 저장할 수 있다.

비트맵 기반의 이 두 형식은 브라우저로 더 빨리 자료를 올리고 웹 서버의 디스크 공간을 덜 차지하도록 그래픽 파일의 정보를 압축한다.

불행하게도 정확한 이미지 포맷을 고르는 구체적인 방법은 없다. 그래서 원본 그래픽의 복잡한 정도와 웹브라우저에 나타나게 하고 싶은 이미지에 따라 결정해야한다.

GIF형식과 JPEG형식의 기본 특징에 대해 살펴보자.

GIF
GIF(The Graphic Interchange Format)는 웹에서 가장 보편적으로 쓰이는 이미지 파일 형식이다.

전형적인 로고와 라인 아트 그림, 화면, 캡쳐의 경우 GIF를 쓰는 것이 최고다. 왜냐면 대부분 이미지의 질을 바꾸지 않고 포토샵에서 만들어진 그대로 웹에 나타나기 때문이다.

하지만 GIF는 8 비트 파일 형식에 쓰이는 인덱스 컬러 팔렛트의 한계인 256색을 넘지 않는 범위 내에서만 쓸 수 있다. 복잡한 컬러 혼합 방식을 쓴 그래픽은 GIF형식에서는 종종 깨져서) 나타난다.

GIF의 기능
GIF는 RGB 그래픽의 크기를 2/3 정도로 줄이는 StuffIt이나 PKZip같은 유명한 도구들과 동일한 데이타 압축 기술을 사용한다. TIFF로 파일을 저장하면 96KB인 것이 GIF 파일 형식으로 저장하면 64KB로 압축할 수 있다.

GIF의 특징
포토샵을 쓰면 GIF인덱스 팔렛트에서 컬러 하나를 투명색으로 지정할 수 있다. 이것은 희미하거나 겹치는 이미지 같은 특수 효과를 만드는 데 유용한 기능이다.

또 포토샵은 웹 브라우저로 저해상도의 이미지 버전을 처음에 즉시 올리고 차차 화질을 향상시키는 GIF 혼합 기법(interlacing GIF)을 제공한다(이 장치는 거의 모든 웹 디자인에 이상적이다).

또한 GIF로 간단한 애니메이션을 만들 때는 GifBuilder와 GifAnimator 같은 셰어웨어 프로그램을 쓸 수 있다.

JPEG
JPEG(The Joint Photographic Experts Group)형식은 사진 이미지와 지속적인 톤 유지를 필요로하는 세밀한 일러스트레이션에 가장 좋은 방법이다.

JPEG은 미묘한 음영의 변화를 정확하게 보여주기 위해서 만들어졌기 때문에 단색의 큰 면적이나 복잡한 가장자리가 있는 화면 캡쳐와 같은 그래픽에는 별로 좋지 않다.

JPEG은 모든 비트수를 지원하지만 일반적으로 24비트와 32비트 이미지에만 쓰인다.

JPEG의 기능
JPEG은 사실 원본 파일에 있는 일부 정보를 없애면서 압축된 이미지를 모방한다.

이런 손실압축은 인간의 눈이 보여지는 모든 컬러를 시각적으로 처리하지 못하기 때문에 일부 컬러나 세부묘사가 사라지더라도 JPEG 이미지가 원본과 거의 같게 보인다는 가정하에 일어난다.

GIF로 대략 64KB 크기가 나오는 96KB의 TIFF 이미지가 JPEG 파일로 바뀌면 32KB로 줄어든다.

JPEG의 특징
원본 이미지의 비트수를 줄이는 JPEG의 압축 비율은 조절이 가능하다. 압축 비율이 낮수록 이미지의 질은 더 좋아진다. 하지만 결과적으로 그런 파일은 더 많은 디스크 공간을 차지한다.

최선의 선택
대부분의 일상적인 웹 이미지의 경우 사람들은 웹 파일 형식으로 대부분 GIF를 선택할 것이다. 하지만 전문적인 이미지를 웹 디자인에 적용하는 경우에는 JPEG으로 할 것이다.

형식을 선택하기 어려우면 그냥 두 가지 압축 기술로 이미지를 변환해 보고 애용하는 웹 브라우저를 통해 비교해보면 된다. 견본용 그래픽은 도안 A(using-1.gif)에서 볼 수 있다.

GIF 파일은 이미지 컬러혼합 기술을 약간만 쓰지만 컬러의 미세한 부분을 더 많이 포함하고 있다는 사실을 명심하자. JPEG 이미지는 실제로 깊이감과 색조 혼합 기능을 향상시켰다. 반면에 멋진 세부묘사 부분을 사라지게 만들었다.

그래픽 디자인에서는 흔히 있는 일이듯이 선택은 이미지의 어떤 점이 자신에게 가장 중요한가에 달려있다.

인터넷에 쓸 GIF 준비
GIF를 인터넷에 올리기 위해 저장할 때는 몇가지 고려할 선택 사항이 있다. 컬러의 양을 줄일 수도 있고, 새 컬러 팔렛트를 고를 수도 있고, GIF를 혼합할 수도 있고, 이미지의 컬러를 투명하게 바꿀 수도 있다.

Gif89a에 대한 이야기
Gif89a 필터는 포토샵에 포함되어 있다. 이 필터를 쓰면 컬러를 선택해서 투명하게 바꾸고 GIF 이미지를 혼합할 수 있다. GIf89a를 써서 GIF를 변환시키는 방법을 실제로 알아보려면 먼저 이미지 하나를 연다. 예를 들어 도안 B(using-2.gif)에 나온 RGB 이미지를 써보자.

그 다음 웹 브라우저에 보이고 싶은 이미지의 일부를 선택하고 새 레이어 선택으로 넘어간다. 도안 B에 나온 것처럼 선택 도구(Selection tools)를 사용해서 기린만 선택한다.

그리고 바탕 레이어에서 선택한 부분을 잘라 새로운 레이어에 그것을 붙여넣는다. 그렇게 하려면 레이어 메뉴 아래의 새 메뉴에서 Layer Via Cut을 선택한다. 그러면 포토샵이 새 레이어에 선택한 부분을 붙여준다.

이제 기린만 옮기려면 바탕 레이어를 숨기면 된다. 그러기 위해선 레이어 팔렛트 안의 배경 레이어 옆에 있는 눈 모양 아이콘을 선택한다. 그리고 이미지를 보낸다.

다음에 GIF89a Export를 파일 메뉴 아래 Export 메뉴에서 선택한다. 그러면 포토샵이 자동으로 투명 인덱스 컬러를 기준 웹 브라우저의 회색으로 맞춘다.

하지만 회색 컬러 견본(gray color swatch)을 클릭하고 컬러선택 대화상자(Color Picker dialog box)에서 새로운 컬러를 골라서 색을 바꿀 수도 있다.

투명 인덱스 컬러를 바꾸는 것 외에 가지고 있는 이미지의 컬러도 바꿀 수 있다. GIF89a Expert 대화 상자(GIF89a Export dialog box)를 쓰면 컬러 팔렛트를 바꾸거나 새 팔렛트를 더하거나 이미지에 사용되는 컬러의 수를 바꿀 수 있다. 예를 들어 적용 팔렛트(Adaptive palette)를 선택하고 컬러 텍스트 상자(Colors text box)에 임의로 255라는 숫자를 써넣을 수도 있다.

다음에는 내보낼 GIF 이미지를 혼합하기 위해 비월주사 체크 상자(Interlaced check box)를 작동시킨다. 대부분 이미지 형식에서 컴퓨터는 정보를 읽고 상하 좌우로 이미지를 그린다.

이 과정에서 사용자가 이미지가 나타나기를 기다리는 약간 지루한 시간이 걸린다. 포맷을 비월주사시키면 컴퓨터가 전체 이미지를 바로 그릴 수 있도록 이미지를 형성한다. 처음에는 해상도가 낮다가 몇 분이 지나면 다운로드가 끝나면서 컴퓨터가 나머지 이미지를 완성한다.

계속해서 OK 클릭
마지막으로 파일의 이름을 정하고 저장한다. 웹에 쓸 이미지를 만드는 것이기 때문에 이미지의 이름을 정할 때 PC에서 이름을 정하는 일정한 관습을 따르는 것이 좋다. (012Web.GIF처럼 8자 이내의 문자와 마침표 다음에 3자로 된 확장자를 사용)

파일의 이름을 정하고 저장하기 위해서 GIF89 Expert 대화 상자(GIF89a Export dialog box)에서 OK 버튼을 클릭한다. 저장대화상자(Save dialog box)에서 만들어놓은 GIF의 이름을 써넣고 저장을 클릭한다.

그러면 할 일이 다 끝났다. 이제 어느 웹 페이지에나 띄울 수 있는 비월주사 그래픽을 만들었다.

명심할 점: 포토샵의 다른 기능들도 두려워하지 말고 장난삼아 다뤄보자. 그런 장난은 강력한 이미지 편집 도구를 더 많이 배울 수 있는 일종의 연습이다.@
"Graphic" 카테고리의 다른 글
  • JPEG(2) - JFIF (1)2007/05/02
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
  • 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리 (0)2005/04/21
  • 스캔해상도와 선수, 출력해상도가 어떻게 다른가? (0)2005/04/21
2005/07/31 19:40 2005/07/31 19:40
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/1287

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/04/21 23:51

그레이 이미지 톤(Tone)수와 프린터 출력간의 원리

그레이 이미지 톤(Tone)수와 프린터 출력간의 원리


8비트 Grayscale 이미지는 최대 256톤을 갖는다. 그러나, 레이저 프린터는 이 모든 톤의 정보를 표현해 낼 수 없다.

저해상도 프린터는 더욱 비참하다.


회색음영 (Shades of Gray) = 프린터해상도(dpi)/lpi => n제곱

↓

Ex. 150dpi의 해상도 지닌 이미지, lpi는 dpi의 절반 곧, 75lpi로 설정해야 함을 공식에서 배웠는데, 이 때 300dpi 프린터로 프린트한다면?

300dpi/75lpi = 4, 4의 제곱=16 회색음영


정말 너무하지 않은가? 256 회색 음영 이미지가 300dpi 프린터에서 16음영으로 줄어든다니!


엄밀히 말해서 75lpi 하프톤 스크린도 300dpi 프린터에 비하면 아주 놓은 값이다. 대부분의 제조업자들은 45-60 사이의 lpi를 권장한다. 프린터에서 사용해야 하는 라인스크린 빈도는 정말로 심미학적인 문제이다.

하프톤 패턴을 표현하는데 사용하는 인치당 라인수(lpi)가 적으면 적을수록 더 많은 음영을 시뮬레이션 할 수 있지만, 이미지의 선들이 더 많이 나타나게 된다.

Ex. 1200dpi 포스트스크립트 프린터로 85lpi의 하프톤 라인 스크린으로 시뮬레이션 할 수 있는 회색 음영색 영역은?

1200dpi/85lpi = 14.12, 14.12의 제곱 = 199.37


그렇게 나쁘지는 않다! 회색음영 이미지의 256가능 음영 중에서 199개가 85lpi 라인스크린의 1200dpi에서 표현할 수 있다.

하지만 200개 이상의 음영을 포함하고 있는 회색음영 이미지에서 이러한 설정을 이용한다면? 이미지에서 보다 정교한 시각 정보에 대한 제어력을 상실하게 되고,일부 음영은 운에 맡기는 수 밖엔......

프린트가 상업 프린트를 위해 촬영용 작품으로 사용할 것이라면, 기계가 처리할 수 있는 것보다 더 많은 시각 정보를 주었기 때문에 전혀 예상치 못했던 곳에서 거칠고 고르지 못한.......

↓

다른 대안> 프린터의 한계에 맞추기 위해 이미지의 톤 수를 줄이려면,
①먼저 이미지에 얼마나 많은 명도들이 있는지 결정을 내린 다음에 ②포토샵의 Level 기능을 이용하여 필요한 만큼 회색음영들을 지우면 된다.


상업인쇄소와 상의한 후 프레스가 12% 이하의 밀도를 가진 하프톤은 제어할 수 엇으며, 90%검정이 프레스가 만들어 낼 수 있는 가장 밀도가 높은 하프톤 도트라고 말한다면?

↓

256-(하프톤밀도(%) ×2.56) = 명암값

①12% × 2.56 = 30.72, 256-30.72 = 225.28 (-> 225)
②90% × 2.56 = 230.40, 256-230.40 = 25.60 (-> 26)

↓

Levels 대화상자 : Output Levels에 26, 225 를 입력한다.


위에서 하프톤밀도(%) ×2.56의 원리: 0에서 255에 이르는 밝기 영역이 0에서 100에 이르는 밀도영역에 직접적으로 대응되는 것이 아니므로
"Graphic" 카테고리의 다른 글
  • JPEG(1) - JPEG원리 (0)2007/05/02
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
  • 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리 (0)2005/04/21
  • 스캔해상도와 선수, 출력해상도가 어떻게 다른가? (0)2005/04/21
  • 이미지 해상도의 이해 (0)2005/04/21
2005/04/21 23:51 2005/04/21 23:51
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/367

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/04/21 23:50

스캔해상도와 선수, 출력해상도가 어떻게 다른가?

스캔해상도와 선수, 출력해상도가 어떻게 다른가?

300dpi로 스캔한 컬러이미지 파일을 300dpi 컬러 프린터로 출력하면 충분하지 않을까? 초보자의 생각.

↓

이는 모니터와 프린터의 근본적인 차이점을 이해하지 못함에서 기인.

↓

안타깝게도 인쇄나 프린터에서 사용하는 잉크는 모니터의 광선처럼 농도를 자유롭게 조절할 수 없으며, 단지 잉크가 찍힐 것인지의 여부만 결정될 수 있다. 따라서 잉크는 한 점을 다양한 농도의 잉크로 출력할 수는 없고, 단지 세가지 색(CMY) 또는 흰색(or 검은색)으로만 표시되는 것이다.

↓

그렇다면 인쇄물은 어떻게 단 4가지 색상의 잉크만으로 총천연색을 표현할 수 있는 것일까?

↓

그 비밀은 바로 디더링(Dithering) 이라는 원리에 있다.

예를 들어, 모니터 상에서 50%의 노란색으로 표시된 점을 프린터로 표시할 경우 프린터는 그 점 내의 절반은 노란색으로 채우고 나머지 절반은 비워둔다. (그러기 위해서는 모니터보다 2배의 해상도가 필요하다.) 마찬가지로 25% 노란색을 표시하려면 그 점 내의 1/4만 노란색 잉크로 채우는 것이다. 물론 이때 채워진 곳과 채워지지 않은 곳은 그 경계가 뚜렷하지 않도록 아주 작은 점들로 나누어 질수록 좋다. (결국 출력 해상도가 높을 수록 좋다.)

이러한 원리로 간단히 생각해 보면, 모니터의 한 점은 각각 256단계의 밝기를 가질 수 있는 세가지 광선을 이용해 표시한다고 했으니, 광선 대신 세가지 잉크를 이용해 그 점의 색상을 표시하려면 그 한 점은 256개의 보다 작은 영역들로 나뉘어 져야 한다. 다시 말해 모니터 상의 한 점이 인쇄물에서 정확히 표시되려면 그 한 점은 256개의 칸들로 나뉘어 져야 하며, 256개의 칸으로 나누려면 가로·세로 각각 16개 씩의 칸들로 구성되므로 (16X16=256), 출력기의 해상도는 원본 파일의 해상도보다 16배가 커야 정확하게 그 색상을 표시할 수 있다는 설명이 가능하다. (해상도는 직선 1인치 안에 몇 개의 점들이 위치하는 가를 표시하기 때문에.)

결국 스크린 해상도는 150dpi의 파일을 가장 정확하게 묘사하려면 출력기의 해상도는 그 16배인 2,400dpi로 설정해 주는 것이 좋고, 300dpi 파일이라면 4,800dpi로 출력하는 것이 가장 좋을 것이다. (그러나 현재까지 선보인 고해상도 출력기 중 4,800dpi의 해상도를 지원하는 기종은 없으며 설사 있다고 해도 4,800분의 1인치 크기의 점에 잉크를 묻히는 일도 결코 쉬운 일은 아닐 것이다.)



그렇다면 출력선수(Screen Ruling (lpi))와는 도대체 무슨 관계가 있는 것일까?

↓

출력선수(lpi)는 사실 출력해상도 보다는 스캔해상도에 직결되는 개념이다.

↓

그 이유는, 앞에서 모니터 상의 한 점을 인쇄로 표현하기 위해서는 농도를 표현하기 위해 그 한 점이 가로/세로 16개 씩의 격자로 나누어야 한다고 설명한 것처럼, 그 16개씩의 격자로 이루어진 한 그룹의 점이 곧 모니터에서 표현되는 하나의 픽셀 (컴퓨터로 스캔된 하나의 픽셀)에 대응되는 셈이기 때문이다. 결국 출력선수는 스캔해상도와 마찬가지로 인쇄물에서의 기본적인 해상도를 나타내는 개념이다.

좀 더 정확히 설명하자면, 출력선수는 인쇄물에서 농도 단위를 결정하는 기본단위인 하프톤 셀 (한 그룹을 이루는 점들의 집합)들이 일정한 범위 내에 얼마나 조밀하게 배열되어 있는지를 표시하는 단위이다.
출력선수는 1인치내에 하프톤 셀들이 얼마나 많이 배열되어 있는가에 따라 Line Per Inch (lpi) 단위로 표시 된다.

결국 전술한 것처럼, 하나의 하프톤셀과 16개의 격자점들로 이루어져 있을 경우에 해당 출력물의 출력해상도는 출력선수에 16을 곱한 값이 된다. (그러나 경우에 따라서는 보다 적은 수의 격자점들로 하프톤 셀을 구성하기도 하므로 15배나 14배가 될 수도 있다.)

따라서 단순화 시켜 볼 경우 150ppi 파일은 150선(lpi)으로 출력하는 것이 좋고, 150선 출력물은 2,400dpi로 출력될 때 최상의 결과가 나온다.



그러나 유감스럽게도 인쇄에 실제 적용되는 기술과 결과는 그리 단순하지만은 않다. 특히 컬러인쇄시에는 전술한 색만으로는 정확한 검정색을 표시하지 못하므로 검정색 잉크를 추가로 사용해야 하며, 또한 이들 색상마다 잉크가 찍히게 될 하프톤 셀들의 위치는 서로 조금씩 달라야 한다. (그 이유는 만약 이들 잉크가 서로 같은 위치에 찍히면 오히려 제 색상을 낼 수 없고, 경우에 따라서는 모아레를 생성시키기 때문이다.)

그러다 보니 파일상의 한 점(Pixel)이 인쇄물에서의 하프톤 셀과 정확히 일치하지 않으며, 오히려 본래 파일상의 한 픽셀을 표현하기 위해서는 네가지 색상의 하프톤 셀들이 원본과는 다른 서로 어긋난 위치에 자리 잡아야 한다는 문제가 생긴다. 그런 문제 때문에 사실 파일상의 데이터를 인쇄물에서 픽셀 위치까지 똑같게 표현 할 수는 없는 일이고 다만 근사치만을 표현 할 수 있을 뿐이다.



<결론> 그러므로 앞에서 단순화했던 '150ppi 파일은 150lpi로 인쇄되는 것이 좋다'는 명제는 현실과는 정확히 일치되지 않는 가설에 지나지 않으며, 오히려 파일상의 두 점을 하나의 하프톤 도트로 표현하거나, 파일상의 세 점을 두 개의 하프톤 셀로 표현할 경우에 보다 좋은 인쇄물을 얻을 수 있다는 실험 결과가 나올 수 있는 것이다.

따라서 스캔해상도는 출력선수의 두 배(또는 1.5배)로 설정함이 가장 이상적이다
"Graphic" 카테고리의 다른 글
  • 포토샵을 이용한 웹이미지 최적화 (0)2005/07/31
  • 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리 (0)2005/04/21
  • 스캔해상도와 선수, 출력해상도가 어떻게 다른가? (0)2005/04/21
  • 이미지 해상도의 이해 (0)2005/04/21
  • GIF파일과 JPG파일의 차이점 (0)2005/04/21
2005/04/21 23:50 2005/04/21 23:50
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/366

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/04/21 23:33

이미지 해상도의 이해

이미지 해상도의 이해

해상도의 설정은 이미지를 출력하는 경우 피해갈 수 없는 요소이다. 포토샵에서 새로운 파일을 만들 때의 대화 상자에서도 ppi를 설정해야 하며, 의식하지 않아도 여러 가지 설정이 용지 설정이나 프린터 옵션에 숨겨져 있다.


출력해상도

이미지가 픽셀이라는 화소의 집합체인 이상, 반드시 해상도(밀도)가 존재한다. 이는 픽셀이라는 것은 구체적인 크기를 가지지 않은 정보이기 때문이다. 여기에 해상도를 설정함으로써 비로소 출력시의 크기가 정해지는 것이다.
예를 들면 포토샵의 경우, 화면에 출력되는 해상도를 설정할 수 없는데, 그것은 포토샵이 사용하고 있는 컴퓨터 시스템에 의존하고 있다는 이야기 이다. 매킨토시의 경우 본래는 72dpi(정확히는 ppi)로 정해져 있지만 현재는 표준적인 해상도라는 말은 사실상 없어지고 있다. 즉 640X480픽셀이라면 13인치 모니터의 표시면적을 말했지만 현재는 17인치 모니터이든 20인치 모니터이든 사용자가 구축한 설정에 따라 다양한 해상도를 설정할 수 있도록 상황이 변해가고 있다.

또한 종이에 출력하는 경우에도 프린터의 성능에 따라 해상도를 자유자재로 변경하면서 출력할 수 있다. 실은 이 프린터의 성능이라고 하는 것이 이해하기 쉬울 듯하면서도 이해하기 어려운 것 중의 하나이다.


계조를 출력할 수 있을까?

디스플레이와 유사한 개념으로 이미지를 출력하는 프린터라면 문제는 간단하다. 예를 들면 염료승화형 컬러프린터는 (성능의 차이는 있지만), 픽셀을 출력할 수 있다. 컬러모니터와 마찬가지로 픽셀 하나하나에 계조 등의 컬러정보를 부여하는 것이 가능하기 때문이다.

그러나 레이저프린터의 경우에는 사정이 달라진다. 여기에서는 알기쉽게 흑백프린터에 대해서만 설명하겠다. 즉 계조를 표현할 수 없는 포스트스크립트 프린터라면 도트의 농도가 아닌 밀도로 계조를 표현하지 않으면 안된다. 밀도안에 다시 밀도가 나타나는 것이다.

첫 번째의 밀도, 즉 출력 해상도는 격자와 같은 것이다.즉 픽셀을 어느 정도의 밀도로 배열할 것인가라는 의미로 컬러의 농도에 의해 이 격자의 크기가 바뀌는 일은 없다.두 번째의 밀도는 격자안을 어떻게 나눌 것인가라는 의미에서의 밀도이다. 두 번째의 밀도가 세밀할수록 많은 계조를 표현할 수 있다.

그런데 출력기 자체의 성능이 여기에서 문제가 된다. 즉, 두 번째 밀도의 최소 단위는 출력기 해상도 이상으로 세밀하게 만들 수 없기 때문이다. 거꾸로 생각해보자. 300dpi의 해상도를 지원하는 출력기에서 60선(처음의 격자)으로 인쇄하는 경우, 5X5도트의 격자 안에 망점하나를 표현하게 된다.(300÷60=5도트). 즉, 망점 하나로 25계조(5X5=25)를 표현할 수 있다(사실은 도트를 사용하지 않는 경우도 포함하여 26계조이지만 먼저 개념을 이해한다는 의미에서 여기에는 포함시키지 않았다).


반비례의 관계

여기에서 선수를 30선으로 떨어뜨리면 10X10도트의 망점, 즉 가로 세로 100단계의 계조를 표현하게 되는데, 30선이라면 화질이 상당히 거칠어진다. 물론 25계조도 거칠지만, 계조수와 선수의 밸런스를 고려하면 300dpi의 흑백프린터를 사용하는 경우에는 현실적인 수치일 것이다(물론, 레이아웃 소프트웨어 등에서 문자를 사용한 경우, 그것은 같은 종이 안에 있는 이미지와는 다른 해상도로 출력할 수 있다).

여기서 말하는 밸런스는 어디까지나 기능에 한계가 있는 프린터의 경우로, 이러한 프린터로 최종출력을 하는 것은 아니므로 출력해상도는 그리 큰 문제가 되지 않는다. 그렇다면 실제로 인쇄용 제판필름에 출력할 경우에는 어떻게 다른지 알아보자.

제판용 필름출력에서는 최종적으로 원하는 해상도(인쇄선수)가 정해져 있으므로 거기에서부터 계산하면 된다. 예를 들어 풀컬러 인쇄의 경우 CMYK 각 판은 256계조를 필요로 한다. 그 경우, 256계조를 실현하기 위해서는 16X16도트로 두 번째의 밀도를 형성하게 된다.이것을 150선으로 인쇄하고 싶은 경우, 1인치당 16X150=2,400의 해상도를 가진 출력기가 필요하다는 계산이 된다.


선수와 이미지의 해상도

그렇게 생각하면 이미지 자체의 해상도는 150선 즉 150ppi면 충분하다고 생각될 것이다. 그러나 실제 인쇄에서는 CMYK 각 판은 겹쳐지지 않도록 서로 엇갈리게 인쇄된다. 이러한 엇갈림을 스크린 각도라고 하는데, 망점이 늘어서는 방향을 회전시킴으로써 각각의 망 사이를 채우고 또 잉크가 서로 섞여 컬러가 탁해지는 것을 막아준다.

이러한 이유에서 이미지 인쇄에는 일반적으로 출력할 선수에 대해 약 2배 정도의 해상도를 필요로 한다. 최저 1.2배 정도라도 그다지 손상없는 인쇄물을 얻을 수 있지만 그러기 위해서는 엄밀한 테스트와 품질 관리를 각오하지 않으면 안된다. 또 2배 이상의 이미지 해상도라면 분명히 품질은 향상되지만 파일크기가 불필요하게 늘어나 작업속도에 영향을 끼치고 인쇄공정에 있어서도 엄격한 품질관리가 요구된다
"Graphic" 카테고리의 다른 글
  • 그레이 이미지 톤(Tone)수와 프린터 출력간의 원리 (0)2005/04/21
  • 스캔해상도와 선수, 출력해상도가 어떻게 다른가? (0)2005/04/21
  • 이미지 해상도의 이해 (0)2005/04/21
  • GIF파일과 JPG파일의 차이점 (0)2005/04/21
  • TWAIN이란 무엇인가? (0)2005/04/21
2005/04/21 23:33 2005/04/21 23:33
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/365

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/04/21 23:32

GIF파일과 JPG파일의 차이점

GIF파일과 JPG파일의 차이점

GIF(Graphisc Interchange Format)

- 주로 사용하는 곳은 아이콘 많습니다.
- 움직이는 아이콘이나 그림 파일은 GIF파일입니다.
- Data 압축 과정에서 Data 손실이 없습니다.

JPG(Joint Photographic Expert Group)

- 사진 또는 색상 수가 많은 그림을 저장할 때 편리합니다.
- JPG로 저장하면 정지된 그림이 됩니다.
- 압축률이 GIF에 비해 높음, 단 Data의 압축 과정에서 Data 손실이 있을 수 있음

[비교]

사진이 아닌 간단한 그림의 경우에는 JPG파일이 압축률이 좋다고는 하지만
압축하는데 필요한 명령공간 때문에 그림을 최대로 줄여도
파일 크기가 7KB이하로는 줄일 수 없으므로
간단한 파일은 GIF파일로 저장하는 것이 더 효과적인이라고 합니다.

그렇지만 화소가 높은 사진인 경우나 색상이 많아서 복잡한 경우에는
GIF파일은 색상이 256컬러로 제한 되어져 있기 때문에
색상 지원이 많이 되지 못하고 압축율도 떨어지므로
JPG파일로 용량을 작게 할 수 있습니다.
"Graphic" 카테고리의 다른 글
  • 스캔해상도와 선수, 출력해상도가 어떻게 다른가? (0)2005/04/21
  • 이미지 해상도의 이해 (0)2005/04/21
  • GIF파일과 JPG파일의 차이점 (0)2005/04/21
  • TWAIN이란 무엇인가? (0)2005/04/21
  • 이미지가 화면과 출력물이 틀려요 (0)2005/04/21
2005/04/21 23:32 2005/04/21 23:32
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/364

Leave your greetings.

[로그인][오픈아이디란?]

Graphic2005/04/21 23:32

TWAIN이란 무엇인가?

TWAIN이란 무엇인가?

TWAIN은 이미지를 스캐닝 작업에 널리 사용되는 프로그램으로서,
이미지를 자신이 선호하는 그래픽 프로그램으로 직접 읽어들일 수 있게 해준다.

만약 TWAIN이 없다면, 우리는 열려있던 응용프로그램을 일단 닫고,
이미지를 받기 위한 특수한 응용프로그램을 열어 스캐닝한 다음,
그 이미지를 자신이 사용하기 원하는 응용프로그램으로 옮기는
번거러움을 감수해야 할 것이다.

TWAIN 드라이버는 응용프로그램과 스캐너 하드웨어 사이에서 동작한다.
TWAIN은 대체로 스캐너를 사면 함께 받게 되는 소프트웨어 패키지의
일부분으로 나오며, 포토샵 등의 이미지 조작 프로그램에 통합되어 있기도 하다.

이 소프트웨어는 주요 스캐너 제작회사 및 스캐닝 소프트웨어 개발회사에서
참여한 작업그룹에 의해 개발되었으며, 이제 산업표준이 되었다.

몇몇 사람의 이야기에 의하면,
TWAIN은 우습게도 "technology without an important name"의 약어라고 한다.
그러나, TWAIN 작업그룹은, 원래의 이름을 선택하고 난 뒤
그것이 이미 등록되어 있는 이름이라는 것이 판명되면서,
11시간의 회의 끝에 TWAIN이라는 이름으로 정하게 되었다고 한다.

TWAIN이라는 말은 "Ne'er the twain shall meet"이라는 속담으로부터
유래하였다고 하는데, 그 이유는 이 프로그램이 드라이버와
응용프로그램 사이에 있다는 점 때문이라고 한다.

이 이름은 머리글자를 딴 약어가 될 작정이 아니었다.
"Graphic" 카테고리의 다른 글
  • 이미지 해상도의 이해 (0)2005/04/21
  • GIF파일과 JPG파일의 차이점 (0)2005/04/21
  • TWAIN이란 무엇인가? (0)2005/04/21
  • 이미지가 화면과 출력물이 틀려요 (0)2005/04/21
  • 비트맵과 벡터의 차이는? (0)2005/04/21
2005/04/21 23:32 2005/04/21 23:32
Posted by webdizen
No Trackback No Comment

Trackback URL : http://www.webdizen.net/blog/trackback/363

Leave your greetings.

[로그인][오픈아이디란?]

«Prev  1 2 3  Next»

RSS HanRSS
Blog Image
webdizen
이 곳은 컴퓨터에 대해 연구하고, 공유하고, 소통하기 위한 연구실입니다. 개인적으로는 OLAP, Data Mining, Semantic Web, Data Modeling에 대해서 연구하고 있습니다.

Categories

전체 (2998)
Webdizen (134)
Life (6)
Diary (16)
Blog (9)
IDEA (1)
Travel (10)
Book (14)
Photo (7)
Movie (7)
Music (13)
Leisure Sports (10)
Funny (5)
Hardware (119)
Software (120)
Windows (5)
Unix & Linux (119)
Installation (4)
Kernel (10)
System (34)
Develop (22)
X-Window (0)
Applicaton (31)
Security (4)
Framework (2)
Hadoop (2)
Programming (805)
Algorithm & Data Structure (1)
Assembly (38)
UNIX/Linux C (95)
C++ (128)
STL (4)
Java (38)
Win32 API (92)
ATL/COM (44)
MFC (151)
.NET (26)
WCF/WPF (4)
C# (28)
Network Programming (17)
Database Programming (12)
OpenGL / DirectX (13)
Multimedia Programming (0)
Game Programming (21)
Parallel Distributed Progra... (0)
Reverse Engineering (0)
Debugging (9)
Python (1)
Ruby (1)
Ruby on Rails (1)
QT (4)
GTK (0)
JSP (0)
PHP (6)
ASP.NET (6)
ASP (3)
Development (28)
Useful Library (2)
Data Modeling (0)
Database (105)
Oracle (4)
MSSQL (41)
MySQL (2)
Data Warehouse (2)
Data Mining (3)
Network (66)
Web (78)
DHTML (4)
XHTML (1)
Javascript (1)
CSS (1)
AJAX (9)
XML (11)
Flex (1)
Silverlight (3)
Security (91)
DoS (1)
Kernel (10)
Scanning (3)
Sniffing (0)
Spoofing (4)
Overflow (28)
Web (11)
Shell (10)
Format String (14)
Window (2)
Embedded (70)
Multimedia (27)
Mobile (14)
Graphic (24)
Management (633)
Knowledge (581)
Hadoop (0)

Notice

  • 메타 블로그 사이트에 등록
  • 새해 맞이 블로그의 변화
  • 블로그 명칭 변경
  • 도메인(www.webdizen.net) 구...
  • TEXTCUBE 1.6.1로 업그레이드...

Tags

  • 몽랑볼 볼리노
  • 이수안
  • 의암관
  • 클립아트
  • WM_COPYDATA
  • 짐빔 화이트
  • 컨트롤
  • Project
  • OPENXML
  • Traffic
  • Detection
  • 네트워크 포트
  • ActionScript
  • 장르
  • upper_bound
  • 양방향 트랜잭션 복제
  • Web 2.0
  • Canon
  • 교육대학
  • 학습

Recent Articles

  • ASCII Code의 CRLF 제거 방법.
  • Hadoop 에서 c++ API 이용시....
  • Ubuntu Linux에서 Hadoop 구....
  • 내 심장을 한껏 뛰게한 "국가....
  • 스타 스키마 데이터베이스 설....

Recent Comments

  • ■ 온라인카지노 ▶ http://L....
    asdf 11/21
  • 그리고 혹시 해외여행자보험....
    kim 11/05
  • ★★실제 바다게임장과 똑같....
    asdf 11/04
  • sbsyama.co.to← 짱5000만당....
    asdf 11/04
  • ♡KicaZ??o(???) 바카라사....
    fdsf3fass 11/03

Recent Trackbacks

  • 파일 열기/저장하기 CFileDialog.
    은마군의 나태블록 02/11
  • World IT Show 2008.
    상우 :: Oranzie's BLOG 2008
  • cvs서버 설치하기.
    3인3색 2008
  • 속속 공개되는 Google Chart....
    PHP와 Web 2.0 2007
  • 마방진을 구하는 프로그램.
    Oranzie's BLOG 3 2007

Archive

  • 2009/09 (3)
  • 2009/08 (1)
  • 2009/03 (1)
  • 2009/02 (9)
  • 2009/01 (13)

Calendar

«   2009/11   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30          

Bookmarks

    • Administration
      • IIS.NET
      • NTFAQ
      • OS의 모든 것
      • 리눅스포털
    • Database
      • SQL Server Central
      • SQL Team
    • Development
      • .NET Heaven
      • ASP Alliance
      • ASP.NET 2.0
      • Bullog.net
      • C# Corner
      • C++ (C PlusPlus.com)
      • C++ Reference
      • CodeGuru
      • CodePlex
      • DebugLab
      • Dev Articles
      • Devpia
      • DotNet Junkies
      • DotNet Zone
      • Driver Online
      • GOSU.NET
      • HOONS 닷넷
      • Joinc 팀블로그
      • KOSR
      • MSDN Home Page
      • OSR Online
      • Sky.ph - 개발자 커뮤니...
      • TAEYO.NET
      • The Code Project
      • WindowsClient.net
      • 김상욱의 개발자 Side
      • 조인시 위키
    • Human Networks
      • belief21c's e-space
      • I think I can
      • Invisible Rover's Blog :D
      • Rodman®
      • ■ Feel So Good~! ■
      • 까만 나비
      • 나를 가꾸는 시간.
      • 나만의 즐거움~~!
      • 단녕
      • 상우 :: Oranzie's BLOG
    • Information Technology
      • Microsoft TechNet
      • 지디넷코리아 - 글로벌...
    • Security
      • FoundStone
      • milw0rm
      • NewOrder
      • OpenRCE
      • Phrack.org
      • Reverse Engineering b1...
      • Reverse Engineering Team
      • RootKit
      • SecurityFocus
      • SecurityXploded by Nag...
      • Wow Hacker
      • Zone-H
Textcube
Louice Studio Inc.
Powered by Textcube. Original designed by Tistory.