Sådan pakkes tekst rundt om billedet i CSS

Jeg er en avanceret udvikler, der sidder fast med et simpelt spørgsmål. Er positionen for en

element på en webside Vigtigt eller ej? Og hvad er nogle gode brugstilfælde af figurelementet?

Generelt siger de en

element bruges til fotos, codeblock, diagrammer osv. Selvom elementets indhold er relateret til hovedstrømmen, er dets position uafhængig af hovedstrømmen, og hvis det fjernes, bør det ikke påvirke dokumentets strømning.

Ifølge disse artikler fra Pluralsight: Brug

hvis indholdet er vigtigt, men det er nøjagtig position på siden er vigtig.

Når jeg ser på artiklen fra html.com: det

er til indhold, der er direkte relateret til hovedindholdet, mens er til "tangentielt relateret" indhold.

Så en

element:

  1. Indeholder selvstændigt indhold (indhold med betydning i sig selv).
  2. Det kan fjernes og påvirker ikke f.eks. En artikel.
  3. Det bruges kun til indhold, der er direkte relateret til hovedindholdet.
  4. Positionen i en artikel er vigtig.

Forklar mig, hvorfor og hvornår jeg skal pakke min inde i en

når en
er ikke nødvendigt.

  • Spørgsmål om HTML-brug er uden for emnet her undtagen med hensyn til SEO. Hvis du er i tvivl om elementbrug, skal du bruge kilden, Luhn. Figurelementet repræsenterer noget flowindhold, eventuelt med en billedtekst, der er selvstændig (som en komplet sætning) og der refereres typisk til som en enkelt enhed fra dokumentets hovedflow. html.spec.whatwg.org/dev/…
  • 1 Til dit sidste spørgsmål pakker jeg billeder ind i figurer (eller sidelæns) for at gøre dem lettere at håndtere, hvor "img" altid er width:100%; height:auto.

Forestil dig, at du har en kamerahåndbog trykt på papir.

Du kan have et diagram over alle elementer på side 1, dette diagram er figur nr. 1.

På side 16 kan du skrive "se figur nr. 1"

Dette indebærer, at en figur kan være på en anden del af siden, fordi du skal have den på den anden del af siden.

Men for SEO-synspunkt kan en figur have (og burde have) identificerbart tekstindhold, det er derfor, du skal have et "figcaption" -element.

Jeg tvivler på, at søgemaskinernes intelligens er i stand til at måle "afstanden" til den tekst, du illustrerer med billedet, men som alle SEO-strategier, hvis du vil placere et udtryk, og du har godt indhold og tal med de rette billedtekster. det er godt for dig.

  • Jeg forstår sammenhængen, hvor figurelementet kom fra. Især hvordan du forklarer det. Den typiske henvisning i en bog til et bestemt billede på en anden side. Det samme gælder for typiske websteder som Wikipedia (selvom du ikke bruger det). Men hvornår er det rigtigt at bruge det, når man f.eks. Opretter en webshop? Jeg ser en webshop bare bruge den som et containerelement til forsiden af ​​et produkt.
  • Folk bruger tags bare fordi. En bedre container kunne sandsynligvis være billedelementet. Men brug af figur forsøger at være mere semantisk. Ja, omslagsbilledet af et produkt kunne refereres senere, så det er ikke en dårlig ting at gøre det. Det er som mærketiketten. Det er semantisk korrekt ved siden af ​​et input-tag, men ubrugeligt, hvis du ikke henviser til det korrekte ID med for-attributten.

arbejdet for dig: Charles Robertson | Ønsker du at kontakte os?

nyttige oplysninger