Biller op Websiten eropzelueden

Kuckt Iech elo eng Websäit um Internet an Dir wësst, datt se verschidde Saache gemeinsam hunn. Een vun deene gedeelt Zorte sinn Biller. Déi richteg Biller addéieren esou vill op d'Presentatioun vum Site. E puer vun deene Biller, wéi e Logo vun der Firma, hëlleft hir Marque de Site a verbinden dës digitale Organisatioun mat Ärer kierperlecher Gesellschaft.

Fir e Bild, Icons oder Grafiken op Är Websäit ze addéieren, musst Dir d'Mark op HTML-Code vun der Säit benotzen. Dir plangt den IMG-Tag an Ärem HTML genau wou Dir wëllt d'Grafik fir ze weisen. Den Webbrowser, deen den Code vun der Säit gemaach gëtt, ersetzt dësen Dag mat der passenden Grafik wann d'Säit se gesinn ass. Gitt eis Firma fir e Beispill fir Firmenlogo hei, wéi Dir dëse Bild op ärem Site addéiere kann:

Image Attributiounen

Kuckt de HTML Code hei uewen, da gesitt Dir datt dëst Element zwee Attributer enthält. Jiddwer vun hinnen ass néideg fir d'Bild.

Dat éischt Attribut ass de "src". Dëst ass ganz wuertwiertlech d'Imagefichier déi Dir op der Säit ugewisen wärt. An e Beispill kënne mir e Fichier "Logo.png" benotzen. Dëst ass d'Grafik déi de Webbrowser wäerte weisen wann et de Site gemaach gëtt.

Dir kënnt och feststellen datt virun dësem Dateinumm mer zousätzlech Informatioune "/ images /". Dëst ass de Fichier Wee. Den initialen Schrëftschnëtt erzielt de Server fir an d'Root vum Verzeichnis ze kucken. Et gesait dann no engem Ordner "Bild" a schliisslech de Fichier "Logo.png". Mat engem Ordner mam Numm "Biller" fir all graphesch Site ze speichern ass eng zimlech allgemeng Praxis, mä Äre Fichier Wee sollt geännert ginn op wat fir Iech wichteg ass.

Déi zweet obligatoresch Attribut ass den Text "alt". Dëst ass den "alternativen Text", wat gezeechent gëtt, wann d'Bild net aus irgendege Grënn uginn. Dëse Text, deen an eisem Beispill liest "Company Logo" wäerte gewise ginn wann de Bild guer net fält. Firwat wär dat? Verschidde Grënn:

Dëst sinn nëmme e puer Méiglechkeeten firwat eise spezielle Bild fehlt. An dësen Fäll fanne mir eis alt Text un.

Alt Text gëtt och vun der Schirmreader Software benotzt fir "e" liest den Image zu engem Visiteur, deen d'Visioun beeilt. Well se net d'Bild esou wéi mer maachen, kann dësen Text léiwer wësse wat de Bild selwer ass. Dëst ass d'Ursaach fir al Text ze benotzen an firwat et kloer ze soen wat d'Bild ass!

Ee gemeinsame Misunderstanding vum Alen Text ass datt et fir de Motocycletten gemeet ass. Dëst ass net richteg. Während Google an aner Sichmotoren dësen Text gelies hunn, fir festzeleeën wat de Bild ass (erënners datt se "Äert" och net Äert Bild sinn), sollt Dir alt Text net schreiwen fir nëmme fir Motoren ze sichen. Auteur kléngen Alttext, dat heescht fir d'Mënschen. Wann Dir och Schlësselwieder ka benotzen fir den Suchmaschinn ze benotzen, dat ass gutt, maacht ëmmer datt den alen Text seng Haaptziel benotzt gëtt, fir ze erklären datt dat Bild fir jiddereen kënnt deen d'Grafikdatei net gesinn.

Aner Attributer

Den IMG Tag huet och zwee aner Attributer déi Dir benotzt ka benotzen wann Dir eng Grafik op Är Websäit fannt - d'Breet a d'Héicht. Zum Beispill, wann Dir e WYSIWYG Editor wéi Dreamweaver benotzt, fiert automatesch dës Info fir Iech. Hei ass e Beispill:

De WIDTH a HEIGHT Attribute verëffentlechen dem Browser d'Gréisst vum Bild. De Browser weess dann genee wéi vill Plaatz am Layout fir ze allocéiren, an et kann op den nächsten Element op der Säit wann déi Biller eroflueden. De Problem mat der Verwäertung vun dëser Informatioun hei am HTML ass datt Dir net ëmmer wëllt datt Äert Bild bei der genaue Gréisst ze weisen. Zum Beispill, wann Dir eng reaktiouns Websäit hutt, déi d'Gréisst vun der Verännerung baséiert op engem Besuchsbildschirm an der Gréisst vun der Apparat, musst Dir och datt Är Biller flexibel sinn. Wann Dir an Äerem HTML soen wéi déi feste Gréisst ass, kënnt Dir et ganz schwéier fannen fir mat responsable CSS Medien Queryen ze iwwerschreiden. Aus deem Grond, a fir datt d'Trennung vu Stil (CSS) a Struktur (HTML) beibehale gëtt, ass et recommandéiert datt Dir kee Brevet an Héicht attribéiert op Äre HTML Code.

Eng Note: Wann Dir dës Enzyklopedie verloosse wëllt a keng CSS-Gréisst ugi gëtt, weist de Browser d'Bild op senger Standardphase, iergendenger Gréisst iergendwéi aus.

Edited by Jeremy Girard