|
27 | 27 | <meta property="twitter:site" content="{{ site.twitter }}"> |
28 | 28 | <meta property="twitter:card" content="summary_large_image" /> |
29 | 29 |
|
30 | | - <meta property="og:type" content="website"> |
| 30 | + <!-- |
| 31 | + SEO OPTIMIZATION: Page-specific Open Graph Meta Tags |
| 32 | + - Different og:type for book pages vs author pages vs general website pages |
| 33 | + - Page-specific metadata for better social sharing and search understanding |
| 34 | + - Author information, release date, and categorization for books |
| 35 | + --> |
| 36 | + {% if page.layout == 'book' %} |
| 37 | + <meta property="og:type" content="book"> |
| 38 | + <!-- SEO: Book author information for Open Graph --> |
| 39 | + <meta property="book:author" content="{% for author_id in page.authors %}{% assign author = site.people | where: 'name', author_id | first %}{{ author.name | default: author_id }}{% unless forloop.last %}, {% endunless %}{% endfor %}"> |
| 40 | + <!-- SEO: Book release date for better categorization --> |
| 41 | + <meta property="book:release_date" content="{{ page.start | date: '%Y-%m-%d' }}"> |
| 42 | + <!-- SEO: Book categorization for content understanding --> |
| 43 | + <meta property="book:tag" content="Book of the Week"> |
| 44 | + {% elsif page.layout == 'author' %} |
| 45 | + <meta property="og:type" content="profile"> |
| 46 | + <!-- SEO: Author-specific Open Graph metadata --> |
| 47 | + <meta property="profile:first_name" content="{{ page.title | split: ' ' | first }}"> |
| 48 | + <meta property="profile:last_name" content="{{ page.title | split: ' ' | last }}"> |
| 49 | + <meta property="profile:username" content="{{ page.short }}"> |
| 50 | + {% if page.twitter %} |
| 51 | + <meta property="profile:username" content="{{ page.twitter }}"> |
| 52 | + {% endif %} |
| 53 | + {% else %} |
| 54 | + <meta property="og:type" content="website"> |
| 55 | + {% endif %} |
31 | 56 | <meta property="og:site_name" content="{{ site.name }}"> |
32 | 57 | <meta property="og:url" content="{{ site.url }}{{ page.url }}"> |
33 | 58 | <link rel="canonical" href="{{ site.url }}{{ page.url }}"> |
34 | 59 |
|
35 | | - <meta property="og:image" content="{{ site.url }}/{{ page.image }}"> |
36 | | - <meta property="twitter:image" content="{{ site.url }}/{{ page.image }}"> |
37 | | - <link rel="image_src" href="{{ site.url }}/{{ page.image }}"> |
| 60 | + <!-- |
| 61 | + SEO OPTIMIZATION: Enhanced Image Meta Tags |
| 62 | + - Image dimensions for better social media display |
| 63 | + - Alt text for accessibility and SEO |
| 64 | + - Consistent image tags for both Open Graph and Twitter Cards |
| 65 | + - Author-specific image handling |
| 66 | + --> |
| 67 | + {% if page.layout == 'author' %} |
| 68 | + <meta property="og:image" content="{{ site.url }}/{{ page.picture }}"> |
| 69 | + <!-- SEO: Image dimensions for optimal social media display --> |
| 70 | + <meta property="og:image:width" content="400"> |
| 71 | + <meta property="og:image:height" content="400"> |
| 72 | + <!-- SEO: Descriptive alt text for image accessibility --> |
| 73 | + <meta property="og:image:alt" content="{{ page.title }} - Author Profile Photo"> |
| 74 | + <meta property="twitter:image" content="{{ site.url }}/{{ page.picture }}"> |
| 75 | + <!-- SEO: Twitter-specific image alt text --> |
| 76 | + <meta property="twitter:image:alt" content="{{ page.title }} - Author Profile Photo"> |
| 77 | + <link rel="image_src" href="{{ site.url }}/{{ page.picture }}"> |
| 78 | + {% else %} |
| 79 | + <meta property="og:image" content="{{ site.url }}/{{ page.image }}"> |
| 80 | + <!-- SEO: Image dimensions for optimal social media display --> |
| 81 | + <meta property="og:image:width" content="1200"> |
| 82 | + <meta property="og:image:height" content="630"> |
| 83 | + <!-- SEO: Descriptive alt text for image accessibility --> |
| 84 | + <meta property="og:image:alt" content="{{ page.title }} book cover"> |
| 85 | + <meta property="twitter:image" content="{{ site.url }}/{{ page.image }}"> |
| 86 | + <!-- SEO: Twitter-specific image alt text --> |
| 87 | + <meta property="twitter:image:alt" content="{{ page.title }} book cover"> |
| 88 | + <link rel="image_src" href="{{ site.url }}/{{ page.image }}"> |
| 89 | + {% endif %} |
38 | 90 |
|
39 | | - <meta property="og:description" content="{{ page.description }}"> |
40 | | - <meta property="twitter:description" content="{{ page.description }}"> |
41 | | - <meta name="description" content="{{ page.description }}"> |
| 91 | + <!-- SEO: Page-specific meta descriptions for search engines and social media --> |
| 92 | + {% if page.layout == 'author' %} |
| 93 | + <meta property="og:description" content="{{ page.content | strip_html | truncate: 160 | escape | default: 'Learn more about ' | append: page.title | append: ', a data science professional and member of the DataTalks.Club community.' }}"> |
| 94 | + <meta property="twitter:description" content="{{ page.content | strip_html | truncate: 160 | escape | default: 'Learn more about ' | append: page.title | append: ', a data science professional and member of the DataTalks.Club community.' }}"> |
| 95 | + <meta name="description" content="{{ page.content | strip_html | truncate: 160 | escape | default: 'Learn more about ' | append: page.title | append: ', a data science professional and member of the DataTalks.Club community.' }}"> |
| 96 | + <!-- SEO: Author-specific keywords --> |
| 97 | + <meta name="keywords" content="{{ page.title | downcase }}, author, data scientist, machine learning, data talks club, {% if page.twitter %}{{ page.twitter }}, {% endif %}{% if page.github %}{{ page.github }}, {% endif %}{% if page.linkedin %}{{ page.linkedin }}, {% endif %}data science professional, AI expert"> |
| 98 | + {% else %} |
| 99 | + <meta property="og:description" content="{{ page.description }}"> |
| 100 | + <meta property="twitter:description" content="{{ page.description }}"> |
| 101 | + <meta name="description" content="{{ page.description }}"> |
| 102 | + <!-- |
| 103 | + SEO OPTIMIZATION: Keywords Meta Tag |
| 104 | + - Comprehensive keywords including book title, authors, and site context |
| 105 | + - Helps search engines understand page content and relevance |
| 106 | + - Includes site-specific terms for better categorization |
| 107 | + --> |
| 108 | + <meta name="keywords" content="book, {{ page.title | downcase }}, {% for author_id in page.authors %}{% assign author = site.people | where: 'name', author_id | first %}{{ author.name | default: author_id | downcase }}{% unless forloop.last %}, {% endunless %}{% endfor %}, book of the week, data talks club"> |
| 109 | + {% endif %} |
42 | 110 |
|
43 | 111 | <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon.png"> |
44 | 112 | <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> |
|
48 | 116 | <meta name="msapplication-TileColor" content="#da532c"> |
49 | 117 | <meta name="theme-color" content="#ffffff"> |
50 | 118 |
|
51 | | - <link rel="stylesheet" |
52 | | - href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" |
53 | | - integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" |
54 | | - crossorigin="anonymous"> |
55 | | - |
56 | | - <link href="https://fonts.googleapis.com/css?family=Alegreya+Sans:300,400,700" rel="stylesheet" /> |
57 | | - <link href="https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700" rel="stylesheet" /> |
58 | | - |
| 119 | + <!-- |
| 120 | + SEO OPTIMIZATION: Performance & Core Web Vitals |
| 121 | + - Preload critical CSS for faster rendering |
| 122 | + - Async loading prevents render blocking |
| 123 | + - display=swap prevents font flash (FOIT/FOUT) |
| 124 | + - Noscript fallbacks for accessibility |
| 125 | + --> |
| 126 | + <!-- Preload critical resources --> |
| 127 | + <link rel="preload" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'"> |
| 128 | + <noscript><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"></noscript> |
| 129 | + |
| 130 | + <!-- SEO: Google Fonts with display=swap for better performance --> |
| 131 | + <link rel="preload" href="https://fonts.googleapis.com/css?family=Alegreya+Sans:300,400,700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'"> |
| 132 | + <noscript><link href="https://fonts.googleapis.com/css?family=Alegreya+Sans:300,400,700&display=swap" rel="stylesheet"></noscript> |
| 133 | + |
| 134 | + <link rel="preload" href="https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'"> |
| 135 | + <noscript><link href="https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700&display=swap" rel="stylesheet"></noscript> |
59 | 136 |
|
60 | | - <script src="https://kit.fontawesome.com/c37fbeb327.js"></script> |
| 137 | + <!-- SEO: Load non-critical resources asynchronously --> |
| 138 | + <script src="https://kit.fontawesome.com/c37fbeb327.js" crossorigin="anonymous" async></script> |
61 | 139 |
|
62 | 140 | <link rel="stylesheet" href="/assets/styles.css" /> |
63 | 141 | <link rel="stylesheet" href="/assets/syntax.css" /> |
|
0 commit comments