[vc_row][vc_column][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”2\/3″][vc_column_text]<\/p>\n

SVG Logo for Your Website<\/h1>\n

[\/vc_column_text][vc_column_text]Web & Design Services will create a new logo or replicate your existing logo as a Scalable Vector Graphic (SVG).<\/p>\n

As technology advances, be sure that your business is up to the task.<\/p>\n

What does that even mean?<\/h4>\n

In graphic design, there are two types of images \u2013 raster and vector images.\u00a0 Raster<\/strong> images are composed of individual pixels \u2013 \u2018dots\u2019 \u2013 for instance, a photograph. \u00a0Surely, you are already familiar with existing formats like jpg, bmp, gif, or png.\u00a0 When you zoom in on these images, these pixels are visible.\u00a0 No matter what steps are taken, you cannot create more \u2018dots\u2019 to make it a better picture.<\/p>\n

Vector<\/strong> images, on the other hand, are created using a mathematical equation each time that the image is produced.\u00a0 Since the image is generated from a formula, if you were to zoom in (no matter how close) the image still looks just as good.\u00a0 In other words, whether your logo is being used as a small image on a website or encompasses an entire billboard, it will still have the same clean, crisp lines that are required.[\/vc_column_text][vc_column_text]<\/p>\n

Raster Image Explained<\/h2>\n

[\/vc_column_text][\/vc_column_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][\/vc_row_inner][vc_single_image image=”970″ img_size=”full” alignment=”center”][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”2\/3″][vc_column_text]In the past, raster images were \u201cgood enough\u201d.\u00a0 The optical resolution of a computer or a cell phone was not what it is today and a low-res image would suffice.\u00a0 That is no longer the case.\u00a0 Now there are \u201cretina\u201d displays for cell phones, computers, and TVs. If you have ever seen one of these displays, you realize that you no longer see any pixels (dots).\u00a0 How much longer will your logo be \u2018good enough\u2019?[\/vc_column_text][vc_column_text]<\/p>\n

Benefits of Vector Graphics<\/h3>\n

Vector images provide clear, sharp images regardless of the size or device.\u00a0 Besides looking great, vector graphics are typically much<\/u> smaller files.\u00a0 This means that a webpage loads much faster.[\/vc_column_text][\/vc_column_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][\/vc_row_inner][vc_raw_html]JTNDaW1nJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZkZXNpZ25zZXJ2aWNlc2ZvcnR3YXluZS5jb20lMkZ3cC1jb250ZW50JTJGdXBsb2FkcyUyRjIwMTglMkYxMCUyRmhlYWRlcl9sb2dvLnN2ZyUyMiUyMCUyRiUzRSUwQSUzQ3AlMjBzdHlsZSUzRCUyMmZvbnQtc2l6ZSUzQSUyMHNtYWxsJTNCJTIwdGV4dC1hbGlnbiUzQSUyMGNlbnRlciUzQiUyMiUzRVRoaXMlMjBpcyUyMGElMjBmdWxsLXNjcmVlbiUyMGV4YW1wbGUlMjBvZiUyMGFuJTIwU1ZHJTIwZ3JhcGhpYy4lMjAlMjBUaGUlMjBmaWxlJTIwaXMlMjBvbmx5JTIwMTkuNEtCJTIwLSUyMHdoaWNoJTIwbWVhbnMlMjBpdCUyMHRha2VzJTIwbm8lMjB0aW1lJTIwdG8lMjBsb2FkJTIwZXZlbiUyMHdpdGglMjB0aGUlMjBzbG93ZXN0JTIwY29ubmVjdGlvbi4lMjAlMjBTVkclMjBpcyUyMHN1cHBvcnRlZCUyMGluJTIwYWxsJTIwYnJvd3NlcnMlMjBvbiUyMGFsbCUyMGRldmljZXMuJTNDJTJGcCUzRQ==[\/vc_raw_html][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”2\/3″][vc_column_text]<\/p>\n

Limitations of Vector Graphics<\/h3>\n

You might say: \u2018Wow!\u00a0 All graphics should be like this\u2026\u2019\u00a0 It\u2019s not really that simple.\u00a0 As previously stated, vector graphics are superior to other graphics formats in many ways, but they will never completely replace raster images.\u00a0 By comparison, vector images are in some ways fairly simple compared to raster images.\u00a0 Let\u2019s use the comparison made earlier of raster images being like photographs.\u00a0 This complexity is needed at times to show detail that a vector image could not accomplish.\u00a0 A balance must be made using both formats when appropriate.<\/p>\n

Vector Generated Logos<\/h3>\n

Vector graphics are the preferred format for every logo.\u00a0 This gives you, the business owner, the freedom to use the same graphic for many different applications.\u00a0 Whether it be the version used on your website, printed on a t-shirt, or filling a billboard, a vector image is what is needed.[\/vc_column_text][\/vc_column_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][\/vc_row_inner][\/vc_column][vc_column][vc_column_text]<\/p>\n

