I am a little bit fuzzy on what does the chart represent on the business slide http://rubenverborgh.github.io/WebFundamentals/birds-eye-view/#business. Maybe adding a legend with the colors and x and y axis labels would make it easier to read and understand. 10x

I am not 100% sure if it is a "bug" or desired behavior, but it seems strange that the example query would return no results (see screenshot):

Also, the previous two query examples return either no results or just the schema URIs. Seems strange, since examples should return something and also the query seems like there should be hits.

Although, "manually" checking
http://fragments.dbpedia.org/2016-04/en?subject=&predicate=&object=http%3A%2F%2Fdbpedia.org%2Fresource%2FPablo_Picaso
There is only one relation pointing to Pablo Picaso (and not being influencedBy), so I guess the results are as expected?

Anyway, I would suggest the examples be such, that they return data; that would be more informative for studying, IMO.

http://rubenverborgh.github.io/WebFundamentals/web-apis/#web-self-descriptive-messages

De 'Finding your way around' sectie is handig maar ik vind het handiger als ik naar de bestanden kijk en het direct snap. Vb 'architecture' en 'scripts', welke map is inhoud en welke is functioneel? Mogelijk oplossing daarvoor is volgens mij de bestandsstructuur om te keren en bv in de root de mappen 'slideshtml', 'images', 'scripts', ... te hebben en dan in die mappen onderverdelingen te maken per hoofdstuk. Of... en dit is minder werk: een map 'slides' in de root directory met daarin 'architecture', 'birds-eye-view',...

The graph on Facebook/Internet usage is currently an image from an external site. It should be redrawn in SVG to match the slides' style.

Alternatively, we could replace this and other graphs by interactive graphs (but then we probably sacrifice progressive enhancement).

To quickly navigate to a specific chapter, this would be a massive help. Now you have to click through all “Next topic” links to get to the last chapter. It would also give a better feeling of where you are in the slides.

Related to #11.

Many of the links in the slides refer to other slides, while a few refer to external pages.
As a learner, I'm more interested in external pages than internal pages (since I'll encounter those anyway, being the avid reader that I am). It would handy to easily see which links are external and which are not.

Reverse proxy is mentioned before the distinction is explained. We need to resolve this dependency, or least by place a link.

