Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
CSS gives Web designers control over the appearance of their web sites by separating the visual presentation from the content. It lets them easily make minor changes to a site or perform a complete overhaul of the design. In CSS Web Site Design, instructor and leading industry expert Eric Meyer reviews the essentials of CSS, including selectors, the cascade, and inheritance. The training also covers how to build effective navigation, how to lay out pages, and how to work with typography, colors, backgrounds, and white space. Using a project-based approach, Eric walks through the process of creating a Web page, while teaching the essentials of CSS along the way. By the end of the training, viewers will have the tools to master professional site design. Exercise files accompany the training videos.
In this movie, we're just going to quickly look at how you would associate a user style sheet with your web browser so that it would be applied to any page you might visit. So here we have a copy of Javaco tea design. This is Safari. Every browser is a little different and actually Firefox makes this, and Mozilla makes this really difficult, but Safari makes it pretty easy and in Windows Internet Explorer you can do it pretty easily too. Here in Safari you call up the preferences and there are these various options, but under advanced there's style sheet, and you can pick other, to be able to browse the hard drive and you go and find a file like ex0311.css, choose that, and you'll notice that the page just changed. That's because the user style sheet has been applied.
The contants of that user style sheet, you can actually see right here, what I'm saying is make all elements have a black foreground and white background, except for a elements, which we underlined and have a weight foreground and a black background and I've made all these importants as discussed in an earlier videos because I absolutely want these to apply. These are important to me as the user, I really want them to happen, so they are important to me so I marked them as being important, and here's the situation. This is what the page looks like and if we were to go to a different site and you say whatsoever, we'll pick lynda.com, again, there we go.
All the background images pretty much are switched off and all background color for that matter and links are being presented in the reverse text so anyone can do this just, you know, for a bit of a giggle to wonder around the Internet and see what sites look like with your own user style sheet applied but this again would be important for me or for anyone who is fully colorblind and needs to be able to distinguish links from the rest of the text, or who has some other form of a disability that they, that they need to overcome and if we direct a nonselected then, everything just goes back to normal.
Under Windows, in your preferences, what you need to look for is under General, the general preferences tab, there's an Accessibility button that you can add and in there, there's a place to browse your hard drive for a user style sheet, other then that difference basically, the effects are the same, it's just a difference in how you navigate your way through the preferences in Internet Explorer as opposed to Safari.
There are currently no FAQs about CSS Web Site Design.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.