Home > Store

larger cover

Add To My Wish List

Build a Website for Free, Rough Cuts, 3rd Edition

Rough Cuts

  • Sorry, this book is no longer in print.
  • About Rough Cuts
  • Rough Cuts are manuscripts that are developed but not yet published, available through Safari Books Online. Rough Cuts provide you access to the very latest information on a given topic and offer you the opportunity to interact with the author to influence the final publication.

Not for Sale

Also available in other formats.

  • Description
  • Sample Content
  • Updates
  • Copyright 2012
  • Dimensions: 7" x 9-1/8"
  • Pages: 384
  • Edition: 3rd
  • Rough Cuts
  • ISBN-10: 0-13-335326-5
  • ISBN-13: 978-0-13-335326-6

This is the Rough Cut version of the printed book.

Build yourself a state-of-the-art website.

It’s incredibly easy…and it won’t cost you a dime!

 

You need a website. But you don’t need the hassles that usually go with building one or the expense of hiring someone else to do it. Here’s your solution: Build a Website for Free! You’ll learn how you can use current technologies to create a site that’s

impressive and effective. And here’s the best part: You’ll do it all with software and tools that won’t cost you a dime!

 

  • Plan, organize, and design a site that really works, using tools you can find for free
  • Discover the simple secrets of writing pages people want to read
  • Explore HTML5 and JavaScript
  • Use video on your site–and get someone else to pay for hosting it
  • Add an easy-to-update blog and start building your own web community
  • Quickly and easily handle “nuts and bolts” tasks, from getting your site name to uploading your content
  • Get your site picked up by Google, Yahoo!, and other search engines
  • Adapt your site for easy viewing on smart phones and tablets.

 

Table of Contents

    Introduction . . . . .1

Part I: The Basics

1 The Order of Things . . . .11

    The Website-Creation Process . . . .12

        1. Planning . . . . .13

        2. Design . . . . .14

        3. Building . . . . .14

        4. Testing . . . . .15

        5. Promotion and Maintenance . . . .15

    Why You Should Follow This Order . . . .16

2 Choosing a Location for Your Site . . . .17

    Web Hosting . . . . .17

    What Is a Web Server? . . . .18

    Determining Your Web Hosting Needs . . .19

        Cost . . . . .19

        Technical Knowledge Required . . . .20

        Maintenance Needs . . . .20

        Storage Space . . . .20

        Accessibility . . . . .20

        Bandwidth Needs . . . .20

        Security Needs . . . .21

        Domain Name Service . . . .21

    Hosting Options . . . . .23

        Home Hosting . . . .23

        Free Online Hosting . . . .23

        Online Hosting Service . . . .23

        Professional Hosting . . . .24

        Commercial Hosting . . . .24

    So, What Works Best for You? . . . .24

    Working with Different Types of Hosting Services . . .25

        Free Services . . . . .25

        Low-Cost Commercial Sites . . . .27

        Other Resources . . . .27

Part II: Plan and Prep

3 Planning Your Site . . . .29

    What Type of Site Do You Want to Build? . . .30

        Types of Sites . . . .30

    Learning from Sites You Go To . . . .34

    Website Goals . . . . .35

    Organizing Websites . . . .36

        Organizing the Site . . . .37

        Organizing My Personal Site . . . .38

        Organizing the Page . . . .38

        Web Page Designs . . . .40

    Best Practices of Website Organization . . .41

        Keep Your Website Simple . . . .41

        Keep Your Website Consistent . . . .42

        Keep Your Website Easy to Maintain . . .42

4 Designing Your Site . . . .43

    I Can’t Make a Website That Looks That Good! . . .44

    Content Before Design . . . .45

    Overall Design . . . . .45

        Design Ideas . . . . .46

    Colors . . . . .46

        The Magic Four . . . .46

        Hex Color . . . . .47

        Color Schemes . . . .48

        Color Blindness . . . .50

    Fonts . . . . .51

        System Fonts . . . . .51

        Fonts as Images . . . .52

        Fonts and Color . . . .53

    Images . . . . .53

    Cascading Style Sheets . . . .54

        Design Best Practices . . . .54

        Content Is King . . . .54

        Put What Is New Front and Center . . . .54

        Keep It Simple . . . .54

        Don’t Use Attention Grabbers . . . .54

        Be Consistent . . . .54

