Krišs ([info]misame) rakstīja [info]html_css kopienā,
@ 2006-07-13 10:05:00

Previous Entry  Add to memories!  Tell a Friend!  Next Entry
Semantic markup un attēlu nosaukumi
Sāku (pār)rakstīt fotogalerijas skriptu. Viena no vēlmēm ir dabūt skaistāku semantisko markupu nekā bija.
"Aplauzos" jau pašā sākumā, proti, ar fotogrāfijas nosaukumu.
Ideja: sākotnējā skatā ir bildīšu (thumbnailu) saraksts un tiem blakus - nosaukumi. Varbūt vēl kaut kāda papildinformācija, piemēram "ir XX komentāri", "ievietots NN datumā".
Kādu HTML elementu izmantot nosaukumam?
Man prātā ienākušie varianti:
- h1/h2/h3 it kā būtu OK, bet vai tas ir virsraksts? Varbūt, mazliet. Atspējojot CSS, izskatīsies ļoti jocīgi.
- dfn - jo varbūt tādā veidā tiek definēts, ka šis nosaukums ir jāsaprot kā šī bilde vai otrādi. Bet tad dfn-ā būtu jāliek gan bilde, gan nosaukums, kas būtu mazliet jocīgi.
- visu to sarakstu formēt kā DL, nosaukumus likt kā DT un attēlus kā DD.. arī būtu jocīgi laikam

.. un vēl kādas labas idejas? ;-)


(Ierakstīt jaunu komentāru)


[info]nfoworm
2006-07-13 10:28 (saite)
Kaada gan vaina h1/h2/h3? Nebuus CSS - izskatiisies peec klasiskas Web 2.0 lapas :D

(Atbildēt uz šo) (Diskusija)


[info]misame
2006-07-13 10:39 (saite)
Nu, it kā jau vainas nav.
Tad varētu gribēties markupu apmēram šādu:

<h2>Mēs ar juriju</h2>
<p><img src="images/shmiga.jpg" alt="Mēs ar juriju" />
<div class="imgDate">Attēls ievietots vakar</div>
<div class="imgComments">Attēlam nav komentāru</div>
</p>


Savukārt nav pārliecības, ka to būs viegli grafiski izkārtot tā, kā gribētos, jo gribētos kreisajā malā bilduci un tai blakus (tajā pašā rindā) - nosaukumu.
Pamēģinās.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]nfoworm
2006-07-13 10:41 (saite)
Jaaizmanto buus floati un/vai relatiivaa pozicioneeshana.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]misame
2006-07-13 10:43 (saite)
mhmm.. labi, ka tiem bildukiem vismaz platums ir konstants, tas situāciju uzlabo ;-)

(Atbildēt uz šo) (Iepriekšējais)


[info]ns
2006-07-13 10:49 (saite)
da kāda starpība, ko izmanto - veidi ir 100 un viens.

(Atbildēt uz šo) (Iepriekšējais)


[info]ns
2006-07-13 10:49 (saite)
es drīzāk gribētu ieteikt:
[div class="bla"] - tīri priekš pozicionēšanas
[h4]Tu ar Juriju[/h4]
[img .../]
[p]blabla[/p]
[p]komentāri[/p]
[/div]

šitā sanāk daudz semantiskāk, jo tie propertiji manuprāt nebūtu jāliek iekš div, bet p. šitā vieglāk arī būtu stilot, jo būs viens div, uz kuru tad attiecīgi attiecināt visiem apakšelementiem stilus. turklāt būs tikai viens ne-semantiskais elements (div), kas pat sanāk diezgan semantisks, jo tiešām apraksta kaut kādu bloku.

un patiesībā uzskatu, ka gana semantiski būtu thumbnails kolekciju likt tabulā.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]misame
2006-07-13 10:54 (saite)
nujā, šis variants izklausās mazliet dabiskāks, tiesa.

Tabulas lietošana laikam īsti neatrisinātu problēmu ar to, kādu elementu izmantot nosaukumiem, lai pat google saprastu, ko tas nozīmē ;-)

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]ns
2006-07-13 11:00 (saite)
nu es jau arī par to nerunāju - tabula bija tikai papildus ieteikums. es palieku pie domām, ka atbilstošais nosaukma elements būtu h4 vai h3 - atkārīgs kā tu lapā tos lieto kopumā.

tabula manuprāt būtu labs ziavietojums tiem iekļaujošajiem div... turklāt arī stilot būtu ķēpīgāk, bet par layoutu nebūtu jāraizējas.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


(Anonīms)
2006-07-13 14:19 (saite)
tas divs tur maisaas. der atcereeties, ka tas buus saraksts ar atteeliem.

varbuut vareetu buut kas shaads driizaak:

