Separation av innehåll och presentation i ett CMS med WYSIWYG-gränssnitt

Relevanta dokument
Webbteknik. Innehåll. Historisk återblick Teknisk beskrivning Märkspråk Standardisering Trender. En kort introduktion

Hur hänger det ihop? För att kunna kommunicera krävs ett protokoll tcp/ip, http, ftp För att veta var man skall skicka

Varför ska man använda ett CMS? Vilka är fördelarna och är det alltid bra? Kattis Lodén

Litteratur. Nätverk, Internet och World Wide Web. Olika typer av nätverk. Varför nätverk? Anne Diedrichs Medieteknik Södertörns högskola

Content Management System. Publiceringssystem

Webbtillgänglighet. Webbtillgänglighet. World Wide Web Consortium. Web Accessibility Initiative, WAI WCAG 2.0 WCAG 1.0

Content Management System. Publiceringssystem


ITK:P2 F1. Hemsidor med HTML HTML. FTP, HTTP, HTML, XML och XHTML

Xhtml och CSS.Tillämpad fysik och elektronik Per Kvarnbrink (redigering Ulf Holmgren 2011)

Frågor och svar - Diagnostisk prov ht14 - Webbutveckling 1

Repetition. Hypertext. Internet HTTP. Server och klient Text försedd med länkar till andra texter. Många sammankopplade nät

Repetition. Hypertext. Internet HTTP. Server och klient Föreläsning 2. Text försedd med länkar till andra texter. Många sammankopplade nät

SICS Swedish Institute of Computer Science

Webbtillgänglighet. Tillgänglighet på webben. Hörselskadades behov. Synskadades behov. Kognitivt funktionshindrades behov. Rörelsehindrades behov

Content Management System. Publiceringssystem

TNMK30 - Elektronisk publicering

Optimering av webbsidor

Frågor och svar Gränssnittsdesign/Webbutveckling

Webbservrar, severskript & webbproduktion

Användbarhet för webben MDI, Webb och speciella behov 1

Introduktion Till WordPress

Att arbeta med. Müfit Kiper

Idag. Webben, HTML och CSS. Live demo. Webbens funktion

Språk för webben introduk4on 4ll HTML

Hantera informationspaket i system för bevarande

Klient/server. Översikt. Lektion 1: Webbtekniker från Microsoft. Webbteknik från Microsoft. Klient/server. Designmönster. Utrullning.

WEBB PRODUKTION. Tillgänglighet och Användbarhet Thomas Mejtoft. Thomas Mejtoft

Skriva, presentera och opponera uppsats på läkarprogrammet Examensarbete termin 10

Programmeringteknik. Planering MÅL LABB: MOMENT LAB4 HTML - EXEMPEL HTML. Webbdelen

Riktlinjer och regler för Karolinska Institutets webbplatser (utan bilagor)

Föreläsning 4. CSS Stilmallar för webben

<Webbutvecklare lektion="02"> Kursledare: Mahmud Al Hakim

Övning (X)HTML 2. Sidan 1 av

Redaktörshandbok Online

FrontPage Express. Ämne: Datorkunskap (Internet) Handledare: Thomas Granhäll

Webbprogrammering. Sahand Sadjadee

Svenska kommuners webbplatser 31 + och deras tillgänglighet. Webbtillgänglighet, kommuner, Verva, 24-timmarssamhället

F02 En första sida. Dagens agenda

Kort om World Wide Web (webben)

Introduktion Översikt av kursen och området webbteknik

Inlämningsuppgift 2. DA156A - Introduktion till webbutveckling Teknik och samhälle, Malmö högskola Oktober 2012

Grafisk webbpresentation

Användbarhet. Bryt rätt regler. Nils Ehrenberg

ATT GÖRA WEBBSIDOR. Frivillig labb

CMS, optimerade för programmerare Eller hur kan ett sådan skapas.

Olika slags datornätverk. Föreläsning 5 Internet ARPANET, Internet började med ARPANET

Introduktion till programmering

Presentera dig själv Laboration 1

Laboration 2: Xhtml och CSS.

Webbprogrammering, grundkurs 725G54

Introduk+on +ll programmering i JavaScript

2000-talet tillgänglighet på webben. Olle Olsson Swedish W3C Office Swedish Institute of Computer Science (SICS)

Webbprogrammering 725G54

Elektronisk publicering TNMK30