5 Gathering Your Tools . . . .55

    Finding the Right Tools for the Job . . . .56

    Tool Sites and Reviews . . . .56

    Downloading New Software . . . .56

    Essential Tools . . . . .58

        Operating Systems . . . .58

        Web Browsers . . . .58

        Office Suites . . . . .59

        File Transfer Protocol Programs . . . .59

        Text Editor . . . . .60

        Graphics Editors . . . .61

        HTML Editors . . . . .62

        Sound Recorders . . . .63

        Video Editing . . . .64

        Advanced Tools . . . .64

    Future of Free Web Tools . . . .64

6 Moving Files to and from the Internet . . .65

    Storing Your Files . . . .66

        Naming Files . . . . .66

        Keep All Your Web Files in One Place . . .67

        Have an Organizational Structure . . . .68

        Use a Version Control System . . . .69

        Back Up Your Files . . . .69

    Uploading Files to the Internet . . . .70

        Logging In . . . . .71

        Creating a FTP Site Listing . . . .72

        Adding New Files . . . .72

        Changing Existing Files . . . .73

    Downloading Files from an FTP Server . . .73

        One File or Many . . . .73

        Downloading from a Browser . . . .74

        Types of Download Files . . . .74

        Best Practices for Downloading Files . . .76

Part III: Website Building Basics

7 Elements of a Website . . . .77

    Content . . . . .78

        Content Best Practices . . . .78

        Content Standards . . . .79

    Parts of a Web Page . . . .80

        Title . . . . .80

        Header . . . . .81

        Body . . . . .81

        Footer . . . . .83

        Sidebars . . . . .83

        Navigational Elements . . . .84

    Parts of a Website . . . .85

        Home Page . . . . .85

        Content Pages . . . .86

    How Do I Know How to Organize My Site? . . .87

    Web Advertising . . . .88

        Banner Ads . . . . .89

        Animated Ads . . . .89

        Google AdSense . . . .89

        iSocket . . . . .90

        Advertising Widgets . . . .90

8 Using Existing Websites . . . .93

    Social Networking Sites . . . .94

        MySpace . . . . .95

        Facebook . . . . .95

        Twitter . . . . .100

    Other Web 2.0 Sites . . . .101

        Pinterest . . . . .102

        Flickr . . . . .102

        Delicious.com . . . .103

    Promoting Your Website on Other Sites . . .103

9 Web Page Services . . . .105

    Before We Begin . . . .106

    Google Sites . . . . .106

        Signing Up for Google Sites . . . .107

        Creating a Google Site . . . .108

        Editing a Page . . . .111

        Creating a Page . . . .113

        Move a Page . . . .114

        Delete a Page . . . .114

        Edit Page Settings . . . .114

        Edit Site Settings . . . .115

        Google Sites Features and Limitations . . .116

    Weebly . . . . .116

        Signing Up for Weebly . . . .116

        Creating a Site on Weebly . . . .117

        Editing a Page . . . .118

        Weebly Features and Limitations . . . .119

    Webs . . . . .119

        Signing Up for Webs . . . .119

10 HTML 101 . . . . .121

    The Structure of HTML . . . .122

        Elements, Tags, and Attributes . . . .123

        The Structure of Elements . . . .124

    Common HTML Tags . . . .125

        HTML Structure Tags . . . .125

        Text Tags . . . . .126

        Lists . . . . .129

        Tables . . . . .130

        Hyperlinks . . . . .131

        Images . . . . .132

    Free HTML Editors . . . .132

        Text Editors . . . . .132

        WYSIWYG Editors . . . .133

    Resources . . . . .134

    Using a Text Editor to Create HTML . . . .135

11 HTML5 . . . . .137

    What Is HTML5 and Why Should I Care? . . .137

    Standards . . . . .138

    World Wide Web Consortium (W3C) . . . .138

        HTML and XHTML . . . .138

    HTML5 Standard . . . .138

        High Level of Changes . . . .138

        Browser Overview . . . .139

        HTML5 Resources . . . .140

    HTML5 Elements . . . .140

        Structure Elements . . . .140

        Multimedia Elements . . . .144

        HTML5 Forms . . . .145

        Fun Stuff . . . . .147

        Removed Elements . . . .149

