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 ...


14

90% or more of Americans have images on, JavaScript enabled, CSS support, and a reasonable connection. Spending 90% of your time chasing the 10% of the world that has gone out of their way to not experience the modern web is a waste of time.


12

Assume: JavaScript will be turned off CSS3 will not be supported Images will be disabled The users connection will be slow I know that's not what you want to hear but as web designers and developers this is the reality we face. Not only will there be users using older browsers but some of them will alter the settings on their browser to change its default ...


12

Add Google Analytics to your site and track your users The only way to find out is to collect a reasonable sample of statistics about your user base. Anything short of that is just a baseless assumption. Fortunately, Google Analytics tracks absolutely everything about the browser, screen size, enabled capabilities, etc... Target Internet Explorer as the '...


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

I think it's very good idea. There is a nice js library called modernizr which can add the support of html5 new tags and detect which css3 features the browser supports.


6

[What specifically happens as far as search engines' interpretations of these things is always going to be up for speculation. But:] The text might be seen as slightly less important. Remember, though, that it's still within an H* tag, so we'd be talking slightly less starting from that context. That would be correct as it's intended to represent "fine ...


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 ...


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