Make Cyber Security A New Year Resolution: Start with a plan

Cybersecurity checklist for the New Year

 

With the ring in the New Year, there is hope that 2023 brings abundant health, prosperity, and success in all endeavors.  A new year is a beginning, a fresh start for everything.  And of course, it’s also a time to think about making cyber security a priority as everyone is back from the holidays to prevent future headaches and costly prevention. 

Now is a great time to assess your current cyber security setup and make sure you’re starting out the New year right.  A quick checklist can help you to determine if your cyber security is adequate or if you need to step up your game plan.  Questions are needed to ask about quality firewalls to block unwanted traffic to the network.  Are you using two-factor authentication?  What’s about anti-virus and anti-malware software to protect you from cyber threats?  Are all your passwords more than 12 unique and strong characters?  And any backup and restore plans?

(more…)

Bootstrap Alternatives

From the previous blog Bootstrap 3 vs 4 vs 5: Which to Choose? comparisons are made between each version and what major changes are for them. When it comes to designing and ease of use for developing CSS, HTML, and Javascript, Bootstrap is one of the most popular front-end frameworks.  According to the BuiltWith report, Bootstrap is the most popular design framework and powers over 20 million websites.  And some of the most popular and beautiful websites that are using Bootstrap (to name a few) are Lee Clothing, Reuters News, Etsy, and many others.

(more…)

Bootstrap 3 vs 4 vs 5: Which to Choose?

 

Bootstrap is a free and open-source CSS framework aimed at responsive, mobile-first front-end web development. It includes HTML, CSS, and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.  All HTML elements in Bootstrap have basic style definitions. As a result, prose, tables, and form elements appear consistently across web browsers. Furthermore, developers can use CSS classes defined in Bootstrap to further customize the appearance of their content.  

The layout components of Bootstrap are the most visible because they affect the entire web page. Because every other element on the page is placed in it, the basic layout component is called a “Container.” Developers have the option of using a fixed-width container or a fluid-width container.

The latest version of Bootstrap is 5.2.2 but it’s backward compatible.  As with previous versions, version 3 and version 4 are still supported for critical bug fixes but no longer add more functionalities.  Bootstrap version 3 is the most stable version.  Bootstrap version 4 is a newer version with a faster stylesheet and more responsiveness.  And Bootstrap version 5 is the newest version but JQuery is replaced with vanilla JavaScript.

Technically, Bootstrap has 3 major versions running, and developers and designers can use the latest version 5 or the old version 3 (still supported critical bug fixes) or stick to the middle ground version 4.  So the questions must be asked:  Which version to choose and why?

(more…)

WordPress 6.1 “Misha”

 

On November 1, 2022, WordPress 6.1 code name “Misha” was released.  It is named after Soviet-Norwegian Jazz pianist Mikhail “Misha” Alperin.  According to WordPress, this is the third major release of 2022, it is known as the “Gutenberg project.” There is a growing interest in headless content management systems (CMSs), including those from Kontent.ai, Magnolia, Agility CMS, Contentful, Butter CMS, Contentstack, Netlify, Strapi, and others. The website builders like Wix and Squarespace also have gained a lot of traction in recent years. So, the importance of ensuring WordPress stays relevant and competitive in today’s market. The larger ambition involves revolutionizing how all websites are built in the future, which is supported by the fact that WordPress powers more than a third of all websites.

This WordPress 6.1 contains basically five updates within this release.  Additional changes and enhancements to the editor provide site owners greater power and make customization simpler while providing users with a more seamless experience. The new version contains a lot of writing-related changes because, in order to give the voiceless a voice, attention must be paid to the copywriters.  The improved ability to pick only a portion of a block’s paragraphs, the option to keep the list view open by default, and the keyboard shortcut to add internal links expanded to all blocks are some of my favorite improvements.

 

(more…)

Google Search Structured Data

 

 
When you search Google for certain recipes or products, the results you see are rich snippets, which are logically structured with product images on top, followed by descriptions, pricing, availability, and user reviews. This is known as structured data.
 

Why structured data is important?

 
As of November 2022, Google holds a 92.21% share of the global search engine market. That’s impressive don’t you think? This means that adding structured data to your web pages or product pages will increase the chance that they will show up on Google search results.
 

So what is Structured Data?

 
According to Google, Structured Data uses schema markup, which is a standardized format for providing information about a page and classifying the page’s content. This helps search engines to better understand your content and provide more relevant search results..
 

Google Search supports Structured Data in these 3 formats: JSON-LD, Microdata, and RDFa.

JSON-LD is a JavaScript notation embedded in a <script> tag in the page head or body. Data can be static or dynamically injected into the page’s content. JSON-LD is recommended by Google.
 
