Responsive Webdesign: anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.]
Gespeichert in:
| 1. Verfasser: | |
|---|---|
| Format: | Buch |
| Sprache: | German |
| Veröffentlicht: |
Bonn
Galileo Press
2014
|
| Ausgabe: | 1. Aufl. |
| Schriftenreihe: | Galileo Computing
|
| Schlagworte: | |
| Online-Zugang: | Inhaltstext Ausführliche Beschreibung Inhaltsverzeichnis |
| Beschreibung: | 438 S. zahlr. Ill., graph. Darst. 240 mm x 168 mm 1 DVD-ROM (12 cm) |
| ISBN: | 9783836225823 3836225824 |
Internformat
MARC
| LEADER | 00000nam a2200000 c 4500 | ||
|---|---|---|---|
| 001 | BV041299260 | ||
| 003 | DE-604 | ||
| 005 | 20141010 | ||
| 007 | t | ||
| 008 | 131002s2014 gw ad|| |||| 00||| ger d | ||
| 015 | |a 13,N33 |2 dnb | ||
| 016 | 7 | |a 1037931262 |2 DE-101 | |
| 020 | |a 9783836225823 |c : EUR 39.90 (DE), EUR 41.10 (AT), sfr 49.90 (freier Pr.) |9 978-3-8362-2582-3 | ||
| 020 | |a 3836225824 |9 3-8362-2582-4 | ||
| 024 | 3 | |a 9783836225823 | |
| 035 | |a (OCoLC)869850400 | ||
| 035 | |a (DE-599)DNB1037931262 | ||
| 040 | |a DE-604 |b ger |e rakddb | ||
| 041 | 0 | |a ger | |
| 044 | |a gw |c XA-DE-NW | ||
| 049 | |a DE-M347 |a DE-1051 |a DE-573 |a DE-859 |a DE-1043 |a DE-92 |a DE-83 |a DE-703 |a DE-634 |a DE-91G |a DE-863 |a DE-384 |a DE-1102 |a DE-526 |a DE-29T |a DE-Aug4 |a DE-B768 |a DE-2174 | ||
| 082 | 0 | |a 006.7 |2 22/ger | |
| 084 | |a ST 152 |0 (DE-625)143596: |2 rvk | ||
| 084 | |a ST 252 |0 (DE-625)143627: |2 rvk | ||
| 084 | |a 004 |2 sdnb | ||
| 084 | |a DAT 675f |2 stub | ||
| 100 | 1 | |a Ertel, Andrea |d ca. 20. Jh. |e Verfasser |0 (DE-588)1047416069 |4 aut | |
| 245 | 1 | 0 | |a Responsive Webdesign |b anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] |c Andrea Ertel ; Kai Laborenz |
| 250 | |a 1. Aufl. | ||
| 264 | 1 | |a Bonn |b Galileo Press |c 2014 | |
| 300 | |a 438 S. |b zahlr. Ill., graph. Darst. |c 240 mm x 168 mm |e 1 DVD-ROM (12 cm) | ||
| 336 | |b txt |2 rdacontent | ||
| 337 | |b n |2 rdamedia | ||
| 338 | |b nc |2 rdacarrier | ||
| 490 | 0 | |a Galileo Computing | |
| 650 | 0 | 7 | |a Responsive Webdesign |0 (DE-588)1035443651 |2 gnd |9 rswk-swf |
| 655 | 7 | |0 (DE-588)4585131-1 |a DVD-ROM |2 gnd-carrier | |
| 689 | 0 | 0 | |a Responsive Webdesign |0 (DE-588)1035443651 |D s |
| 689 | 0 | |5 DE-604 | |
| 700 | 1 | |a Laborenz, Kai |d ca. 20. Jh. |e Sonstige |0 (DE-588)1023809540 |4 oth | |
| 856 | 4 | 2 | |m X:MVB |q text/html |u http://deposit.dnb.de/cgi-bin/dokserv?id=4397919&prov=M&dok_var=1&dok_ext=htm |3 Inhaltstext |
| 856 | 4 | 2 | |q text/html |u https://www.galileo-press.de/responsive-webdesign_3429/ |3 Ausführliche Beschreibung |
| 856 | 4 | 2 | |m DNB Datenaustausch |q application/pdf |u http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026748078&sequence=000001&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA |3 Inhaltsverzeichnis |
| 943 | 1 | |a oai:aleph.bib-bvb.de:BVB01-026748078 | |
Datensatz im Suchindex
| DE-BY-863_location | 1000 |
|---|---|
| DE-BY-FWS_call_number | 1000/ST 252 E73 |
| DE-BY-FWS_katkey | 507539 |
| DE-BY-FWS_media_number | 083101349412 |
| _version_ | 1806528991397412864 |
| adam_text |
AUF EINEN BLICK
1 DENKEN IN FLEXIBLEN STRUKTUREN 21
2 UMSETZUNG EINES FIXEN DESIGNS IN EIN FLEXIBLES LAYOUT 41
3 DIE SCHLUESSELTECHNOLOGIE MEDIA QUERIES 57
4 EIN RESPONSIVER WORKFLOW 87
5 DESIGN UND TYPOGRAFIE 111
6 SEMANTIK UND BARRIEREFREIHEIT 147
7 DESKTOP FIRST RESPONSIVE LAYOUT-PATTERNS 165
8 FRAMEWORKS FUER RESPONSIVES DESIGN 211
9 NAVIGATIONSKONZEPTE 239
10 FLEXIBLE BILDELEMENTE 273
11 MEHR FLEXIBLE INHALTE 325
12 QUALITAETSSICHERUNG UND OPTIMIERUNG 385
13 FAZIT 421
HTTP://D-NB.INFO/1037931262
INHALT
GELEITWORT DES FACHGUTACHTERS 15
VORWORT 17
1 DENKEN IN FLEXIBLEN STRUKTUREN 21
1.1 RESPONSIVE WEBDESIGN: WAS BEDEUTET DAS EIGENTLICH? 21
1.1.1 VERAENDERTE ANFORDERUNGEN AN DIE DARSTELLUNG VON WEBSITES 22
1.1.2 ANPASSUNGSFAEHIGE WEBSITES VERSUS MOBILVERSIONEN VON WEBSITES .
25
1.1.3 BEISPIELE FUER ANPASSUNGSFAEHIGE WEBSITES 26
1.2 LAYOUTTYPEN: FEST, FLUIDE UND FLEXIBLE 30
1.2.1 DAS FESTE LAYOUT 30
1.2.2 FLUIDES UND ELASTISCHES LAYOUT 30
1.2.3 DAS ADAPTIVE LAYOUT 31
1.2.4 DAS RESPONSIVE LAYOUT 31
1.3 VOM FIXEN ZUM FLEXIBLEN RASTER (GRID) 32
1.4 ADAPTIVES LAYOUT: FESTES LAYOUT MIT UMBRUECHEN 37
1.4.1 GEGENUEBERSTELLUNG: ADAPTIVES VERSUS FIXES LAYOUT 38
1.5 RESPONSIVE LAYOUT: FLUIDES LAYOUT MIT UMBRUECHEN 38
1.5.1 GEGENUEBERSTELLUNG: RESPONSIVES VERSUS ADAPTIVES LAYOUT 39
1.6 ZUSAMMENFASSUNG 40
2 UMSETZUNG EINES FIXEN DESIGNS IN
EIN FLEXIBLES LAYOUT 41
2.1 DIE AUSGANGSLAGE: EIN GRAFISCHER ENTWURF MIT FESTEN ABMESSUNGEN 41
2.2 DER ERSTE SCHRITT: FESTE RASTER IN FLEXIBLE UMRECHNEN 47
2.3 DER ZWEITE SCHRITT ZU MEHR FLEXIBILITAET: ANPASSUNGSFAEHIGE INHALTE 49
2.4 DER DRITTE SCHRITT: LAYOUTS MIT MEDIA QUERIES UMSCHALTEN 52
2.5 ZUSAMMENFASSUNG 55
3 DIE SCHLUESSELTECHNOLOGIE MEDIA QUERIES
57
3.1 CASCADING STYLESHEETS (EIN KURZER RUECKBLICK) 58
3.1.1 ZUWEISUNG VON CSS-EIGENSCHAFTEN 58
3.2 MEDIENTYP (MEDIA TYPE) 59
3.2.1 MEDIENABFRAGE FUER DEN MEDIENTYP SETZEN 60
3.2.2 MEDIENTYPEN IN DER UEBERSICHT 60
3.3 MEDIENEIGENSCHAFTEN (MEDIA FEATURES) 61
3.3.1 MEDIENEIGENSCHAFTEN IN DER UEBERSICHT 62
3.4 MEDIA QUERIES SCHREIBEN 64
3.4.1 KOMPONENTEN EINES MEDIA QUERYS 64
3.5 VIEWPORTS UND PIXEL 66
3.5.1 DER VISUELLE VIEWPORT 66
3.5.2 DER LAYOUT-VIEWPORT AUF MOBILEN GERAETEN 66
3.5.3 GERAETEPIXEL UND CSS-PIXEL: DER VIRTUELLE VISUELLE VIEWPORT 67
3.5.4 DAS VIEWPORT-METATAG UND SEINE EIGENSCHAFTEN 71
3.5.5 DIE @VIEWPORT-ANWEISUNG IN CSS 73
3.6 MEDIA QUERIES IM RESPONSIVE WEBDESIGN 75
3.6.1 MEDIENEIGENSCHAFT: WIDTH 75
3.6.2 MEDIENEIGENSCHAFT: DEVICE-WIDTH 76
3.6.3 MEDIA QUERIES IN EM 77
3.6.4 MEDIENEIGENSCHAFT: HEIGHT-VERTIKALE MEDIA QUERIES 79
3.6.5 MEDIENEIGENSCHAFT: ORIENTATION 80
3.6.6 MEDIENEIGENSCHAFT: ASPECT-RATIO, DEVICE-ASPECT-RATIO 80
3.6.7 MEDIENEIGENSCHAFT: RESOLUTION UND DEVICE-PIXEL-RATIO 80
3.7 MEDIA QUERIES IM HTML-HEADER ODER IM STYLESHEET 84
3.8 DAS WICHTIGSTE MEDIA QUERY IST KEIN MEDIA QUERY! 84
3.9 MEDIA QUERIES UND DIE ALTEN INTERNET EXPLORER 84
3.9.1 NUR BASISLAYOUT ZUWEISEN 85
3.9.2 MITTLERE LAYOUTSTUFEN MIT CONDITIONAL COMMENTS ZUWEISEN 85
3.9.3 MEDIA-QUERY-UNTERSTUETZUNG MIT JAVASCRIPT NACHRUESTEN 85
3.10 ZUSAMMENFASSUNG 86
4 EIN RESPONSIVER WORKFLOW 87
4.1 DER ALTE PROZESS 87
4.2 PHASE 1: MOODBOARDS UND INHALTSPLAN 90
4.2.1 MOODBOARDS 90
4.2.2 INHALTE STRUKTURIEREN UND HIERARCHISIEREN 91
4.2.3 CONTENT-PROTOTYPEN 93
4.3 PHASE 2: STYLE TILES UND WIREFRAMES 94
4.3.1 STYLE TILES 94
4.3.2 MOCKUPS 98
4.4 PHASE 3: DESIGN IM BROWSER 102
4.4.1 ONLINE-EDITOREN 103
4.4.2 KOMPONENTEN, PATTERNS UND ATOMIC DESIGN 104
4.5 PHASE 4: RINSE AND REPEAT 104
4.5.1 BEZIEHEN SIE IHRE KUNDEN IN DEN CESAMTPROZESS MIT EIN 105
4.6 DAS RESPONSIVE TEAM 106
4.7 DOKUMENTATION RESPONSIVER DESIGNS 107
4.7.1 STYLE-DOKUMENTATION MIT EVERNOTE 108
4.7.2 DEXY 109
4.8 ZUSAMMENFASSUNG 110
5 DESIGN UND TYPOGRAFIE
111
5.1 DESIGN FOLLOWS CONTENT 111
5.1.1 YOU CANNOT NOT COMMUNICATE-KEIN DESIGN IST AUCH EIN DESIGN 112
5.2 DESIGN VON INNEN NACH AUSSEN - DER ATOMIC-DESIGN-ANSATZ 113
5.2.1 ATOMIC DESIGN ANWENDEN MIT PATTERN LAB 115
5.3 DESIGNANFORDERUNGEN FUER RESPONSIVE SITES 118
5.3.1 DOES SIZE MATTER-WAS MACHEN NUTZER MIT IHREN GERAETEN? 118
5.3.2 GERAETEUEBERGREIFENDES SURFEN 120
5.3.3 SIZE MATTERS: ZIELE FUER TOUCH-EVENTS 120
5.3.4 ES GIBT KEIN HOEVER AUF HAWAII 122
5.3.5 INAKTIVES :ACTIVE AUF IOS 123
5.3.6 HANDPOSITIONEN 124
5.3.7 LAYOUTWECHSEL BEI AENDERUNG DER ORIENTIERUNG 125
5.3.8 SCHREIBEN IST MUEHSAM: FORMULARE AUF SMARTPHONES 127
5.3.9 MOBILE INSPIRATION UND BEST PRATICE 128
5.4 TYPOGRAFIE (ANPASSUNGSFAEHIGER TEXT) 129
5.4.1 DIE AUSWAHL DER SCHRIFTART 130
5.4.2 ANGABEN FUER DIE SCHRIFTGROESSE 133
5.4.3 SCHRIFTGROESSENWAHRNEHMUNG AUF KLEINEN UND GROSSEN
BILDSCHIRMEN 137
5.4.4 ZEILENLAENGE UND DURCHSCHUSS 140
5.4.5 SKALIERBARE SEITENBREITE TEXTE 144
5.5 ZUSAMMENFASSUNG 145
6 SEMANTIK UND BARRIEREFREIHEIT
147
6.1 PRINZIPIEN DER ZUGAENGLICHKEIT 147
6.1.1 WAHRNEHMBARKEIT 148
6.1.2 BEDIENBARKEIT 152
6.1.3 VERSTAENDLICHKEIT 153
6.1.4 ROBUSTHEIT 154
6.2 SEMANTIK DURCH HTML5 155
6.2.1 SECTION 156
6.2.2 ARTICLE 156
6.2.3 NAV 157
6.2.4 ASIDE 157
6.2.5 HEADER 157
6.2.6 FOOTER 157
6.3 HTML5-FORMULARATTRIBUTE FUER MEHR SEMANTIK 158
6.3.1 NEUE EINGABEELEMENTE 159
6.4 SEMANTIK DURCH WAI-ARIA-ROLLEN 161
6.5 ZUSAMMENFASSUNG 163
7 DESKTOP FIRST RESPONSIVE LAYOUT-PATTERNS 165
7.1 MOBILE FIRST 165
7.1.1 REDUKTION AUF DAS WESENTLICHE IST DIE DEVISE 166
7.1.2
MOBILE FIRST-PROGRESSIVE ENHANCEMENT FUER'S LAYOUT
167
7.1.3 MOBILE FIRST BEDEUTET AUCH CONTENT FIRST 168
7.1.4 FALLBACKLAYOUT: WAS IST DIE NOTFALLANSICHT? 169
7.2 PRAXISBEISPIEL: MOBILE FIRST 170
7.2.1 MOBILE FIRST-LOS GEHT'S! 170
7.2.2 MOCKUPS FUER DAS LAYOUT 171
7.2.3 BASISVERSION: SMARTPHONE-ANSICHT 172
7.2.4 SETZEN DES VIEWPORT-METATAGS 179
7.3 AUSWAHL DER BREAKPOINTS 181
7.3.1 HAUPT-BREAKPOINTS 182
7.3.2 ANPASSUNGS-BREAKPOINTS 183
7.3.3 VERTIKALE BREAKPOINTS 183
7.4 PRAXISBEISPIEL: ERSTEN BREAKPOINT SETZEN (TABLETS) 185
7.5 LAYOUT-PATTERNS (DARSTELLUNGSMUSTER) FUER UNTERSCHIEDLICHE
AUSGABEGERAETE 190
7.5.1 TINYTWEAKS (KLEINE OPTIMIERUNGEN) 190
7.5.2 MOSTLY FLUID (GROSSTEILS FLIESSEND) 192
7.5.3 COLUMN DROP (ABGESENKTE SPALTEN) 192
7.5.4 LAYOUT SHIFTER (LAYOUTVERDREHER) 193
7.5.5 OFF-CANVAS-LAYOUT (AUSSERHALB DES BILDSCHIRMS) 194
7.5.6 FOOTER-NAVIGATION UND OFF-CANVAS-MARGINALIE 194
7.5.7 TOP-OFF-CANVAS-MENUE UND OFF-CANVAS-MARGINALIE 195
7.5.8 VERTIKALE UND HORIZONTALE OFF-CANVAS-PANELS 196
7.5.9 ZUSAMMENGEFASSTE ELEMENTE OFF-CANVAS 197
7.5.10
OFF-CANVAS-LOESUNGEN AUS DER SCHUBLADE
198
7.6 PRAXISBEISPIEL: WEITERE BREAKPOINTS SETZEN (GROSSE SCREENS) 199
7.6.1 KLEINE DESKTOPVERSION NACH DEM KONZEPT LAYOUT SHIFTER 199
7.6.2 GROSSE DESKTOPVERSION 201
7.7 BREAKPOINT-TOOLS 203
7.7.1 BREAKPOINTS TESTEN MIT FIREFOX 203
7.7.2 CRIDPAK ZUM ERSTELLEN VON RASTERN MIT MEDIA QUERIES 204
7.8 CSS3-LAYOUTTECHNIKEN FUER RESPONSIVE LAYOUTS 205
7.8.1 FLEXBOX-LAYOUT 205
7.8.2 GRID-LAYOUT (CSS3) 209
7.9 ZUSAMMENFASSUNG 210
8 FRAMEWORKS FUER RESPONSIVES DESIGN 211
8.1 EIGENE VORLAGE ODER FERTIGE FRAMEWORKS VERWENDEN? 212
8.2 WIE WAEHLEN SIE DAS RICHTIGE FRAMEWORK AUS? 214
8.3 EIN KURZE VORSTELLUNG RESPONSIVER FRAMEWORKS 215
8.3.1 YAML 217
8.3.2 FOUNDATION 220
8.3.3 GROUNDWORKCSS 224
8.3.4 PURECSS 226
8.4 JAVASCRIPT-BIBLIOTHEKEN UND ANDERE HELFER 228
8.4.1 JQUERY UND ZEPTO 229
8.4.2 MODERNIZR 230
8.4.3 ELEGANTE STYLESHEETS MIT PRAEPROZESSOREN: SASS 232
8.5 ZUSAMMENFASSUNG 237
9 NAVIGATIONSKONZEPTE
23G
9.1 WAS MACHT EINE NAVIGATION BENUTZERFREUNDLICH? 239
9.2 BENUTZERFREUNDLICHE NAVIGATION FUER MOBILE GERAETE 240
9.2.1 FREIER BLICK AUF DIE WEBSITE 241
9.2.2 AUSREICHEND GROSSE KLICKFLAECHEN FUER TOUCHBEDIENUNG 242
9.2.3 UMGANG MIT MENUES MIT MEHREREN EBENEN 242
9.3 NAVIGATIONSTYPEN FUER MOBILE GERAETE MIT TOUCHSCREEN 242
9.3.1 WENIGE MENUEPUNKTE AM OBEREN RAND 243
9.3.2 LANGE MENUES AM OBEREN RAND 246
9.3.3 SELECT-MENUE 247
9.3.4 NAVIGATION PER ANKER AM ENDE DES SEITENINHALTS 252
9.3.5 TOGGLE-MENUE 256
9.3.6 OFF-CANVAS-MENUE 263
9.4 MULTILEVEL-MENUES 268
9.4.1 DIE NATIVE EINBINDUNG VON MULTILEVEL-MENUES
AUF IOS UND ANDROID 269
9.4.2 ANDERE LOESUNGEN FUER MULTILEVEL-MENUES 271
9.5 ZUSAMMENFASSUNG 272
10 FLEXIBLE BILDELEMENTE
273
10.1 ANPASSUNGSFAEHIGE BILDER 273
10.1.1 PRAXISBEISPIEL: ANPASSUNGSFAEHIGES HEADERBILD 275
10.1.2 BILDER AUSSCHNITTWEISE ANZEIGEN 277
10.1.3
PRAXISBEISPIEL: NUR BILDAUSSCHNITT FUER DIE BASISVERSION
277
10.1.4
FLEXIBLE BILDER, DIE NICHT UEBER DIE GANZE RASTERBREITE GEHEN
278
10.1.5
PRAXISBEISPIEL: FLEXIBLE TEASER-BOXEN MIT BILD UND TEXT
279
10.2 RESPONSIVE HINTERGRUNDBILDER 283
10.2.1 GEKACHELTE HINTERGRUNDMUSTER 283
10.2.2 GROSSFLAECHIGE HINTERGRUNDBILDER 288
10.2.3 PRAXISBEISPIEL: VOLLFLAECHIGE HINTERGRUNDBILDER 292
10.2.4 HINTERGRUNDGRAFIKEN ALS ICONS 294
10.2.5 CSS-SPRITES FUER HINTERGRUNDBILDER 295
10.2.6 PRAXISBEISPIEL: SPRITES FUER SOCIAL-ICONS (HOCHAUFLOESENDE) 297
10.3 AUFLOESUNGSUNABHAENGIGE GRAFIKEN 301
10.3.1 SCALABLE VECTOR GRAPHICS (SVG) 302
10.3.2 ICON-FONTS 306
10.3.3
PRAXISBEISPIEL: ICON-FONTS MIT FONT AWESOME
308
10.3.4 ICON-FONTS MIT LIGATUREN 311
10.4 BILDER FUER UNTERSCHIEDLICHE AUFLOESUNGEN 312
10.4.1 WIE ORDNE ICH DIE RICHTIGEN BILDER IM HTML-CODE ZU? 313
10.4.2 UND WER ERSTELLT DIE GANZEN BILDER? 320
10.5 ZUSAMMENFASSUNG 324
11 MEHR FLEXIBLE INHALTE
325
11.1 RESPONSIVE BILDERGALERIEN 326
11.1.1 PRAXISBEISPIEL: FLEXIBLE SLIDESHOW MIT RESPONSIVESLIDES 326
11.1.2 PRAXISBEISPIEL: RESPONSIVE BILDERGALERIEN MIT FLEXSLIDER 328
11.1.3 ANDERE BILDERGALERIETOOLS 334
11.2 RESPONSIVE IMAGE MAPS 335
11.2.1 PRAXISBEISPIEL: JQUERY-RWDLMAGEMAPS.JS 336
11.3 ANPASSUNGSFAEHIGE VIDEOS 337
11.3.1 PRAXISBEISPIEL: HTML5-VIDEOS 339
11.3.2 RESPONSIVE EMBEDDING VON YOUTUBE & CO-. VIDEOS IM IFRAME 341
11.3.3 AUTOMATISCHE ANPASSUNG FUER UNTERSCHIEDLICHE
VIDEO-SEITENVERHAELTNISSE DURCH FITVIDS.JS 344
11.4 ADOBE FLASH 344
11.5 FLEXIBLE KARTENEINBINDUNGEN (GOOGLE MAPS) 345
11.6 FLEXIBLE TABELLEN (MEDIATABLE) 347
11.6.1 TABELLENINHALTE DEAKTIVIEREN (HIDE ON MOBILE) 348
11.6.2 DIE TABELLE MIT CSS UMSTRUKTURIEREN 350
11.6.3 ANPASSUNGSFAEHIGE TABELLEN MIT FOOTABLE 354
11.7 AKKORDEONS UND INHALTSBOXEN MIT REITERN 356
11.8 FLEXIBLE FORMULARE 361
11.8.1 ANWENDUNGSBEISPIEL: FORMULAR 362
11.9 INHALTE SELEKTIV ANZEIGEN UND LADEN 367
11.9.1 INHALTE ENTFERNEN ODER ERGAENZEN-WANN UND WIE? 367
11.9.2 INHALTE PER CSS AUSBLENDEN (DISPLAY: NONE) 368
11.9.3 INHALTE PER CSS HINZUFUEGEN 368
11.9.4 CONDITIONAL LOADING CONTENT VIA JAVASCRIPT (UND CSS) 371
11.10 FLEXIBLE WERBUNG 374
11.10.1 BEWUSSTSEIN SCHAFFEN 375
11.10.2 ALTE UND NEUE BANNERKONZEPTE 376
11.10.3 BANNERERSTELLUNG 377
11.10.4 BANNERAUSLIEFERUNG 378
11.10.5 FIXE SPALTE UND NUR EIN RECTANGLE-FORMAT 380
11.10.6 UNTERSCHIEDLICHE GOOGLE ADSENSE ADS IM RESPONSIVEN DESIGN
AUSLIEFERN 380
11.10.7 WERBEBLOECKE ZWISCHEN INHALTE SCHIEBEN MIT CSS-REGIONS (POLYFILL)
. 381
11.10.8 INHALTE DYNAMISCH VERSCHIEBEN 383
11.11 ZUSAMMENFASSUNG 384
12 QUALITAETSSICHERUNG UND OPTIMIERUNG
385
12.1 TESTING 385
12.1.1 VALIDATOREN FUER HTML UND CSS 385
12.1.2 BREAKPOINTS TESTEN 386
12.1.3 AUF DEM GERAET TESTEN 392
12.1.4 ADOBE EDGE INSPECT, SDKS 394
12.2 PERFORMANCE TESTEN UND OPTIMIERUNG 396
12.2.1 WAS BEEINTRAECHTIGT DIE PERFORMANCE? 396
12.2.2 SKRIPTE UND HTML 400
12.2.3 CACHING 409
12.2.4 PERFORMANCEOPTIMIERUNG FUER GRAFIKEN UND BILDER 410
12.2.5 SCHRIFTEN OPTIMIEREN 412
12.2.6 LAZYLOADING 416
12.2.7 AUS DEN AUGEN, AUS DEM SINN? 418
12.3 ZUSAMMENFASSUNG 420
13 FAZIT
42I
DVD ZUM BUCH
423
WEBSITE ZUM BUCH 423
QUELLENNACHWEISE DER VERWENDETEN BILDER 423
INDEX 427 |
| any_adam_object | 1 |
| author | Ertel, Andrea ca. 20. Jh |
| author_GND | (DE-588)1047416069 (DE-588)1023809540 |
| author_facet | Ertel, Andrea ca. 20. Jh |
| author_role | aut |
| author_sort | Ertel, Andrea ca. 20. Jh |
| author_variant | a e ae |
| building | Verbundindex |
| bvnumber | BV041299260 |
| classification_rvk | ST 152 ST 252 |
| classification_tum | DAT 675f |
| ctrlnum | (OCoLC)869850400 (DE-599)DNB1037931262 |
| dewey-full | 006.7 |
| dewey-hundreds | 000 - Computer science, information, general works |
| dewey-ones | 006 - Special computer methods |
| dewey-raw | 006.7 |
| dewey-search | 006.7 |
| dewey-sort | 16.7 |
| dewey-tens | 000 - Computer science, information, general works |
| discipline | Informatik |
| edition | 1. Aufl. |
| format | Book |
| fullrecord | <?xml version="1.0" encoding="UTF-8"?><collection xmlns="http://www.loc.gov/MARC21/slim"><record><leader>00000nam a2200000 c 4500</leader><controlfield tag="001">BV041299260</controlfield><controlfield tag="003">DE-604</controlfield><controlfield tag="005">20141010</controlfield><controlfield tag="007">t</controlfield><controlfield tag="008">131002s2014 gw ad|| |||| 00||| ger d</controlfield><datafield tag="015" ind1=" " ind2=" "><subfield code="a">13,N33</subfield><subfield code="2">dnb</subfield></datafield><datafield tag="016" ind1="7" ind2=" "><subfield code="a">1037931262</subfield><subfield code="2">DE-101</subfield></datafield><datafield tag="020" ind1=" " ind2=" "><subfield code="a">9783836225823</subfield><subfield code="c">: EUR 39.90 (DE), EUR 41.10 (AT), sfr 49.90 (freier Pr.)</subfield><subfield code="9">978-3-8362-2582-3</subfield></datafield><datafield tag="020" ind1=" " ind2=" "><subfield code="a">3836225824</subfield><subfield code="9">3-8362-2582-4</subfield></datafield><datafield tag="024" ind1="3" ind2=" "><subfield code="a">9783836225823</subfield></datafield><datafield tag="035" ind1=" " ind2=" "><subfield code="a">(OCoLC)869850400</subfield></datafield><datafield tag="035" ind1=" " ind2=" "><subfield code="a">(DE-599)DNB1037931262</subfield></datafield><datafield tag="040" ind1=" " ind2=" "><subfield code="a">DE-604</subfield><subfield code="b">ger</subfield><subfield code="e">rakddb</subfield></datafield><datafield tag="041" ind1="0" ind2=" "><subfield code="a">ger</subfield></datafield><datafield tag="044" ind1=" " ind2=" "><subfield code="a">gw</subfield><subfield code="c">XA-DE-NW</subfield></datafield><datafield tag="049" ind1=" " ind2=" "><subfield code="a">DE-M347</subfield><subfield code="a">DE-1051</subfield><subfield code="a">DE-573</subfield><subfield code="a">DE-859</subfield><subfield code="a">DE-1043</subfield><subfield code="a">DE-92</subfield><subfield code="a">DE-83</subfield><subfield code="a">DE-703</subfield><subfield code="a">DE-634</subfield><subfield code="a">DE-91G</subfield><subfield code="a">DE-863</subfield><subfield code="a">DE-384</subfield><subfield code="a">DE-1102</subfield><subfield code="a">DE-526</subfield><subfield code="a">DE-29T</subfield><subfield code="a">DE-Aug4</subfield><subfield code="a">DE-B768</subfield><subfield code="a">DE-2174</subfield></datafield><datafield tag="082" ind1="0" ind2=" "><subfield code="a">006.7</subfield><subfield code="2">22/ger</subfield></datafield><datafield tag="084" ind1=" " ind2=" "><subfield code="a">ST 152</subfield><subfield code="0">(DE-625)143596:</subfield><subfield code="2">rvk</subfield></datafield><datafield tag="084" ind1=" " ind2=" "><subfield code="a">ST 252</subfield><subfield code="0">(DE-625)143627:</subfield><subfield code="2">rvk</subfield></datafield><datafield tag="084" ind1=" " ind2=" "><subfield code="a">004</subfield><subfield code="2">sdnb</subfield></datafield><datafield tag="084" ind1=" " ind2=" "><subfield code="a">DAT 675f</subfield><subfield code="2">stub</subfield></datafield><datafield tag="100" ind1="1" ind2=" "><subfield code="a">Ertel, Andrea</subfield><subfield code="d">ca. 20. Jh.</subfield><subfield code="e">Verfasser</subfield><subfield code="0">(DE-588)1047416069</subfield><subfield code="4">aut</subfield></datafield><datafield tag="245" ind1="1" ind2="0"><subfield code="a">Responsive Webdesign</subfield><subfield code="b">anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.]</subfield><subfield code="c">Andrea Ertel ; Kai Laborenz</subfield></datafield><datafield tag="250" ind1=" " ind2=" "><subfield code="a">1. Aufl.</subfield></datafield><datafield tag="264" ind1=" " ind2="1"><subfield code="a">Bonn</subfield><subfield code="b">Galileo Press</subfield><subfield code="c">2014</subfield></datafield><datafield tag="300" ind1=" " ind2=" "><subfield code="a">438 S.</subfield><subfield code="b">zahlr. Ill., graph. Darst.</subfield><subfield code="c">240 mm x 168 mm</subfield><subfield code="e">1 DVD-ROM (12 cm)</subfield></datafield><datafield tag="336" ind1=" " ind2=" "><subfield code="b">txt</subfield><subfield code="2">rdacontent</subfield></datafield><datafield tag="337" ind1=" " ind2=" "><subfield code="b">n</subfield><subfield code="2">rdamedia</subfield></datafield><datafield tag="338" ind1=" " ind2=" "><subfield code="b">nc</subfield><subfield code="2">rdacarrier</subfield></datafield><datafield tag="490" ind1="0" ind2=" "><subfield code="a">Galileo Computing</subfield></datafield><datafield tag="650" ind1="0" ind2="7"><subfield code="a">Responsive Webdesign</subfield><subfield code="0">(DE-588)1035443651</subfield><subfield code="2">gnd</subfield><subfield code="9">rswk-swf</subfield></datafield><datafield tag="655" ind1=" " ind2="7"><subfield code="0">(DE-588)4585131-1</subfield><subfield code="a">DVD-ROM</subfield><subfield code="2">gnd-carrier</subfield></datafield><datafield tag="689" ind1="0" ind2="0"><subfield code="a">Responsive Webdesign</subfield><subfield code="0">(DE-588)1035443651</subfield><subfield code="D">s</subfield></datafield><datafield tag="689" ind1="0" ind2=" "><subfield code="5">DE-604</subfield></datafield><datafield tag="700" ind1="1" ind2=" "><subfield code="a">Laborenz, Kai</subfield><subfield code="d">ca. 20. Jh.</subfield><subfield code="e">Sonstige</subfield><subfield code="0">(DE-588)1023809540</subfield><subfield code="4">oth</subfield></datafield><datafield tag="856" ind1="4" ind2="2"><subfield code="m">X:MVB</subfield><subfield code="q">text/html</subfield><subfield code="u">http://deposit.dnb.de/cgi-bin/dokserv?id=4397919&prov=M&dok_var=1&dok_ext=htm</subfield><subfield code="3">Inhaltstext</subfield></datafield><datafield tag="856" ind1="4" ind2="2"><subfield code="q">text/html</subfield><subfield code="u">https://www.galileo-press.de/responsive-webdesign_3429/</subfield><subfield code="3">Ausführliche Beschreibung</subfield></datafield><datafield tag="856" ind1="4" ind2="2"><subfield code="m">DNB Datenaustausch</subfield><subfield code="q">application/pdf</subfield><subfield code="u">http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026748078&sequence=000001&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA</subfield><subfield code="3">Inhaltsverzeichnis</subfield></datafield><datafield tag="943" ind1="1" ind2=" "><subfield code="a">oai:aleph.bib-bvb.de:BVB01-026748078</subfield></datafield></record></collection> |
| genre | (DE-588)4585131-1 DVD-ROM gnd-carrier |
| genre_facet | DVD-ROM |
| id | DE-604.BV041299260 |
| illustrated | Illustrated |
| indexdate | 2024-08-05T08:45:00Z |
| institution | BVB |
| isbn | 9783836225823 3836225824 |
| language | German |
| oai_aleph_id | oai:aleph.bib-bvb.de:BVB01-026748078 |
| oclc_num | 869850400 |
| open_access_boolean | |
| owner | DE-M347 DE-1051 DE-573 DE-859 DE-1043 DE-92 DE-83 DE-703 DE-634 DE-91G DE-BY-TUM DE-863 DE-BY-FWS DE-384 DE-1102 DE-526 DE-29T DE-Aug4 DE-B768 DE-2174 |
| owner_facet | DE-M347 DE-1051 DE-573 DE-859 DE-1043 DE-92 DE-83 DE-703 DE-634 DE-91G DE-BY-TUM DE-863 DE-BY-FWS DE-384 DE-1102 DE-526 DE-29T DE-Aug4 DE-B768 DE-2174 |
| physical | 438 S. zahlr. Ill., graph. Darst. 240 mm x 168 mm 1 DVD-ROM (12 cm) |
| publishDate | 2014 |
| publishDateSearch | 2014 |
| publishDateSort | 2014 |
| publisher | Galileo Press |
| record_format | marc |
| series2 | Galileo Computing |
| spellingShingle | Ertel, Andrea ca. 20. Jh Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] Responsive Webdesign (DE-588)1035443651 gnd |
| subject_GND | (DE-588)1035443651 (DE-588)4585131-1 |
| title | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] |
| title_auth | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] |
| title_exact_search | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] |
| title_full | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] Andrea Ertel ; Kai Laborenz |
| title_fullStr | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] Andrea Ertel ; Kai Laborenz |
| title_full_unstemmed | Responsive Webdesign anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] Andrea Ertel ; Kai Laborenz |
| title_short | Responsive Webdesign |
| title_sort | responsive webdesign anpassungsfahige webseiten programmieren und gestalten grundlagen strategien praxisbeispiele layout navigationen bilder und videos schriften inkl responsive webdesign frameworks barrierefreiheit performance u v m |
| title_sub | anpassungsfähige Webseiten programmieren und gestalten ; [Grundlagen, Strategien, Praxisbeispiele ; Layout, Navigationen, Bilder und Videos, Schriften ; inkl. responsive Webdesign-Frameworks, Barrierefreiheit, Performance u.v.m.] |
| topic | Responsive Webdesign (DE-588)1035443651 gnd |
| topic_facet | Responsive Webdesign DVD-ROM |
| url | http://deposit.dnb.de/cgi-bin/dokserv?id=4397919&prov=M&dok_var=1&dok_ext=htm https://www.galileo-press.de/responsive-webdesign_3429/ http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026748078&sequence=000001&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA |
| work_keys_str_mv | AT ertelandrea responsivewebdesignanpassungsfahigewebseitenprogrammierenundgestaltengrundlagenstrategienpraxisbeispielelayoutnavigationenbilderundvideosschrifteninklresponsivewebdesignframeworksbarrierefreiheitperformanceuvm AT laborenzkai responsivewebdesignanpassungsfahigewebseitenprogrammierenundgestaltengrundlagenstrategienpraxisbeispielelayoutnavigationenbilderundvideosschrifteninklresponsivewebdesignframeworksbarrierefreiheitperformanceuvm |
Beschreibung
THWS Würzburg Zentralbibliothek Lesesaal
| Signatur: |
1000 ST 252 E73 |
|---|---|
| Exemplar 1 | ausleihbar Verfügbar Bestellen |