12 Working with Images . . . .151

    Creating Graphics . . . .152

        Compression: Lossy and Lossless . . . .152

        Editing Images . . . .154

        Resizing Images . . . .154

        Saving Images . . . .154

        Optimizing Images . . . .155

        When to Use Different File Types . . . .156

        Slicing Images . . . .157

        Image Maps . . . .158

        Animated GIFs . . . .159

    Images and HTML . . . .159

        The Image Tag . . . .160

        Inline Images . . . .161

        Background Images . . . .162

    Finding Images . . . .162

        Free Images . . . . .162

        Other People’s Images . . . .163

    Using Your Own Images . . . .163

13 Working with Multimedia . . . .165

    Digital Audio Files . . . .167

        Audio Formats . . . .167

        Audio Players . . . .168

        Digitizing Audio . . . .169

        Audio Editing . . . .169

        Streaming Audio . . . .170

        Audio Resources . . . .171

    Digital Video Files . . . .172

        Video Formats . . . .172

        Video Players . . . .173

        Digitizing Video . . . .174

        Video Editing . . . .174

        Video Hosting Sites . . . .175

        Working with YouTube . . . .175

        Video Resources . . . .178

    Multimedia Best Practices . . . .179

14 Building a Site Using HTML . . . .181

    How Web Pages Work . . . .182

        Page File . . . . .182

        Extensions . . . . .182

        Tools for Creating Web Pages . . . .182

        Parts of a Page . . . .184

        Hyperlinks . . . . .185

    Cascading Style Sheets . . . .193

        Format of a Style Sheet . . . .194

        Creating and Linking a Style Sheet . . .195

    Putting It All Together . . . .196

    Scripting . . . . .201

    Using Templates . . . .202

15 JavaScript for Beginners . . . .203

    Yes! You Can Be a Programmer! . . . .203

        Geek Speak: Script Versus Language . . .204

    Programming Process . . . .204

    Programming Tools . . . .204

        JavaScript Console . . . .205

        Text Editors . . . . .205

        Browser Add-Ins . . . .206

        JavaScript Basics . . . .206

        Functions of JavaScript . . . .207

        JavaScript Versions . . . .207

        JavaScript Requirements . . . .207

        The Script Element . . . .207

        Inline and External Scripts . . . .208

        Simple JavaScript Example: Rollovers and Dynamic Content . .209

    JavaScript Resources . . . .211

        Tutorials . . . . .212

        Script Libraries . . . .213

Part IV: Site Testing and Maintenance

16 How’d They Do That? . . . .215

    Viewing Code from Other Websites . . . .216

    Web Development Firefox Add-Ons . . . .216

        Recommended Firefox Web-Development Add-Ons . . .217

        Recommended Chrome Web-Development Add-Ons . . .221

        Recommended Safari Web-Development Add-Ons . . .222

    Badges . . . . .222

    Widgets . . . . .224

    Templates . . . . .225

    Developer Networks and Sites . . . .226

17 Making Your Site Work on Smartphones and Tablets . .229

    Why Should You Care About the Mobile Web? . . .230

        How People Access the Mobile Web . . .230

    Become a Mobile Web User . . . .230

        Mobile Web Devices (MWD) . . . .231

        Mobile Operating Systems . . . .232

        Mobile Browsers . . . .233

    Limitations of the Mobile Web . . . .234

    Making Your Website Mobile . . . .235

        Mobile Browser Detection . . . .235

        Domains and Subdomains . . . .236

        Use the Right Code . . . .236

        Page Sizes . . . . .236

        Interface . . . . .237

        Things to Avoid . . . .237

        Mobile Web Tools and Sites . . . .237

    Testing Your Site on a Mobile Phone . . . .239

18 Testing Your Website . . . .241

    Why Testing Is Important . . . .242

    Building a Test Plan . . . .243

        Starting at the End . . . .243

        Testing Basic Functionality . . . .244

        Testing HTML . . . .244

        Testing Browsers . . . .246

        Testing Resolution . . . .246

        Testing Printing . . . .247

        Testing Navigation . . . .248

        Testing Consistency of Design . . . .248

        Testing Security . . . .249

        Testing Mobile and Tablet-Based Websites . . .249

        Testing Accessibility . . . .250

    After Testing . . . . .251

    Testing Tools . . . . .251

