{"id":6988,"date":"2013-01-28T05:20:04","date_gmt":"2013-01-28T05:20:04","guid":{"rendered":"http:\/\/vskills.in\/certification\/tutorial\/?p=6988"},"modified":"2024-04-12T14:13:33","modified_gmt":"2024-04-12T08:43:33","slug":"image-formats-2","status":"publish","type":"page","link":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/","title":{"rendered":"Image Formats"},"content":{"rendered":"<h4><strong>Image Formats<\/strong><\/h4>\n<p>Images makes web pages more appealing and a pleasure to watch but there are various image formats out of which three image formats which are popular and used extensively on web pages are discussed.<\/p>\n<p><strong>Graphics Interchange Format ( GIF )<\/strong> &#8211; Images in this format are used for banners, clip art, and buttons as they can have a transparent background where in parts of the image, the background will be allowed to show through. But, they are usually large file size, not compressed as a jpeg, which results in slow load times and large transfer rates. Gifs are limited to the 256 color scheme. It stores the palette of colors it used to store the image and is called as lookup table<strong>\u00a0<\/strong><\/p>\n<p>They use LZW compression which is lossless compression technique or no data is lost and therefore there is no loss of quality. They can store more than one frame (or copy of the image) within a file, thus they can rotate between the various frames and create a simple animation called as animated GIFs.<\/p>\n<p><strong>Joint Photographic Experts Group (JPEG)<\/strong> &#8211; Images in JPEG format have an unlimited color palette, and have a high compression rate thus reducing load times and disk space. They are a standard for storing and compressing images such as photographs that use a wide range of colors.<\/p>\n<p>It discards color data that people would not normally perceive during compression, thus it uses lossy compression. Amount of compression can be varied and hence the resultant file size from 100% quality means no compression.<\/p>\n<p>It does not allow for transparent backgrounds, but have good size\/quality ratio. They are used for photo galleries, or artwork for more image detail but they are usually avoided for graphical design.<strong>\u00a0<\/strong><\/p>\n<p><strong>Portable Network Graphics (PNG)<\/strong> \u2013 It is an extensible file format for the lossless, portable, well-compressed storage of raster images. PNG provides a patent-free replacement for GIF and can also replace many common uses of TIFF. Indexed-color, grayscale, and true color images are supported, plus an optional alpha channel. Sample depths range from 1 to 16 bits. PNG also compresses better than GIF in almost every case (5% to 25% in typical cases).<\/p>\n<p><strong>Rules to follow for images<\/strong><\/p>\n<ul>\n<li>JPEGs for photo-realistic pictures with a lot of detail.<\/li>\n<li>GIFs or PNGs for images with flat color like diagrams, text, or logos<\/li>\n<\/ul>\n<div class=\"apply\">\n<h3>Apply for HTML5 Certification Now!!<\/h3>\n<p><a href=\"http:\/\/www.vskills.in\/certification\/Certified-HTML5-Developer\" target=\"_blank\" rel=\"noopener\">http:\/\/www.vskills.in\/certification\/Certified-HTML5-Developer<\/a><\/p>\n<h4><a href=\"https:\/\/www.vskills.in\/certification\/tutorial\/certified-html5-developer\/\" target=\"_blank\" rel=\"noopener\"><strong>Back to Tutorial<\/strong><\/a><\/h4>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Image Formats Images makes web pages more appealing and a pleasure to watch but there are various image formats out of which three image formats which are popular and used extensively on web pages are discussed. Graphics Interchange Format ( GIF ) &#8211; Images in this format are used for banners, clip art, and buttons&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[135],"tags":[6768,6767,2444,2541],"class_list":["post-6988","page","type-page","status-publish","hentry","category-html5-developer","tag-html5","tag-html5-developer","tag-html5-developer-certification","tag-image-formats"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Image Formats - Tutorial<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Image Formats - Tutorial\" \/>\n<meta property=\"og:description\" content=\"Image Formats Images makes web pages more appealing and a pleasure to watch but there are various image formats out of which three image formats which are popular and used extensively on web pages are discussed. Graphics Interchange Format ( GIF ) &#8211; Images in this format are used for banners, clip art, and buttons...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Tutorial\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/vskills.in\/\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-12T08:43:33+00:00\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/\",\"name\":\"Image Formats - Tutorial\",\"isPartOf\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#website\"},\"datePublished\":\"2013-01-28T05:20:04+00:00\",\"dateModified\":\"2024-04-12T08:43:33+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Image Formats\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#website\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\",\"name\":\"Tutorial\",\"description\":\"Vskills - A initiative in elearning and certification\",\"publisher\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.vskills.in\/certification\/tutorial\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#organization\",\"name\":\"Vskills\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg\",\"contentUrl\":\"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg\",\"width\":73,\"height\":55,\"caption\":\"Vskills\"},\"image\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/vskills.in\/\",\"https:\/\/x.com\/vskills_in\",\"https:\/\/www.linkedin.com\/company-beta\/1371554\/\",\"https:\/\/www.youtube.com\/channel\/UCMWnscxPwRF_PqXo9B7q_Tw\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Image Formats - Tutorial","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/","og_locale":"en_US","og_type":"article","og_title":"Image Formats - Tutorial","og_description":"Image Formats Images makes web pages more appealing and a pleasure to watch but there are various image formats out of which three image formats which are popular and used extensively on web pages are discussed. Graphics Interchange Format ( GIF ) &#8211; Images in this format are used for banners, clip art, and buttons...","og_url":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/","og_site_name":"Tutorial","article_publisher":"https:\/\/www.facebook.com\/vskills.in\/","article_modified_time":"2024-04-12T08:43:33+00:00","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/","url":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/","name":"Image Formats - Tutorial","isPartOf":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#website"},"datePublished":"2013-01-28T05:20:04+00:00","dateModified":"2024-04-12T08:43:33+00:00","breadcrumb":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/image-formats-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vskills.in\/certification\/tutorial\/"},{"@type":"ListItem","position":2,"name":"Image Formats"}]},{"@type":"WebSite","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#website","url":"https:\/\/www.vskills.in\/certification\/tutorial\/","name":"Tutorial","description":"Vskills - A initiative in elearning and certification","publisher":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vskills.in\/certification\/tutorial\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#organization","name":"Vskills","url":"https:\/\/www.vskills.in\/certification\/tutorial\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/","url":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg","contentUrl":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg","width":73,"height":55,"caption":"Vskills"},"image":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/vskills.in\/","https:\/\/x.com\/vskills_in","https:\/\/www.linkedin.com\/company-beta\/1371554\/","https:\/\/www.youtube.com\/channel\/UCMWnscxPwRF_PqXo9B7q_Tw"]}]}},"_links":{"self":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/6988","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/comments?post=6988"}],"version-history":[{"count":7,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/6988\/revisions"}],"predecessor-version":[{"id":126473,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/6988\/revisions\/126473"}],"wp:attachment":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/media?parent=6988"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/categories?post=6988"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/tags?post=6988"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}