Microdata is an HTML specification used to nest structured data within HTML content. It uses HTML tag attributes to name the properties.
 
RDFa is an HTML5 extension that supports linked data by introducing HTML tag attributes. It is commonly used in both the head and body sections of the HTML page.

 

How to Add Structured Data to Your Pages?

 
The easiest way is to use Google Structured Data Markup Helper where you just select the schema type and then enter the URL. The rest is just selecting images and texts to be tagged.

And if you want to create structured data manually, you need to define the structured data in either JSON-LD or Microdata. In this example, we go with JSON-LD.

First, we need to define the type of Structured Data in JSON-LD. It should be inside <script> tags and can be either in the <head> or <body> of the page.
 

<head>
<script type="application/ld+json">
</script>
</head>

 
Inside the <script> tag, tell Google that we’re using schema.org.
 

<head>
<script type="application/ld+json">
{You can add it manually or you can use markup generators. Google Structured Dat Markup Helper is the most sought-after structured data markup generator for many people,

  "@context": "http://schema.org/",
</script>
</head>

 
Then tell Google the descriptions and the content.
 

<html>
<head>
<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Recipe"
}
</script>
</head>
</html>

 
Add required and recommended properties. In this section, properties allow Google more information about the thing being described.
 

<html>
<head>
...
<script type="application/ld+json">
  {
  "@context": "http://schema.org/",
  "@type": "Recipe",
  "name": "Party Coffee Cake",
  "image": "https://www.leannebrown.com/wp-content/uploads/2016/12/up-close-pear-cake.jpg",
  "author": {
    "@type": "Person",
    "name": "Mary Stone"
  },
  "datePublished": "2018-03-10",
  "description": "This coffee cake is awesome and perfect for parties.",
    "prepTime": "PT20M",
    "cookTime": "PT30M",
    "totalTime": "PT50M",
    "recipeYield": "10 servings",
    "recipeCategory": "Dessert",
    "recipeCuisine": "American",
    "keywords": "cake for a party, coffee",
    "nutrition": {
      "@type": "NutritionInformation",
      "calories": "270 calories"
     },
      "recipeIngredient": [
        "2 cups of flour",
        "3/4 cup white sugar",
        "2 teaspoons baking powder",
        "1/2 teaspoon salt",
        "1/2 cup butter",
        "2 eggs",
        "3/4 cup milk"
       ],
    "recipeInstructions": [
      {
      "@type": "HowToStep",
      "text": "Preheat the oven to 350 degrees F. Grease and flour a 9x9 inch pan."
      },
      {
      "@type": "HowToStep",
      "text": "In a medium bowl, combine flour, sugar, and cinnamon."
      },
      {
      "@type": "HowToStep",
      "text": "Mix in butter until the entire mixture is crumbly."
      },
      {
      "@type": "HowToStep",
      "text": "In a large bowl, combine flour, sugar, baking powder, and salt."
      },
      {
      "@type": "HowToStep",
      "text": "Mix in the butter."
      },
      {
      "@type": "HowToStep",
      "text": "Spread into the prepared pan."
      },
      {
      "@type": "HowToStep",
      "text": "Sprinkle the streusel mixture on top of the cake."
      },
      {
      "@type": "HowToStep",
      "text": "Bake for 30 to 35 minutes, or until firm."
      },
      {
      "@type": "HowToStep",
      "text": "Allow to cool."
     }
  ],
  "video": [
     {
    "@type": "VideoObject", 
    "name": "How to make a Party Coffee Cake",
    "description": "This is how you make a Party Coffee Cake.",
    "thumbnailUrl": [
      "https://example.com/photos/1x1/photo.jpg",
      "https://example.com/photos/4x3/photo.jpg",
      "https://example.com/photos/16x9/photo.jpg"
     ],
    "contentUrl": "http://www.example.com/video123.flv",
    "embedUrl": "http://www.example.com/videoplayer.swf?video=123",
    "uploadDate": "2018-02-05T08:00:00+08:00",
    "duration": "PT1M33S",
    "interactionStatistic": {
      "@type": "InteractionCounter",
      "interactionType": { "@type": "http://schema.org/WatchAction" },
      "userInteractionCount": 2347
     },
    "expires": "2019-02-05T08:00:00+08:00"
   }
  ]
}
</script>
</head>
</html>

 
After you have the content and its data, you can validate and test to see if there are any errors or warnings at the Rich Results Test

The last few steps are adding an individual review and the aggregate rating for all reviews.
 

