Hvis den siste utviklingen i flatskjerm har vist noe, er det så utrolig begrensede webdesignere når det gjelder sammensetning. Nå som vi ikke lenger er distrahert av bevegelser, gradienter og glans, er det klart at webdesignere har en struktur for å bygge sine design rundt: rektangler.
Det er selvfølgelig så mange måter å komponere grupper av rektangler på, da det er piksler på en skjerm, men når du tar hensyn til kravene til typen og nødvendigheten av å designe for forskjellige oppløsninger, begynner layoutalternativene å være tydelig begrenset.
Vi vet alle at alle hjørner ikke er rette vinkler; vi vet alle at linjene ikke alltid er rett. Faktisk har noen av de mest spennende designene fra forrige århundre brutt ut av rutenettet og spunnet av i buer og vinkler, noe som skaper spenning, drama og spenning. Det er et enkelt forslag i utskriftsdesign: Åpne et dokument i InDesign, velg ellipseverktøyet og tegne en sirkel på scenen, velg typverktøyet og klikk på sirkelen, lim inn i teksten din. prøv nå det samme i CSS, fortsett, jeg skal lage en kaffe mens jeg venter ...
Selvfølgelig er det mange måter å tegne en sirkel på en nettside på, men hvis du flyter tekst rundt en, oppdager du at det egentlig ikke er en sirkel; dens avgrensingsboks er fortsatt rektangulær. Det eneste alternativet for å lage tekst som flyter til en kurve, er å sette inn mellomrom på begynnelsen av hver linje og linjeskift på slutten, kunstig inntrykk av teksten; noe som betaler kaos med tilgjengelighet.
For å løse problemet, utvikler W3C CSS Shapes. Utgitt 20. juni sitt første offentlige arbeidsprosjekt, CSS-former Modul Nivå 1, detaljere bruken av ikke-rektangulære former i forhold til boksmodellen og flytegenskapen. Foreløpig et arbeid pågår de foreslåtte tilleggene til CSS, inkludert formene rektangel, insett-rektangel, sirkel, ellipse og polygon.
I den første implementeringen vil vi bare kunne flyte rundt figurer. For å gjøre det bruker vi form-utvendig eiendom, slik som:
Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.