Numbers and Symbols 400

Size: px

Start display at page:

Download "Numbers and Symbols 400"

Muriel Small
5 years ago
Views:

2 Numbers and Symbols 456 Berea Street, 394 & (ampersand) character, : (colon), 174 > (greater than) character, 124 # (hash sign), rule, 352 < (less than) character, / (magic escalator), 137 ; (semicolon), 174 A abbr element, 51, abbreviations, absolute links, accessibility alt attribute, alternative style sheets for, resources, table, a:hover state, 325 acronym element, 51, active pseudo-class, 220, Add-ons architecture, Firefox, 389 Adobe Illustrator, 111 A-grade browsers, 366 AJAX, 382 all media type, 351 alpha transparency, alt attribute, alternative style sheets, accessibility and, ampersand (&) character, <anchor> tag, Andreessen, Marc, 4 5 animation, frame-by-frame, 106 application programming interfaces (APIs), 379 artifacts, 104 aural media type, 351 author styles, 201 B background, styling, with CSS, background color, background-color property, , background-image property, , , 315 for links, styling bullets using, background images adding, with CSS, using with other elements, background-position property, background-repeat property, badges, 385 bandwidth, 152 Basecamp, 388 Berners-Lee, Tim, 4 5, 6 Bézier curves, Bina, Eric, 4 5 bitmaps, 110 block-level elements, 51 53, 292, <blockquote> tag, 79 80, Bluefish, 13 body element, styling, with CSS, body style, for print style sheet, 356 <body> tag, bold, book reviews, 384 books, border-bottom property, 323, 328 border declarations, 322 borders applying, , CSS shorthand for, example, relationship between elements and, box model hack, box models, Braille media type, 351 browsers cross-browser compatibility, 10 default style sheet, 201, for development, 389 Graded Browser Support, testing web pages in various, Browsershots, Browser Upgrade Campaign, 368 browser wars, 5 Budd, Andy, , 391 Building Accessible Websites, 395 Bulletproof Web Design, 390 bullets, styling, C captions, table, cascade, defined, Cascading Style Sheets (CSS) adding background images using, adding to web pages, advantages of, , body, styling, cascade, colors, comments, conditional comments, declaration in, 174 descendant selectors, example,

3 flexibility provided by, 197 grouping selectors, headings, styling, inheritance, 185, introduction to, 168 link styling, lists, styling, media types supported by, paragraphs, styling, rules, sizing text with, specificity, specifying typeface with, text, styling, See also CSS layouts; CSS rules Cederholm, Dan, , 395 C-grade browsers, 367 character encoding, character sets, UTF-8, child elements, citations, cite element, 51, Clarke, Andy, 390, 395 class attributes, 317 about, 248 naming, overuse of, 260 styling with, using with div and span elements, clear property, , 302 closing tags, code samples, displaying, 85 <code> tag, 51, 85 code validation, 53 58, 62 collaborative web, 379 collapsing margins, colon, 174 colors background, in CSS, dithering, GIF, 105 hexadecimal, columns, commenting out, 371 comments conditional, CSS, in markup, community driven sites, 379 conditional comments example, in Internet Explorer, contact forms, 128 content, separating from presentation, 9, 168, 172, 197 content attribute, content div, positioning with floats, contextual selectors, control panel, web hosting, 152 copyright, of images, 92 copyright attribute, 347 Core FTP, 156 Core Web Fonts, country-specific domains (cctlds), 148 Creative Commons, 112 cross-browser compatibility, 10 CSS. See Cascading Style Sheets CSS Artistry, 390 CSS files, creating external, CSS hacks, CSS layouts applying floats to, applying floats to images, collapsing margins, Faux Columns, float-based, one-column, two-column, using div elements to create, CSS Mastery, , 391 CSS rules, commenting out, for fonts, formatting, grouping selectors for efficient, IE specific, inheritance, order of, property, 173 reducing, for troubleshooting, 371 selectors, 173 shorthand for, specificity of, syntax, 174 targeting div elements, targeting, to specific elements, 317, , , 334 for typeface, value, CSS Validation Service, 363, 369 CSS Zen Garden, 394 cursive fonts, 206 Cyberduck, 156, D data, tabular, database-driven sites, 382 DCMI (Dublin Core Metadata Initiative),

