Home
Username:
Password:
Adobe Photoshop CS4 for the Web Tutorials

Internet & Web Design Fundamentals / Web Browsers

Subtitles of the Movie

Another area that can be quite confusing in the world of Web design is Web Browsers. Here, what I have is Firefox on top and Safari down at the bottom of my screen and both Browsers have the VTC website loaded into them. Now, how this works - especially if you're coming from a print world, again, this can be tough - but imagine that the design that you and I create inside Photoshop and that eventually winds up inside Dreamweaver or inside some kind of a similar Web design application, that design that we create is going to be viewed through the filter, if you will, through the rose-colored glasses, if you will, of a Web Browser, right? Now, the real problem is that Web Browsers work in different ways. I only have two browsers open here. There's a whole handful of Web browsers. Let me rhyme a few of them off for you. Well, there's definitely Firefox, that's probably one of the most predominant Browsers around today. There's Internet Explorer, of course, over on the Windows side. Safari, again, here on the Mac. There's Google Chrome - I don't know if you've checked that out or not. There's another one called Opera - I mean there are tons of them, right. And the big challenge, too, is that some of them only work on the Mac, some of them only work on the Windows side, but browsers like say Firefox have cross-platform versions, right, so there's a version of Firefox for the Windows side and there's a version of Firefox for the Mac side, so it can get very confusing. And the whole idea, of course, is that you want your website to look good in all scenarios, right? Well, the reality of the situation is that's a tall order. Getting your website to look good in the most popular browsers, that I think is achievable. Getting it to look good under all scenarios, under all platforms, under all Browsers - tall order. Before we go any further let me give you my definition for what a Web Browser is. A Web Browser, as you saw just a moment ago, makes a request to a Web Server and then receives the information back, right. Well, that information is code, right? HTML, CSS, JavaScript, all kinds of stuff. Well, what the Web Browser does for us is it translates that background code into some sort of a visual display, which we see before our eyes, right. Now give me just a second here. What I'm going to do is I'm going to crank open Firefox into a sort of a full screen view here. So, essentially what Firefox has done for me is it translated all of the VTC background code and translated it for this visual display that we see, which is great because humans don't really like to read code. That's for machines, right? So, that's really the idea here. Now the real challenge is imagine that Firefox speaks French and Safari speaks German and Explorer speaks Italian, right? They're all trying to translate from the same source code but they're all going to translate in a slightly different way, right. That's why sometimes pages look a little bit different in Firefox versus Explorer, this kind of thing, right. Now what I've done here is I've just popped open another tab here from another website, w3schools.com. All I did is I did a quick Google search for Browser Stats, go ahead and do the same thing and this is your first search result and it'll bring you here to this page. Now this page is invaluable because it tells us a breakdown of all of the popular Browsers and their user-based percentages, or the number of users that are using each version and each Browser, right. So here we have Internet Explorer version 8, 7 and 6. We have Firefox at a whopping 47 and a half percent; Chrome, Safari and Opera. So here's really the moral of the story. Kill yourself to make your site look good in Firefox and kill yourself to make your site look good in Internet Explorer versions 6, 7 and 8. I wouldn't worry so much about Chrome. I mean, you might want to make sure that it looks decent, but don't murder yourself. And Opera, at such a low user rate, again, do you really want to stay up all night trying to get your web page and your layout to look perfect inside a Browser that only 2.3 percent of web surfers are actually using? So, definitely keep this Web page Bookmarked and come back to it every once in a while and see how these percentages are going to change over time.

Tutorial Information

Course: Adobe Photoshop CS4 for the Web
Author: Geoff Blake
SKU: 34089
ISBN: 1-936334-01-1
Release Date: 2010-02-25
Duration: 7 hrs / 105 lessons
Work Files: Yes
Captions: Available on CD and Online University
Compatibility: Vista/XP/2000, OS X, Linux
QuickTime 7, Flash 8

VTC Sign up & Benefits

  • Unlimited Access
  • 98,729 Video Tutorials (23,265 free)
  • Video Available as Flash or QuickTime
  • Over 1026 Courses
  • $30 for One Month Access
  • Multi-User Discounts Available