Hot answers tagged

26

Dec. 2018 edit RawGit is now sunsetting due to malicious usage, so they recommend to use one of the following services instead: jsDelivr GitHub Pages CodeSandbox unpkg Original post Rawgithub.com allows users to take the "Raw" versions of a Git and turn it into a URL usable in <script> tags. It's quite easy to use, simply remove the first . from ...


25

Microdata extends HTML5 in a way that link and meta elements can be used in the body, if they contain an itemprop attribute. If the itemprop attribute is present on link or meta, they are flow content and phrasing content. The link and meta elements may be used where phrasing content is expected if the itemprop attribute is present. This extension is ...


24

schema.org: Article, BlogPosting If something is a schema:BlogPosting, it is an schema:Article, too, isn't it? As schema:BlogPosting is a more specific schema:Article: More specific types BlogPosting NewsArticle ScholarlyArticle So you have an schema:Article, and now you may decide if one of these more specific types applies to your content. If not, stay ...


18

After reading several articles on this, the general consensus is that HTML Imports were redundant, since you need JavaScript to bring them alive anyways (they don't just automatically add themselves into the document - the term "include" is kind of misleading if you compare it to what that usually means in other languages). From the article that @Bronwyn ...


16

The problem you have is out of your control since this is how the hosting is setup at Github on the path that you have mentioned, Extension type is not only the factor when it comes to executing files since the web hosting can over-rule how a browser renders a file. You could have a .zip file rendering as a .html file if the host was setup to do so, you can ...


16

Something like this, though of course other properties are required for this to meet Google's requirements for article features in search results. <div itemscope itemtype="http://schema.org/Article"> <!-- blah blah --> <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope ...


12

W3Schools does not set the industry standards on HTML coding. They are simply a 3rd party reference site that is not affiliated with the W3C in anyway. W3Schools and other sites are often wrong when using cutting edge coding technologies such as Schema and Responsive design. When using fairly new code your one stop shop should be W3C as set the compliance ...


11

The datetime-local state is part of: WHATWG’s HTML (Living Standard) (as of 2014-03-14) W3C’s HTML5 (Candidate Recommendation) from 2014-02-04 W3C’s HTML 5.1 (Working Draft) from 2014-02-04 But it’s not anymore in the HTML 5.1 (Editor’s Draft) from 2014-03-17. It was removed in a commit from 2014-02-11: Removing the definition of input type="datetime-...


11

There is no benefit in using the hreflang on a single language website, it is meant exclusively for multilingual and international websites. I am not suggesting that Google (or other search engines) would penalize you for it, but they would definitely not reward you. You can see a proper implementation of the hreflang tag over at trip advisor - a well ...


11

Don't use strong tags inside an already bolded sentence. It looks spammy. It is something that you are obviously only doing for search engines and not for users. Google hates it when it finds that sites are trying technical tricks as opposed to doing something that also benefits users. If anything, I think this is more likely to lead to an over-...


10

Your basic HTML structure is fine. You could use microdata for additional semantic markup.Creative Work is probably the best fit. You can use name, author, and genre. <div itemscope itemtype="http://schema.org/CreativeWork"> <h1 itemprop="name">This is poetry title</h1> <p itemprop="author"> George PHP </p> ...


10

It is perfectly valid for the alt attribute to be blank, if the images are purely decorational. Otherwise, if you are outputting the same image over and over then it makes sense that the alt attribute be the same for all of them. There is no negative SEO benefit to that, and your cross/tick images are unlikely to rank in image searches anyway. One ...


10

First of all, use better alt attributes. Seriously, "Cross" and "Checkmark" are horrible alt attributes. To see why, try viewing your page in a text-only browser. With your HTML as it is, you'll see something like: Unregistered Basic Premium ------------------------------------------------------------------- ...


10

I believe it doesn't matter for SEO. It's HTML5, it is (almost) a standard, they simply "aren't allowed" to give you bad credit. I think this is more of a UX question. A header is a block level element and will be 100% width. An anchor is inline and will only wrap the text. With that knowledge, you have two options: Wrap the <h1> around the <a>...


9

Google doesn't favour HTML5 over HTML4 per se. However, HTML5 does allow more semantic mark-up, which will make it easier for Google to figure out what's what on any given page. This allows Google to be more precise when it comes to ranking what is and what isn't important on a page. For example, the nav element indicates very clearly to Google (or any bot,...


9

You could use the itemref attribute. From the Microdata (W3C Working Group Note) spec: 4.2 The basic syntax: Properties that are not descendants of the element with the itemscope attribute can be associated with the item using the itemref attribute. This attribute takes a list of IDs of elements to crawl in addition to crawling the children of the element ...


9

It will not use the browser default font. But rather it will use the default sans-serif font. Since the last font in the font stack is not a specific font. It is a generic name. Some browsers allow you to set it or it will default to the OS of the users computer. Reference URL: https://developer.mozilla.org/en-US/docs/Web/CSS/font-family


8

During my extensive web searches I have found a quote which I find useful and suspect that future readers of this question will also. Use <h1> for top-level heading <h1> is the HTML element for the first-level heading of a document: If the document is basically stand-alone, for example Things to See and Do in Geneva, the top-level ...


8

There are no tangible benefits from using the hreflang attribute, beyond special usage like the one described by Google. It is declarative markup and does not cause any action or affect rendering, unless you make it to. The HTML5 LC explicitly warns: “It is purely advisory. [...] User agents must not consider this attribute authoritative — upon fetching the ...


8

your code contains error, thats why two authors aren't recognized. If you have more then one author, you should add them as list without entity duplication. Here the correct code: <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "WebPage", "mainEntity": { "@type": "Book", "author": [{ ...


7

Microdata can only be used on HTML elements as defined by HTML5. According to HTML5, the svg element is not in the HTML namespace. WHATWG’s HTML spec explicitly mentions that Microdata doesn’t work for svg (quoted on 2014-01-02): Currently, the itemscope, itemprop, and other microdata attributes are only defined for HTML elements. This means that ...


7

In JSON-LD (instead of Microdata/RDFa) you have to repeat the property and its value for each node. Instead of using a separate script element for each node, you could also use a single script element that contains all your nodes as value of @graph. That way you only have to define the @context (and possibly custom properties) one time. <script type="...


6

The Campaign Monitor people maintain a big table of CSS support in various mail clients. There's a changelog at bottom with running notes, and a bunch of CSS3 properties(mostly decorative) were initially added April 2010.


6

The file extension is irrelevant, it's the Content-Type header that matters, and that file is served with a text/plain content type (which is the purpose of Github's "raw" view). You should really download a copy of the file locally to your site and include it from there. Even if it did work from Github, since you're not loading the JS file asynchronously, ...


