Tài liệu Professional Web Design: Techniques and Templates- P20 pdf

I

icon, 452

ID class name, 417

ideogram, 9-10

IFrames, 29

image. See also graphics

absolute or relative positioning, 107-108

background, 32-33, 35

bitmapped, 99

conversion rate optimization, 512-518

flattened, 98-99

formats, misusing, 143-151

immersive imagery, 11

keywords, 477-479

menu items as, 30-32

mortising, 104-113

normal spacing between, 106

over compressing, 147-149

placing text over, 110-113

positioned in container, 108-109

seamlessly pieced together, 104-105

sense of motion or emotion, 107

source files, 455-457

template customization, 537

thumbnail as smaller version of, 38-39

uncompressed, 37-38

image button, 30-32

image-mapping, 78

Images folder, 91

<img> tag, 115

import, 120

impression, 9

include files, 60-61, 84, 124

indentation, 461

inline characters, 452

<INPUT> tag, 379

ISP usage, 49

italics and bold tags, 476

J

JavaScript, 77, 448

JPG format

compression, 138

saving images as, 137-138

solid colors saved as, 145-146

K

Kbps (kilobits per second), 26

keyword

in ‘‘alt’’ and ‘‘title’’ properties, 477

link, 479-480

meta, 473-474

in naming directories, files, and images,

477-479

research, 468-470

<keyword> tag, 473

Keyword tool (Google), 466

kilobits per second (Kbps), 26

L

label, form, 372-373, 375

<LABEL> tag, 377378

layer

advantages of, 97

design consideration, 96-99

as folder, 97

image made up of, 97

mask, 99

merged, 98--99

parent, 97

Layers panel (Photoshop), 544, 547, 549

layout

deciding on, 95--96

header height considerations, 96

menu width consideration, 96

round edges and corner placement

considerations, 96

scrolling versus nonscrolling, 72

three-column

basic framework, 326-329

CSS container placement, 325

design structure, 322

guide and slice placement, 323-324

header, footer, and column content,

335-342

requirements, 321

rows and columns, adding to framework,

329-334

second-level pages, 343

usability enhancement, 72-74

vertical versus horizontal space

consideration, 95

left alignment, 329

<li> tag, 115

line, 438-439

linear shapes, 452

line-height property, 453-454

line-level tag, 118

link keyword, 479-480

liquid design, 437-438

listing

background-based design

footer, 360-366

framework, 350-352

header area, 353-357

Index 883

box model method, 172-174

CSS design, 168-170

fixed-width design

basic framework and initial style

rule, 421

body and header rules, 423-424

centering, 433-436

footer area, 428-430

left and right column rules, 425-427

form

checkbox, 381

comments row, 382

completed form, 384-389

drop-down menu, 380

initial code, 377

name row, 378-379

options to select row, 383-384

required row, 377

section title, 383-384

style sheet, 374-375

submit and cancel button, 384

high-content CSS design

basic framework, 273-274

center column, 287-296

header row, 276-278

left column, 281-285

second-level pages, three column, 300-309

second-level pages, two column, 311-319

image

background image and text added to,

112-113

mortised, 109-110

line, 439

low-content CSS design

basic framework, 185-187

center (right) column example, 201-206

floating container example, 214-221

header content, 188-190

left-column example, 195-198

second-level page construction example,

208-213

low-content XHTML template

content area, 404-406

footer information, 409

menu table, 399-401

style sheet, 396

medium-content CSS design

basic framework, 228-229

bottom, center, and right content areas,

244-250

left column example, 231-234

second-level page, three column, 253-258

second-level page, two column, 260-264

top-right image example, 238-242

search engine optimization

A5design case study, 484-485,

487-491, 4865

Apricotpetal.com case study, 502-505

onepartart.com case study, 493-500

style sheet, 120

three-column layout

basic framework, 327-328

header, footer, and column content,

335-342

rows and columns, 331-334

XHTML, 160-168

log file, usage statistics, 22

logo

low-content XHTML template, 406

positioning, 73-74

look and feel requirements, 41

low content, 80

low-content CSS design

basic description of, 179

basic framework, 185-188

center (right) column example, 201-207

container placement, 183-185

floating container example, 214-221

guide and slice placement, 180-183

header content, 92, 188-191

left column example, 194-200

nested left and right column, 192-194

second-level page construction, 207-214

understanding the design structure, 180

low-content XHTML template

advantages of, 392-393

center column, adding image to, 401-402

content area, 394, 402-408

disadvantages of, 393

download time, 392

footer information, 408-409

guides and slices, 394-395

menu bullets, 394-395

menu table, 390-392, 398

overview, 391

parent table, 394-396

style sheet, 396

title and logo, 406

Lycos search engine, 465

M

margin, 352, 375, 420-421, 443

mask, layer, 99

mathematics-based technology, 13

Medcomgroup.com (CRO case study), 528-532

medium content, 81

medium-content CSS design

884 Index