<html>
<head>
...
<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Recipe",
  // ...
  // other recipe structured data
  // ...
  "review": {
    "@type": "Review",
    "reviewRating": {
      "@type": "Rating",
      "ratingValue": "4",
      "bestRating": "5"
    },
    "author": {
      "@type": "Person",
      "name": "Mary Stone"
    },
    "datePublished": "2018-05-01",
    "reviewBody": "This cake is delicious!",
    "publisher": "The cake makery"
  }
}
</script>
</head>
</html>

<html>
<head>
...
<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Recipe",
  // other recipe structured data
  // review structured data
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingCount": "18",
    "ratingValue": "4"
  }
}
</script>
</head>
</html>

 
The final JSON-LD sample will look something like this.
 

<!doctype HTML>
<html class="no-js">
    <head>
        <script type="application/ld+json">
        {
        "@context": "http://schema.org/",
        "@type": "Recipe",
        "name": "Party Coffee Cake",
        "image": [
            "https://www.leannebrown.com/wp-content/uploads/2016/12/up-close-pear-cake.jpg"
        ],
        "author": {
            "@type": "Person",
            "name": "Mary Stone"
        },
        "datePublished": "2018-03-10",
        "description": "This coffee cake is awesome and perfect for parties.",          
        "prepTime": "PT20M",
        "cookTime": "PT30M",
        "totalTime": "PT50M",
        "recipeYield": "10 servings",
        "recipeCategory": "Dessert",
        "recipeCuisine": "American",
        "keywords": "cake for a party, coffee",
        "nutrition": {
            "@type": "NutritionInformation",
            "calories": "270 calories"
        },
        "recipeIngredient": [
            "2 cups of flour",
            "3/4 cup white sugar",
            "2 teaspoons baking powder",
            "1/2 teaspoon salt",
            "1/2 cup butter",
            "2 eggs",
            "3/4 cup milk"
           ],
        "recipeInstructions": [
              {
              "@type": "HowToStep",
              "text": "Preheat the oven to 350 degrees F. Grease and flour a 9x9 inch pan."
              },
              {
              "@type": "HowToStep",
              "text": "In a medium bowl, combine flour, sugar, and cinnamon."&nbsp;
              },
              {
              "@type": "HowToStep",
              "text": "Mix in butter until the entire mixture is crumbly."
              },
              {
              "@type": "HowToStep",
              "text": "In a large bowl, combine flour, sugar, baking powder, and salt."
              },
              {
              "@type": "HowToStep",
              "text": "Mix in the butter."
              },
              {
              "@type": "HowToStep",
              "text": "Spread into the prepared pan."
              },
              {
              "@type": "HowToStep",
              "text": "Sprinkle the streusel mixture on top of the cake."
              },
              {
              "@type": "HowToStep",
              "text": "Bake for 30 to 35 minutes, or until firm."
              },&nbsp;&nbsp;
              {
              "@type": "HowToStep",
              "text": "Allow to cool."
             }
          ],
        "video": [
            {
            "@type": "VideoObject", 
            "name": "How to make a Party Coffee Cake",
            "description": "This is how you make a Party Coffee Cake.",
            "thumbnailUrl": [
              "https://example.com/photos/1x1/photo.jpg",
              "https://example.com/photos/4x3/photo.jpg",
              "https://example.com/photos/16x9/photo.jpg"
             ],
            "contentUrl": "http://www.example.com/video123.flv",
            "embedUrl": "http://www.example.com/videoplayer.swf?video=123",
            "uploadDate": "2018-02-05T08:00:00+08:00",
            "duration": "PT1M33S",
            "interactionStatistic": {
              "@type": "InteractionCounter",
              "interactionType": { "@type": "http://schema.org/WatchAction" },
              "userInteractionCount": 2347
            },
            "expires": "2019-02-05T08:00:00+08:00"
           }
          ],
        "aggregateRating": {
            "@type": "AggregateRating",
            "ratingValue": "5",
            "ratingCount": "18"
            },
        "review": {
            "@type": "Review",
            "reviewRating": {
                "@type": "Rating",
                "ratingValue": "4",
                "bestRating": "5"
            },
            "author": {
                "@type": "Person",
                "name": "Mary"
            },
            "datePublished": "2018-05-01",
            "reviewBody": "This cake is delicious!",
            "publisher": "The cake makery"
            }
         }
        </script>
    </head>

<body>

</body>
</html>

 

Conclusion

 
In addition to your current SEO and online marketing strategies, any e-commerce (WooCommerce, Magento, BigCommerce, and Shopify) website or WordPress blog must include structured data if you want it to rank higher in Google, Bing, and other search engine results.
 
Sources:

https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data

https://terakeet.com/blog/structured-data/

« Older posts