4 <dd> tag, 71 declarations commenting out, in CSS, 174 dedicated IP address, 147 default styles, 201 default style sheet, 168, 201, default typeface, 203 definition descriptions, definition lists, definition terms, 71, 72 <del> (delete) tag, 51, 86 descendant selectors, , , , 334 description attribute, in meta tags, 346 design fundamentals, 168 Design Observer, 393 design phase, 40 destination anchor, 118 development browsers, 389 Digital Web magazine, 393 disk space, 151 display: inline, dithering, div element creating CSS layouts using, floating, , as generic element, with id and class attributes, nested, 293 overly wide, overuse of, 247, 260 structuring document with, uses of, Dive into Accessibility, 395 <dl> tag, DNS (Domain Name System) servers, 147 DOCTYPE, document flow, floats and, removing elements from, 326 document type, defining, Document Type Definition (DTD), domain names creating, defined, human-readable, 146 propagation of, 155 registering, top-level domains, dots per inch (dpi), 109 Dragonfly, 388 <dt> tag, 71 Dublin Core Metadata Initiative (DCMI), 347 E efficiency, 9 10 elements block-level, 51 53, calculating width of, child, floated. See floats inline, 51 53, parent, , phrase, removing from normal document flow, 326 targeting specific, 317, , , 334 See also specific elements Elements of Typographic Style Applied to the Web, The, 394 Emacs, 13 addresses, 152 links, embedded style sheets, 176 adding, versus linked style sheets, embossed media type, 351 emphasis, ems, sizing text with, <em> tag, encoded characters, 123 end tags, Enkoder, 128 Extensible Hypertext Markup Language. See XHTML extension, 22 external links, , 128 external style sheets, 176, , creating external CSS file, vs. embedded style sheets, head elements and, 344 rule, 352 link element, 350 linking images to, 353 linking to, power of, F fallback font option, fantasy fonts, 206 Faux Columns, 292, favicons, file extension, 22 file names, files, uploading to server, file structure, File Transfer Protocol (FTP), 146, 154 file transfers, FileZilla, 155 Firebug,