A lot of students are confused when they want to implement PUT/DELETE operations in their Web application, because they started with HTML forms for POST operations and expect the same thing for the other operations. Some get around this by using hidden fields or other work-arounds, which is not a proper solution. (https://softwareengineering.stackexchange.com/questions/114156/why-are-there-are-no-put-and-delete-methods-on-html-forms)

Solution: in the assignment a paragraph can be added to suggest they should use Javascript for this

When attempting to copy text to clipboard in the slides using Ctrl + C, all classes "no-next" are replace by "next", which has visibility : "hidden", not only preventing the copy, but also hiding all content on all slides.

De vraag hoort voornamelijk bij deze slide:
http://rubenverborgh.github.io/WebFundamentals/web-apis/#web-hateoas

In het hoofdstuk over web api's worden de constraints besproken om aan een unfiforme interface te voldoen. O.a. verschillende representaties en hypermedia zijn er 2 van. Verschillende representaties kunnen dus JSON en html zijn. Verder wordt er ook gezegd dat hypermedia bestaat uit o.a. links en dan worden 2 voorbeelden gegeven van links:

<em>http://perdu.com/</em> (geen link)
<a href="http://perdu.com/">Perdu</a> (wel een link)

Nu maak ik hier uit op dat men dus enkel over links spreekt indien men er op kan klikken en dus niet indien ze bv in plaintext staan.

Mijn vraag is of er dan wel kan gezegd worden dat een resource in JSON voldoet aan de REST constraints, aangezien de links die hier worden meegestuurd altijd in string notatie zijn en ze dus ook niet clickable zijn waardoor er dus niet voldaan is aan de constraint van hypermedia.
Alvast bedankt.

It would be handy to navigate between the different chapters.
This would also make it faster to find something.
Now there's no easy way (to my knowledge) to go to lesson 2.

While the broad categories of status codes are introduced, it could be good to create and additional slides aftr this that zooms in on some common codes, such as 200, 404, 500.

For #29, we switched to <object> embeddings of SVG images, given that external fonts are not loaded when SVGs are embedded as <img>. Unfortunately, this is now broken in Chrome.

The slides about RPC and REST are probably too technical for the Bird's-Eye View and should move to Web APIs.

I had the feeling that the cross-site scripting examples were too short to be understood. Perhaps after this introductory slide on cross-site scripting, each example deserves it own slide. Especially the reason why origin protection does not help, should be explained.

Students should be able to answer the question: why does origin protection not prevent cross-site scripting?

In the Linked Data Publishing Section, specifically following slides: 1 2 3 4 (Static blob).

The mapping from

{ "Performance" :
  { "Perf_ID": "567",
    "Venue": { "Name": "Vooruit", "Venue_ID": "78" },
    "Location": { "longitude": "3.725379", "latitude": "51.0477644" } },
}

to

<http://ex.com/venues/78>
    geo:long 3.725379;
    geo:lat 51.0477644.

<http://ex.com/venues/91>
    geo:long 3.728515;
    geo:lat 51.056008.

is made.

This is a decent example to demonstrate the flexibility and power of RML, but might be a bit confusing in demonstrating it's concepts and goals, since the original and new data model are different¹. If this is intentional, a footnote might be in it's place.

¹: The original data model seems 'wrong' as to not include the geolocation attributes as part of the venue; it includes them in the performance itself.

Having only SOAP might give a skewed representation. Perhaps protocols like JSON-RPC should also be explained.

Ruben Maes already sent me an image; I just need to add it.

There's something wrong at line 1342 (slide #rdf-property) or line 1360 (slide #rdfs-literal) but I couldn't get exactly what has to change.

Youtube video kept running when going to different slide, since it had many windows open it was not clear which one I had to close to terminate the video.

Currently, the Linked Data on the Web section is rather technical. Perhaps it should make Linked Data more tangible by showing how the major players use it.

We should probably first focus on the content level before going to the structural level, i.e., first show the data out there and then explain the elementary buildling blocks of which it consists. Then, the link with RDF etc. should be explained; preferably without mentioning RDF too early on. (We could initially talk about “Linked Data as JSON-LD”, only to get to RDF later.)

Once RDF is introduced, we might point to examples such as Facebook, recipes, and Gmail's usage of JSON-LD. In addition, it should be detailed why different RDF formats are needed (see #20).

This example has really unfortunate implications for gay parents. Suggestion: use :isBiologicalFatherOf, or maybe use a different example altogether.

These slides are still loaded over HTTP because of HTTP iframes. However, it seems that all of them can be upgraded to HTTPS now.

I found it a bit unexpected that the U stands for Uniform instead of Unique, because throughout the whole explanation one talks about uniqueness.

We should go through an existing ontology (such as FOAF) and explain how things work. This will help for the practical exercises.

The current red 'warning sign' icon tends to give the impression that this item is a super important point, rather than an opinion. Assuming that wasn't intentional, it might be better to use a different icon (for example, a question mark).

Because RDFa is currently preferred by Google over JSON-LD as a way to add (schema.org) metadata to existing (X)HTML pages (source), I think it might be useful to add a (or a few) slides about RDFa and how to use it (for example how to get a rich snippet for a product page).

On this graph, 146 is higher than 275.

In the part "A Bird's-Eye View of the Web" the YouTube video "The Internet's Own Boy" has been removed because of copyright claims. Ironic, isn't it? There are however other copies of the video on YouTube (e.g. https://www.youtube.com/watch?v=9vz06QO3UkQ).

Affected browser: Firefox
How to reproduce: In the Semantic Web presentation, start at outline mode and open any slide before the slides that have canvas graphics (these start from slide 13 onwards) and navigate to the slide with canvas graphics using the ↓ key. The canvas graphics are distorted and displayed in the top left corner of the slide, with only a small part being visible. Note: canvas is displayed correctly if I navigate directly to these slides by clicking them in outline mode.

Re: https://rubenverborgh.github.io/WebFundamentals/web-apis/#soap-generation

Surprisingly, it seems that using POST does not necessarily imply non-cacheability.

From the spec:

Responses to this method are not cacheable, unless the response includes appropriate Cache-Control or Expires header fields.

What do you make of this?

One thing I found confusing while I was studying this course was that in the Semantic Web chapter prefixes such as 'foaf' are used quite a lot but it is (as far as I remember) never explained what they are referring to. Maybe this information could be added to the chapter?

Very low priority!

Looking at http://rubenverborgh.github.io/WebFundamentals/semantic-web/#recap I can't scroll down by using the space bar (as I usually expect to do on a web page).

Can this be fixed so the space bar works as usual for a web page to scroll down?

Thanks!

Some slides are currently autonumbered. For persistent links, they should all have an id.
In other words, go from

<div class="slide">

to

<div class="slide" id="slide-topic">

I already did this for the architecture slides in 8f5aec3.

Due to the many links it could be possible that you accidently skip part of a lecture. Maybe it would be good to have a small window to mark your progress: page number, % explored,... (not always evident if people would explore the slides in a nonlinear way)

This was probably a pragmatic, for the sake of simplicity, choice, but since semantics are important here, I would avoid it.

https://github.com/RubenVerborgh/WebFundamentals/blob/gh-pages/semantic-web/index.html#L640
claims the "Tim" is Tim with a language tag "en", but it isn't. I know, I'm nit picking :)

