Texteditor i ASP.NET AJAX släpps på CodePlex

Kannan Sundarajan har skapat en "Rich Text Editor"-kontroll med ASP.NET AJAX och delat ut den med en MS-PL licens på CodePlex. Läs mer hos Kirti's blog för skärmskott och kolla in ett demo.

Ser ut att vara en någorlunda start. Men att det blir radbryt vid entertryckning istället för paragraf, att den inte stödjer XHTML och att den använder FONT-taggar tycker inte jag är så bra.

Förhoppningsvis utvecklas den fint av communityn så det är nog något att hålla ögonen på.

By Jesper Lind

Exempel på enkel box-layout

Imorgon ska jag lära en kille grunderna i webb-design och html-programmering. Tänkte även att detta kan vara något att skriva om i bloggen, så andra läsare kan få nytta av detta.

Ett enkelt exempel i XHTML

Nu ikväll har jag förberett en enkel stuktur för en webbplats för att ha något att börja med. Denna kan ni se på följande länk:

Simple box-layout

Exempel-sajten är kodad i XHTML 1.0. Funderade ett tag på om det var bättre att använda HTML som första exempel, men vi kör med XHMTL till en en början så får vi se.

Layout utan tabeller

Sajten i exemplet är kodad utan tabeller använder istället <div>-taggar som positioneras med hjälp av CSS.

Validerad

Ofta stöter man på konstigheter med att olika webbläsare visar layouten olika. Det första man bör göra är att se till att korrekt CSS och HTML (länkarna går till valideringsverktygen hos W3C). Det är en förutsättning för att de olika webbläsarna ska få en chans att visa ditt innehåll som det var tänkt.

Övrigt

Till sajten har jag använt lite externa resurser. "Lorem Ipsum"-texterna har jag fått genererade här och bakgrundbilden lånade jag från Kaliber 10000.

By Jesper Lind

Lista över alla element i HTML 3.2 till XHTML 2.0

Jens Meiert berättar att han har skapat en lista över alla element som finns i HTML 3.2, HTML 4.01 (alla dokumenttyper), XHTML 1.0 Strict, XHTML 1.1, HTML 5 och XHTML 2.0.

Även fast de sista tre två specifikationerna inte är klara, så ska tabellen representera de senaste rekommendationerna. Han förklarar att han ska fortsätta att uppdatera listan så fort några förändringar sker.

Rene Sarsoo har gjort en variant av listan med färgkodning, så man kan se vilka element som är på väg bort och vilka som är nytillkomna.

Uppdatering: W3C släppte nyligen ett utkast över förändringar mellan HTML 4 till HTML 5.

By Jesper Lind

XHTML Strict med .NET

Här gör jag en liten sammanfattning om tips för hur man får en .NET-applikation att validera som XHTML Strict.

Så testar man 

För att avgöra om sina sidor validerar mot den webbstandard som man valt att följa så kan man använda valideringsverktyget från WC3.

Vill man vara extrem så kan man ju även testa den nya betaversionen. Märkte just en skillnad från den vanliga versionen. I nya betan måste ange rätt namnrymd i html-taggen för att validera som Strict, så här alltså:

<html xmlns="http://www.w3.org/1999/xhtml">

Ställ in Web.config 

Använder man .NET som utvecklingsplattform så finns det några saker man bör ha med i <system.web>-delen av Web.config för att slippa konstiga fel.

Dels så bör man lägga till W3C_Validator i BrowserCaps som vi förklarat tidigare.

<browserCaps>
<case match="W3C_Validator*">
TagWriter = System.Web.UI.HtmlTextWriter
W3CDomVersion = 1.0
</case>
</browserCaps>

Sen även lägga till följande rad så att koden ska följa Strict-standarden. I detta läge får inte form-taggen inte ska få något name-attribut (det får den inte ha i XHTML). Antagligen är det fler saker som händer med koden men vet inte precis.

<xhtmlConformance mode="Strict" />

Den extra diven runt viewstate

I och med .NET 2.0 så har en del förändringar skett så att koden ska bli mer XHTML-kompatibel. Bland annat så läggs numera en extra <div> runt viewstate.

Det här kan dock ställa till problem med CSS formatering. För den nya div-taggen har inte har någon css-klass eller id och är därför svår att styla utan att påverka resten av dokumentet. Den här taggen har flera gånger förstört layouts för mig, så jag förstår de som klagar.

By Jesper Lind

Integrera W3C Validation Service i dina projekt

När man tillhandahåller ett CMS-system åt en kund så är det nästan oundvikligt att kunderna kommer att skriva in ogiltig XHTML. Alla kan helt enkelt inte vara webbstandard-freaks och det är inget man kan kräva av någon.

Då skulle det vara perfekt om man kunde få en varning så fort ogiltig kod har publiserats, så man kan gå in och rätta till den.

Blitz Labs har gjort en sådan lösning och delar med sig av .NET-koden. Funktionen tar emot en url som ska kontrolleras. Skickar ett anrop till W3C Markup Validation Service. Tar emot resultatet genom deras SOAP-tjänst och transformerar det till RSS med hjälp av en XSLT-fil.

