ai

「ホームページ・技術ブログ」https://tech.airis0.com 「ブログ」https://www.airis0.com 「ギャラリー」https://atelier.airis0.com

ai

「ホームページ・技術ブログ」https://tech.airis0.com 「ブログ」https://www.airis0.com 「ギャラリー」https://atelier.airis0.com

マガジン

  • SEO対策

    SEO対策の記事 ①XMLサイトマップ ②プライバシーポリシー ③サイト表示速度 -画像の最適化- ④サイト表示速度 -遅延読み込み- ⑤CSSの非同期読み込み ⑥meta description ⑦alt属性

  • 静的サイトジェネレーター

    静的サイトジェネレーター ・Jekyll ・Hexo

  • BaaS【 Firebase 】

    BaaSであるFirebaseについての記事。 ①FirebaseでWebページを公開するまで ②FirebaseのRealtime Databaseでチャットアプリを作成

ストア

  • 商品の画像

    組紐 【No.35】

    ご覧いただきありがとうございます。 ハンドメイドで編んだ組紐です。 ブレスレット・ミサンガ・髪飾りなどにご活用頂けます。 ブレスレットとして使用する場合、3~4連になります。 ビーズの入ったガラス玉がアクセント。 普段使いだけではなく、和の装飾である組紐を使っていますので浴衣など和服にも合います。 刺繍糸で編んでいるので軽い着用感で、肌触りも良いです。 結べる部分は長めにしています。 ●色 : 青、水色、紫、白 ●素材 : 刺繍糸 ●サイズ : 約 70㎝ ※長さは多少の誤差が出ます。
    1,500円
    AI'S GALLERY
  • 商品の画像

    組紐 【No.34】

    ご覧いただきありがとうございます。 ハンドメイドで編んだ組紐です。 ブレスレット・ミサンガ・髪飾りなどにご活用頂けます。 ブレスレットとして使用する場合、3~4連になります。 普段使いだけではなく、和の装飾である組紐を使っていますので浴衣など和服にも合います。 刺繍糸で編んでいるので軽い着用感で、肌触りも良いです。 結べる部分は長めにしています。 ●色 : 水色、淡水色、淡青、白 ●素材 : 刺繍糸 ●サイズ : 約 70㎝ ※長さは多少の誤差が出ます。
    1,000円
    AI'S GALLERY
  • 商品の画像

    組紐 【No.35】

    ご覧いただきありがとうございます。 ハンドメイドで編んだ組紐です。 ブレスレット・ミサンガ・髪飾りなどにご活用頂けます。 ブレスレットとして使用する場合、3~4連になります。 ビーズの入ったガラス玉がアクセント。 普段使いだけではなく、和の装飾である組紐を使っていますので浴衣など和服にも合います。 刺繍糸で編んでいるので軽い着用感で、肌触りも良いです。 結べる部分は長めにしています。 ●色 : 青、水色、紫、白 ●素材 : 刺繍糸 ●サイズ : 約 70㎝ ※長さは多少の誤差が出ます。
    1,500円
    AI'S GALLERY
  • 商品の画像

    組紐 【No.34】

    ご覧いただきありがとうございます。 ハンドメイドで編んだ組紐です。 ブレスレット・ミサンガ・髪飾りなどにご活用頂けます。 ブレスレットとして使用する場合、3~4連になります。 普段使いだけではなく、和の装飾である組紐を使っていますので浴衣など和服にも合います。 刺繍糸で編んでいるので軽い着用感で、肌触りも良いです。 結べる部分は長めにしています。 ●色 : 水色、淡水色、淡青、白 ●素材 : 刺繍糸 ●サイズ : 約 70㎝ ※長さは多少の誤差が出ます。
    1,000円
    AI'S GALLERY
  • 商品の画像

    組紐 【No.33】

    ご覧いただきありがとうございます。 ハンドメイドで編んだ組紐です。 ブレスレット・ミサンガ・髪飾りなどにご活用頂けます。 ブレスレットとして使用する場合、3~4連になります。 普段使いだけではなく、和の装飾である組紐を使っていますので浴衣など和服にも合います。 刺繍糸で編んでいるので軽い着用感で、肌触りも良いです。 結べる部分は長めにしています。 ●色 : 紫、薄紫、青、濃緑 ●素材 : 刺繍糸 ●サイズ : 約 70㎝ ※長さは多少の誤差が出ます。
    1,000円
    AI'S GALLERY
  • もっとみる

最近の記事

  • 固定された記事

GitHub PagesにJekyllでブログを作成する

