| Top Web Hosting Provider of The Month: |
 |
| Visit Bluehost.com | Read Bluehost Review |
|
|
| >> Web Hosting Geeks // Web Hosting Articles // Web Design |
|
|
 |
Hexadecimal Color Notation on the Web
When designing elements for your webpage, you will often be called upon to specify a color. For example, the code for a span shown below specifies that the color of the text within the span will be yellow. Text Colors can be specified according to their names, for example "yellow", "green", or "blue". In many cases, these simple color names will work. But what if you want to specify a more sophisticated color like "cornflowerblue"? A particular browser may not recognize a particular color name. It's more reliable to specify colors with an "RGB triplet". An RGB triplet specifies a color based upon the amounts of red, green, and blue, on a scale from 0 to 255, required to create the color. For example, to create the color cornflowerblue you need red=100, green=149, and blue=237. We could then specify the color of the text within a span using the rgb function as shown below. Text This will work fine with style notation, but what if you want to use straight html. Html doesn't recognize the rgb function. In that case, you can specify color using "hexadecimal" notation. Whereas the decimal numbering system uses the characters 0 through 9 to get 10 values, the hexadecimal numbering system uses the characters 0 through f to get 16 values. (After 9 the characters a, b, c, d, e and f are used, as shown below.) Decimal Hexidecimal Equivilants dec hex 0 = 0 1 = 1 2 = 2 3 = 3 4 = 4 5 = 5 6 = 6 7 = 7 8 = 8 9 = 9 10 = A 11 = B 12 = C 13 = D 14 = E 15 = F On first appearance, this looks pretty simple but you need two hexadecimal characters to represent all decimal values from 0 to 255. When you increment decimal 9 by 1, you change the 9 to 0 and put 1 in the ten's place. When you increment hexidecimal F by one, you change the F to 0 and put 1 in the "sixteens" place. Sometimes it's not easy to convert between decimal and hexadecimal in your head. RGB Triplet for Cornflowerblue color dec hex red 100 64 green 149 95 blue 237 ED We could then specify the color of text within a span using the hexadecimal notation as shown below. Text Note that when we indicate the use of hexadecimal notation by placing a pound (#) sign in front of the number, and we don't use commas to separate the color components. If it's not easy to convert between decimal and hexadecimal in your head, then how do you do it? You can use a calculator that has a decimal to hexadecimal coversion function, or you can learn to think in hexadecimal. For example, what's the next number after CE? That would be CF. what's the next number after CF? That would be D0. Which hexadecimal number is higher 99 or B2? B2 would be higher than 99. It gets easier with experience. Here's Java Script code for a simple decimal to hexidecimal color converter function convert(decvalue) { var num = parseInt(decvalue); if(num >= 0 && num < 256) { var hexnum = num.toString(16); alert("#" + hexnum); } else {alert("Error!");} } It's important to use hexadecimal notation to specify colors when you use DHTML with visual effects, because to create a dynamic color change you have to increment or add a value to a color. The vast amount of color specification on webpages is in hexadecimal notation, so it would be wise to become familiar with it. Copyright(C) Bucaro TecHelp. Permission is granted for the below article to forward, reprint, distribute, use for ezine, newsletter, website, offer as free bonus or part of a product for sale as long as no changes are made and the byline, copyright, and the resource box below is included. About The Author To learn how to maintain your computer and use it more effectively to design a Web site and make money on the Web visit bucarotechelp.com. To subscribe to Bucaro TecHelp Newsletter visit http://bucarotechelp.com/search/000800.asp
MORE RESOURCES:
Web-Design - Google News |
|
|
|
RELATED ARTICLES
Give People What They Want And Watch Your Profits Soar! Do you know why the majority of people use the Internet?The majority of people use the Internet to do some type of research. In other words, to read. Make it Clear What Your Website is About Just about every list of the "Top 10 Web Design Mistakes" includes at least one reference to either1. Not clearly specifying the objectives of your website, or2. Double Ad-Trackers Its Not as Crazy as It Sounds Here Are 7 Reasons Why? A Double Ad Tracker is an Ad-Tracker that points to an AD-Tracker. It may sound a bit like overkill to have an Ad-Tracker Pointing at another Ad-Tracker but it's not crazy. Does Your Website Induce Seizures? QUESTION: We promote our web site in all our ad campaigns, but according to my website statistics program, we are getting very few visitors who click past the first page. The site has a cool Flash introduction page that the designer said would impress visitors, but it doesn't seem to be working. Make Your Site Quick To Load! The time it takes to load your site can make or break a visitor's first impression of your site. If your site takes too long to load, the visitor will click "Stop" or "Back" and leave your web site. What Does Your Website Say About Your Business? QUESTION: My business is very small, just me and two employees, and our product really can't be sold online. Do I really need a website? -- Robin C. The Ultimate Web Site Marketing Strategies That You Should Know Most of us know that we need to advertise our products and our services, some of us still believe we are too small to invest in a advertising campaign. Now while a full-fledged marketing effort may be too much for your operation, it is however crucial to your success that you are involved in some kind of marketing activities. Custom Web Site Design Strategies Web site design has certainly, in the past decade, evolved tremendously. More clients now are demanding custom design, as opposed to the 'cookie cutter' sites of yesteryear. 20 Tips to Creating a Profitable Website As an online Entrepreneur you require a successful website.One that you personal own. Web Copywriting: The Psychology Of Scarcity, Less Is More If You Want Faster Sales Countdown to Armageddon - at least you'd think so judging from some of the garish copy and blaring headlines screaming at you from so many websites.At the opposite extreme though, you've some sites which don't even have a single decent headline anywhere that captures visitors attention, let alone leads them into captivating copywriting that'll get them a sale. Converting Print Advertising For Use On The Web - A How-To Contrary to the beliefs of some, advertising for web and print are very different. Converting print ads for use on the web is very tricky. Simple Steps To Proper Web Design Over the course of the last decade, the Internet has grown beyond all expectations. Each and everyday there is a new website that is being developed. You Too Can Have an Amazing Website It is a well-known fact that a successful business depends greatly on how it is marketed. With an ever increasing dependence on the web, the use of a professional website is not only a necessity, but a priority. Web Usability: The Basics What is web usability & why is it important?Web usability is about making your website in such a way that your site users can find what they're looking for quickly and efficiently. A usable website can reap huge benefits on to your website and your business. Increase Sales on Your Website! Use Graphics! How many times have you clicked on a website only to find a screen full of text? You read a large-scale headline and then all you see is text, much like reading a letter. You scan down the page looking for something to attract your attention. A Landing Page is Not an Order Page (and why it matters) To explain my point I need to first confuse the issue a bit (you'll see why): While a landing page is not an order page, it can, and in many cases should, contain the order form.So what is the difference? Is this just a question of semantics? Actually, there is a big difference and it can have a big effect on your conversion rate. Some File Naming Tricks for Your Online Home Based Business Web Pages Conventional Wisdom states you should use Sub-Directories to organize your web Pages. Unfortunately the Page Indexing Tools Penalize your Page Rankings when you Do this, Many of the Page Ranking Algorithms in use today deem that pages closed to your Root are of a Higher Value then pages that are further away from your root. Choosing Form Over Function Kills Your Site Never put form over function. Why? Because it's crucial that visitors actually be able to USE your site. How to Create a Favicon for Your Web Site One of the simplest things you can do to give your site 'identity' and to make it stand out from other sites is to use a favicon (favourite icon). They are the little logos that go next to the website listing in your favourites folder, and pop up in other places, (depending on your browser and operating system). Your Site Map: Spider Food or Just A Light Snack? Mechanical spiders have to eat. In fact, they usually have bigger appetites than the real-life spiders you squish under your shoe.
|
|
|
|
|
| © 2004 - 2008 "Web Hosting Geeks" | Web Hosting Reviews | Customer Reviews | RealMetrics Reviews | Hosting Articles | Directory | Partners | Contacts Over 7000 articles: web hosting, web development, domain names, ecommerce, web design, site promotion, ppc advertising, seo, site promotion and many others. Web hosting reviews, ratings and awards are not based on any incentives or commissions. Names and trademarks are the properties of their respective owners. A direct link to Web Hosting Geeks (http://webhostinggeeks.com) must be provided in order to use any of the above information. Contact us for more info. Partners: Hosts by speed, Cheap Website Hosting, Free Website Hosting, Cheap Web Hosting, Top 10 Web Hosts, Top 10 Web Hosting Deals, Best Website Hosting, Free Web Hosting, Free Web Hosting, Dedicated Server Hosting, Adult Web Hosting, Web Hosting Discussions, Dedicated Server Reviews, Best Web Hosting, Web Hosting Discounts, HostProfessor.com, rsuog, halyava, PHP Website Hosting Services, Web Hosting Reviews, Hosting Uptime, Best Web Hosting Reviews, Cheap Webhosting, Web Hosting, Flash Templates, CMS Templates, Web Hosting Reviews, Website Hosting Reviews, Web Hosting Providers, Best Web Hosting, Top Web Hosting, RSUOG Web Hosting |