Labora&on 1 Introduk&on &ll utvecklingsmiljön övningar/uppgi<er

Webbens grundbegrepp. Introduktion till programmering. Ytterligare exempel. Exempel på webbsida. Föreläsning 5

CSS-övningar. 1. Grunder

Kursplan Gränssnittsdesign och Webbutveckling 1 Vårtermin 2014

För att skriva CSS-kod använder man sig av olika kommandon. Ett exempel på hur man kan skriva kod för att ändra textfärg kan vara:

Webbserver och HTML-sidor i E1000 KI

Utveckling av Brooklyn Tigers webbplats

HTML5 Semantic. Informationen kommer från w3schools.com. En semantisk elementet beskriver tydligt dess betydelse för både webbläsaren och utvecklaren.

Utvecklingen av ett tidregistrerings- och faktureringssystem

Kursutvärdering av Tekniker för webbdesign samt Tekniker för webbdesign, distans, 7,5hp (31KTW1, 31ETW1, 31FTW1), höstterminen 2016

MOT TILLGÄNGLIGA WEBBPLATSER WEBBPLATSER SOM FUNGERAR I ALLA WEBBLÄSARE NU OCH I FRAMTIDEN. Kandidatuppsats i informatik

LaTeX. Grunderna till dokumentsystemet LaTeX. Eric Elfving Institutionen för Datavetenskap (IDA)

Copy Cat Laboration 4

Statistik från webbplatser

Laboration 2. Webbproduktion En stiligare webbsida HT2015

Användbarhet för webben

Användbarhet för webben

Undervisningen i ämnet webbutveckling ska ge eleverna förutsättningar att utveckla följande:

En stiligare portal Laboration 3

Projektuppgift.

Hi-Fi Prototyping + laborationsgenomgång & verktyg

WEBBUTVECKLING Kursplanering

Labora&on 1 Introduk&on &ll utvecklingsmiljön övningar/uppgi<er

Tillgänglighetskrav på teknik Dessa krav baseras på WCAG 2.0,

Hemsideprojekt för Kulas Ponnystuteri

HTML och CSS. Eric Elfving Institutionen för Datavetenskap (IDA)

Tentamen på kursen Webbdesign, 7,5 hp

Riktlinjer för examensarbetare

Olle Olsson. December 2006

ORDLISTA WEBBDESIGN 100P

Webbprogrammering TDDD52

Elektronisk publicering TNMK30

behövs för enhetlighet, tala samma språk, så att användaren kan lära sig och använda det vidare.

Next -> Next -> Finish

Visio och SharePoint 2010 Better together. Staffan Söderholm Specialist MS Visio Train IT Stockholm AB

Laboration 3 i kursen Produktion för tryckta medier och webb: Webbplatsproduktion med ett publiceringssystem

Webbdesign. Fotografiska vann bästa webbsite 2015 i kategorin turism:

Webbpublicering. Teknikintroduktion 1 Jody Foo (jodfo@ida.liu.se)

Användarcentrerad design Structure plane (tredje nivån)

Digital inlämning av årsredovisningar

HTML och CSS. Eric Elfving Institutionen för datavetenskap. 18 augusti 2015

Tentamen etjänster och webbprogrammering

Internets historia Tillämpningar

Manual för Typo3 version 4.2

Avancerade Webbteknologier 2. AD11g Göteborg 2012 Mobilanpassning

Transkript:

