コモテック制作チーム

株式会社コモテック 制作チームです。 https://www.comotec.ne.j…

コモテック制作チーム

株式会社コモテック 制作チームです。 https://www.comotec.ne.jp/

最近の記事

ちょっと楽しいサーチコンソールの見方

こんにちは、コモテック制作チームです。 サーチコンソールは、Google検索でのWebサイトのパフォーマンスを分析するツールです。 今回は、弊社のサーチコンソールで、検索キーワードを把握できる機能を使い、なぜこのキーワードが検索結果に…?というキーワードを中心にご紹介したいと思います。 サーチコンソールの基本的な情報をまとめた記事はこちらからご覧ください。 コモテック まずは検索キーワードダントツNo.1。 これは社内からのアクセスも多そうです。 武士は食わねど高楊枝

    • 視線誘導を意識したWEBデザイン

      こんにちは、コモテック制作チームです。 デザインを考える上で、見る人の「視線」を考えることはとても大切です。 今回はwebサイトデザインの視線誘導について説明します。 視線誘導について 人の視線の動きには大きく分けて4つの種類があるとされています。 ◎グーテンベルク・ダイヤグラム 同じように並んだ情報やモノを見るとき、左上から右下に人の視線は動くという考え方です。この左上から右下の斜めのエリアは利用者の目に留まりやすいので、重要な情報を記載することが多いです。 ◎Z

      • 【Webフォント入門】Googlefontsの導入方法

        こんにちは。コモテック制作チーム コーダーです。 閲覧者側の端末環境に関係なく設定できるWebフォント。 今回はそんなWebフォントを導入する事のメリットや気軽に使う方法について紹介したいと思います。 そもそもなぜWebフォントが良いと言われるのか。Webフォントは、あらかじめWebサーバ上に置かれているフォントデータを読み込んで使用するフォントです。これによって閲覧者側の端末環境に関係なく、指定したフォントでWebサイトを表示しています。 各種ブラウザがデフォルトとして「

        • 色の見え方で考えたいこと

          こんにちは、コモテック制作チームデザイナーです。 今回は色について考えました。 私たちが、物体を目で見て認識する時、 光が物体反射し、かえってきた光の違いを色として認識しています。 万人が同じものを見ているとは限らず、 人体で言うと、色覚の異常、加齢、瞳の色、 ホームページで言うと、モニターの環境などにも左右されます。 デザインの色の決め方ホームページをデザインする際、 コーポレートカラーや企業イメージでカラーを設定し、デザインすることが多いです。 また、ホームページの色

        ちょっと楽しいサーチコンソールの見方

          Googleサーチコンソールについて

          こんにちは、コモテック制作チームです。 Webサイトを運営する上で、Googleアナリティクスなどのアクセス解析を活用されている方も多いと思います。 ただ、Googleアナリティクスだとサイトにアクセスした後のユーザーの行動(アクセス数、直帰率、滞在時間)などを解析することはできますが、 ・どのような「キーワード」で検索されたのか ・Google検索結果での自社サイトの「表示回数」や「平均掲載順位」 ・自社サイトへの「クリック数」 などはGoogleアナリティクスでは解析する

          Googleサーチコンソールについて

          動きから見るUI

          こんにちは。コモテック制作チーム デザイナーです。 PCやスマホ、通信技術等の進化に伴い、近年のWebサイトには動画やアニメーション等を取り入れたサイトもよく見かけるようになりました。 アニメーション(動き)は、サイトをより魅力的に見せるほかに、ユーザーをうまくナビゲートする効果も期待できます。 今回は、アニメーション(動き)をうまく取り入れているサイトを2つピックアップしてみました。 このサイトの特徴として、ヘッダーメニュー、各ボタン、記事など、それぞれをホバーした際に、

          いいねボタンで見るSNS

          こんにちは。コモテックのデザイナーです。 突然ですが、いいねボタンと言われて思い浮かぶのはどちらですか? 私は最近までずっと「👍」と思っていましたが、 今年入った新入社員に聞いたところ「 ❤️」だそうです。 ジェネレーションギャップに衝撃を受け、いいねボタンがどこから「 ❤️」になっていったのか、調べてみることにしました。 主要SNSのいいねボタン Facebook 2004年2月4日に創業。 2010年に日本展開が始まったサービスです。 リリース以来、いいねボタンは

          いいねボタンで見るSNS

          【サイトへの埋め込みもできる!】便利なGoogleサービス

          こんにちは。コモテック制作チーム コーダーです。 GoogleアナリティクスやGoogleサーチコンソールなど、Google社が提供するウェブサービス。しかし、サイト集計以外にも役立てることができるサービスが目白押しです。 今回は便利なGoogleのウェブサービス(アプリ)について紹介します。 Googleカレンダー言わずと知れたアプリですね。 「マイカレンダー」で予定をカテゴリ―分けできるほか、繰り返し登録(月に1回、週に1回・・・など)も可能なため、操作性もよいアプリで

          【サイトへの埋め込みもできる!】便利なGoogleサービス

          webデザインにおける配色

          こんにちは。制作チームのデザイナーです。 今回はwebサイトにおける色の効果について、説明していこうと思います。 Webサイトの配色色はデザインにおいてとても重要な要素です。 Webサイトでも同じく、配色によって与えるイメージが変わってきます。 まず、Webサイトには基本の3つの配色があります。 その3つが「ベースカラー」「メインカラー」「アクセントカラー」です。 ベースカラー Webサイトの基本となる色のこと。メインとアクセントを引き立てる役割があり、背景や余白に

          webデザインにおける配色

          WordPressについて

          こんにちは。コモテック制作チーム コーダーです。 Webサイト制作を進めていく中で、WordPressの導入を提案、検討されたことはございませんでしょうか。 そもそもWordPressってなに?WordPressを導入するとどうなるのか… そんな疑問の解決に少しでも役に立てればと思い、WordPressの基本的な情報を掲載したいと思います。 【WordPressとは】WordPress(ワードプレス)とはCMS(コンテンツマネジメントシステム)というWebサイトを構築・管

          効果的なバナーの作成

          こんにちは、コモテック制作チームです。 今回は効果的なバナーの作成についてお話ししていきます。 バナーの役割とはまず、Webサイトにおけるバナーとは、サイト上で他のWebページを紹介するために設置する画像のことです。皆さんも一度は目にしたことがあると思います。 バナーを日本語に訳すと「旗印」という意味があり、Webサイト上での「のぼり」や「垂れ幕」の役割があります。宣伝を目的として設置されているため、見る人に興味を持ってもらい、クリックしてもらうことがとても重要となります

          効果的なバナーの作成

          文字から見るUI

          こんにちは。コモテック制作チーム デザイナーです。 WEBサイトは、ビジュアルなどで目を引くことの他に、文字の読みやすさも重要です。せっかくサイトを立ち上げても、書いてある内容がユーザーやターゲットに伝わりづらいと効果が薄くなってしまいます。 今回は、文字が見やすい・読みやすいサイトをいくつかピックアップしてみました。読みやすいしくみを見ていきましょう。 (投稿日時点の情報です) 見出しの文字はひときわ大きく太く、ひと目で分かりやすいようになっています。本文は小さすぎず大

          SSLについて

          こんにちは。制作チームのコーダーです。 SSLってご存知ですか? ホームぺージを運用していくにあたって、【SSL化】や【https://】というワードを耳にしたことがあるかもしれません。 聞いたことはあるけど、実際どんなものなの?という疑問を調べてみたいと思います。 ■SSL(Secure Socket Layer)とはインターネット上でデータを暗号化して送受信する仕組みのひとつです。 これは安心・安全にインターネットを利用する手段であり、 ・データの盗み見や改ざん ・フィ

          Lighthouseについて

          こんにちは。コモテック制作チーム デザイナーです。 今回は、Lighthouseについてご説明したいと思います。 Lighthouseとは、 Lighthouseでは、以下のようなことがわかります。 Performanceサイトの重さや、読み込み速度を測定します。 こちらは計測時のパソコンの処理能力に左右されやすいため、数値が安定するまで何度か計測し直す時もあります。 Accessibilityaltが設定されているか、言語設定や色が見やすいコントラスト比になっている

          入力フォームにおけるユーザビリティを考える

          こんにちは。コモテック制作チーム コーダーです。 コロナ禍でお問い合わせフォームや申込フォームを作成したという方も多いと思いますが、作った"後"はどうしていますか・・・? 今日はフォームのユーザビリティについて少しお話したいと思います。 そもとも「ユーザビリティ」とは ユーザビリティという言葉には「有用性」「使い勝手」というような意味があります。 たとえば、赤いボールペンと青いボールペンを購入したとしましょう。 赤いボールペンはノック式で片手で扱えますが、青いボールペンは

          入力フォームにおけるユーザビリティを考える

          様々なメニューから見るUI

          こんにちは。コモテック制作チーム デザイナーです。 近年、サイトはより身近な存在で、表現手法も自由になってきています。ユーザーが使いやすく、興味を引くサイトのためには、メニューの創意工夫は必要不可欠です。 今回は、特徴的なメニューがあるサイトをいくつかピックアップしてみました。どのような工夫がされているかを見ていきましょう。 こちらは、グローバルナビゲーションをホバーすると下層ページメニューを表示する「メガメニュー」と呼ばれるメニューです。 下層ページが多い大規模サイト等で

          様々なメニューから見るUI