はじめに Webサイト・ブログを作る際、「WordPress等のCMS」を使うか、「HTML」で作成するか、どちらかを検討すると思います。 しかし、これら以外の選択肢として、「静的サイトジェネレータ」という方法があります。 今回は、Webサイト・ブログを作る際に利用するツールの選択肢として、Ruby製の静的サイトジェネレータ「Jekyll」について紹介していきます。 ※記事を移行しました。

    • SEO対策⑧次世代の画像フォーマット「WebP」

      はじめにwebサイトの高速表示は、SEOやよりよいユーザー体験の為にも重要な要素です。 サイトの表示速度を計測したり、改善のヒントを得るために「Page Speed Insights」を利用することが多いと思いますが、そんなPageSpeed Insightsの改善項目に「次世代フォーマットでの画像の配信」というものがあります。 この「次世代フォーマットでの画像の配信」とは、いったい何なのでしょうか? そこで本記事では、次世代の画像フォーマットとその一つ「WebP(ウェ

      • Electronの環境を構築し、デスクトップアプリを作成するまで

        「Electron」は、クロスプラットフォームデスクトップアプリケーションエンジンです。 端的に言えば、HTML+CSS+Javascript(Node.js)を使い、デスクトップアプリケーションを作成できるフレームワークになります。 先日、Electronでデスクトップアプリを作成したので、自らの覚書も兼ねて、Electronの環境構築からデスクトップアプリの作成までを解説したいと思います。 特に、「Electronに入門したい」、「とにかく環境を構築し、アプリを作ると

        • GitHubPagesにHexoでブログを構築し公開するまで

          はじめにWebサイト・ブログを作る際、「WordPress等のCMS」を使うか、「HTML」で作成するか、どちらかを検討すると思います。 しかし、これら以外の選択肢として、「静的サイトジェネレータ」という方法があります。 今回は、Webサイト・ブログを作る際に利用するツールの選択肢として、Node.js製の静的サイトジェネレータ「Hexo」について紹介したいと思います。 ※記事を移行しました。

        • 固定された記事

        GitHub PagesにJekyllでブログを作成する

        • SEO対策⑧次世代の画像フォーマット「WebP」

        • Electronの環境を構築し、デスクトップアプリを作成するまで

        • GitHubPagesにHexoでブログを構築し公開するまで

        マガジン

        • SEO対策
          8本
        • 静的サイトジェネレーター
          2本
        • BaaS【 Firebase 】
          2本

        記事

          FirebaseのRealtime Databaseでチャットアプリを作成

          はじめに先日、FirebaseのRealtime Databaseというデータベース機能を使用したチャットアプリ(Webアプリ)を作成しました。 Realtime Databaseの使用方法などの自分用メモ、及び、今後FirebaseのRealtime Databaseを初めて使う人の役に立てばと思い、Realtime DatabaseとNoSQLの概要、Realtime Databaseを使用したリアルタイムチャットアプリの作成から公開までを記事にしました。 ※記事を移

          FirebaseのRealtime Databaseでチャットアプリを作成

          SEO対策⑦alt属性

          はじめにWebサイトには、色々な写真・画像が乗っており、見ていて飽きないですよね。 そんな普段見慣れたサイトに貼られている画像ですが、その一つひとつの画像には「alt属性」というテキスト情報の設定ができます。 検索エンジンは、検索エンジンを使用するユーザーの考え方に近づける為、画像そのものは認識できない仕組みになっており、画像の内容を理解できず、評価することもできません。 その為、画像に書かれている内容を検索エンジンに伝え、画像の代替テキストを設定するのが「alt属性」

          SEO対策⑦alt属性

          SEO対策⑥meta description

          はじめにmeta description(メタディスクリプション)とは、Webページのコンテンツを100文字程度の文章で表した「概要」・「要約」の様なもので、HTMLの内に記述します。 検索順位結果に影響を与えなくなった為、以前ほど重視されない傾向にありますが、現在でも、ユーザーのクリック率に大きな影響を与える要素です。 今回は、meta descriptionの概要・記述方法などについて、説明していきたいと思います。 ※記事を移行しました。

          SEO対策⑥meta description

          RPAとは -RPAの概要とUiPathのインストールまで-

          はじめに近頃、RPAという言葉を耳にするようになったと感じる方は多いのではないでしょうか。 働き方改革・人手不足の解決手段として、業務を効率化させたいと考える企業は増えています。 しかし、RPAという言葉は耳にしたことはあるものの、どういうものなのか、よくわからないという方もいらっしゃると思います。 自分自身も、よく分かっていなかったので、自身の勉強も兼ねて、RPAについて説明したいと思います。 また、無料のRPAツールの一つである「UiPath」の概要・インストール方法につ

          RPAとは -RPAの概要とUiPathのインストールまで-

          SEO対策⑤ CSSの非同期読み込み

          はじめにサイト高速化にあたり、PageSpeed Insightsを使用している際、「キー リクエストのプリロード」という項目が出現しました。 「<link rel="preload"> を使用して、現在ページ読み込みの後のほうでリクエストしているリソースを優先的に取得することをご検討ください」とのことです。 この改善はサイト高速化に有効なので、今回は、preloadについて説明していきます。 ※記事を移行しました。

          SEO対策⑤ CSSの非同期読み込み

          SEO対策④サイト表示速度 -遅延読み込み-

          はじめに前回の記事で、「pagespeed insights」を使ったサイトのパフォーマンスチェックを行いました。 その中に、「オフスクリーン画像の遅延読み込み」という項目があり、「適切なサイズの画像」程ではないですが、大きな改善項目として挙がっていました。 そこで、「オフスクリーン画像の遅延読み込み」とは何なのか、その対策について、説明していきたいと思います。 ※記事を移行しました。

          SEO対策④サイト表示速度 -遅延読み込み-

          SEO対策③サイト表示速度 -画像の最適化-

          はじめに先日、GoogleのWebパフォーマンス改善ツールの1つである「PageSpeed Insights(ページスピードインサイト)」を使用し、自分のWebサイトの表示スピードを調べていました。 結果、スコアは70という、良くもなく、悪くもなく、といったところでした。(後述しますが、スコアは0~100です) 大きな改善点として、「適切なサイズの画像」という項目がありました。 調べたところ、画像はユーザーの目を引き付けたり、文章では説明が難しい内容を分かりやすく伝えたりと

          SEO対策③サイト表示速度 -画像の最適化-

          SEO対策②プライバシーポリシー

          はじめにサイト・ブログを運営する際に、必須となるコンテンツがいくつかありますが、その代表的なものが「プライバシーポリシー」を記載したページです。法律用語が多いので、「面倒なので他サイトのものをコピペで使用している」という方もいらっしゃるかもしれません。 企業サイトは勿論、ブログでもメールフォームからのお問合せ等で個人情報を扱います。 グーグルアドセンスやアフィリエイト広告サービスを利用する場合は、各々のサービスの規約で「プライバシーポリシーに○○を記載すること」と定められてい

          SEO対策②プライバシーポリシー

          SEO対策① XMLサイトマップ

          はじめにSEO対策とは、インターネットの検索結果において、自分のWebサイトを上位表示させる・より多く露出させる為の対策のことで、検索エンジン最適化(Search Engine Optimization)とも言われます。 良質なコンテンツを作成するのが一番重要ですし、大前提ではありますが、ここでは、それ以外の部分でのSEO対策について説明していきたいと思います。 XMLサイトマップ(sitemap.xml)を作成し、サーバー上に用意することで、検索エンジンに公開したホーム

          SEO対策① XMLサイトマップ

          Webサイト作成ソフト「Mobirise」の概要と使い方

          はじめに Webサイトを作る場合、HTMLのタグを覚えるのは勿論、CSSで装飾する知識は必須であり、スマートフォン・パソコンの双方で、綺麗に見られるようにしなければなりません。 サイトに少し動きをつけたいだけでもJavaScriptを使ったプログラミングを学ぶ必要があります。とても気軽に始められるものではありません。 そういった知識なしで、気軽にWebサイトを作ってみたいという場合、「Mobirise」というソフトウェアを使うという方法があります。 今回は、この「Mobir

          Webサイト作成ソフト「Mobirise」の概要と使い方

          GitHubの登録から使い方まで

          はじめにバージョン管理ツールであるGitHubは、プログラマーにとっては欠かせないサービスです。 しかし、これからプログラミングの勉強を始めるという方にとっては、よくわからない・わかりにくいものかもしれません。 そこで、そもそもGithubとは何なのか、どんな時に使うものなのかを説明していきます。 ぜひ、参考にしていただければと思います。 ※記事を移行しました。

          GitHubの登録から使い方まで

          ルート相対パス

          はじめにアプリケーション開発・Webサイト制作の際、画像を読み込んだり、リンクを張って他のページへ移動させたいときに、 そのファイルの位置を指定する為に、パスという指定方法を使います。 パスの指定方法として、「絶対パス」「相対パス」がありますが、「ルート相対パス」を知っていると、コーディング・プログラムの効率性・汎用性が高まるので、おすすめのパス指定方法です。 ここではファイル・ディレクトリの位置を指定するときに使用する、絶対パスと相対パス、そして「ルート相対パス」の意味

          ルート相対パス