Your SlideShare is downloading. ×
Castro Chapter 2
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Castro Chapter 2


Published on

Published in: Technology, Design

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. WORKING WITH WEBPAGE FILESHTML5 & CSS Visual Quickstart GuideChapter 2
  • 2. Designing Your Site• First, take some steps to plan and design your site • Figure out why you’re creating the site…what do you want to convey? • Think about your audience, and how you can tailor your content to appeal to this audience. • Should you add lots of graphics to make it flashy, or is it more important that the page downloads quickly? • How many pages will you need?
  • 3. Designing Your Site, Part 2• What structure should it have? Should your users be able to explore it in any direction, or do you want them to follow a certain path?• Sketch your site on paper• Devise a simple, consistent naming system for your pages, images, and other files• Don’t overdo the planning!
  • 4. Creating a New Web Page• Don’t need any special tools to create a web page; can use any word processor or text editor • On Windows: NotePad or WordPad (Notepad++ is better) • On Mac: TextEdit (TextWrangler is better; BBEdit is even better, but not free) • On Linux: pico, nano, gedit, Kedit• To create a new Web Page: • Open any text editor or word processor • Choose File > New to create a new, blank document (if necessary) • Create the HTML content • Save your file
  • 5. Saving Your Web Page• So browsers and web servers recognize Web page files, they have the .htm or .html extension• To save your file: • Once you’ve created the file, choose File > Save As • Choose Plain Text or Text Document (or however the program words it) for the format • Give the document a name and the .html extension • Choose the folder in which to save it • Click Save
  • 6. About Microsoft Word and Web Pages•Just Say No
  • 7. Specifying a Default or “Home” Page• Web servers have a system for recognizing a default page in each folder, based on the name of the file• If your visitors type a URL without a filename, the default file is used• To specify a default or “home” page: • Ask your ISP how such a default page should be named. • Most servers use index.html; Microsoft servers sometimes use default.html • For our purposes, index.html should always be used
  • 8. Organizing Files• Create a central folder/directory to hold all the material that will be available at your Web site• You may want a separate subfolder for different parts of your site, such as a subfolder for images• Use simple, one-word names without symbols or punctuation for your files and folders • Web servers don’t deal with spaces in file names the way you might expect • Neither do web browsers • “Images Folder” is a bad directory name • So is “images folder” • “images_folder” is okay • “images” is even better!
  • 9. Viewing Your Page in a Browser• Most of the time, you can just double-click the file and it will open in a web browser• Sometimes, you might have to right-click and choose a program to open with
  • 10. The Inspiration of Others• To view other designers’ HTML code: • Open a Web page with any browser • Choose View > Source (in some browsers, View > Page Source) • If you want, save the file for further study