Miten textarealla annetun tekstin saa pakotettua divin sisään jos käyttäjä ei ole painanut enteriä? Itse textarealla teksti menee seuraavalle riville mutta divissä rivi jatkuu reunojen yli.
word-wrap:break-word;
Tuo word-wrap: break-word on alun perin Microsoftin keksintö, nyt mukana myös CSS3-luonnoksissa ja selaintuki laajentunut. Mutta se siis ei suinkaan toimi kaikissa selaimissa. Olennaisempi ongelma syntyy silloin, kun se toimii. Se nimittäin katkaisee merkkijonon just siitä mistä sattuu. Eli esimerkiksi sana katkeaa keskeltä aivan mielivaltaisesti, eikä mitään tavuviivaa tule merkiksi jakautumisesta.
Yleensä on huono ajatus pakottaa teksti johonkin määräleveyteen tai kokoon, joten pitäisi ensin kysyä, miten ongelma on luotu. Siis mistä alun perin kenkä puristaa ja mitä ollaan tekemässä.
Normaalisti kyllä teksti "wräppää" divin sisälläkin kuten textareassa: jokainen välilyönti on mahdollinen rivinvaihtokohta. Nyt siis pitäisi tietää, miten tämä on estetty. Vai onko tässä kyse hyvin pitkistä sanoista tai merkkijonoista, joissa ei ole välilyöntejä?
Teksti ei wrappaa ikinä jos se on yhtälaista, esim pitkät urlit. Normaali teksti wrappytyy yleensä hyvin ilman mitään koska siinä on välejä tarpeeks usein. Kuva liittyy:
http://s3.amazonaws.com/firebelly/blog-posts/graphics/171/original/css_is_awesome.gif
divi jossa on word-wrap: break-word; vastaa wrappaykseltään samaa kuin textareassa on luonnostaan, eli jos yhtäläinen sana on liian pitkä textareassa se wrappaytyy kuten word-wrap: break-word; divissäkin.
Kumpi esim näistä on toivottu lopputulos pitkille sanoille ?
Itse asiassa kyllä pitkä URLikin saattaa wräpätä, jos siinä on esimerkiksi yhdysmerkki (-). Sellainen on kyllä virheellistä, mutta niin siis selaimet saattavat tehdä.
URLia(kaan) ei pitäisi pätkäistä mistä sattuu. Tästä on URL-spekseissä aika tarkat ohjeet, ja ottavatpa asiaan kantaa jopa kielten (siis immeisten kielten, niin kuin suomi ja englanti) ohjeet ja tyylioppaat. Jos URL ylipäänsä pätkäistään, niin sen ympärillä olisi käytettävä lainausmerkkejä tai muita rajoittimia. Tästä voi ehkä poiketa, jos URL muuten erottuu URLiksi, esimerkiksi koska siitä on tehty linkki. Mutta pätkäisy siis pitäisi tehdä älykkäästi. Yleensä riittänee, että tekstiä käsiteltäessä lisätään sallittu rivinvaihtokohta (<wbr>) aina vinoviivan "/" jälkeen (paitsi jos se seuraa vinoviivaa), kysymysmerkin "?" jälkeen ja et-merkin "&" jälkeen.
Mutta nythän emme tiedä oliko ongelmassa kyse URLeista vai jostain ihan muusta. Luultavasti jostain muusta.
Mietteitä tavutuksesta ylipäänsä (sivuaa aihetta, mutta vähemmän itse ongelmaa): HTML:n (ja selainten) tuki tavutukselle on perinteisesti ollut varsin heikkoa (johtuen mahdollisesti sen vähäisemmästä tarpeesta lyhytsanaisissa kielissä?) Kuitenkin, jos kurkistaa alalle, jossa on pohdittu jo satoja vuosia minkälaista tekstiä on helppo lukea (eli kirjoihin) - tai toisenlaista formaattia pohtiville, sanomalehtiin - huomaa selkeän trendin sen suhteen, tavutetaanko teksti, ja tasataanko se laitoihin: kyllä ja kyllä. Näin tehdään kaikessa asiallisessa taitossa (raportit, selostustyöt jne.) Leveydestä sellainen huomio, että 40 cm (tai vastaavat) ei ole lukijaystävällistä (automaattinen sarakkeisiin jako voi olla vielä lapsenkengissään).
Nykyään tavutusta voi harrastaa myös www:ssä (kiistanalainen mielipide, myönnän), mutta ilmaiseksi se ei tule. Tietokone on tässä asiassa ystävä (myös suomalaisen sisällön kanssa), mutta tämän varsin vähä-älyisen tekeleen ehdotelma on tarkistettava, jos ei halua sivuilleen tahatonta huumoria (ei erityisen hyvää sellaista). Joka tapauksessa, jossain sisällön lisäämisen vaiheessa (sellaisessa, jossa tavutusehdotuksen voi tarkistaa) automaattisen tavutustyökalun avulla lisätään tekstisisältöön tavutusehdotukset (vaihtoehdot: tekstiin lisätään oikeille kohdille "Soft Hyphen" eli ns. tavutusvihje joko suoraan merkillä (vaatii Unicode-muotoisen sisällön, näkymätön) tai entiteetillä ­). Sanojen jakamista aivan alusta (kuten o-mena) on syytä välttää, vaikka se kieliopillisesti oikein olisikin (ja varsinkin jos se ei ole, tai on kiistanalaista!) Tämä myös silloin, kun kyse on yhdyssanan jälkimmäisten osien alusta (esim. kansane-dustaja).
Täydellisyyteen pyrkiminen on turhaa, koska ladonnan voi tehdä "täydellisyyttä hipoen" vain erikseen tarkistamalla ja virheet korjaamalla, ts. vain kiinteille leveyksille. HTML-dokumentit ovat, myös kiinteäleveyksisten elementtien kanssa, lähtökohtaisesti vaihtelevanlaatuisia johtuen vaikkapa käyttäjän kirjasinvalikoimasta, tai tietokoneen kirjasinten renderöintitavasta (eroja on, mutta aivan kaikkea ei kannata lähteä huomioimaan). Vaikka selaimet eivät ilman työtä suostukaan sanoja tavuttamaan, niillä on paha tapa lisätä rivivälejä moniin sellaisiin kohtiin, joihin niitä erityisesti ei pitäisi laittaa, kuten kaksoispisteen jälkeen, ennen taivutuspäätettä. Tästä, ja muistakin syistä johtuen toistan: täydellisyyteen pyrkiminen on turhaa.
Kyllä tavutuksessa omat ongelmansakin on: varsinkin se, että tietyt vanhentuneet selaimet eivät osaa näyttää tavutusvihjettä oikein, vaan näyttävät jokaisen kohdalla viivaa (huono asia). Kannattaa selvittää haitat, ja punnita ne mieltämiänsä etuja vastaan (tyylikkäämpi sisältö?).
Aloitusviestin ongelmaan sekalaisia huomioita: yli menevän osan voi luonnollisesti piilottaa; rivinvaihdon pakottaminen riippuu pitkälti siitä, onko pitkässä tekstissä mielekästä jakokohtaa (esimerkkeinä URLit), vai pitääkö se vain valita mielivaltaisesti vähintään x merkin välein. Myös elementin leveyttä on syytä pohtia, jos monilla sisällöillä on vaikeuksia mahtua siihen.
eq: jos rajoitat hieman sulkujen käyttöä tekstissäsi, niin sitä jaksaisi lukeakin saamatta aivojaan umpisolmuun :)
Merri kirjoitti:
eq: jos rajoitat hieman sulkujen käyttöä tekstissäsi, niin sitä jaksaisi lukeakin saamatta aivojaan umpisolmuun :)
"Ei pysty, liian hapokasta". Kopioin tyylin suullisesta ilmaisusta, jossa tosin on merkittävästi erilaisia tapoja ilmaista virkkeiden olevan lähinnä sivuhuomioita, tai vaihtoehtoisella painotuksella. (Ilmaisutapa ei kieltämättä ole täydellinen tai edes välttämättä se intuitiivisin, enkä käytä sitä aina kieliopillisesti oikein; tiedän, muitakin olisi.)
En usko, että se on tässä suurin ongelma, elleivät sulkumerkit tekstin sisällä häiritse muista syistä poikkeusellisen paljon. Varsinainen paheeni keskustelupalstoilla ovat ylipitkät lauseet – ne, joissa vain kierrätetään ajatuksen katkaisuun käytettäviä merkkejä, jotta peitetään se, että pitkässäkin kappaleessa on vain yksi tai korkeintaan muutama täydellinen lause – jos sitäkään.
Toinen – edelliseen läheisesti liittyvä – pahe on lopuksi tehty lauseiden osittainen muokkaus. Tästä seuraavat kirjoitusvirheet – kuten yhteensopimattomat taivutuspäätteet – eivät siis ole välttämättä seurausta vain kehnosta äidinkielen osaamisesta, vaan ne johtuvat tietyn vaiheen jälkeen tehdystä vähäisestä oikolukemisesta (voiko tässä yhteydessä sanoa "tehdystä" ;)?)
eq kirjoitti:
Tietokone on tässä asiassa ystävä (myös suomalaisen sisällön kanssa), mutta tämän varsin vähä-älyisen tekeleen ehdotelma on tarkistettava, jos ei halua sivuilleen tahatonta huumoria (ei erityisen hyvää sellaista).
Olen siinä uskossa, että tietokoneille on olemassa varsin hyviä tavutussanastoja. En esimerkiksi ole itse kertaakaan törmännyt siihen, että Word olisi tavuttanut väärin suomenkielistä tekstiä.
Grez kirjoitti:
eq kirjoitti:
Tietokone on tässä asiassa ystävä (myös suomalaisen sisällön kanssa), mutta tämän varsin vähä-älyisen tekeleen ehdotelma on tarkistettava, jos ei halua sivuilleen tahatonta huumoria (ei erityisen hyvää sellaista).
Olen siinä uskossa, että tietokoneille on olemassa varsin hyviä tavutussanastoja. En esimerkiksi ole itse kertaakaan törmännyt siihen, että Word olisi tavuttanut väärin suomenkielistä tekstiä.
En kiistä. Sivuhuomiona todettakoon, että itse olen, montakin kertaa, törmännyt Wordin tekemiin virheellisiin tavutuksiin – mutta ehkäpä ne ovat www-sivuilla anteeksiannettavampia kuin tulosteessa. Tässä tosin puhun menneistä ajoista ja versioista, sillä en ole viime vuosina tarvinnut Wordin apuja tavutusta vaativissa dokumenteissa.
Tietokonetavutuksessa ongelmat painottunevat yhdyssanoihin ja taivutettuihin muotoihin. Esimerkkejä:
Lisäksi tavutustyökalut saattavat lisätä rivinvaihdon myös sellaisiin tavuväleihin, joihin sitä ei hyvän tavan mukaisesti tule laittaa; näistä puhuin ylempänä.
Jos dokumentin yleisvaikutelma on tärkeä, oikoluen sen paitsi kirjoitusvirheiden, myös tietokoneen tarjoaman tavutuksen osalta.</offtopic>
Mikään järkevä suomen kielen tavutus ei perustu tavutussanastoihin vaan yksinkertaisiin algoritmeihin (tavunraja on konsonanttiyhdistelmän viimeisen konsonantin edellä). Toissijaisesti sovelletaan sitten aika mutkikkaitakin lisäsääntöjä, ja niissä isoimman ongelman tuottaa yhdyssanojen tunnistaminen. Tästä johtuu se, että ohjelmat joko tavuttavat väärin (Wordkin tekee niin) tai jättävät tavuttamatta sallitusta, jopa optimaalisesta tavutuskohdasta. Mutta koko perusmenetelmä on toinen kuin englannin sanastopohjaisessa tavutuksessa.
Tavutus öATK:s-saö on kyllä epäsuotava vaikka sallittu, mutta öATK:-ssaö yksinkertaisesti väärin (mutta sellaista ei mikään ohjelma taida tuottaa, siihen tarvitaan ihminen; sen sijaan jotkin ladontaohjelmat saattavat jakaa kaksoispisteen jäljestä ilman tavuviivaa, eli rivin loppuun tulee öATK:ö ja seuraavan alkuun össaö, mikä on tietysti väärin).
Nettisivuilla kuitenkin ongelma on enemmänkin se, että mitään tavutusta ei ole. Pahimmat ongelmat on aika helppo välttää kirjoittamalla pisimpiin yhdyssanoihin tavutusvihjeet (soft hyphen) yhdysosien väliin. Todella hyvä rivijako onkin sitten paljon vaativampaa ja enimmäkseen mahdotonta nettisivuilla. Laadukkaimmat taitto-ohjelmat nimittäin tavuttavat kappaleen kokonaisuutena ja osaavat säätää sanojen (ja merkkienkin) välistystä. Selaimissa sellaisesta ei juuri ole toivoakaan.
No joo, tulipa todettua tosiaan että Word tavuttaa kansa-nautomme, eikä näin ollen voi käyttää sanastoa tavutukseen.
Ihmettelen miksi "mikään järkevä" suomen kielen tavutus sitten ei perustu sanastoihin? Sillähän nimenomaan päästäisiin näistä typeristä virheistä eroon. Wordissäkin on joka tapauksessa melko kattava sanasto oikolukua varten, joten miksei samaa voisi käyttää tavutuksen apuna?
Kyse on onnittelusivusta, jota testasin painamalla x-näppäintä niin kauan kuin siihen tekstiä mahtui. Kokeilin mitä tapahtuu jos joku kirjoittaa kaiken yhteen pötköön. No laitoin tuon word-wrap:break-word; joka katkoo ylipitkät sanat sopiviksi. Se, mitä se tulostaa on sitten käyttäjän vastuulla jos hän tekee ylipitkiä sanoja. Kiitos kaikille vastanneille.
lainaus:
URLia(kaan) ei pitäisi pätkäistä mistä sattuu.
Ihan sama mistä sen pätkäsee, CSS pätkäsy on VAIN kosmeettinen. Mitään \r tai \n tavuja ei siinä lisätä tekstiin joten CSSllä "pätkityt" (mitään pätkimistähän datalle ei edes tapahdu) urlit sisältää täysin samat merkit kuin alkuperäinenkin ja käyttäytyvät täysin samalla tavalla kuin yhdellä rivillä olevat 3000px urlit.
Jos taas tarkotit urlin luettavuutta, niin aika uskomaton väite että urli jonka copypasteeminen/lukeminen vaatii peruskäyttäjältä kilometrien side scrollausta on helpompi kuin normaali ylhäältä alas.
esajeejee kirjoitti:
lainaus:
URLia(kaan) ei pitäisi pätkäistä mistä sattuu.
Ihan sama mistä sen pätkäsee,
RFC 3986 (= Internet-standardi STD 66), liite C, on eri mieltä.
Samoin esimerkiksi SFS 4175:2008.
Yucca kirjoitti:
RFC 3986 (= Internet-standardi STD 66), liite C, on eri mieltä.
Samoin esimerkiksi SFS 4175:2008.
cssllä ehostettu html sivu on ihan eri kontekstissa kun plain text, mihin tuo liite C viittaa.
Vielä suora lainaus tosta:
lainaus:
In some cases, extra whitespace (spaces, line-breaks, tabs, etc.) may
have to be added to break a long URI across lines.
Vaan eipä tarvi lisätä (ja nimenomaan ei lisää, kuten edellisessä viestissä sanoin) mitään whitespacea kun css ei muuta itse dataa vaan ainoastaan sitä kuinka se näkyy selaimessa.
Kaikista pahin on laittaa jotain html tageja sinne väliin, vaikka ne ei näkyiskään päällepäin niin esim </p> tagi muuttuu kaheks newlinetavuks copypastettaessa.
esajeejee kirjoitti:
Vaan eipä tarvi lisätä (ja nimenomaan ei lisää, kuten edellisessä viestissä sanoin) mitään whitespacea kun css ei muuta itse dataa vaan ainoastaan sitä kuinka se näkyy selaimessa.
Kaikista pahin on laittaa jotain html tageja sinne väliin, vaikka ne ei näkyiskään päällepäin niin esim </p> tagi muuttuu kaheks newlinetavuks copypastettaessa.
Eihän URLeja sitä varten kirjoiteta nettisivuille, että ne copypastettaisiin. Yleensä ei kannata ollenkaan kirjoittaa URLeja, vaan kirjoitetaan selväkieliset linkit, ja linkkien osoitteissa sitten on URLit.
Jos URLin kirjoittamisella sivulle näkyviin on jotain merkitystä, niin silloin se URL on tekstinä, ja sitä koskevat sitten tekstin säännöt, joihin viittasin.
Hyvä syy kirjoittaa URL näkyviin on se, että teksti käsittelee (kuvailee, kommentoi tms.) URLeja, ja silloin niitä on parempi olla katkomatta mistä sattuu.
Aihe on jo aika vanha, joten et voi enää vastata siihen.
