1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
1001
1002
1003
1004
1005
1006
1007
1008
1009
1010
1011
1012
1013
1014
1015
1016
1017
1018
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>SELFHTML: Navigationshilfen / Hufig gestellte Fragen (FAQ)</title>
<link rel="stylesheet" type="text/css" href="../src/selfhtml.css">
<meta name="description" content="Welche Fragen rund ums Erstellen von Web-Seiten besonders oft gestellt werden.">
<meta name="keywords" content="SELFHTML, FAQ">
<meta name="author" content="Redaktion SELFHTML, selfhtml81@selfhtml.org">
<meta name="robots" content="noindex, nofollow">
<meta name="DC.Publisher" content="SELFHTML e. V.">
<meta name="DC.Date" content="2005-11-16T01:48:05+01:00">
<meta name="DC.Identifier" content="http://de.selfhtml.org/navigation/faq.htm">
<meta name="DC.Language" content="de">
<meta name="DC.Rights" content="../editorial/copyright.htm">
<meta name="DC.Date.created" content="2001-10-27T08:00+01:00">
<meta name="SELF.Pagetype" content="page">
<link rel="alternate" type="application/atom+xml" title="SELFHTML-Weblog (Atom, gesamt)" href="http://aktuell.de.selfhtml.org/weblog/atom-feed">
<link rel="alternate" type="application/rss+xml" title="SELFHTML-Weblog (RSS, Auszge)" href="http://aktuell.de.selfhtml.org/weblog/rss-feed">
<link rel="shortcut icon" type="image/x-icon" href="../src/favicon.ico">
<link rel="author" title="Impressum" href="../editorial/impressum.htm">
<link rel="contents" title="Inhaltsverzeichnis" href="inhalt.htm">
<link rel="index" title="Stichwortverzeichnis" href="stichwort.htm">
<link rel="search" title="Suche" href="suche/index.htm">
<link rel="help" title="Hilfe" href="../editorial/index.htm">
<link rel="copyright" title="Urheberrecht" href="../editorial/copyright.htm">
<link rel="top" title="SELFHTML" href="../index.htm">
<link rel="up" title="Navigationshilfen" href="index.htm">
<link rel="next" title="Kurzreferenz: HTML" href="html.htm">
<link rel="prev" title="Wie fange ich an?" href="anfang/index.htm">
</head>
<body>
<table cellpadding="4" cellspacing="0" border="0" width="100%">
<tr>
<td colspan="2" class="nav"><a class="an" name="top"><img src="../src/refkap.gif" width="16" height="13" alt="Teil von"></a> <a href="../index.htm">SELFHTML</a> <img src="../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="index.htm">Navigationshilfen</a></td>
</tr>
<tr>
<td class="doc" width="110"><a href="../index.htm"><img src="../src/logo.gif" width="106" height="109" border="0" alt="SELFHTML"></a></td>
<td class="docbot" width="100%"><h1 class="ph1">Hufig gestellte Fragen (FAQ)</h1></td>
</tr>
<tr>
<td class="doctop">
<img src="../src/dokx.gif" width="30" height="20" vspace="6" alt="Informationsseite">
</td>
<td valign="top" nowrap="nowrap">
<p>
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#hinweis">Hinweis</a><br>
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#liste">Liste der Fragen</a><br>
</p>
</td>
</tr><tr><td colspan="2" class="doc"> <a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a> </td></tr>
</table>
<h2><a class="an" name="hinweis">Hinweis</a></h2>
<p>Lesen Sie sich diese Seite in Ruhe und ganz durch, wenn Sie bereits erste Erfahrungen beim Erstellen von Web-Seiten gewonnen haben und in jenes Stadium der Entwicklung eingetreten sind, in dem viele kleine und groe Wnsche im Kopf entstehen. Solche Wnsche sind nmlich ganz normal. Einige dieser Wnsche und die entsprechenden Fragen sind "typisch" und werden immer wieder gestellt. Solche Fragen werden auf dieser Seite gesammelt. Die Sammlung erhebt keinerlei Anspruch auf Vollstndigkeit. Es werden nicht alle erdenklichen Fragen gesammelt (dann wre diese Seite wohl die umfangreichste der Welt), sondern nur wirklich hufig gestellte. Ob Ihre Fragen dabei sind, ist natrlich ein Glcksspiel.</p>
<p>Die Fragen werden mit kurzen Hinweisen, gegebenenfalls mit Beispielen und so weit wie mglich mit Verweisen auf Stellen innerhalb der vorliegenden Dokumentation beantwortet. Insofern eignet sich diese Seite zur Navigation, nmlich als "problemorientierte" Navigation.</p>
<p>Wenn Sie Fragen haben, die hier nicht aufgelistet sind, dann lesen Sie mal den Abschnitt ber <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/support.htm">Support</a>. Dort erfahren Sie, wo und wie Sie Ihre Fragen im Internet stellen knnen.</p>
<p>Die Fragen sind bewusst nicht nach Sprachen und Technologien sortiert, sondern nach "Problemzonen". Denn nicht wenige der Antworten verweisen auf mehrere Technologien. Einige Fragen beantworten sich auch einfach dadurch, dass man einfach nicht wusste, dass zur Lsung eine andere Technologie erforderlich ist als die, von der man sich zunchst die Lsung erwartete.</p>
<p>Einige der "Wnsche" sind aus Anfngersicht vielleicht verstndlich, doch in der Web-Praxis durchaus <strong>unerwnscht</strong>, weil Sie die Besucher Ihrer Seiten dadurch aller Wahrscheinlichkeit nach nur verrgern. Da es kaum Ihr Ziel sein kann, Ihre Besucher zu verrgern (die kommen nmlich nie wieder), werden Sie an den entsprechenden Stellen darauf hingewiesen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="liste">Liste der Fragen</a></h2>
<table class="reftable" cellpadding="3" cellspacing="0" border="1" width="100%">
<tr><th>Allgemeines</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#favoriten_icon">Wie bekomme ich ein kleines Bild in die Adresszeile und in die Favoriten bzw. Lesezeichen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#quelltext_schuetzen">Wie kann ich meinen (Code) Quelltext verstecken / schtzen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#rechte_maustaste">Wie kann ich die rechte Maustaste sperren, damit niemand meine Grafiken klauen kann?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#passwortschutz">Wie kann ich einen Passwortschutz fr Seiten programmieren?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#user_mail">Kann ich die E-Mail-Adresse eines Seitenbesuchers irgendwie auslesen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#chat">Wie kann ich einen Chat auf meiner Homepage anbieten?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#gaestebuch_forum">Wie kann ich ein Gstebuch oder ein Forum auf meiner Homepage anbieten?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#automatisch_ablaufende_praesentation">Wie kann ich eine automatisch ablaufende Prsentation aus mehreren Seiten erstellen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#automatische_weiterleitung">Wie kann ich Besucher automatisch zu einer anderen Seite weiterleiten?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#daten_einbinden">Wie kann ich Textdaten aus einer externen Datei dynamisch einbinden?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#vollbildmodus">Wie kann ich erreichen, dass meine Seite im Vollbildmodus angezeigt wird?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#bildschirmaufloesung">Fr welche Bildschirmauflsung/Fenstergre sollte ich meine Web-Seiten schreiben?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#werbebanner">Wie kann ich die automatischen Werbe-Banner von kostenlosen Homepage-Anbietern unterdrcken?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#referenzen_funktionieren_nicht">Warum funktionieren meine Verweise und Grafikreferenzen nach dem Hochladen auf den Server nicht mehr?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#nur_startadresse_anzeigen">Wie kann ich erreichen, dass in der Adresszeile des Browsers die Startadresse meiner Seiten stehen bleibt?</a>
</td></tr>
<tr><th>Verweise/Links</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#rahmen_bei_verweisen">Wie kann ich den gepnktelten Rahmen um aktivierte Verweise im Internet Explorer vermeiden?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#nicht_unterstrichene_verweise">Wie kann ich erreichen, dass Verweise nicht unterstrichen werden?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#verweise_in_neuem_fenster">Wie kann ich ein Verweisziel in einem neuen Fenster ffnen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#hover_bei_netscape">Wie kann ich einen Hover-Effekt auch bei Netscape 4 erreichen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#hover_problem">Warum funktionieren die Hover-Effekte bei Verweisen nicht wie gewnscht?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#zwei_frames">Wie kann ich mit einem Verweis den Inhalt von zwei Frames gleichzeitig ndern?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#button_als_verweis">Wie kann ich einen Formular-Button als anklickbaren Verweis verwenden?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#auswahlliste_als_verweisliste">Wie kann ich eine Auswahlliste so nutzen, dass sie ausfhrbare Verweise enthlt?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#back_verweis">Wie kann ich erreichen, dass ein Verweis die Back-Funktion im Browser bewirkt?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#grafik_als_verweis">Wie kann ich eine Grafik als anklickbaren Verweis verwenden?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#navigationsleisten">Wie funktioniert eine Navigationsleiste mit anklickbaren grafischen Buttons?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#abweichende_verweisfarben">Wie kann ich fr bestimmte Verweise andere als die dateiweiten Verweisfarben definieren?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#statuszeilentext_bei_verweisen">Wie kann ich in der Statuszeile bei Verweisen einen eigenen Text anzeigen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#programm_ausfuehren">Wie kann ich mit einem Verweis ein Programm wie Word, Notepad usw. ausfhren?</a>
</td></tr>
<tr><th>Text und Textformatierung</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#blocksatz">Wie kann ich Blocksatz fr Text erzwingen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#blocksatz_probleme">Wie kann ich Darstellungsprobleme bei Blocksatz lsen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#text_einruecken">Wie kann ich Text einrcken?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#tabulatoren">Wie kann ich Tabulatoren in HTML erzeugen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#fremde_schriftzeichen">Wie kann ich fremde Schriftzeichen einfgen?</a>
</td></tr>
<tr><th>Grafik</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#grafiken_highlighten">Wie erreiche ich, dass Grafiken beim berfahren mit der Maus gehighlighted werden?</a>
</td></tr>
<tr><th>Positionierung von Inhalten / Seitenaufbau</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#mittig_zentrierte_inhalte">Wie kann ich Inhalte genau in der Mitte des Anzeigefensters positionieren?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#mittig_zentriertes_framefenster">Wie kann ich ein einzelnes Frame-Fenster in der Mitte des Anzeigefensters positionieren?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#breiten_bei_tabellen">Wie kann ich verhindern, dass Browser meine Breitenangaben in Tabellen missachten?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#frames_bei_netscape">Warum stellt Netscape 4 Frames nicht in exakter Gre dar?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#kein_seitenrand">Wie kann ich erreichen, dass Inhalte ohne Seitenrand links oben beginnen?</a>
</td></tr>
<tr><th>Anzeigeprobleme</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#darstellung_internet_explorer">Warum weicht die Darstellung im Internet Explorer ab?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#css_geht_nicht_bei_netscape">Warum geht CSS unter Netscape 4 nicht?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#css_falsch">Meine CSS-Angaben funktionieren nicht richtig - woran kann das liegen?</a>
</td></tr>
<tr><th>Fenster</th></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#fenstergroesse">Wie kann ich das Browser-Fenster auf eine bestimmte Gre ndern?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#popup_groesse">Wie kann ich ein Popup-Fenster in bestimmter Gre erzeugen?</a>
</td></tr>
<tr><td class="code">
<img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#fenster_vordergrund">Wie kann ich erreichen, dass ein Fenster immer im Vordergrund bleibt?</a>
</td></tr>
</table><br>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="favoriten_icon">Wie bekomme ich ein kleines Bild in die Adresszeile und in die Favoriten bzw. Lesezeichen?</a></h2>
<p>Dies ist ein kleines Extra-Feature, bekannt unter dem Namen <strong>Favicon</strong>, das mit der Produktversion 5.0 des Internet Explorers eingefhrt und mittlerweile von vielen anderen Browserherstellern bernommen wurde. Angezeigt werden kann ein solches Favicon dann, wenn eine Seite mit einem Favicon verknpft ist - im Internet Explorer jedoch nur dann, wenn ein Anwender die Seite in seine Favoriten mit aufnimmt. Es wird dann im Men der Favoriten dem Eintrag vorangestellt, und beim Anzeigen der Seite(n) erscheint es in der Adresszeile des Browsers.</p>
<p>Das Favicon selbst ist eine kleine Grafik, die im Windows-Icon-Format (Dateien <var>*.ico</var>) vorliegen und eine Gre von entweder 32x32 oder von 16x16 Pixeln haben sollte. Um solche Grafiken zu erstellen, bentigen Sie ein <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/software.htm#grafik">Grafikprogramm</a>, das Grafiken im ICO-Format abspeichern kann.</p>
<p>Die Verknpfung zwischen einer Web-Seite und einer Favicon-Grafik kann auf zwei Weisen hergestellt werden: entweder Sie legen die Grafik im Wurzelverzeichnis einer Domain unter dem festen Dateinamen <var>favicon.ico</var> (kleingeschrieben) ab, sodass der URI im Schema lautet: <var>http://www.example.org/favicon.ico</var>. In diesem Fall wird das Favicon automatisch erkannt, sobald Anwender irgendeine Seite des Web-Angebots unterhalb dieser Domain zu ihren Favoriten hinzufgen. Die andere Mglichkeit besteht darin, im Kopf einer HTML-Datei folgendes zu notieren:</p>
<pre><link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"></pre>
<p>Fr Angaben im Attribut <code>href</code> gelten die Regeln zum <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/allgemein/referenzieren.htm">Referenzieren in HTML</a>, der <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../diverses/mimetypen.htm">Mime-Typ</a> lautet <code>image/x-icon</code> oder (weniger verbreitet) <code>image/vnd.microsoft.icon</code>. Liegt das Favicon im Wurzelverzeichnis, ist es wie oben angefhrt via <code>/favicon.ico</code> zu referenzieren. Der Name der Icon-Datei ist in diesem Fall egal, nur die Dateiendung muss fr den Internet Explorer <var>.ico</var> lauten. Andere Browser akzeptieren auch davon abweichende Grafikformate.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="quelltext_schuetzen">Wie kann ich meinen (Code) Quelltext verstecken / schtzen?</a></h2>
<p>Das ist eine der Fragen, die gar nicht gerne gesehen werden. Und die Antwort vorab: es gibt <strong>keine</strong> wirksame Mglichkeit zu verhindern, dass Besucher Ihrer Web-Seite den Quelltext ansehen knnen.</p>
<p>Der Wunsch ist deshalb verpnt, weil das Web auf offen dokumentierten Klartextsprachen wie HTML, CSS oder XML basiert. Es gibt also nichts, was zu verheimlichen sinnvoll wre, denn jeder, den es interessiert, kann sich das entsprechende Wissen im Netz aus <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/dokus.htm">Dokumenten und Dokumentationen</a> besorgen.</p>
<p>Ferner lst der Wunsch entnervte Reaktionen aus, weil er von Unkenntnis zeugt. Sie mssen nmlich bedenken, dass Ihre im Internet zur Verfgung gestellten Web-Seiten beim Aufrufen an den Rechner des Anwenders bertragen werden. Die Daten landen dort nicht nur im Anzeigefenster des Browsers, sondern der Browser speichert die Daten auch auf der Festplatte des Anwenders in seinem Cache-Speicher ab. Jeder Anwender kann mit etwas Kenntnis oder mit Hilfe spezieller "Cache-Explorer"-Programme die Daten durchforsten, die auf seiner Festplatte gelandet sind, und den darin gespeicherten Quelltext ansehen, kopieren usw.</p>
<p>Verstndlich ist der Wunsch, dass Sie nicht von anderen Anwendern "beklaut" werden wollen, indem diese sich einfach Ihre mhsam erstellten <img src="../src/down.gif" width="14" height="10" alt="nach unten"> <a href="#rechte_maustaste">Grafiken</a> oder JavaScripts und dergleichen kopieren und von Ihrer Arbeit profitieren, ohne dass Sie etwas davon haben. Das Kopieren werden Sie wie gesagt kaum verhindern knnen. Aber Ihr geistiges Eigentum ist Ihr gutes Recht. Zwar sind Ihre Web-Seiten ohnehin durch das geltende Urheberrecht geschtzt, doch um der Sache Nachdruck zu verleihen und bei potentiellen Dieben eine hhere Hemmschwelle zu erzeugen, knnen Sie Hinweise in den Quelltext einfgen. Notieren Sie beispielsweise einen <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/allgemein/kommentare.htm#nicht_angezeigt">HTML-Kommentar</a> weit oben in der Datei, z.B. direkt nach dem einleitenden <code><html></code>-Tag, und weisen Sie im Kommentartext darauf hin, was Sie nicht wnschen.</p>
<p>JavaScript-Quelltext knnen Sie z.B. in eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/intro.htm#javascriptdateien">externe JavaScript-Datei</a> auslagern. So kommen zumindest unerfahrene Anwender nicht ganz so leicht an den Quelltext.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="rechte_maustaste">Wie kann ich die rechte Maustaste sperren, damit niemand meine Grafiken klauen kann?</a></h2>
<p>Dies geht in die gleiche Richtung wie die Frage nach dem Schtzen von Quelltext. Wenn der Anwender eine Grafik im Web-Browser sieht, braucht er sie gar nicht mehr mit dem Kontextmen und "Speichern unter" auf seinen Rechner zu kopieren, weil sie lngst dort gespeichert ist - nmlich im Browser-Cache. Die "Speichern-Unter"-Option im Kontextmen ist fr unbedarfte Anwender gedacht, die eine Grafik vielleicht noch mal in Ruhe offline betrachten mchten. Erfahrene Seitenbastler, die wirklich die Absicht haben, eine fremde Grafik fr eigene Seiten zu verwenden, bentigen diese Option im Kontextmen nicht. Machen Sie sich also nicht die Mhe. Auch in diesem Fall gilt: das Kopieren und Klauen knnen Sie nicht technisch verhindern, aber juristisch haben Sie ein Recht darauf, fr Ihre selbst erstellten Grafiken den geistigen Urheberschutz in Anspruch zu nehmen. Ganz einfach ist es allerdings nicht, diesen juristischen Anspruch durchzusetzen. Denn es knnte ja Aussage gegen Aussage stehen, wenn der Gegner behauptet, es sei umgekehrt und Sie htten von ihm geklaut. Deshalb gibt es die Mglichkeit, so genannte <strong>Wasserzeichen</strong> in Grafiken einzubauen. Dabei wird nach einem bestimmten Schlssel ein Text in dem binren Bit-Salat einer Grafikdatei versteckt, z.B. ein Text, der Sie als Urheber der Grafik ausweist (das Verfahren wird als <strong>Steganografie</strong> bezeichnet). In der Grafik selbst sieht man nichts davon, doch im Zweifelsfall knnen Sie anhand des Wasserzeichens nachweisen, dass Sie der geistige Urheber der Grafik sind. Wasserzeichen knnen jedoch bei Grafikformaten, die mit Verlust komprimieren, wie etwa das im Web vielfach eingesetzte <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../grafik/formate.htm#jpeg">JPEG-Format</a>, teilweise verloren gehen bzw. unleserlich werden. Um sich nher ber die Technik der Wasserzeichen zu informieren, suchen Sie mal in einer der bekannten groen Suchmaschinen nach <var>Wasserzeichen</var> oder <var>Steganografie</var>.</p>
<p>Wenn Sie das alles nicht befriedigt und Sie doch lieber die rechte Maustaste sperren wollen, dann knnen Sie <img src="../src/dokf.gif" width="15" height="10" alt="Beispiel-Seite"> <a href="anzeige/rechte_maustaste.htm">dieses Script</a> verwenden. Um die Funktionsweise des Scripts zu verstehen, mssen Sie sich mit <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../javascript/index.htm">JavaScript</a> befassen, speziell mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/event.htm#allgemeines">Ereignisberwachung</a>. Seien Sie sich aber im Klaren darber, dass Sie den Anwender damit einschrnken und sich eine solche Manupulation in modernen Browsern verhindern lsst. Denn das Kontextmen der rechten Maustaste enthlt schlielich noch andere wichtige Befehle, beispielsweise den zum ffnen eines Verweises in einem neuen Fenster. Kein Anwender mchte in seinem Bewegungsspielraum eingeschrnkt werden, Sie doch auch nicht, oder? Und schon gar nicht auf einer Web-Seite, die man freiwillig aufgerufen hat und die man jederzeit auf Nimmerwiedersehen verlassen kann. </p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="passwortschutz">Wie kann ich einen Passwortschutz fr Seiten programmieren?</a></h2>
<p>Es gibt verschiedene Mglichkeiten, Web-Seiten nur bestimmten, autorisierten Anwendern zugnglich zu machen. Die Lsungen sind unterschiedlich gut und sicher.</p>
<p>Die im Web blichste und gegen normale Anwender ausreichende Methode, Web-Seiten zu schtzen, ist diejenige, die auf HTTP-Ebene funktioniert. Der Mechanismus dazu ist im NCSA-Servermodell festgelegt und wird als <strong>HTTP Authentication</strong> bezeichnet (wobei diese Technik unter dem Namen <strong>htaccess</strong> bekannter ist). Viele Web-Server untersttzen diesen Mechanismus, z.B. der verbreitete Apache-Server. Beim ersten Zugriff auf eine Datei, die in einem geschtzten Verzeichnis liegt, ffnet der Browser ein Dialogfenster, in dem der Anwender User-ID und Passwort eingeben muss. Nur wenn beide Angaben korrekt sind, kann er auf die Daten in dem Verzeichnis und auf Unterverzeichnisse zugreifen. Wie das funktioniert, wird im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../servercgi/server/htaccess.htm#verzeichnisschutz">Verzeichnisse und Dateien mit Passwort schtzen</a> beschrieben.</p>
<p>Ein weiterer, nicht selten gewhlter Weg ist es, alle Anwender erst mal mit einem <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../html/formulare/index.htm">Formular</a> zu beglcken, in dem sie ein <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/formulare/eingabe.htm#felder_passwort">Passwort eingeben</a> mssen. Beim <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/formulare/formularbuttons.htm">Absenden des Formulars</a> wird dann ein CGI-Script <img src="../src/dok.gif" width="15" height="10" alt="Kapitel"> <a href="../servercgi/cgi/cgihtml.htm#cgi_aufrufe">aufgerufen</a>, das Passwrter verwaltet und nachprfen kann, ob das eingegebene Passwort registriert ist. Das ist zwar auch noch vergleichsweise sicher, aber nicht ganz so wirksam wie der htaccess-Schutz, weil jemand, der erst mal die "geheimen" Adressen kennt, diese jederzeit direkt aufrufen (und beispielsweise Links darauf setzen) kann. Das CGI-Script bekommt davon gar nichts mit. Es gibt Freeware-Scripts im Netz, meist in Perl geschrieben, die so einen Passwortschutz realisieren. Im Online-Angebot von SELFHTML aktuell finden Sie Links zu entsprechenden Quellen im Web:</p>
<p><img src="../src/serverkap.gif" width="15" height="13" alt="Online-Kapitel"> <a target="_top" href="http://aktuell.de.selfhtml.org/links/cgiperl.htm">Link-Verzeichnis: CGI/Perl</a><br>
<img src="../src/serverkap.gif" width="15" height="13" alt="Online-Kapitel"> <a target="_top" href="http://aktuell.de.selfhtml.org/links/php.htm">Link-Verzeichnis: PHP</a><br>
<img src="../src/serverkap.gif" width="15" height="13" alt="Online-Kapitel"> <a target="_top" href="http://aktuell.de.selfhtml.org/links/asp.htm">Link-Verzeichnis: ASP</a></p>
<p>Suchen Sie in den Script-Sammlungen nach dem Stichwort <var>Passwort</var> bzw. bei englischsprachigen Sammlungen nach <var>password</var>.</p>
<p>Der dritte Weg zum Seitenschutz ist JavaScript. Auch dabei wird eine Seite mit einem Formular und Eingabemglichkeit eines Passwortes vorgeschaltet. JavaScript berprft die Eingabe und weist den Besucher dann entweder ab oder leitet ihn auf die geheimen Seiten. Eine beliebte Methode dabei ist es, einfach den Namen der "geheimen" Datei als Passwort zu verlangen und nach Eingabe des Passworts mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/location.htm#href">location.href</a> zu der eingegebenen Datei zu springen. Das ist allerdings ein reiner Placebo-Effekt. Es gibt auch JavaScripts, die mit einem richtigen Verschlsselungs-Algorithmus arbeiten, der nicht ohne weiteres durchschaubar ist. <img src="../src/dokf.gif" width="15" height="10" alt="Beispiel-Seite"> <a href="anzeige/passwortschutz.htm">Dieses Script</a> ist ein Beispiel dafr. Verwenden Sie die Beispieldatei zunchst dazu, um Passwrter Ihrer Wahl einzugeben. Das Script leitet Sie dann auf (noch nicht) existierende Dateinamen weiter, die nach seinem Algorithmus auf das eingegebene Passwort passen. Wenn Sie dann Seiten mit dem entsprechenden Dateinamen erstellen, findet das Script die entsprechende Seite, wenn das Passwort korrekt eingegeben wird. Auch in diesem Fall sind also Dateinamen und Passwort aneinander gekoppelt. Solche Verfahren erlauben keine benutzerspezifischen Passwrter. Das ist mit JavaScript auch gar nicht mglich, da JavaScript im Browser des Anwenders abluft. Eine zentrale Benutzerverwaltung ist aber nur server-seitig mglich.</p>
<p>JavaScript-Lsungen sind also vergleichsweise primitiv und eher eine Notlsung fr Anbieter, die ihre Homepages bei Billiganbietern haben, wo kein htaccess und nicht mal CGI zur Verfgung steht. Auch bei den JavaScript-Lsungen gilt: wer die geheimen Dateinamen erst mal kennt, kommt auch auf direktem Wege dorthin.</p>
<p>Eine ganz schlichte Lsung fr Leute, die sich keine Probleme machen wollen, wo keine sind, gibt es aber auch: stellen Sie Seiten <strong>unverlinkt</strong> ins Netz und teilen Sie nur solchen Personen die Adresse mit, die diese Seiten sehen knnen sollen. Notieren Sie den Pfad nicht in einer <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../diverses/robots.htm">robots.txt</a>-Datei, da diese fr jedermann sichtbar ist. Verbieten Sie Suchmaschinen besser mittels <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/kopfdaten/meta.htm#robots">meta</a>-Element die Aufnahme in den Index. Allerdings bietet auch diese Methode keinen echten Schutz, da sich Besucher, denen die Adresse bekannt ist nicht authentifizieren mssen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="user_mail">Kann ich die E-Mail-Adresse eines Seitenbesuchers irgendwie auslesen?</a></h2>
<p>Nein, weder mit JavaScript noch mit CGI/Perl oder vergleichbaren Technologien. Jeder moderne Web-Browser verhindert das. Denn wenn so etwas mglich wre, knnte beispielsweise jedes hufig aufgerufene CGI-Script (Counter, Suchmaschine usw.) nebenbei eine E-Mail-Adressensammlung pflegen. Und E-Mail-Adressen als Massenware lassen sich an <strong>Spammer</strong> verkaufen, also an jenes Pack von Mensch, das Tag fr Tag millionenfach sinnlosen Werbemll durchs Netz an E-Mail-Adressen schickt und damit das Netz verstopft.</p>
<p>Was Sie ermitteln knnen, sind die <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/internet/standards.htm#tcpip">IP-Adressen der Host-Rechner</a> Ihrer Seitenbesucher. Ein aufgerufenes CGI-Script kann beispielsweise mit den <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../servercgi/cgi/umgebungsvariablen.htm">CGI-Umgebungsvariablen</a> <code>REMOTE_ADDR</code> und <code>REMOTE_HOST</code> entsprechende Daten ermitteln. ber einen <img src="../src/en.gif" width="16" height="10" alt="englischsprachige Seite"> <a target="_top" href="http://www.ripe.net/perl/whois">Whois-Service</a> lsst sich dann der Zugangsprovider der entsprechenden Person ermitteln und kontaktieren, z.B. bei begrndbarem Verdacht auf einen kriminellen Anwender.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="chat">Wie kann ich einen Chat auf meiner Homepage anbieten?</a></h2>
<p>Dabei gibt es zwei verbreitete Mglichkeiten: mit Hilfe eines in <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/multimedia/objekte.htm#java_applets">HTML eingebundenen Java-Applets</a>, oder in Form eines CGI-basierten Chats.</p>
<p>Bei Java-Applets, die einen Chat realisieren, muss man nochmals unterscheiden zwischen solchen, die ein eigenes, proprietres Internet-Protokoll zur Datenbertragung verwenden, und solchen, die einfach einen java-basierten <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/internet/dienste.htm#irc">IRC</a>-Client darstellen. Java-Anwendungen, die ein proprietres Protokoll verwenden, bestehen aus zwei Teilen: aus dem Java-Applet, das in HTML eingebunden wird (Client), und aus einem Java-Programm, dass einen zugehrigen Server darstellt. Auf <img src="../src/de.gif" width="16" height="10" alt="deutschsprachige Seite"> <a target="_top" href="http://java.seite.net/chat/">http://java.seite.net/chat/</a> finden Sie eine Beschreibung, wie man eine solche Client-Server-Anwendung in Java selber realisieren kann. Wenn Sie sich nicht in der Lage fhlen, so etwas selber zu programmieren, dann knnen Sie auch auf vorhandene <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/services.htm">Web-Services</a> zurckgreifen. Der bekannteste Anbieter fr java-basierten Chat mit eigenem System ist <img src="../src/de.gif" width="16" height="10" alt="deutschsprachige Seite"> <a target="_top" href="http://www.spinchat.de/">SpinChat</a>. Dort knnen Sie sich auch den HTML-Quelltext zum Einbau eines eigenen Chats holen. Der Chat gehrt dann zum Verbundsystem des Anbieters Spin.</p>
<p>Java-Applets, die einen echten IRC-Client darstellen, erlauben dagegen die Teilnahme am weltweiten IRC-Netz. Zigtausende von Chatrumen auf vielen verschiedenen IRC-Servern sind damit erreichbar. Suchen Sie in einer groen Suchmaschine nach <var>java applet irc client</var>, um solche Java-Applets fr die eigene Homepage ausfindig zu machen.</p>
<p>CGI-basierte Chats nutzen die Kommunikation zwischen Browser und Server ber das HTTP-Protokoll. Das HTTP-Protokoll hat allerdings Eigenschaften, die es nicht unbedingt fr Chat-Anwendungen qualifizieren. Im Gegensatz zum IRC-Protokoll halten Client und Server nicht stndig Verbindung. Eine Kommunikation findet nur statt, wenn z.B der Browser vom Server Daten anfordert. Die meisten CGI-basierten Chats bauen daher in den HTML-Code, der an den Browser gesendet wird, die <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/kopfdaten/meta.htm#weiterleitung">Meta-Angabe zum Automatischen Weiterleiten</a> ein, um das verarbeitende CGI-Script nach ein paar Sekunden erneut aufzurufen, das dann wieder den aktuellen "Zustand" des Chat-Raums an den Browser sendet, inklusive der eingebauten Meta-Angabe fr den nchsten Aufruf. Ein Echtzeit-Chat wie bei IRC ist damit aber nicht mglich. Ein Vorteil der CGI-basierten Chats ist dagegen jedoch, dass beim Anwender keine zustzlichen Voraussetzungen wie aktiviertes Java erforderlich sind. Im Online-Angebot von SELFHTML aktuell finden Sie Links zu CGI-Script-Sammlungen im Web, wo Sie unter anderem auch CGI-basierte Chats finden:</p>
<p><img src="../src/serverkap.gif" width="15" height="13" alt="Online-Kapitel">
<a target="_top" href="http://aktuell.de.selfhtml.org/links/cgiperl.htm">Link-Verzeichnis: CGI/Perl</a></p>
<p>Suchen Sie in den Script-Sammlungen nach dem Stichwort <var>Chat</var>.</p>
<p>Zum Betrieb eines CGI/Perl-basierten Chats bentigen Sie eine CGI-Schnittstelle und den Perl-Interpreter. Fragen Sie gegebenenfalls den Provider, wo Sie Ihre Web-Seiten hosten, danach!</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="gaestebuch_forum">Wie kann ich ein Gstebuch oder ein Forum auf meiner Homepage anbieten?</a></h2>
<p>Gstebcher und Foren sind typische Anwendungen, die mit Hilfe von <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../servercgi/cgi/cgihtml.htm">CGI/Perl</a> oder <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/technologien/php.htm">PHP</a> realisiert werden.</p>
<p>Die reizvollste, aber auch schwierigste Variante ist, sich eine eigene Lsung von Grund auf zu programmieren. Dazu sind jedoch gute bis sehr gute Kenntnisse in Programmiersprachen wie Perl oder PHP erforderlich.</p>
<p>Die zweite Mglichkeit, eine etwas mildere Variante der ersten, ist die, ein vorhandenes Script einzusetzen und anzupassen. Es gibt viele frei verfgbare Scripts, die Sie sich downloaden und fr Ihre Zwecke anpassen knnen. Auch dazu sind jedoch zumindest Grundkenntnisse in den verwendeten Programmiersprachen erforderlich. Im Online-Angebot von SELFHTML aktuell finden Sie Links zu CGI-Script-Sammlungen im Web, wo Sie unter anderem auch CGI-basierte Chats finden:</p>
<p><img src="../src/serverkap.gif" width="15" height="13" alt="Online-Kapitel">
<a target="_top" href="http://aktuell.de.selfhtml.org/links/cgiperl.htm">Link-Verzeichnis: CGI/Perl</a></p>
<p>Suchen Sie in den Script-Sammlungen nach den Stichwrtern <var>Gstebuch</var> (bei englischsprachigen Sammlungen <var>guestbook</var>) bzw. <var>Forum</var> oder <var>message board</var>.</p>
<p>Zum Betrieb von CGI/Perl-basierten Gstebchern oder Foren bentigen Sie eine CGI-Schnittstelle und den Perl-Interpreter, bei PHP ein auf dem Server installiertes PHP. Fragen Sie gegebenenfalls den Provider, wo Sie Ihre Web-Seiten hosten, danach!</p>
<p>Als dritte Mglichkeit kommen <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/services.htm#cgi">CGI-Services fr eigene dynamische Web-Seiten</a> in Frage. Dabei knnen Sie kostenlos oder gegen geringe Gebhr ein Forum oder Gstebuch von einem Fremdanbieter in Anspruch nehmen. Meistens besteht dabei die Mglichkeit, die Optik der Gstebcher oder Foren an das Layout der eigenen Web-Seiten zumindest grob anzupassen. Die Daten werden auf dem Server des Fremdanbieters gespeichert. Sie selber haben also keinen direkten Zugriff darauf. In der Regel bieten solche Anbieter jedoch einen Service-Bereich an, wo Sie mit Hilfe von Formularen Ihre Daten auf dem fremden Server verwalten knnen, um z.B. unliebsame Eintrge zu lschen usw.</p>
<p>Diese Lsung bietet sich fr Homepage-Anbieter an, denen keine CGI-Schnittstelle zur Verfgung steht.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="automatisch_ablaufende_praesentation">Wie kann ich eine automatisch ablaufende Prsentation aus mehreren Seiten erstellen?</a></h2>
<p>Vorneweg: im Web wird vom Anwender alles, was er nicht selber unter Kontrolle hat, als negativ empfunden. Dort sollten Sie deshalb besser auf solche Dinge verzichten und stattdessen eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hypertext/begriffe.htm#guided_tours">Guided Tour</a> anbieten, bei der jede Seite, die zu der Tour gehrt, am Ende einen <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../html/verweise/index.htm">Verweis</a> zur nchsten Seite der Tour sowie einen Verweis zur Startseite enthlt. Interessant sind automatisch ablaufende Prsentationen dagegen etwa auf Messen. Dabei knnen Sie auch Endlosschleifen erzeugen, indem einfach die letzte Seite der Prsentation wieder die erste aufruft.</p>
<p>Zum Erstellen einer solchen Prsentation bentigen Sie verschiedene HTML-Dateien, von denen jede einen Mechanismus enthlt, mit dessen Hilfe eine bestimmte andere Seite nach Ablauf einer bestimmten Zeit, z.B. nach 5 Sekunden, automatisch aufgerufen wird. Zwei Mglichkeiten stehen dabei zur Verfgung: bei der einen verwenden Sie die <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/kopfdaten/meta.htm#weiterleitung">Meta-Angabe zum Automatischen Weiterleiten</a>. Diese Angabe wird von den verbreiteten Browser auch lokal, also ohne Server-Kommunikation, interpretiert. Die zweite Mglichkeit verwendet JavaScript. Mit der JavaScript-Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#set_timeout">setTimeout()</a> in Verbindung mit dem Event-Handler <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/sprache/eventhandler.htm#onload">onload</a> im einleitenden <code><body></code>-Tag knnen Sie nach Ablauf von z.B. 5000 Millisekunden (= 5 Sekunden) eine selbstgeschriebene <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/sprache/funktionen.htm">Funktion</a> aufrufen, die z.B. in einem JavaScript-Bereich im Dateikopf notiert sein kann. Es gengt, wenn diese Funktion eine einzige Anweisung enthlt, nmlich den Aufruf einer anderen Adresse mit der Objekteigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/location.htm#href">location.href</a>.</p>
<p>Jede an der Prsentation beteiligte HTML-Datei muss die Meta-Angabe oder den entsprechenden JavaScript-Code enthalten. Auf diese Weise wird die Kette der automatischen Aufrufe erzeugt.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="automatische_weiterleitung">Wie kann ich Besucher automatisch zu einer anderen Seite weiterleiten?</a></h2>
<p>Dabei bestehen die gleichen Mglichkeiten wie im Zusammenhang mit der <img src="../src/up.gif" width="14" height="10" alt="nach oben"> <a href="#automatisch_ablaufende_praesentation">automatisch ablaufenden Prsentation</a> beschrieben. Der einzige Unterschied ist, dass Sie die Angaben nur auf einer Seite notieren mssen und nicht auf mehreren. Bieten Sie aber auf der Weiterleitungsseite auf jeden Fall auch einen Verweis zu der Zieladresse an, damit auch solche Anwender dorthin finden, bei denen die Meta-Angabe oder das JavaScript zur Weiterleitung nicht funktioniert.</p>
<p>Fr die automatische Weiterleitung gibt es daneben allerdings server-seitige Lsungen, die letztlich sauberer sind. Denn erstens erfordern sie keine Browser-Fhigkeiten wie das Interpretieren einer Meta-Angabe oder eines Java-Scripts; und zweitens muss erst gar nicht die Weiterleitungsseite angezeigt werden. Am Bildschirm des Anwenders erscheint ohne Umweg die Zieladresse.</p>
<p>So lassen sich Weiterleitungen innerhalb eines Web-Angebots und auf dem gleichen Server-Rechner beispielsweise durch symbolische Links erreichen. Anstelle der "alten Datei" wird ein gleichnamiger symbolischer Link platziert, der auf Betriebssystemebene zu einer anderen Datei fhrt. Dazu mssen Sie allerdings auf Betriebssystemebene am Server arbeiten knnen, beispielsweise mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/internet/dienste.htm#telnet_ssh">Telnet/SSH</a>.</p>
<p>Server-seitige Redirects auf andere Domain-Adressen knnen Sie mit Hilfe einer <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../servercgi/server/htaccess.htm">.htaccess-Datei</a> realisieren. Legen Sie im Web-Seiten-Wurzelverzeichnis der alten Domain eine solche Datei ab, die eine Zeile wie diese enthlt (Beispiel):</p>
<pre>Redirect / http://www.example.org/</pre>
<p>Handelt es sich um eine permanente Umleitung, lautet die Direktive wie folgt:</p>
<pre>Redirect permanent / http://www.example.org/</pre>
<p>In den oben angefhrten Beispielen werden Anfragen fr die aktuelle Domain umgeleitet auf <code>http://www.example.org/</code>
Wenn Sie sich an solche Dinge nicht herantrauen oder die Lsung mit <var>.htaccess</var> bei Ihnen nicht funktioniert, fragen Sie den Provider der alten Adresse. Er kann eine server-seitige Weiterleitung fr Sie einrichten.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="daten_einbinden">Wie kann ich Textdaten aus einer externen Datei dynamisch einbinden?</a></h2>
<p>Dazu gibt es verschiedene Mglichkeiten, zum Beispiel <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/frames/eingebettete.htm">Eingebettete Frames</a>. Einbinden knnen Sie damit neben anderen HTML-Dateien z.B. auch reine Textdateien <var>*.txt</var>, Grafiken oder dynamische Quellen wie den Aufruf eines CGI-Scripts, das aktuelle Daten ausgibt.</p>
<p>Durch die Angabe <code>frameborder="no"</code> im einleitenden <code><iframe></code>-Tag knnen Sie erreichen, dass das Frame-Fenster nahtlos in die Seite eingebettet wird. Mit <code>scrolling="no"</code> knnen Sie zustzlich auch noch die Scrollbalken unterdrcken, sofern Sie diese nicht bentigen. Nachteil der eingebetteten Frames ist, dass Netscape 4.x diese noch nicht kennt.</p>
<p>Alternativ knnen Sie <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/multimedia/objekte.htm#datendateien">Datendateien als Objekt einbinden</a>. Mit <code>data="datei.htm"</code> oder <code>data="datei.txt"</code> lassen sich auch Textdaten als Objekt einbinden. Im Attribut <code>type</code> ist dann <code>text/html</code> bzw. <code>text/plain</code> anzugeben. Im Grunde genommen ist der Effekt ganz hnlich wie eingebetteten Frames.</p>
<p>Eine weitere Mglichkeit ist die <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../dhtml/modelle/datenanbindung.htm">Datenanbindung (Microsoft)</a>. Damit lassen sich Daten kontrolliert einbinden, z.B. datensatzweise aus einer kommabegrenzten Datei. Dies funktioniert allerdings nur im Internet Explorer.</p>
<p>Mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../servercgi/server/ssi.htm">Server Side Includes</a> lassen sich externe Daten server-seitig einbinden. Das hat den Vorteil, dass es mit jedem Browser funktioniert, da die Daten schon eingefgt werden, bevor das Ganze berhaupt beim Browser ankommt. Es funktioniert jedoch nur in HTTP-Umgebung und nur dann, wenn der Web-Server die Technik der Server Side Includes untersttzt.</p>
<p>Mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/technologien/php.htm">PHP</a> lassen sich externe Daten sehr einfach einbinden, da PHP ja innerhalb von HTML notiert wird. hnlich wie Server Side Includes funktioniert auch PHP mit jedem Browser, da die Daten bereits server-seitig eingefgt werden. Es funktioniert jedoch ebenfalls nur in HTTP-Umgebung und nur dann, wenn PHP installiert ist und vom Web-Server untersttzt wird. Mit einer PHP-Anweisung wie <code>require ('datei.txt');</code> knnen Sie eine externe Textdatei einbinden.</p>
<p>Per <strong>JavaScript</strong> kann man eigentlich keine Dateien lesen. ber die <strong>Java</strong>-Schnittstelle von JavaScript ist dies ber Umwege allerdings doch mglich. Auch so knnen natrlich keine Dateien vom Rechner des Anwenders gelesen werden, aber zumindest Dateien, die zum Web-Projekt gehren, und darum geht es ja in diesem Fall. Zu diesem Thema gibt es im Online-Angebot von SELFHTML aktuell einen Artikel <img src="../src/serverdok.gif" width="15" height="10" alt="Online-Seite"> <a target="_top" href="http://aktuell.de.selfhtml.org/artikel/javascript/file-open">Auf Dateien mit JavaScript zugreifen</a> von Daniel Thoma.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="vollbildmodus">Wie kann ich erreichen, dass meine Seite im Vollbildmodus angezeigt wird?</a></h2>
<p>Es ist nicht mglich, dass eine Seite eigenstndig in den Vollbildmodus wechselt. Bei den gngigen Browsern kann allerdings der Anwender selbststndig in den Vollbild-Modus wechseln, indem er die Taste <kbd>F11</kbd> drckt. Die beste Methode ist letztlich, den Anwender freundlich dazu zu bitten.</p>
<p>Lediglich der Internet Explorer ab Version 5.0 bietet eine Mglichkeit, ein neues Fenster im Vollbildmodus zu ffnen. Dazu ffnen Sie mit der JavaScript-Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#open">window.open()</a> ein neues Fenster. Um den Popup-Blocker zu umgehen, sollte dies nicht automatisch geschehen, sondern z.B. bei einem Klick auf einen Button. Bei den Fenstereigenschaften geben Sie <code>fullscreen=yes</code> an. Dann wird das Fenster im Vollbildmodus geffnet.</p>
<p>Was unter dem Vollbildmodus zu verstehen ist, variiert je nach Internet-Explorer-Version. Vor dem Internet Explorer 6 fr Windows XP mit dem Service Pack 2 nimmt die Webseite den gesamten Bildschirm ein, ohne dass irgendwelche Fenster-Bedienelemente wie das Men und die Symbolleisten zu sehen sind. Der Browser bietet dann keine Mglichkeit mehr an, das Fenster zu schlieen. Nur die Tastenkombination <kbd>Alt + F4</kbd> funktioniert noch. Bieten Sie daher auf Seiten, die in einem Vollbild-Fenster angezeigt werden, eine Mglichkeit an, das Fenster zu schlieen. Das geht beispielsweise so:</p>
<pre>
<a href="oeffnende_seite.htm" onclick="self.close(); return false;">Fenster schlieen</a>
</pre>
<p>Seit dem besagten Service Pack wird das neue Fenster aus Sicherheitsgrnden lediglich maximiert. Die Titel- und die Adressleiste und auch die Statusleiste bleiben sichtbar. Dies wird auch fr den kommenden Internet Explorer 7 gelten und ist nicht umgehbar.</p>
<p>Beachten Sie, dass es die meisten Anwender als unangenehm empfinden, wenn eine Web-Seite sich unaufgefordert im Vollbildmodus ffnet.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="bildschirmaufloesung">Fr welche Bildschirmauflsung/Fenstergre sollte ich meine Web-Seiten schreiben?</a></h2>
<p>Die Antwort sollte sich von selbst verstehen: fr jede Fenstergre! Wenn Sie ganz normalen Flietext mit HTML erstellen und diesen gerne auch mit Stylesheets formatieren, schreiben Sie zunchst einmal fr jede beliebige Fenstergre. Denn der Browser bricht den Text entsprechend der Fenstergre automatisch um. Die Probleme entstehen erst dann, wenn von vorneherein mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/layouts.htm">Tabellenlayouts</a> oder <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../html/frames/index.htm">Frames</a> gearbeitet wird und dabei feste Breiten mit Pixelangaben erzwungen werden.</p>
<p>Bedenken Sie, dass Bildschirmauflsung und Gre des Browser-Fensters nicht unbedingt viel miteinander zu tun haben. Denn Anwender mit groen Bildschirmauflsungen wie 1600 1200 fahren kaum eine Anwendung im Vollbildmodus, auch den Browser nicht. Das heit, das Browser-Fenster hat dort meistens eine sehr zufllige und berhaupt nicht berechenbare Gre. Bei Anwendern mit kleineren Bildschirmauflsungen wie 800 600 oder auch 1024 768 ist zwar eher damit zu rechnen, dass der Browser im Vollbildmodus gefahren wird. Doch haben viele Anwender Programme offen, die an Randbezirken der Bildschirmflche fest positioniert sind, wie z.B. der beliebte Instant Messenger ICQ, oder es wird im Browser links z.B. ein Navigationsfenster mit Bookmarks angezeigt.</p>
<p>So gesehen hat es also berhaupt keinen Sinn, das Seiten-Layout von einer bestimmten Bildschirmauflsung abhngig zu machen. Die ganze Frage ist falsch gestellt. Bemhen Sie sich einfach um ein Layout, das sich besonders in der Breite den Gegebenheiten anpasst. Bei Tabellenlayouts ist dies beispielsweise mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/gestaltung.htm#breiten_hoehen">Breitenangaben</a> in Prozent statt in Pixeln mglich. Wenn Sie feste Breiten erzwingen wollen, dann mglichst nur fr die erste, linke Tabellen- oder Frame-Spalte. Ein paar hundert Pixel Breite drfen Sie schon erwarten, denn irgendwo ist natrlich auch eine Untergrenze der Praktikabilitt. Wenn Sie also links eine gewisse Breite erzwingen und den Rest der gegebenen Breite berlassen, dann ist dagegen nichts einzuwenden. Fr links angesiedelte Navigationsleisten sollten allerdings umgerechnet nicht viel mehr als 200 bis 250 Pixel erzwungene Breite spendiert werden, ansonsten knnte der eigentliche Inhalt bei wenig Anzeigebreite bereits zu sehr in eine enge Restspalte gequetscht werden. Bei drei- und mehrspaltigen Layouts sollte auf jeden Fall eine Spalte keine feste Breite haben, sondern flexibel bleiben.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="werbebanner">Wie kann ich die automatischen Werbe-Banner von kostenlosen Homepage-Anbietern unterdrcken?</a></h2>
<p>Mit dieser Frage werden Sie Emprung ernten - selbst unter denen, die Werbe-Banner ansonsten selber nur als lstig empfinden. Der Grund ist einfach, dass Sie kein Recht dazu haben. Sie nehmen einen kostenlosen Dienst in Anspruch. Dafr knnen Sie nun mal nicht das Gleiche haben wie fr Geld. Anbieter kostenloser Homepages finanzieren sich nun mal hufig ber Werbung, also wrden Sie einen solchen Anbieter seiner Ertragsquelle berauben, wenn Sie die Werbe-Banner unterdrcken wrden. Es gibt auch gar keine Mglichkeit, solche Banner oder automatischen Popup-Fenster zu unterdrcken, weil sie server-seitig eingefgt werden, bevor die Web-Seite an den Browser bertragen wird. Werbefinanzierte Angebote sind somit nicht kostenlos - den Preis bezahlen Ihre Besucher.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="referenzen_funktionieren_nicht">Warum funktionieren meine Verweise und Grafikreferenzen nach dem Hochladen auf den Server nicht mehr?</a></h2>
<p>Vermutlich haben Sie Ihre Web-Seiten und Grafiken unter einem Betriebssystem wie MS Windows erstellt, wo Gro- und Kleinschreibung von Dateinamen keine Rolle spielt. Auf typischen Server-Betriebssystemen wie Linux dagegen wird streng zwischen Gro- und Kleinschreibung unterschieden. Wenn Sie also beispielsweise <code><a href="datei.htm"></code> notiert haben und die Datei heit in Wirklichkeit <var>Datei.htm</var>, dann funktioniert der Verweis unter Windows, aber unter Linux funktioniert er nicht. Ebenso ist es bei Grafik- und anderen Referenzen auf externe Dateien. Achten Sie deshalb schon beim Erstellen der Dateien darauf, die Dateien exakt so abzuspeichern, wie Sie es in den Referenzen darauf angeben. Am sichersten ist es, wenn Sie einfach alles klein schreiben - also sowohl alle vergebenen Dateinamen als auch die entsprechenden Referenzen in HTML, CSS oder JavaScript und auf Leerzeichen in Dateinamen verzichten. Leider gibt es noch einige ltere Windows-Programme, die sich nicht daran halten und beispielsweise immer den ersten Buchstaben des Dateinamens gro machen. Stellen Sie deshalb auf Datei-Ebene nochmals sicher, dass die Dateinamen mit den Referenzen bereinstimmen, und benennen Sie anders geschriebene Dateinamen gegebenenfalls noch mal um. Das Gleiche gilt auch fr Verzeichnisnamen, falls Sie innerhalb Ihres Web-Projekts mit Unterverzeichnissen arbeiten.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="nur_startadresse_anzeigen">Wie kann ich erreichen, dass in der Adresszeile des Browsers die Startadresse meiner Seiten stehenbleibt?</a></h2>
<p>Bei diesem Wunsch mssen Sie sich zunchst einmal die Gegenfrage gefallen lassen, was Ihnen so unbehaglich ist an der Vorstellung, dass Anwender Ihre vergebenen Dateinamen sehen? Das ist etwas vllig Normales und jeder Web-Anwender ist daran gewhnt. Leider ist dies wieder ein typischer Fall, wo um einer Zwangsvorstellung willen eine von vielen Anwendern als ntzlich empfundene Browser-Funktion unterdrckt werden soll. Verzichten Sie also lieber auf diese Zwangsvorstellung.</p>
<p>Die sachliche Antwort auf die Frage ist, <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../html/frames/index.htm">Frames</a> zu verwenden. Wenn Sie als Startseite gleich ein Frameset laden, bleibt whrend der Navigation innerhalb des Framesets in der Adresszeile des Browsers stets die Adresse der zuerst aufgerufenen Seite stehen. Sie mssen sich allerdings im Klaren darber sein, dass diese "Lsung" ernstzunehmende Nachteile hat. Whrend Sie technische versierte Anwender nicht davon abhalten, die Adressen Ihrer Unterseiten in Erfahrung zu bringen, nehmen Sie den Durchschnitsbesuchern die Mglichkeit, Ihre Unterseiten zu verlinken, deren Adressen an Freunde zu senden usw. Dadurch schaden Sie letztlich nur der Bekanntheit und Beliebtheit Ihrer Webseite.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="rahmen_bei_verweisen">Wie kann ich den gepnktelten Rahmen um aktivierte Verweise im Internet Explorer vermeiden?</a></h2>
<p>Das knnen Sie verhindern, indem Sie im Verweis notieren:</p>
<pre><a href="ziel.htm" onfocus="if (this.blur) this.blur()">Text</a></pre>
<p>Beachten Sie jedoch, dass Sie dem Anwender damit die Mglichkeit nehmen, mit der Tabulator-Taste auf diesen Verweis zu positionieren und diesen dann mit der Return-Taste auszufhren. Es gibt dagegen kaum einen Anwender, der den gepnktelten Rahmen als unschn oder als Minuspunkt frs Layout empfindet. Opfern Sie nicht ohne Not die Navigationsmglichkeiten des Anwenders der Zwangsvorstellung von einem "makellosen" Aussehen Ihrer Web-Seiten!</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="nicht_unterstrichene_verweise">Wie kann ich erreichen, dass Verweise nicht unterstrichen werden?</a></h2>
<p>Das funktioniert mit Hilfe von Stylesheets und wird im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/verweise/definieren.htm#gestalten">Verweise optisch gestalten mit CSS</a> beschrieben. Beachten Sie jedoch, dass Sie damit ein wichtiges Erkennungsmerkmal von Verweisen verloren geht.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="verweise_in_neuem_fenster">Wie kann ich ein Verweisziel in einem neuen Fenster ffnen?</a></h2>
<p>Dazu notieren Sie im einleitenden Verweis-Tag zustzlich zum <code>href</code>-Attribut <code>target="_blank"</code>. Beschrieben wird dies im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/verweise/definieren.htm#zielfenster">Zielfenster fr Verweise bestimmen</a>. Die Gre des neuen Fensters knnen Sie dabei allerdings nicht beeinflussen. Falls Sie das wollen, z.B. weil das neue Fenster als kleines Popup-Fenster erscheinen soll, dann mssen Sie mit JavaScript arbeiten, und zwar mit der Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#open">window.open()</a>. Dabei knnen Sie verschiedene Optionen zum Aussehen und zur Gre des Fensters bestimmen.</p>
<p><img src="../src/dokf.gif" width="15" height="10" alt="Beispiel-Seite"> <a href="anzeige/popupfenster.htm">Anzeigebeispiel: So sieht's aus</a></p>
<p>Das Beispiel zeigt eine HTML-Datei mit einem Verweis, bei dessen Anklicken sich das Beispiel nochmals in einem ein Popup-Fenster ffnet.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="hover_bei_netscape">Wie kann ich einen Hover-Effekt auch bei Netscape 4 erreichen?</a></h2>
<p>Fr Netscape 4.x lsst sich mit etwas Aufwand eine Lsung in JavaScript programmieren. Im Online-Angebot von SELFHTML aktuell stellt ein Artikel diese Mglichkeit vor: <img src="../src/serverdok.gif" width="15" height="10" alt="Online-Seite"> <a target="_top" href="http://aktuell.de.selfhtml.org/artikel/dhtml/positionierung/#a7">Positionierung von Layern (DHTML)</a> von Andreas Zierhut. Bei Netscape ab Version 6.0 funktioniert der Hover-Effekt mit CSS auf Anhieb problemlos.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="hover_problem">Warum funktionieren die Hover-Effekte bei Verweisen nicht wie gewnscht?</a></h2>
<p>Bei den Hover-Effekten kommt es auf die richtige Reihenfolge an, in der die entsprechenden <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active">Pseudoklassen fr Verweise</a> notiert werden. Probieren Sie folgende Reihenfolge:</p>
<pre>
a:link { /* Deklarationen */ }
a:visited { /* Deklarationen */ }
a:focus { /* Deklarationen */ }
a:hover { /* Deklarationen */ }
a:active { /* Deklarationen */ }
</pre>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="zwei_frames">Wie kann ich mit einem Verweis den Inhalt von zwei Frames gleichzeitig ndern?</a></h2>
<p>Dies ist mit HTML alleine nur lsbar, wenn Sie fr jede mgliche Frame-Kombination jeweils eine Datei mit passenden Frameset-Definitionen erstellen - deshalb suchen Anfnger oft an der falschen Stelle und stellen die entsprechende Frage dann gerne in Foren und Newsgroups, wo die Frage jedoch meistens genervte Reaktionen auslst. Um mit einem Verweis den Inhalt von zwei anderen Frame-Fenstern zu ndern, ist ein JavaScript erforderlich. Ein solches Script wird im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/beispiele/zweiframes.htm">Zwei Frames gleichzeitig ndern</a> vorgestellt.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="button_als_verweis">Wie kann ich einen Formular-Button als anklickbaren Verweis verwenden?</a></h2>
<p>Dazu mssen Sie einen <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/formulare/formularbuttons.htm">Absende-Button</a> innerhalb eines Formulares definieren. Im action-Attribut des Formulars notieren Sie die URL des Ziels. Das Konstrukt sieht dann beispielsweise so aus:</p>
<pre>
<form action="../index.htm">
<input type="submit" value="Buttontext">
</form>
</pre>
<p>Bedenken Sie aber, dass das Aussehen solcher Buttons ziemlich stark vom Browser und dem verwendeten Betriebssystem des Besuchers beeinflusst wird und nur in gewissen Grenzen mit CSS formatiert werden kann. Der Button wird deshalb vielleicht gar nicht mehr in ihre Seitengestaltung passen, wenn er anderswo angezeigt wird. Es ist ratsamer, sich stattdessen einen normalen Link mit CSS passend zu formatieren oder eine Grafik in Form des Buttons zu verwenden. Grafik und normaler Link lassen sich auerdem mit CSS auch kombinieren (die Grafik als Hintergrundbild verwenden).</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="auswahlliste_als_verweisliste">Wie kann ich eine Auswahlliste so nutzen, dass sie ausfhrbare Verweise enthlt?</a></h2>
<p>Mit Hilfe eines JavaScripts lassen sich <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/formulare/auswahl.htm#listen">Auswahllisten</a> so umfunktionieren, dass sie wie Verweislisten wirken. Die <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="quickbar/index.htm">SELFHTML-Quickbar</a> ist so eine Anwendung. Wie das genau funktioniert, wird im Kapitel ber JavaScript im Anwendungsbeispiel <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/beispiele/verweisliste.htm">Verweisliste als Auswahlliste</a> beschrieben.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="back_verweis">Wie kann ich erreichen, dass ein Verweis die Back-Funktion im Browser bewirkt?</a></h2>
<p>Dazu ist ein Stckchen JavaScript-Code im Verweis erforderlich. Der Verweis sieht so aus:</p>
<pre>
<a href="javascript:history.back()">Verweistext</a>
</pre>
<p>Dazu wird beim <code>href</code>-Attribut das Pseudo-Protokoll <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/sprache/eventhandler.htm#javascript">javascript:</a> notiert. Daran anschlieend kann JavaScript-Code notiert werden. in diesem Fall wird mit Hilfe der Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/history.htm#back">history.back()</a> die Back-Funktion im Browser angesprochen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="grafik_als_verweis">Wie kann ich eine Grafik als anklickbaren Verweis verwenden?</a></h2>
<p>Dazu notieren Sie einfach einen normalen <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/verweise/definieren.htm">Verweis</a>. Anstelle des Verweistextes, also als Inhalt zwischen dem einleitenden <code><a href=></code> und dem abschlieenden <code></a></code>, notieren Sie eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/grafiken/einbinden.htm">Grafikreferenz</a>. Das Ganze ist auch noch mal im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/grafiken/verweise.htm">Grafiken als Verweise</a> beschrieben.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="navigationsleisten">Wie funktioniert eine Navigationsleiste mit anklickbaren grafischen Buttons?</a></h2>
<p>Dazu bentigen Sie zunchst gleichartige Grafiken, die eine Schaltflche darstellen. Im Abschnitt <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../grafik/sorten.htm#buttons">Buttons (Schaltflchen)</a> finden Sie Beispiele solcher Grafiken. Die Grafiken knnen Sie mit einem geeigneten <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/hilfsmittel/software.htm#grafik">Grafikprogramm</a> so bearbeiten, dass jeder Button eine individuelle Beschriftung erhlt, also beispielsweise <var>Home</var>, <var>Infos</var>, <var>Kontakt</var>, <var>Gstebuch</var> usw. Die Grafiken speichern Sie am besten unter Dateinamen ab, welche die Serie erkennen lassen, z.B. <var>btn_home.gif</var>, <var>btn_infos.gif</var>, <var>btn_kontakt.gif</var>, <var>btn_gbuch.gif</var>. Die erzeugten Grafiken binden Sie dann in einer HTML-Datei so ein, dass ein Navigationsleisten-Effekt entsteht. Sehr hufig werden zu diesem Zweck <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/layouts.htm">Tabellenlayouts</a> verwendet, die Umsetzung ist jedoch auch problemlos mittels einer per CSS formatierten <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/listen.htm">HTML-Liste</a> mglich (siehe Quelltext-Beispiel). Eine zustzliche Mglichkeit, solche Navigationsleisten einzusetzen, bieten <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../html/frames/index.htm">Frames</a>. Ein Frame-Fenster kann dann die Navigationsleiste enthalten, whrend das andere die Informationen anzeigt.</p>
<pre>
<ul>
<li><a href="index.htm"><img src="btn_home.gif" alt="Home"></a></li>
<li><a href="infos.htm"><img src="btn_infos.gif" alt="Infos"></a></li>
<li><a href="kontakt.htm"><img src="btn_kontakt.gif" alt="Kontakt"></a></li>
<li><a href="gbook.htm"><img src="btn_gbook.gif" alt="Gstebuch"></a></li>
</ul>
</pre>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="abweichende_verweisfarben">Wie kann ich fr bestimmte Verweise andere als die dateiweiten Verweisfarben definieren?</a></h2>
<p>Das geht mit Stylesheets. Dazu definieren Sie verschiedene zentrale <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/zentrale.htm#klassen">Klassen</a> fr Verweise. Das sieht beispielsweise so aus:</p>
<pre>
<style type="text/css">
a.type1:link { color:#FF0000; }
a.type2:link { color:#FF00FF; }
a.type1:visited { color:#990000; }
a.type2:visited { color:#990099; }
a.type1:active { color:#000000; }
a.type2:active { color:#000000; }
</style>
</pre>
<p>Dabei sind <code>type1</code> und <code>type2</code> die Klassennamen. Die Syntax mit den Doppelpunkten ist die fr <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/zentrale.htm#pseudoformate">Pseudoelemente und Pseudoklassen</a>. In HTML knnen Sie die verschiedenen Klassen dann mit dem <code>class</code>-Attribut ansprechen:</p>
<pre>
<a class="type1" href="...">Verweis</a>
<a class="type2" href="...">Verweis</a>
</pre>
<p>Haben Sie Bereiche der Seite in Elementen mit einem ID-Attribut zusammengefasst, lassen sich abweichende Formatierungen auch folgendermaen erreichen:</p>
<pre>
<div id="bereich">
<p><a href="ziel.htm">Verweistext</a></p>
</div>
</pre>
<pre>
#bereich a:link { /* Deklaration /* }
#bereich a:visited { /* Deklaration /* }
</pre>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="statuszeilentext_bei_verweisen">Wie kann ich in der Statuszeile bei Verweisen einen eigenen Text anzeigen?</a></h2>
<p>Das geht mit JavaScript und der Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#status">window.status</a>. Dort finden Sie auch ein Beispiel fr Verweise, die beim berfahren mit der Maus einen eigenen Text in der Statuszeile des Browsers erzeugen. Beachten Sie jedoch, dass nicht alle Anwender dieses Feature besonders toll finden. Viele Anwender mchten lieber die bliche Information in der Statuszeile sehen, nmlich den URI des mit dem Verweis verknpften Ziels.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="programm_ausfuehren">Wie kann ich mit einem Verweis ein Programm wie Word, Notepad usw. ausfhren?</a></h2>
<p>Wenn Sie einen Verweis auf eine ausfhrbare Datei wie <var>notepad.exe</var> oder <var>winword.exe</var> legen, wird der Browser diese Datei stets zum Download anbieten, aber ganz sicher nicht ausfhren. Der Grund ist, dass Web-Browser und auch HTML fr den <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../intro/internet/standards.htm#client_server">Client-Server</a>-Betrieb im Internet ausgelegt sind, nicht aber fr das unbedenkliche lokale PC-Umfeld. Denn wenn die <var>notepad.exe</var> ausfhrbar wre, dann wre auch die <var>format.com</var> ausfhrbar, und wre ein Verweis in der Lage, Ihre Festplatte neu zu formatieren.</p>
<p>Sie knnen jedoch sehr wohl <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/verweise/dateitypen.htm#beliebig">Verweise auf beliebige Dateien</a> setzen. Wenn Sie beispielsweise einen Verweis auf eine <var>.doc</var>-Datei setzen, wird beim Anwender MS Word geffnet, sofern das Programm dort installiert ist und Dateien mit dieser Endung mit dem Programm verknpft sind.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="blocksatz">Wie kann ich Blocksatz fr Text erzwingen?</a></h2>
<p>In HTML knnen Sie <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/ueberschriften.htm#ausrichten">berschriften ausrichten</a>, <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/absaetze.htm#ausrichten">Textabstze ausrichten</a>, <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/bereiche.htm#block">Textbereiche ausrichten</a> und <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/gestaltung.htm#ausrichtung_zellen">Tabellenzellen ausrichten</a>. Dazu verwenden Sie in allen Fllen das Attribut <code>align</code>. Mit <code>align="justify"</code> erzwingen Sie den Blocksatz. Beachten Sie aber, dass das <code>align</code>-Attribut von HTML als <i>deprecated</i> gekennzeichnet ist und knftig aus dem HTML-Standard entfallen soll. Stattdessen gibt es die CSS-Eigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/ausrichtung.htm#text_align">text-align</a>, der Sie ebenfalls den Wert <code>justify</code> fr Blocksatz zuweisen knnen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="blocksatz_probleme">Wie kann ich Darstellungsprobleme bei Blocksatz lsen?</a></h2>
<p>Bei Blocksatzausrichtung kann es vor allem bei Netscape zu unschnen Ausdehnungen kurzer Zeilen kommen. Um das zu vermeiden, sollten Sie auf jeden Fall jeden z.B. mit <code><p></code> eingeleiteten Textabsatz mit dem abschlieenden <code></p></code> beenden. Wenn die unerwnschte Ausdehnung der kurzen Zeile bei einem einfachen Zeilenumbruch (<code><br></code>) erscheint, hilft vor dem <code><br></code> ein einfaches Leerzeichen (jedoch <strong>kein</strong> <code>&nbsp;</code>).</p>
<p>Da die heute verbreiteten Browser keine automatische Silbentrennung im Flietext anwenden, kann es bei Blocksatz zu greren Lcken zwischen Wrtern kommen. Vermeiden Sie Blocksatz deshalb vor allem in schmalen Bereichen. Je breiter der Block ist, desto sauberer sieht der Text aus.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="text_einruecken">Wie kann ich Text einrcken?</a></h2>
<p>Um nur die erste Zeile eines mehrzeiligen Absatzes einzurcken, knnen Sie die CSS-Eigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/ausrichtung.htm#text_indent">text-indent</a> verwenden. Wenn Sie dagegen den gesamten Absatz einrcken wollen, mssen Sie einen linken Rand dafr definieren. Auch das geht mit CSS - nmlich mit der Eigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/randabstand.htm#margin_left">margin-left</a>.</p>
<p>Bitte vermeiden Sie, fr Einrckungen die HTML-Elemente <code>blockquote</code> oder <code>ul</code> zu verwenden, wie es frher gerne gemacht wurde und manchmal noch immer empfohlen wird. Das ist erstens schlechter Stil, zweitens besteht keine Garantie, dass solche Elemente von jedem Browser eingerckt dargestellt werden, und drittens knnen Sie dabei gar nicht festlegen, wie weit der Text eingerckt werden soll.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="tabulatoren">Wie kann ich Tabulatoren in HTML erzeugen?</a></h2>
<p>Im Konzept von HTML sind Tabulatoren nicht vorgesehen. Mittlerweile gibt es mit Hilfe von CSS folgende Mglichkeit - Beispiel:</p>
<pre>
<p>Text<span style="white-space:pre">&#9;</span>Text</p>
</pre>
<p>Dabei wird mit Hilfe des <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/bereiche.htm#inline">allgemeinen Inline-Elements</a> <code>span</code>, der CSS-Eigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/ausrichtung.htm#white_space">white-space</a> mit dem Wert <code>pre</code> und der numerischen Notation <code>&#9;</code> fr das Tabulator-Zeichen mitten im Text ein Tabulator erzeugt.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="fremde_schriftzeichen">Wie kann ich fremde Schriftzeichen einfgen?</a></h2>
<p>Ab HTML 4.0 knnen Sie alle Zeichen des <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../inter/unicode.htm">Unicode</a>-Systems notieren. Auf diese Weise knnen Sie praktisch alle bekannten Zeichen der Welt notieren. Um einige wenige fremde Zeichen einzufgen, knnen Sie solche Zeichen mit ihrer Unicode-Nummer notieren. Wie das funktioniert, wird in der <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/referenz/zeichen.htm">Zeichenreferenz</a> (Abschnitt "Allgemeines") beschrieben. Dort finden Sie aber auch viele <b>benannte Zeichen</b> wie <code>&Pi;</code> oder <code>&euro;</code>, die Sie ebenfalls verwenden knnen.</p>
<p>Wenn Sie eine komplette HTML-Datei in einer Sprache erstellen, die fremde Schriftzeichen verwendet, dann sollten Sie eine passende Kodierung whlen. Stellen Sie diese Kodierung in dem Programm ein, mit dem Sie die Texte erstellen. In den Kopfdaten der HTML-Datei notieren Sie eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/kopfdaten/meta.htm#zeichenkodierung">Angabe zur Zeichenkodierung</a>. Der Browser versucht dann, die HTML-Datei gem der angegebenen Kodierung zu verarbeiten.</p>
<p>Damit die fremden Schriftzeichen angezeigt werden knnen, mssen allerdings beim Anwender Schriftarten installiert sein, die solche Zeichen anzeigen knnen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="grafiken_highlighten">Wie erreiche ich, dass Grafiken beim berfahren mit der Maus gehighlighted werden?</a></h2>
<p>Sie bentigen Sie jeweils zwei Varianten einer Grafik. Der Effekt entsteht dann dadurch, dass beim berfahren einer Grafik mit der Maus diese Grafik dynamisch durch die "Schwestergrafik" ersetzt wird. Wird die Maus wieder entfernt, wird wieder die normale Grafik an der Stelle angezeigt. Definieren Sie zunchst fr das gewnschte Element eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/hintergrund.htm#background_image">Hintergrundgrafik</a>. Mit der <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active">Pseudoklasse</a> <code>:hover</code> definieren Sie nun die zweite Grafik als Hintergrundbild. Dieser Effekt kann auch mit JavaScript realisiert werden. In dem JavaScript-Anwendungsbeispiel <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/beispiele/buttons.htm">Dynamische grafische Buttons</a> wird genau beschrieben, wie Sie so etwas realisieren knnen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="mittig_zentrierte_inhalte">Wie kann ich Inhalte genau in der Mitte des Anzeigefensters positionieren?</a></h2>
<p>Um Blockelemente zu zentrieren, setzen Sie den linken und rechten <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/randabstand.htm">Auenabstand</a> auf den Wert <var>auto</var>:</p>
<pre>
margin-left:auto;
margin-right:auto;
</pre>
<p>Beachten Sie, dass der Internet Explorer 6 diese Angaben nur dann interpretiert, wenn die Seite im <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/box_modell.htm#standardkonform">standardkonformen Modus</a> dargestellt wird.</p>
<p>Soll ein Element sowohl horizontal als auch vertikal zentriert werden, bietet sich eine Lsung mit absoluter <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/positionierung.htm#position">Positionierung</a> an:</p>
<p><img src="../src/dokf.gif" width="15" height="10" alt="Beispiel-Seite"> <a href="anzeige/zentriertes_element.htm">Anzeigebeispiel: So sieht's aus</a></p>
<pre>
#zentriert {
position:absolute;
top:50%;
left:50%;
width:30em;
height:20em;
margin-left:-15em;
margin-top:-10em;
}
</pre>
<p>Das Element mit der <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/zentrale.htm#individualformate">ID</a> "zentriert" wird zunchst so positioniert, dass dessen linke obere Ecke sich genau in der Mitte befindet (<code>top:50%; left:50%;</code>). Anschlieend wird es mittels negativer Auenabstnde um dessen halbe Breite nach links (<code>margin-left:-15em;</code>) und um dessen halbe Hhe nach oben (<code>margin-top:-10em;</code>) verschoben.</p>
<p>Alternativ knnen Sie eine <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/aufbau.htm">Tabelle</a> notieren, die sowohl 100% der verfgbaren Breite als auch 100% der verfgbaren Hhe einnimmt und eine einzige Tabellenzelle enthlt, deren Inhalt Sie horizontal zentriert und vertikal mittig ausrichten. Das sieht dann so aus:</p>
<pre>
<body>
<table border="0" cellpadding="0" cellspacing="0"
width="100%" height="100%">
<tr><td align="center" valign="middle">
<h1>Willkommen in der Mitte!</h1>
</td></tr></table>
</body>
</pre>
<p>Diese Lsung hat nur einen Schnheitsfehler: bei <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/gestaltung.htm#breiten_hoehen">Breiten- und Hhenangaben</a> zu Tabellen ist das Attribut <code>height</code> dem HTML-Standard zufolge nicht im Zusammenhang mit dem <code>table</code>-Element erlaubt. Genau dies wird jedoch im gezeigten Beispiel angewendet und auch von fast allen Browsern problemlos interpretiert. Das Problem knnen Sie zwar umgehen, indem Sie statt <code>height="100%"</code> mit CSS arbeiten und <code>style="height:100%"</code> notieren. Doch das interpretiert zumindest Netscape 4.x nicht.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="mittig_zentriertes_framefenster"> Wie kann ich ein einzelnes Frame-Fenster in der Mitte des Anzeigefensters positionieren?</a></h2>
<p>Dazu mssen Sie eine "Tabelle" aus drei mal drei Frame-Fenstern erstellen, wobei nur das Fenster, das in der zweiten Reihe dasjenige in der zweiten Spalte ist, einen Inhalt erhlt. Das Frameset dazu sieht beispielsweise so aus:</p>
<pre>
<frameset cols="*,66%,*" rows="*,66%,*" frameborder="0" framespacing="0" border="0">
<frame><frame><frame>
<frame><frame src="datei.htm" name="Inhalt"><frame>
<frame><frame><frame>
</frameset>
</pre>
<p>Beachten Sie jedoch, dass die Attribute zum Erzwingen von <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/frames/eigenschaften.htm#rahmen">unsichtbaren Fensterrahmen</a>, so wie sie in dem Beispiel notiert sind, nach HTML-Standard nicht erlaubt sind, doch erforderlich sind, um in den Browsern die gewnschte Wirkung zu erzielen.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="breiten_bei_tabellen">Wie kann ich verhindern, dass Browser meine Breitenangaben in Tabellen missachten?</a></h2>
<p>Wenn die Inhalte der Tabellenzellen sehr unterschiedlich gewichtet sind, oder wenn Inhalte eine Spalte in der angegebenen Breite nicht ausfllen, kann es je nach Browser zu unschnen Darstellungen durch unterschiedliche Interpretationen des Attributs <code>width</code> bei <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/tabellen/gestaltung.htm#breiten_hoehen">Breiten- und Hhenangaben</a> zu Tabellen kommen.</p>
<p>Mittlerweile gibt es eine CSS-Eigenschaft, mit der sich bestimmte Spaltenbreiten erzwingen lassen, nmlich die Eigenschaft <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/tabellen.htm#table_layout">table-layout</a>. Diese wird zwar auch von den neueren Browsern interpretiert, aber die Browser der 4er-Generation ignorieren sie. Deshalb wird in der Praxis, um Mindestbreiten zu erzwingen, noch immer viel mit dem so genannten <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../grafik/sorten.htm#blinde_pixel">blinden Pixel</a> gearbeitet. Das entspricht zwar nicht gerade der Philosophie von HTML, zeigt aber, dass in der Praxis Probleme existieren, die zumindest in den lteren Browser-Generationen nur ber solche Tricksereien lsbar waren.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="frames_bei_netscape">Warum stellt Netscape 4 Frames nicht in exakter Gre dar?</a></h2>
<p>Netscape interpretiert bis zur 4er-Version Pixelangaben zur Breite und Hhe von Frame-Fenstern bei der <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/frames/definieren.htm#framesets">Frameset-Definition</a> nicht exakt. Erfahrungen von Anwendern berichten von bis zu 10-15 Pixeln Abweichung von der festgelegten Fensterbreite. Einer kursierenden Theorie zufolge verhlt sich Netscape folgendermaen:</p>
<p>Er arbeitet nicht mit absoluten Pixelwerten, sondern teilt den zur Verfgung stehenden Platz horizontal wie vertikal in 100 Teile mit je 1 Prozent auf. Netscape akzeptiert als Framegre also praktisch nur Prozentwerte und rechnet Pixelangaben intern in Prozent um. Bei einer Bildschirmauflsung von z.B. 800 x 600 Pixeln (dabei muss man ca. 4 Pixel fr den Rand abziehen, daher bleiben in der Breite also ca. 796 Pixel), ergibt sich dann beispielsweise:</p>
<p>Frameset 10% = 10 x 7,96 => Framebreite = 79 Pixel<br>
Frameset 11% = 11 x 7,96 => Framebreite = 87 Pixel<br>
Frameset 12% = 12 x 7,96 => Framebreite = 95 Pixel</p>
<p>Die tatschliche Gre ist dann noch mal ca. 1 Pixel schmaler. Angaben dazwischen, also etwa 90 Pixel, fhren dann also zu tatschlichen Breite von 86 oder 94 Pixel.</p>
<p>Es ist keine Mglichkeit bekannt, dagegen etwas auszurichten. So bleibt nur die Mglichkeit, das Layout von HTML-Dateien, die innerhalb solcher Frame-Fenster angezeigt werden, so zu gestalten, dass ein gewisser Spielraum in Breite und Hhe der Anzeige das Layout nicht gleich durcheinanderbringt. Eigentlich sollte das ja sowieso als Grundsatz beim Web-Design gelten. Inhalte, zum Beispiel Grafiken, sollten auf jeden Fall 10-15 Pixel kleiner sein als die Angaben zur Breite bzw. Hhe des zugehrigen Frame-Fensters. Nur so ist sichergestellt, dass sie vollstndig angezeigt werden.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="kein_seitenrand">Wie kann ich erreichen, dass Inhalte ohne Seitenrand links oben beginnen?</a></h2>
<p>Dazu werden zwar vielfach <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/dateiweit/seitenraender.htm">Seitenrnder</a> in HTML definiert, wobei allen Angaben der Wert <code>0</code> zugewiesen wird. Da dies jedoch kein standardkonformes HTML ist, ist es empfehlenswerter, Stylesheets fr diese Zwecke einzusetzen. Am einfachsten ist es, wenn Sie einfach den <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/randabstand.htm">Auenabstand</a> und <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/innenabstand.htm">Innenabstand</a> des <code>body</code>-Elements global auf 0 Pixel setzen. Dazu notieren Sie einfach:</p>
<pre>
<body style="margin:0px; padding:0px;">
</pre>
<p>Dies wird von Netscape 4.x noch nicht richtig interpretiert, es handelt sich allerdings um eine zu vernachlssigende Abweichung. Sind Sie dennoch auf eine identische Darstellung angewiesen, knnen Sie den gesamten sichtbaren Inhalt der HTML-Datei absolut positionieren. Dies ist mit Hilfe eines <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../html/text/bereiche.htm#block">allgemeinen Block-Elements</a> und CSS-Eigenschaften zur <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/eigenschaften/positionierung.htm">Positionierung</a> mglich. Der Dateikrper sieht dann beispielsweise so aus:</p>
<pre>
<body>
<div style="position:absolute; top:0px; left:0px;">
Hier den gesamten sichtbaren Inhalt der Seite notieren
</div>
</body>
</pre>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="darstellung_internet_explorer">Warum weicht die Darstellung im Internet Explorer ab?</a></h2>
<p>Fhren Breiten- oder Hhenangaben im Internet Explorer im Vergleich zu anderen Browsern zu einer abweichenden Darstellung, liegt dies vermutlich an dessen <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/box_modell.htm#box_model_bug">Box-Modell-Fehler</a>. Zeichnen Sie Ihre Seiten in diesem Fall mit einer <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../css/formate/box_modell.htm#standardkonform">Dokumenttyp-Deklaration fr den standardkonformen Modus</a> aus.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="css_geht_nicht_bei_netscape">Warum geht CSS unter Netscape 4 nicht?</a></h2>
<p>Bei Netscape 4.x ist CSS intern an JavaScript gekoppelt, so merkwrdig sich das auch anhren mag. Denn intern setzt Netscape 4.x CSS mit Hilfe einer speziellen JavaScript-Erweiterung namens <strong>JSSS</strong> (<i>JavaScript StyleSheets</i>) um. Das bedeutet, dass in diesem Browser keine Stylesheets angezeigt werden, wenn in den Browser-Einstellungen JavaScript deaktiviert wird. Wenn also gar keine Stylesheets im Netscape-4.x-Browser interpretiert werden, liegt es normalerweise daran, dass JavaScript ausgeschaltet ist. Leider knnen Sie als Web-Autor dagegen nichts weiter unternehmen, denn wenn ein Anwender nun mal kein JavaScript mchte, ist es sein gutes Recht, dies zu deaktivieren.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="css_falsch">Meine CSS-Angaben funktionieren nicht richtig - woran kann das liegen?</a></h2>
<p>Die wahrscheinlichste Ursache dafr sind Syntaxfehler bei den <img src="../src/kap.gif" width="15" height="13" alt="Kapitel"> <a href="../css/formate/index.htm">CSS-Formatdefinitionen</a>. Wer HTML gewohnt ist, bei dem schleichen sich leicht Flchtigkeitsfehler ein. Ein beliebter Fehler ist beispielsweise, bei der Wertzuweisung an eine CSS-Eigenschaft anstelle des Doppelpunktes ein Gleichheitszeichen zu notieren.</p>
<p><strong>Falsch</strong> ist also z.B.: <code>h1 { color=red }</code><br>
<strong>Richtig</strong> ist dagegen: <code>h1 { color:red }</code><br>
Auch vergessene Strichpunkte fhren zu Fehlinterpretationen.<br>
<strong>Falsch</strong> ist also z.B.: <code>h1 { color:red background-color:yellow }</code><br>
<strong>Richtig</strong> ist dagegen: <code>h1 { color:red; background-color:yellow }</code></p>
<p>Da die Browser bei Syntaxfehlern in CSS keine Fehlermeldungen erzeugen, bleiben solche Fehler hufig unentdeckt und machen sich nur in Form von Fehlinterpretationen bemerkbar. berprfen Sie deshalb stets genau die Syntax Ihrer CSS-Formatdefinitionen.</p>
<p>Sie knnen Ihre CSS-Formatdefinitionen auch online auf korrekte Syntax berprfen lassen. Dazu gibt es den <img src="../src/en.gif" width="16" height="10" alt="englischsprachige Seite">/<img src="../src/de.gif" width="16" height="10" alt="deutschsprachige Seite"> <a target="_top" href="http://jigsaw.w3.org/css-validator/">W3C CSS-Validierungsservice</a>.</p>
<p>Speziell frhe Zwischenversionen von Netscape 4.x haben Probleme mit Leerzeichen zwischen CSS-Eigenschaft und Wertzuweisung. Notieren Sie deshalb - obwohl es erlaubt ist, besser nicht<br>
<code>h1 { color: red }</code><br>
sondern<br>
<code>h1 { color:red }</code></p>
<p>Generell hat Netscape 4.x noch massive Probleme mit vielen CSS-Eigenschaften. Einige der Probleme lassen sich durch Trickserei in den Griff bekommen, aber viele auch nicht.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="fenstergroesse">Wie kann ich das Browser-Fenster auf eine bestimmte Gre ndern?</a></h2>
<p>Mit Hilfe der JavaScript-Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#resize_to">window.resizeTo()</a> knnen Sie das Browser-Fenster auf eine gewnschte Gre ndern. Im Beispiel zur Methode <code>window.resizeTo()</code> wird beschrieben, wie Sie das Browser-Fenster nach Einlesen der Seite automatisch auf die gewnschte Gre bekommen.</p>
<p>Beachten Sie aber, dass viele Anwender dies als Eingriff in ihre Freiheit empfinden. Ein Web-Projekt, das gleich auf der Startseite automatisch das Browser-Fenster des Anwenders verndert, erzeugt bei Besuchern, die das Projekt zum ersten mal besuchen, sofort einen negativen Eindruck und fhrt vermutlich in vielen Fllen dazu, dass die Anwender gleich wieder flchten gehen. In vielen Browsern lsst sich diese Unsitte unterbinden.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="popup_groesse">Wie kann ich ein Popup-Fenster in bestimmter Gre erzeugen?</a></h2>
<p>Mit Hilfe der JavaScript-Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#open">window.open()</a> knnen Sie ein Popup-Fenster erzeugen. Dabei knnen Sie auch verschiedene Optionen zur Ausstattung, Gre und Position des Fensters mit angeben. Es gibt verschiedene Mglichkeiten, ein solches Popup-Fenster aufzurufen. Eine Mglichkeit ist, das Popup-Fenster gleich beim Einlesen der Seite automatisch zu ffnen, was mittlerweile in vielen Browsern von einem Popup-Blocker auf Wunsch unterbunden wird.. Eine andere Mglichkeit ist, einen <img src="../src/up.gif" width="14" height="10" alt="nach oben"> <a href="#verweise_in_neuem_fenster">Verweis zum ffnen des Popup-Fensters</a> anzubieten.</p>
<p class="doc"><a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a><a href="#bottom"><img src="../src/down.gif" width="14" height="10" border="0" alt="nach unten"></a></p>
<h2><a class="an" name="fenster_vordergrund">Wie kann ich erreichen, dass ein Fenster immer im Vordergrund bleibt?</a></h2>
<p>Fr selbst erzeugte Popup-Fenster knnen Sie bewirken, dass diese sich nicht vom Hauptfenster berlappen lassen. Es gibt zwar im normalen JavaScript keine Mglichkeit, einem Fenster die Eigenschaft "immer im Vordergrund" beim ffnen mit auf den Weg zu geben (nur bei Microsoft JScript und <i>signed</i> JavaScript gibt es so etwas), doch mit einem kleinen Umweg lsst sich der gewnschte Effekt erreichen. Dazu wird in Dateien, die in dem Popup-Fenster angezeigt werden sollen, im Dateikopf ein JavaScript wie das folgende notiert:</p>
<pre>
<script type="text/javascript">
function immervorn() {
self.focus();
window.setTimeout("immervorn()",100);
}
</script>
</pre>
<p>Im einleitenden <code><body></code>-Tag wird auerdem notiert:</p>
<pre>
<body onload="immervorn()">
</pre>
<p>Die selbstgeschriebene <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/sprache/funktionen.htm">Funktion</a> <code>immervorn()</code> setzt dabei mit der Methode <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#focus">focus()</a> den Fokus auf das eigene Fenster - und zwar alle 100 Millisekunden, also jede zehntel Sekunde. Dazu ruft sich die Funktion mit <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/objekte/window.htm#set_timeout">setTimeout()</a> nach der entsprechenden Zeit selbst wieder auf (Rekursion). Durch den Event-Handler <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../javascript/sprache/eventhandler.htm#onload">onload</a> wird sie nach dem Laden der Seite erstmals aufgerufen. Derartige Fenstermanipulationen lassen sich in vielen Browsern unterbinden.</p>
<table cellpadding="4" cellspacing="0" border="0" width="100%">
<tr><td colspan="2" class="doc">
<a href="#top"><img src="../src/up.gif" width="14" height="10" border="0" alt="nach oben"></a>
</td></tr>
<tr><td class="doc"><a href="html.htm"><img src="../src/next.gif" width="10" height="10" border="0" hspace="10" alt="weiter"></a></td>
<td width="100%"><img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="html.htm">Kurzreferenz: HTML</a>
</td></tr>
<tr>
<td class="doc"><a href="anfang/index.htm"><img src="../src/prev.gif" width="10" height="10" border="0" hspace="10" alt="zurck"></a></td>
<td><img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="anfang/index.htm">Wie fange ich an?</a>
</td>
</tr>
<tr><td colspan="2" class="doc"> </td>
</tr>
<tr>
<td colspan="2" class="nav"><a class="an" name="bottom"><img src="../src/refkap.gif" width="16" height="13" alt="Teil von"></a> <a href="../index.htm">SELFHTML</a> <img src="../src/refkap.gif" width="16" height="13" alt="Teil von"> <a href="index.htm">Navigationshilfen</a></td>
</tr>
</table>
<p>© 2007 <img src="../src/dok.gif" width="15" height="10" alt="Seite"> <a href="../editorial/impressum.htm">Impressum</a></p>
</body>
</html>
|