Utkast FORSKNINGSPLAN Datum: 12.4.2005 Respondent: Simon Rönnqvist Opponent: Pia Rönnberg Handledare: Johnny Biström Separation av innehåll och presentation i ett CMS med WYSIWYG-gränssnitt Utgångspunkter samt bakgrund och teori W3C (World Wide Web Consortium) är det organ som definierar standarder på webben (jfr. ISO). Organistationen leds av webbens uppfinnare Tim Berners-Lee. Enligt deras rekommendationer bör man bl.a. försöka separera information om utseendet från innehållet på webbsidor, vilket kallas för separation av innehåll och presentation. HTML (HyperText Markup Language) eller i min produktion den modernare versionen XHTML är det format i vilket man strukturerar webbsidors innehåll. CSS (Cascading Style Sheets) är ett format för att beskriva webbsidors utseende. I CSS-koden definieras alltså webbsidors olika elements visuella egenskaper, så som typsnitt och iom. nyare versionen CSS2 även mer layoutrelaterade egenskaper. (X)HTML-kod skall alltså inte användas för att beskriva utseende utan för att beskriva olika partier av innehållet på webbsidan. Detta kallas för semantisk kod och innebär att den t.ex. berättar vad som är en huvudrubrik men inte hur den skall se ut. (X)HTML-koden och CSS-koden hålls i regel separat, vilket bör tillämpas för separation av innehåll och presentation. Även en del av nyttan av att följa dessa rekommedationer tas upp i slutarbetet, men utelämnas här pga. att det är ett så mångfasetterat område. Som slutproduktion designar jag standardenliga webbsidor åt trubaduren Håkan Streng, med fokus på eftersträvande av en separation av innehåll och presentation. Håkans sambo skall fungera som webbredaktör, alltså stå för uppdateringen av webbsidorna. För att sitens struktur skall hållas intakt behövs ett uppdateringsverktyg, ett s.k. CMS (Content Management System) som bl.a. håller innehållsmässig och presentationsmässig data separat. En WYSIWYG-editor är en viktig men fristående komponent i det CMS jag tillämpar. En WYSIWYG ( What You See Is What You

Get ) är en innehållseditor som likt en ordbehandlare hela tiden visar hur sidan skulle se ut om den publicerades. Själva CMS:et hanterar informationen på servern (dvs. lagring och visning), medan WYSIWYG:en körs i webbläsaren. Slutarbetets fokus är inte på saker som är specifika för min slutproduktion, utan snarare på sånt som torde vara applicerbart på uppdateringsverktyg för enkla standardenligt designade webbsidor i allmänhet. Detta torde vara av allmänt intresse iom. att ett hinder för en mer vidsträckt tillämpning av webbstandarder är CMS:ar som producerar icke-standardenlig kod, ofta pga. deras eventuella WYSIWYGeditorer. Syfte och mål I slutproduktionen används Bitflux Editor som WYSIWYG-editor. Den efterlever rekommendationerna beträffande separation av innehåll och presentation bäst av alla editorer (med öppen källkod) som jag hittat. (Öppen källkod förbättrar avsevärt möjligheterna till att på egenhand kunna lösa vissa eventuella problem.) En närmare redogörelse för valet av WYSIWYG-editor kommer i det egentliga slutarbetet. Analysdelen fokuserar dock på Bitflux Editor som jag valt att använda i slutproduktionen. Som CMS används troligen Bitflux CMS, men till det finns även andra goda konkurrenter. Även om valet av CMS påverkar möjligheterna är det inte lika avgörande som själva WYSIWYG-editorn. Eftersom Bitflux Editor kan användas tillsammans med flera olika sorters CMS väljer jag att fokusera på själva editorns funktionalitet. Dock kan även möjligheter som involverar CMS:ets egenskaper vid behov diskuteras, fast jag försöker att hålla diskussionen på en nivå som mestadels är applicerbar även på andra CMS:ar. Syftet med slutarbetet är att utreda i vilken mån WYSIWYG-editorn Bitflux Editor kan tillfredsställa behovet av separation av innehåll och presentation på Håkan Strengs webbsidor.

Frågor: 1. Vilka problem och möjligheter har Bitflux Editor med att tillfredsställa Håkan Strengs webbsidors behov av separation av innehåll och presentation? 2. Hur kunde eventuella problem lösas så att separationen skulle bli fullständigare? 3. Vad skulle dessa lösningar ha för praktiskt betydelse? (Är dessa lösningar alltså till någon praktisk nytta eller förbättrar de bara separationen av innehåll och presentaiton som ett självändamål?) Vad webbstandarder beträffar bör noteras att det innefattar även mycket annat än separation av innehåll och presentation. Även om jag i produktionen försöker följa alla för projektet relevanta webbstandarder avgränsar jag mitt slutarbete till att endast behandla separationen av innehåll och presentation. Absolut separation av innehåll och presentation är i praktiken omöjlig, det kan närmast ses som ideal. Man kan också diskutera var gränsen mellan innehåll och presentation går. I slutarbetet refererar eller citerar jag även vissa resonemang kring detta. (I praktiken separaras även i viss mån struktur från innehåll iom. lagring av data i XML-filer och databaser. Detta innebär t.ex. att webbsidornas editerbara innehåll är separerat från element som förekommer på varje sida. En total separation av struktur och innehåll är omöjlig iom. att innehållet då skulle bli oförståeligt för webbservern. Trots allt är struktur och innehåll sammanfogat i den XHTML-kod som webbsitens besökares webbläsare förses med. Jag väljer därför att fokusera på enbart en uppdelning av innehåll (innefattande struktur) och presentation. I detta fall är alltså struktur och innehåll synonymt. Struktur och innehåll används även i många fall synonymt, då man även ofta talar om separation av struktur och presentation men menar samma sak.) Metod Bitflux Editor och Bitflux CMS har ganska knapphändig dokumentation. Däremot har de e-postlistor via vilka projektens huvudinitiativtagare Christian Stocker svarar på frågor som rör produkterna. Genom att fråga sig fram samt söka i e-postlistornas arkiv kan man också hitta svar på frågor som uppstår under produktionen.