Prenumenera sedan på den RSS som skapats och få meddelande så fort någon ogiltig kod har publiserats.

By Jesper Lind

Utvärdering av textarea-editorer

Läste nyligen hos media:screen att Peter Kranz har gjort en utvärdering av textarea-editorer och rangordnat dem enligt hur bra de klarar av att formatera giltig HTML. Totalt åtta olika editorer finns med i testen, sju av dem är så kallade WYSIWYG-editorer och en av dem är en WYSIWYM-editor.

Den senare beteckningen (What You See Is What You Mean) var något nytt för mig men låter definitivt som något att kolla vidare på. Om jag har förstått det rätt så ska denna nya typ av editor generera XHTML och separera innehåll från formatering i större mån. Läs mer om den nya typen av editor eller testa en demo-version av WYMeditor som hör till denna kategori.

Med på Peters test finns TinyMCE som jag installerade i mitt blogg-system nyligen. Den kom bara på tredje plats i testen pga inkorrekt nästlade listor, inget stöd för tabellcaptions och avsaknad av lang-attributet. I nästa version av editor (2.1) kommer dock dessa problem vara lösta meddelar utvecklarna på Moxiecode i en kommentar till testet.

By Jesper Lind

Flash - som man bäddar får man ligga

Det har nyligen blivit krångligare att embedda flash i sina projekt. I alla fall om man vill följa webbstandarder och få det att funka i alla webbläsare.

En käpp i hjulet var Eolas stämning mot Microsoft som ledde till att mjukvarujätten beslutade sig för att ta bort viss funktionalitet ur IE. Som tur var gick det att hacka runt det och vi har skrivit om en lösning hur man fixar autostart på ActiveX-objekt tidigare.

En annan gång råkade vi i trubbel när vi på den här bloggen hade en flash-fil som vägrade att validera som XHTML. Då sökte vi hjälp hos en artikel hos suveräna "A List Apart".

Nu har samma sajt (AAL) skrivit en uppföljare med ny genomgång av flash-trasslet. Har inte läst hela men man diskuterar bland annat taggarna embed och object plats ibland webbstandarderna. Denna kommer jag återvända till nästa gång jag känner för att försöka använda flash och samtidigt ha en XHTML-kompatibel hemsida.

Uppdatering: Tyckte jag läst nåt annat om det här nyligen, Robert Nymans inlägg om XHTML med Flash är något att kolla vidare på.

By Jesper Lind

Radbryt och paragrafer

Robert Nyman skriver ett inlägg om i vilka lägen man bör använda <br />-taggen. Med de för tillfället 32 stycken kommentarerna fortsätter det hela till en intressant diskussion ur många synvinklar.

Tänkte passa på att ta skriva om en ganska massiv manöver jag nyligen genomförde på den här bloggen. Innan denna så avgränsades alla textstycken av dubbla radbryt och jag skrev all text för hand – inklusive taggarna. Inte en enda <p>-tagg på långt ögat nådde. Även alla länkar hårdkodade jag vilket blev väldigt jobbigt i längden, som ni kan förstå.

Så jag beslutade mig för att leta upp en WYSIWYG-editor och installera i vårt egenutvecklade bloggverktyg. Senast jag letade efter en sådan var för några år sen och då kunde jag aldrig hitta en som fungerade på alla marknadsledande webbläsare. Nu hittade jag äntligen en, nämligen den förträffliga TinyMCE, som för övrigt även används i Wordpress.

Sedan plöjde jag igenom alla inläggen med editorn och formaterade paragraferna som de bör göras. Rätt jobbigt kan jag lova eftersom vi precis som bloggen Reklamchock!!! nyligen firade 200-inläggs-jubileum.

Men nu är alla inlägg mer semantiskt korrekta och jag är en mycket gladare bloggare.

By Jesper Lind

W3C Markup Validation Service med .NET-sidor

Körde en test med W3C Markup Validation Service för att se att min sida validerar mot XHTML 1.0 Transitional standarden och märkte att så var inte fallet. Jag har gjort lite förändringar på sidan och något hade gått snett. En bild som rendereras av en ImageButton hade helt plötsligt fått ett border-attribut. Detta är inte giltig XHTML-kod och W3C-validatorn gav följande fel:

Error Line 240, column 577: there is no attribute "border". ..."", false, false))" border="0" />

När jag kollade källkoden på sidan såg jag dock inget border-attribut på bilden. Märkligt..

Efter lite undersökning så hittade jag posten "XHTML Validation Fails due to renders a BORDER="0" output" på Microsofts forum. Det verkar röra sig om ett missförstånd mellan W3C validator and ASP.NET ramverket. Lösningen är enkel, lägg till detta i Web.Config:

<browserCaps>
<case match="W3C_Validator*">
TagWriter = System.Web.UI.HtmlTextWriter
W3CDomVersion = 1.0
</case>
</browserCaps>

By Jesper Lind