6

Microdata doesn’t have a concept of "site"; each page is separate. So you should include all relevant metadata on every page where the corresponding content is visible (but only one time per page). Think of a browser-add on that displays all Microdata name-value pairs in a sidebar: why should the user have to visit a specific page of your site to see the ...


6

You can remove the image from the td and just add it to the td instead. In your example you don't actually need the image, it has no content value, or SEO value. Because of that, you can do this: <td class="center Crossed" title="Cross"></td> .Cross{ background: url('/images/cross.png') no-repeat center center; height: 15px; } This has ...


6

There is nothing wrong with having duplicate alt tags as its job is to describe the images for screen readers and users who have images disabled. So if you have the images on the page many times then it is likely you will have duplicate alt tags - it is semantically correct. Saying all that you could however describe your images differently for each one e.g....


6

Your plan of using meta data for microdata is not viable. Here is Google's FAQ about why it isn't showing your data in the search results: Is your marked-up content hidden from users? In general, Google won't display any content in rich snippets that is not visible to human user. Don't hide the content that you have marked up for rich snippets ...


6

What is the correct usage of using the brand schema from schema.org? There is not one "correct usage" – it depends on what you want to convey. If you want to say something about a brand, you can use Schema.org’s Brand type. The Product type has the property brand, which takes a Brand item as value. This would allow you to reference the Brand from each of ...


6

This answer hugely depends on what you are expecting as an answer. Google has not, and will not, reveal exactly how much weight each element is worth, nor am I aware of any case study that has proven SVG as in-viable. This answer is based on what we know and not what we hope Google loves responsive design :: SVG scales to any resolution :: GREAT! Google ...


Only top voted, non community-wiki answers of a minimum length are eligible