Part V: Website Workshop

19 Promoting Your Website . . . .253

    Self-Promotion . . . . .254

        Have Excellent and Unique Content . . .254

        Update Content . . . .254

        Publicize Your URL . . . .255

        Connect with Others . . . .256

    Social Media Sites for Self-Promotion . . .258

    Search Engines . . . . .259

        How Search Engines Work . . . .259

    Optimizing Your Site for Search Engines . . .261

        Keywords . . . . .261

        Meta Tags . . . . .261

20 Maintaining Your Website . . . .263

    What? I’m Not Done? . . . .263

    Regular Maintenance . . . .264

        Weekly Tasks . . . .264

        Monthly Tasks . . . .264

        Annual Tasks . . . .264

    The Power of Analytics . . . .265

        Common Analytics and What They Mean . . .265

        Using Google Analytics . . . .266

    Tweaking Your Site Based on Analytics . . .270

21 Building a Blog Using WordPress . . .271

    What Is a Blog? . . . . .272

    Why Should I Blog? . . . .272

    Blog Publishing . . . .272

    Syndication . . . . .273

    What Is WordPress? . . . .273

        Software Versions . . . .273

    Building a Blog Using WordPress.com . . .274

        Signing Up for WordPress.com . . . .275

        Activating Your Account . . . .278

        Logging Into Your Blog . . . .279

        Writing Blog Posts . . . .280

        Managing Blog Posts . . . .282

        Changing the Design of Your Blog . . .283

        Manage the Comments on Your Blog . . .284

    Setting Up Your Own Blog with WordPress Software . . .285

        Information You Need Before You Begin . . .285

        How WordPress Software Works . . . .285

        How Much Does All This Cost? . . . .286

    Before Installing Your Software . . . .286

        Confirm That the Right Software Is Installed on Your Server . .287

        Get a Text Editor . . . .287

        Get an FTP Client . . . .287

        Pick a Username and Password . . . .287

    Download and Install WordPress . . . .287

        Download WordPress Software . . . .288

    Customization of WordPress . . . .288

        Adding Themes . . . .289

        Adding Plug-Ins . . . .289

    Personalization of WordPress . . . .290

        Modifying Themes . . . .290

        Creating Themes . . . .291

        Creating Plug-Ins . . . .292

        Blogging on Your iPhone . . . .292

    A Simple Blogging Solution . . . .293

    Keep an Eye on Things . . . .293

22 Building a Business Site Using a Content Management System . .295

    Five Reasons to Use Open Source as Your CMS . . .296

    Building a Site with Joomla! . . . .297

    Before Installing Your Joomla! Software . . .298

    Download and Install Joomla! . . . .298

        Adding Articles . . . .299

        Managing Users . . . .300

    Modules, Plug-Ins, and Templates . . . .302

    Keep an Eye on Things . . . .302

    Other Open Source CMSs . . . .302

    23 Building a Multimedia Website . . . .305

    Best Practices for Multimedia . . . .306

    Using Multimedia . . . .308

        Storing Multimedia Files . . . .308

        Downloading Audio and Video Files . . .309

        Streaming Audio and Video . . . .310

    Advanced Multimedia Options . . . .314

        Wix.com (www.wix.com/) . . . .315

        Webtrends Apps (www.transpond.com/) . . .315

    Advanced Open-Source Multimedia . . . .315

24 Building a Site Using a Wiki . . . .317

    Five Reasons to Use Wikia to Host Your Wiki . . .318

    Five Reasons to Use MediaWiki for Your Wiki . . .319

    What Is Wikia? . . . . .319

    Building a Wiki Using Wikia . . . .320

    Signing Up for Wikia . . . .320

    Adding a Page . . . .322

    Editing a Page . . . .323

    Linking Pages . . . .323

    Viewing Page History . . . .324

    What Is MediaWiki? . . . .325

    Information You Need Before You Begin . . .326

    MediaWiki Software Architecture . . . .326

    Before Installing Your MediaWiki Software . . .326

    Download and Install MediaWiki . . . .327

    Keep an Eye on Things . . . .329

Part VI: Appendixes

A List of the Most Common HTML Tags . . .331

B Free and Open-Source Software Sites . . .335

TOC, 10/19/2012, 9780789750235