Med hjälp av e-postlistorna och dokumentationen försöker jag tillämpa Bitflux Editor på lämpligast möjliga vis för att lägga upp ett system som tillfredsställer Håkan Strengs webbsidors behov av separation av innehåll och presentaiton. Webbsidornas behov av separation av innehåll och presentation avgörs utgående från på detta fall applicerbara utsagor från W3C och andra auktoriteter * inom webbstandarder. Jag dokumenterar i vilken mån dessa behov kunde tillfredsställas och diskuterar eventuella gränsfall. Ett diskutabelt gränsfall kunde vara ett fall i vilket en auktoritets utsago skulle vara applicerbar men kanske inte i detta fall ha någon praktisk betydelse. Ifall denna diskussion blir av spekulativ karaktär kan den inte förekomma i analysendelen utan måste tas upp först under sammanfattning och diskussion. Källor Bitflux Editor http://bitfluxeditor.org World Wide Web Consortium http://www.w3.org/ The Web Standards Project, gräsrotsorganisation som har haft en betydande roll bl.a. i att få webbläsartillverkare att göra webbläsare som stöder webbstandarder http://www.webstandards.org A List Apart, en webbtidning för webbdesigners med många artiklar av auktoriteter inom webbstandarder http://www.alistapart.com Digital Web Magaizine, en annan webbtidning som ofta behandlar webbstandarder http://www.digital-web.com Eventuellt andra artiklar från andra siter med auktoriteter inom webbstandarder. * Person som arbetar eller har arbetat för W3C eller the Web Standards Project eller har fått sitt erkännande av någon därifrån.

Berners-Lee, Tim; Fischetti, Mark. Weaving the Web. The original design of the World Wide Web by its inventor. 2000. New York: HarperCollins. 246 s. ISBN 0-06- 251587-X. Briggs, Owen; Champeon, Steven; Costello, Eric & Patterson, Matt. Cascading Style Sheets. Separating content from presentaiton. 2004. 2 uppl. Berkeley: Friends of ED. 409 s. ISBN 1-59059-231-X. Cederholm, Dan. Web standards solutions. The markup and style handbook. 2004. Berkeley: Friend of ED. 253 s. ISBN 1-59059-381-2. Hjelm, Johan. Informera på Internet. Hur man sätter upp sin egen WWW. 1995. Lund: Studentlitteratur. 137 s. ISBN 91-44-60561-7. Meyer, Eric A. Cascading Style Sheets. The Definitive Guide. 2004. 2 uppl. Sebastopol: O'Reilly Media Inc. 507 s. ISBN 0-596-00525-3. - Eventuellt också något ur de två mer pratiskt orienterade böckerna: Eric Meyer on CSS och More Eric Meyer on CSS. Shea, Dave; Holzschlag, Molly. The Zen of CSS design. Visual enlightenment for the web. 2005. Berkeley: Peachpit Press. 296 s. ISBN 0-321-30347-4. Zeldman, Jeffrey. Designing with web standards. 2003. Indianapolis: New Riders. 436 s. ISBN 0-7357-1201-8. Zeldman, Jeffrey. Taking Your Talent to the Web. A Guide for the Transitioning Desinger. New York: Macmillan Computer Pub. 426 s. ISBN 0-7357-1073-2. Tidsplan Från Till Vad? 20.04 Presentation av forskningsplan och disposition 01.05 31.08 Färdigställande av slutproduktion samt största delen av slutarbetet. 01.09 31.10 Presentaiton av nyckelkapitel Finslipning av slutarbetet Slutpresentation