Scalable Vector Graphics Demonstration<\/h2>\n

[\/vc_column_text][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”5\/6″][vc_raw_html]JTNDZGl2JTIwY2xhc3MlM0QlMjJib3gtY29udGFpbiUyMiUzRSUzQ2RpdiUyMGNsYXNzJTNEJTIyc2NhbGUtYm94JTIyJTNFJTNDaW1nJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZkZXNpZ25zZXJ2aWNlc2ZvcnR3YXluZS5jb20lMkZpbWFnZXMlMkZ3ZC1sb2dvLnN2ZyUyMiUyMCUyRiUzRSUwQSUzQyUyRmRpdiUzRSUzQ2ltZyUyMHNyYyUzRCUyMmh0dHBzJTNBJTJGJTJGZGVzaWduc2VydmljZXNmb3J0d2F5bmUuY29tJTJGaW1hZ2VzJTJGcHVsbC1hbmltYXRpb24uZ2lmJTIyJTIwaGVpZ2h0JTNEJTIyMTZweCUyMiUyMHdpZHRoJTNEJTIyMTZweCUyMiUyMCUyRiUzRSUzQyUyRmRpdiUzRQ==[\/vc_raw_html][\/vc_column_inner][\/vc_row_inner][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”2\/3″][vc_column_text]Above is a fun little example that shows how a vector image is resized according to the size of its container. By pulling on the bottom right corner (click and drag) and you can resize the box in which the logo is displayed. This is accomplished using the CSS \u2018resize\u2019 function. This CSS function is not supported by all browsers \u2013 sorry IE, Edge, and iOS viewers. If you are having problems getting it to work, you can check compatibility here.<\/a><\/p>\n

The browser support chart shows the compatibility for the CSS function only. As stated before, SVG (scalable vector graphics) is supported by all browsers and all devices.[\/vc_column_text][\/vc_column_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row][vc_column][vc_tta_pageable no_fill_content_area=”1″ autoplay=”5″ active_section=”1″ pagination_style=”flat-rounded” tab_position=”top” title=”Some Examples…”][vc_tta_section title=”Section 1″ tab_id=”1554267758940-6848c818-c769″ el_class=”black”][vc_raw_html]JTNDaW1nJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZkZXNpZ25zZXJ2aWNlc2ZvcnR3YXluZS5jb20lMkZpbWFnZXMlMkZmd3NyLWxvZ28uc3ZnJTIyJTIwJTIwYWx0JTNEJTIyRm9ydCUyMFdheW5lJTIwU3VyZmFjZSUyMFJlc3RvcmF0aW9uJTIwc2NhbGFibGUlMjB2ZWN0b3IlMjBncmFwaGljJTIwbG9nbyUyMiUyMCUyRiUzRQ==[\/vc_raw_html][\/vc_tta_section][vc_tta_section title=”Section 2″ tab_id=”1554267758959-97c4798c-ccaf”][vc_raw_html]JTNDaW1nJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZjYXJyb2xsc2VjdXJpdHkuY29tJTJGY2Fycm9sbC1zZWN1cml0eS1sb2dvLnN2ZyUyMiUyMGFsdCUzRCUyMkNhcnJvbGwlMjBTZWN1cml0eSUyMHNjYWxhYmxlJTIwdmVjdG9yJTIwZ3JhcGhpYyUyMGxvZ28lMjIlMjAlMkYlM0U=[\/vc_raw_html][\/vc_tta_section][vc_tta_section title=”Section 3″ tab_id=”1554272977148-86fa0b61-24a7″][vc_raw_html]JTNDaW1nJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZkZXNpZ25zZXJ2aWNlc2ZvcnR3YXluZS5jb20lMkZpbWFnZXMlMkZza3lsaW5lLWxvZ28uc3ZnJTIyJTIwJTJGJTNF[\/vc_raw_html][\/vc_tta_section][\/vc_tta_pageable][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"

[vc_row][vc_column][vc_row_inner][vc_column_inner width=”1\/6″][\/vc_column_inner][vc_column_inner width=”2\/3″][vc_column_text] SVG Logo for Your Website [\/vc_column_text][vc_column_text]Web & Design Services will create a new logo or replicate your existing logo as a Scalable Vector Graphic (SVG). As technology advances, be sure that your business is up to the task. What does that even mean? In graphic design, there are two types of images […]<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/pages\/958"}],"collection":[{"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/comments?post=958"}],"version-history":[{"count":28,"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/pages\/958\/revisions"}],"predecessor-version":[{"id":6944,"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/pages\/958\/revisions\/6944"}],"wp:attachment":[{"href":"https:\/\/designservicesfortwayne.com\/wp-json\/wp\/v2\/media?parent=958"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}