<ul>

    <li>
        <h3> atteela virsraksts </h3>
        <img src="foo.jpg" />        
        <p> atteela apraksts ja nu taads ir </p>
        <ul>
            <li> <a href="?comments"> 12 komentaari </a> </li>
            <li> pievienots vakar </li>
            <li> focheets ar aciim ciet </li>
            ...
        </ul>
    </li>   
    
    ...
    
</ul>


nu un tad taalaak nianses: aareejaa UL vietaa varbuut vajag OL, IMG var likt title atribuutu, kuraa atkaartot virsrakstu utt

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]ns
2006-07-13 14:32 (saite)
lietas, kas ir labas, ir tādēļ labas, ka tās dara to, ko vajag un tur, kur vajag. lai nu kas - šis nebūs sarkasts ar attēliem. tas jebkurš raksts būtu uztveram kā saraksts no paragrāfiem. tas jau ir marasms nevis semantika.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


(Anonīms)
2006-07-13 14:40 (saite)
kaa nu ne?! taads thumbnailu saraksts jau nav nekas cits kaa navigaacijas izveelne, buutiibaa linku saraksts uz taalaakajaam lapaam, taads pats kaa, piemeeram, lapas galevnais menu, tikai ar mazliet vairaak info pie katra itema, ne tikai nosaukumu.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]ns
2006-07-13 14:42 (saite)
nu ok - es varētu mēģināt to iedomāties un piekrist, bet tikai tad, ja tas būtu izkārtots nevis režģa, bet vienas kolonnas/rindas veidā. ja būs režģis, tad manuprāt tas sarakstu nestings būs tikai par apgrūtinājumu.

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


(Anonīms)
2006-07-13 14:51 (saite)
nu izkaartojums jau ir css lieta. rindaa, kolonnaa vai rezhgjii – tam it kaa nevajadzeetu iespaidot html struktuuru, vai ne? :P
cita lieta, ka tas var nebuut visvienkaarshaak realizeejamais variants, bet sheit jau nebija jautaajums par to, kaa aatraak.

re ku te btw kaa reiz viss jauki – i rezhgjis, i UL :
http://brunildo.org/test/ImgThumbIBL2.html

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]ns
2006-07-13 15:07 (saite)
ok, ok - pielauzi :) tas piemērs gan bija sū*s citos sīkumus, bet nu es jau pats klūstu marasmatisks tik garā sarunā :)

(Atbildēt uz šo) (Iepriekšējais)


[info]misame
2006-07-13 15:10 (saite)
Pagaidām arī domāju to likt vienā kolonnā, kā man ir pašlaik... abet varbūt arī tomēr režģī? :-)

(Atbildēt uz šo) (Iepriekšējais) (Diskusija)


[info]ns
2006-07-13 15:19 (saite)
nē nu īstenībā pofig - piekrītu anonīmajam kritiķim, ka tam nav nozīmes, kā tas saraksts ir izkārtots. man tā doma iepatikās. un bildes ar dažas iepatikās.

(Atbildēt uz šo) (Iepriekšējais)


[info]kits
2006-07-13 10:30 (saite)
web 2.0 FTW!!!

(Atbildēt uz šo) (Diskusija)


[info]kits
2006-07-13 10:30 (saite)
tā, šito es gribēju infotārpam pakārtot - neraža sanāca..

(Atbildēt uz šo) (Iepriekšējais)


[info]kangaroo
2006-07-13 10:36 (saite)
< pre > ?

(Atbildēt uz šo) (Diskusija)


[info]ns
2006-07-13 10:45 (saite)
pre?!

(Atbildēt uz šo) (Iepriekšējais)


(Anonīms)
2006-07-13 10:57 (saite)
WTF U KREIZY?!

(Atbildēt uz šo) (Iepriekšējais)

Varbūt ne veiksmīgākais piemērs, bet…
[info]wasted
2006-07-13 11:43 (saite)

HTML doesn't have an element that allows to insert a figure with a caption. It was once proposed, but never made it into HTML4.

(Atbildēt uz šo) (Diskusija)

Re: Varbūt ne veiksmīgākais piemērs, bet…
[info]misame
2006-07-13 11:50 (saite)
bet rakstiņš noderīgs, paldies!

(Atbildēt uz šo) (Iepriekšējais)


[info]bh
2006-07-13 20:46 (saite)
Un kapēc nevar tabulas? :)
http://www.alistapart.com/articles/practicalcss/

(Atbildēt uz šo) (Diskusija)


[info]bh
2006-07-13 20:54 (saite)
Nē nevar tabulas, ja grib uber. Ar tabulām tad ari īstenībā būtu jātaisa
bilde apraksts lala blabla
bilde apraksts lala blabla
bilde apraksts lala blabla
Tāda būtu tabulas jēga.
Atliek uber.css

(Atbildēt uz šo) (Iepriekšējais)


Neesi iežurnalējies. Iežurnalēties?