GIF, PNG, JPG. Which One To Use? If you’re starting out in web design you may be familiar with the different types of file formats used for images on the web, but it can be confusing trying to figure out which file type you should use. This is short guide outlines the differences between the file types and also uses a couple of examples to show you how the file size varies depending on which file type you use. Let’s start with GIF. Graphics Interchange Format (GIF) is one of the file formats used to display indexed-color graphics and images in HTML documents on the web. Indexed color means that it will only display a maximum of 256 colors. For this reason, GIF is NOT a good format for saving photographic type images with many colors.
JPG or JPEGJoint Photographic Experts Group (JPEG) format is used to display photographs and other continuous-tone images on the web. Portable Network Graphics (PNG) is a little bit like the best of both worlds. Logo Saved As Transparent GifFile size 10.17 K Logo saved as JPG. CSS Box Model: The Foundation For Improving Your CSS. The CSS box model lies behind everything you do in CSS.
Every element is defined by a rectangular box that encloses that element. Understanding how the box model works is a key to understanding CSS and having greater control over your layout and presentation. Let’s dive right in and talk about what the CSS box model is, how one box affects the boxes around it, and some common browser issues when displaying CSS boxes. In nutshell, the box model in CSS describes the boxes which are being generated for HTML-elements. In this post below you’ll learn the tips and techniques exactly about CSS box model to achieve best out of CSS development. You may be interested in the following related articles as well.
Feel free to join us and you are always welcome to share your thoughts that our readers may find helpful. Don’t forget to and follow us on Twitter — for recent updates. What is the CSS Box Model? Every element in the document tree is defined by a rectangular box. Inline boxes will wrap though. Elements Of Design: Texture.
On to the third element of design in our series. Previously we looked at the line and shape and how they can be used to enhance your design and communicate a message. Today we’re looking at texture. Texture can be defined as “the properties held and sensations caused by the external surface of objects received through the sense of touch.” It tends to play more of a supporting role in design, rather than being the main player. An exception to this is in interior design, where the designer will pay close attention to wall, floor and furniture textures when making decisions to do with colors and positioning in a room.
Image Credit: Great Interior Design Obviously texture is easier to create on print work because a designer can choose the type of paper, card or material used in the design. On the Ernest Hemmingway website it’s not hard to imagine what it would feel like if you ran your fingers over the “desk”. Texture Supports The Content Guidelines For Using Texture 1. 2. 3. Related Reading: Telerik Visual Style Builder.