5 Firefox, 389 Firefox Web Developer Add-on, Fireworks, 99 Flickr, 112 float-based CSS layout, float: left, 326 float property, , 290, 326 floats, applying to images, applying to layouts, calculating width of elements and, clear property, , 302 creating two-column layouts with, floating divs, , overflow property, specifying widths on, 291 focus pseudo-class, 220 folders linking between, organizing, font families, , , font-family property, , fonts Core Web Fonts, CSS rules for, cursive, 206 defined, 197 fallback, fantasy, 206 monospace, 206 names, enclosing in quotes, 212 sans serif, 206 serif, 205 size, specifying, styling, with CSS, font-size property, , font sizes, points for, 355 font-weight property, 212, 332, 336 forward compatibility, 11 frame-by-frame animation, 106 free web hosting, 150 FTP, 146, 154 FTP clients, 156 G gftp, 156 GIF (Graphic Interchange Format), , GIMP (GNU Image Manipulation Program), 100 Gmail, 383 GNU General Public License, 385 google, 146 Google, 146, 346 Google-friendly markup, Google Maps API, 379 Google Suggest feature, 382 graceful degradation, 367 Graded Browser Support, graphics. See images greater than (>) character, 124 grouped selectors, , 262 Gruber, John, 396 guerilla testing suite, H <h1> element, <h2> element, Haine, Paul, , 391 handheld media type, hash sign (#), 126 head element, 24, 26, headings creating structure with, 44 styling, for print style sheet, 356 styling, with CSS, <head> tag, 24, 26, 44 height, of block-level elements, 292 Hello World! web page, 22 26, 30 Hewitt, Joe, 386 hexadecimal colors, Hicks, Jon, 396 Holzschlag, Molly E., 390 horizontal lists, creating, horizontal rule, hosting companies, hover pseudo-class, 220 href attribute, 119, 120, 122, , 351, 361 <hr> tag, HTML (Hypertext Markup Language), 5 6, 169 HTML 2.0, 6 HTML 4.01, 6 HTML 5, 6 HTML documents identifying sections of, structuring, with div and span elements, HTML Mastery, , 391 <html> tag, 24 HTML tags. See tags http-equiv attribute, human-readable address, 146 hypertext, 118 Hypertext Markup Language. See HTML hypertext reference,

6 I ICANN (Internet Corporation for Assigned Names and Numbers), 148 id attributes, 127, 317, 331 about, 248 naming, using with div and span elements, iehacks.css, 359 image editors, image formats, 92, GIF, JPG (JPEG), , PNG, images, alt text, applying floats to, background, bitmap, 110 compressing, copyright protection on, 92 dimensions of, 109 external style sheets and, 353 finding, <img> tag, low-cost, 112 optimization of, resolution, 109 styling bullets using, title attribute, vector graphics, width and height attributes, 96 working with, <img> tag, index file, information hierarchy, 43 46, inheritance, 185, specificity and, styling lists using, 334 inline content, 264 inline elements, 51 53, inline styles, 177, <ins> (insert) tag, 51, 86 Instant Domain Search, 149 internal links, 122, internal style sheets, Internet, 4 Internet Explorer, 389 conditional comments for, Developer Toolbar, 388 Internet Protocol (IP) address, istockphoto, 112 italics, J Java, 363 JavaScript, 128, JavaScript libraries, JPEG (Joint Photographic Experts Group), , 103 JPG format, , jquery, 381 justification, K keywords font-size, 206 in meta tags, keyword stuffing, 346 Komodo Edit, 13 L layouts float-based, one-column, table-based, two-column, See also CSS layouts leading, 215 less than (<) character, 124 letter-spacing property, libraries, JavaScript, licensed country-specific domains, 148 <li> element, line breaks, in markup, 35 line-height property, , line length measure, 183 styling, with CSS, 182 linked style sheets. See external style sheets link element, link pseudo-class, links, absolute, adding to lists, anchor tag, between folders, checking, 124 default style, 119 descriptive text for, , external, , 128 internal, 122, local, 122, 125, 128 opening in new window, relative, , 134, 138 styling, , 357 target attribute,

7 link states, link text, Linux, 13 Listamatic, 314 List Apart, A, 393 list items, 67 68, lists, 66 73, adding links to, bullets, styling, definition, displaying items as inline elements, horizontal, for navigation, 314, nested, 70, ordered, 68 70, reasons to use, styling, navigation, nested, ordered, simple, unordered, list-style: none declaration, list-style property, , 333, list-style-image property, 319 Litmus, 365 local links, 122, 125, 128 local machine, lowercase letters, 214 lurid palette, for troubleshooting, 370 M machine-readable address, 146 Mac OS X, 13 magic escalator, 137 margins, 318 applying, , collapsing, CSS shorthand for, example, relationship between elements and, resetting, markup commenting, line breaks in, 35 meaningful, semantic, tabs in, 35 white space in, See also structured markup mashups, 379 measure, 183 media attributes, media types, metadata, 346 meta tags importance of, types of attributes for, microformats, 347 Microsoft, 5 mobile media, image compression and, 101 monospace fonts, 206 MooTools, 381 Mosaic, 5 multicolumn layouts creating, Faux Columns, float-based, N name attribute, 347 namespace declaration, 29 National Center for Supercomputing Applications (NCSA), 4 5 navigation lists, nested divs, 293 nested elements, nested lists, 70, Netscape Navigator, 5 nonbrowser compatibility, 10 North Temple Journal of Design, 395 O <ol> tag, bit transparency, 106 opening tags, Opera, 388 operating system (OS), 13 optimization, image, ordered lists, 68 70, organizations, 392 overflow property, P <p> tag, 25 padding applying, CSS shorthand for, example, relationship between elements and, resetting, padding property, 318, 320, page titles, Page Zoom feature,

8 paragraphs aligning text, creating structure with, 44 indents, setting line height, styling, , parent elements, , parent folders, linking to, passwords, web hosting, 157 path, Pederick, Chris, 385 Photoshop, 98 99, 103 Photoshop Express, phrase elements, Pilgrim, Mark, 395 pixels, 109, 207 Plain Old Semantic HTML (POSH), 4, 40, 43 plain text editors, 13 Platial, 379 PNG (Portable Network Graphic), , PNG-8, 107 PNG-24, POSH. See Plain Old Semantic HTML presentation, separating from content, 9, 168, 172, 197 presentational markup, inefficiency of, 171 <pre> tag, 85 print media type, 351 print style sheet adding, 355 body style, 356 building, heading styles, 356 hiding unnecessary content, 356 link styles, 357 Process Type Foundry, 202 progressive enhancement, 367 projection media type, 351 propagation, 155 property, 173 prototype, 381 pseudo-classes, for styling links, publications, 392 Q <q> tag, 51, Quirks Mode, 28 quotation marks, 212 quotations, 51, R relative links, , 134, 138 rel attribute, 351, 361 remote machine, repetition, checking for, 370 reserved characters, resources, , rich Internet applications, robots attribute, 347 roman numerals, for ordered lists, 338 rows, Rutter, Richard, 394 S Safari Web Inspector, 388 sans serif fonts, 206 Save for Web and Devices feature, 102, 103 Scalable Vector Graphics (SVG), 112 scheme attribute, 347 screen media type, 351 screen readers, summary attribute and, scripts, adding, search engine optimization (SEO), 346 search engines, structured markup and, section separators, Secure File Transfer Protocol (SFTP), 146, 154 selectors, 173 descendant, , , , 334 grouped, , 262 self-closing tags, 93, 84 semantic markup, semicolon (;), 174 serif fonts, 205 server address, 157 server connections, servers shared, 147 uploading files to, set width, SFTP (Secure File Transfer Protocol), 146, 154 shared servers, 147 Shea, Dave, 390, 394 shorthand, for CSS rules, sidebar div, site maps, styling, with nested lists, social bookmarking services, 379 spaces, in file names, span element as generic element, overuse of, 247, 260 structuring document with, using with id and class attributes, specificity, 186, spelling mistakes, start tags, stock.xchng, 112 strong tag,

9 structured markup, block-level elements, case study, The Guardian, code validation, creating structure with headings and paragraphs, inline elements, overview, phrase elements, search engines and, style element, 177, Stylegala, 394 style sheets browser's default, 168, 201, embedded, external. See external style sheets internal, print, title for, with comments, 190 See also Cascading Style Sheets subfolders, linking to, 136 sub (subscript) tag, summary attribute, <sup> (superscript) tag, T tabbed browsing, 125 table headers, 76 tables, accessibility, captions, columns, for layouts, rows, summary attribute, <table> tag, tabs, in markup, 35 tabular data, tags, closing, nested, opening, overview, relationships between, self-closing, 84, 93 See also specific tags tag soup, target attribute, <td> tag, teas, 385 testing, guerilla testing suite, suite, 389 in various browsers, Web-based browser test services, text accessibility of, aligning, , 256 color, 182 letter spacing, link styling, paragraph styling, quotations, sizing, styling, transforming display of, 213 typefaces, underlined, 86 word spacing, 214 styling, with CSS, 182 text editors, 13 text-indent property, text-level elements, text-transform property, 213, 320 TextWrangler, 13 <th> tag, 76 Times New Roman, 203 title attribute, 96 97, title element, 24, 26 27, 344 tools, 384, 385, 389 top-level domains (TLDs), Transmit, 156 transparency, full alpha, troubleshooting, 363, <tr> tag, tty media type, 351 tv media type, 351 Twitter, 383 two-column CSS layouts, applying floats to, applying floats to images, box model theory and, calculating width of elements, collapsing margins, creating, Faux Columns, float-based, for King Kong page, type attribute, 177, 351, 361 typefaces default, 203 defined, 197 fallback, sizing, specifying, , typography, typos,

10 U <ul> element, underlined text, 86 underscores, unique IP address, 147 unordered lists, URLs (Uniform Resource Locators), user agent styles, 201 user-generated content, 379 username, web hosting, 157 user styles, 201 UTF-8 character set, V validation, 53 58, , validation output, 56 validation services, 29, 53 58, 62, 123, 363, valid code, value, 173 vector graphics, Vim, 13 visited pseudo-class, 220, visual breaks, comments as, 190 W W3C, 392 W3C Markup Validation Service, 29, 53 58, 62, 123, 363, web addresses human-readable, 146 machine-readable, 146 registering, web-based applications, 379 web-based browser test services, web browsers. See browsers Web Developer Add-on, Firefox, web hosting bandwidth, 152 changing hosts, 153 control panel, 152 disk space, 151 , 152 free, 150 on shared servers, 147 support, 152 web hosting companies, 149, Web Inspector, 388 web pages adding CSS to, basic construction of, building basic, generated with WYSIWYG editors, 169 Hello World!, 22 26, 30 including images on, styling, with CSS, 169, 172, validating, 363, web sites database-driven, 382 getting online, recommended, structuring files and folders, testing, troubleshooting, 363, updating, with external style sheets, uploading files, Web Standardistas, 4 15 webstandardistas.com, Web Standardistas periodical, 384 web standards, 7 14 approach to, definition of, 7 8 reasons to use, 8 11 tools for, Web Standards Project (WaSP), 5, 7, 392 Web Standards Solutions, white space, in markup, width calculating, of elements, overflow property, specifying, of floated elements, 291 Windows, 13 word-spacing property, 214 World Wide Web, 4 7 World Wide Web Consortium (W3C), 5 6 WYSIWYG (What You See Is What You Get), 12 13, 169 X X-grade browsers, 367 XHTML (Extensible Hypertext Markup Language), 7, 12 XHTML pages, creating, XHTML rule reference, XHTML Strict, XML (Extensible Markup Language), 7 XML namespace declaration, 29 Y Yahoo! User Interface Library, 381 Z Zeldman, Jeffrey, 396 Zen of CSS Design,

Symbols INDEX. !important rule, rule, , 146, , rule,

Symbols INDEX. !important rule, rule, , 146, , rule, Symbols!important rule, 209 @import rule, 140-144, 146, 155-156, 157 @media rule, 155-156 A element. See anchors abbr attribute, 36-37 element, 87, 90-91 absolute positioning, 177, 178, 182,