Használja a CSS-t Stílus egy Tag Cloud-hez
A címkefelhő a tételek listájának vizuális ábrázolása. Gyakran láthatja a címkék felhőit a blogokon. A Flickr oldalakkal népszerűvé vált.
A címkefelhők egy olyan listák listája, amelyek méretekben és súlyokban (néha színben is) módosulnak bizonyos mérhető attribútumtól függően. A legtöbb címkefelhő a népszerűség vagy az adott címkével ellátott oldalak számán alapul. De létrehozhat címkefelhőt a webhelyen található olyan elemek listájából, amelyeknek legalább két megjelenítési módja van. Például:
- A cikkek listája abc sorrendben a cikkek népszerűségét jelző stílusokkal.
- A webhelyek listája ábécés sorrendben a stílusokkal, jelezve, hogy melyik tetszik legjobban.
- A webes szerkesztők felsorolása az árrendben szerepel a stílusokkal, jelezve, hogy a közelben minden egyes előre meghatározott kritériumkészletet tartalmaz.
- A baráti listát a stílusok jelzik a távolság a házat az övék.
Mit kell felépíteni egy tagfelhőt?
Könnyű felépíteni egy címkefelhőt, csak két dolgod van:
- Az elemek listája (például webes cikkek, webhelyek vagy barátai)
- Minden elemre vonatkozó mérés (például napi oldalnézetek, 1-10-es rangsor, vagy távolság a házadhoz).
A legtöbb címkefelhő a linkek listája, így segít, ha minden elemhez hozzá van rendelve egy URL. De ez nem szükséges vizuális hierarchiát létrehozni.
A népszerű linkek címkefelhőinek létrehozásához szükséges lépések
A webhelyem olyan cikkeket tartalmaz, amelyek naponta megjelenítik az oldalnézeteket, és ez egy egyszerű metrika, amivel létrehozhatok címkefelhőt. Tehát ehhez a példához hozzon létre egy címkefelhőt a cikkem listájából, amely a webhelyem legfontosabb 25 cikke a 2007. január 1-jei héten.
- Határozza meg, hány szintet szeretne a hierarchiában.
- Bár lehet, hogy annyi szint van a felhőben, mint a listán szereplő elemek, ez fárasztóan kódolt, és a különbségek nagyon minimálisak lehetnek. Azt javaslom, hogy a hierarchiában legfeljebb 10 szint legyen.
- Határozza meg az egyes szintek vágási pontjait.
- Lehet, hogy olyan egyszerű, mint az oldalnézeteinek naponta történő vágása 1/10 szeletbe - pl. ha a webhelyének legnagyobb oldala naponta 100 oldalmegtekintést kap, akár 100+, 90-100, 80-90, 70-80, stb. szeletelhetnénk. Az oldalnézeteimet ilyen módon vágtam fel.
- Sorolja fel az elemeket az oldalnézeti sorrendben, és adjon nekik egy rangot a 2. lépés alapján
- Ne aggódjon, ha nincsenek olyan elemei a résidőkben, amelyek csak a felhő érdekesebbé teszik.
- A listát ábécé sorrendben (vagy bármilyen másfajta rendezést szeretne használni) használja.
- Ez teszi az érdeklődést a felhőnek. Ha elhagyja rangsorolás szerint, akkor csak egy lista lesz a legmagasabb tételekkel a legalsóbb alján.
- Írja be a HTML-kódot úgy, hogy a rang egy osztályszám. class = "tag4"> Streaming audio fájlok hozzáadása
Miután megadta a HTML-t az egyes elemek listájához és a megjeleníteni kívánt sorrendhez, akkor döntést kell hoznia. A hivatkozásokat egy bekezdésbe teheti, és készen áll. De ez nem szemantikailag megjelölve, és bárki, aki nem érte el a CSS címke felhőjét, csak egy nagy hivatkozási bekezdést látna. Az ilyen típusú lista HTML-je így fog kinézni:
Streaming audiofájlok hozzáadása Alapvető címkék egy weboldalhoz Legjobb webes tervező szoftver Weboldal létrehozása a teljesen elveszett Szín szimbolizmus Ehelyett azt javaslom, hogy hozzon létre címkefelhőt egy rendezetlen listával. Ez még egy sor HTML és CSS kód, de biztosítja, hogy a tartalom olvasható legyen, függetlenül attól, hogy kik érkeznek hozzá. A HTML így fog kinézni: Most jutunk el a szórakoztató részhez - a CSS stílusokhoz. Amikor megcímkéz egy címkefelhőt, általában megváltoztatja a betűméretet és a betűk súlyát. Módosíthatja a betűtípus színét, a hátteret vagy bármilyen más stílusú attribútumot is, de a méret és a tömeg hagyományos. 10 stílusosztályra van szükséged, egy minden rangsorban: Szeretem néhány magatípust magába foglalni: a felhő szövegét középpontba állítani, a vonalmagasságot úgy beállítani, hogy a felhő olvasható legyen, és győződjön meg róla, hogy a horgonycímkéknek nincsenek kitöltve: Végül, ha a szemantikus stílusmódot használja (pl. A rendezetlen listát), akkor még két sor CSS-t kell hozzáadnia ahhoz, hogy a lista ne legyen golyó, és nem indítva:
De hol vannak a Stílusok a Tag Cloud számára