With Microsoft's GitHub acquisition, tech firms are yet more centralised. Would you consider mirroring this repo on other platforms like Framagit (GitLab server run by French FOSS organization Framasoft)? There are also fine self-hostable platforms, like the lightweight Gitea or the feature-rich GitLab.

I know this is a minor point, but the Web protocols were specifically designed to encompass the space of Internet resources (accessible to everyone) and private resources (auth required) and local resources (things that are only defined in relation to the local user, like local file URLs and local router identifiers). The Internet itself doesn't work without them, but the Web does, which is why all local wifi services start with a non-encrypted HTTP request to obtain the instructions necessary to use the local network for access to the larger Internet.

BTW, nice slides!

Explanation of:

• necessity
• mechanisms
• impact (possibly with literature to back it up)

cfr. the HTTP/2 section.

Also explanation of recent HTTP RFCs that split off semantics, why that was done and how it facilitates HTTP/2, HTTP/3, etc.

Pointers:

• https://http3-explained.haxx.se/
• https://info.cloudflare.com/index.php/email/emailWebview
• https://blog.cloudflare.com/http3-the-past-present-and-future/?mkt_tok=eyJpIjoiTmpKak0yRXhaamMzWXpneSIsInQiOiJLbEVcL1dSMDA2dVJnWXF6eWZIamZLZkNpMUUyWjR0aWhpeTNmNk9FZGdicWxPalpMZmo3dGdxRGN1b2Nid1FcL0FweDVLZmVpTkR1OG5mTERZa2J6RlR6U1VzWHZ3WWxIUDg5cytkUDhodWtndjJTZEQ1XC9KVDVBR1pOaURZaXJlciJ9
• "clearly identify it as another binding of HTTP semantics to the wire protocol"
• …

It currently isn't clear from the slides what the practical use of RDF and its different syntaxes is. Examples would make this more clear.

When showing the slide with the doors, I ask students whether the door opens inward or outward. The purpose of this question is that they reason about affordance: does this handle afford pulling or pushing?

Funnily, all students answered “inward, because it is an outside door”, which kind of voided my point 😄 So we should find a better picture.

Can be something other than a door, too!

For some reason, Firefox does not pick up the right font (Open Sans) inside of SVG images. Works in Chrome.

Idea by @ldorigo:

In case you feel like your course needs an extra illustration of why GET requests should be idempotent… :-)

https://twitter.com/rombulow/status/990684453734203392

Only when actually presenting the slides, it makes sense for items to appear one by one. For all other purposes (especially studying), it is easier to just see everything at once on a slide.

Build should be disabled by default; a button or keypress activates them.

Pictures such as the ones in these blog posts might make the explanation of CORS clearer:

• https://ejj.io/breaking-sop/
• https://ejj.io/misconfigured-cors/

Additionally, this last post might be a good example of the importance of setting headers right.

FAIR Data is a topic that needs to be touched I think. In Life Sciences this is more familiar than the term Linked Data although the definitions are quite close. It would be great to give some context on how they compare / differ!