HTML and CSS Reference
In-Depth Information
7. In your browser, navigate to .
8. In the text area on the site, paste the styles from styles.css.
9. From the Compression drop-down menu, select Highest and click Minify.
When you click Minify, spaces and returns are stripped out of the styles in the text area.
10. Highlight and copy all the minified styles from the text area.
11. Return to styles.min.css and paste the minified styles.
12. Save styles.min.css.
Now that you have a minified version of styles.css, index.html needs to reference it.
13. In index.html, find the reference to styles.css and change it to reference styles.min.css:
<!--[if ! lte IE 6]><!--><link rel=”stylesheet”
href=”css/styles.min.css” type=”text/css” /><![endif]-->
14. Save index.html.
Cool Shoes & Socks now uses the minified styles from styles.min.css instead of the production styles found in
Testing, Testing, Testing
In Chapter 15, you prepared Cool Shoes & Socks to begin modifying it with media queries. Having modified the site
in this chapter and Chapter 16, you should test it again to be doubly sure it is cross browser compatible. Although
testing can sometimes be tiresome, it is a very important step and should be your last step before making a page live
for everybody to see.
Going Live! Uploading to a Web Server
When you're satisfied that a web page is cross browser compatible, to make it live, you need to upload it to a web
server, most commonly done using FTP software.
Many text editors nowadays come with built-in FTP software, and if this is the case, consult the instructions
provided with your text editor to set it up. Alternatively, dedicated FTP programs are available, some free and some
My recommendations are Cyberduck ( ) and FileZilla ( ),
both free and both available on Mac and Windows.
If you choose to use one of these FTP clients, see the documentation made available on its website for instructions
on how to use it.
The Future Web
With Cool Shoes & Socks, you created a page suited not just to the modern web but also the future web. Its robust,
responsive layout will make it appear and function great across many different types of devices now and in the fu-
ture. Will CSS offer anything more for the future, though? Of course!
Because the CSS3 specification is still being modified, you will be able to use many new technologies in the near fu-
ture. Here are a couple:
Search WWH ::

Custom Search