2021.08.20 WEB教育機関ウェブサイト 【2021年度版】大学WebサイトのレスポンシブWebデザイン・常時SSL対応状況(関東エリア・東海エリア) 以前のブログで関東エリア(東京・神奈川・千葉・埼玉)と東海エリア(静岡、愛知、岐阜、三重)の大学webサイトにおけるレスポンシブwebデザインと常時SSL対応状況について書きましたが、1年以上が経過した現在の状況について再度調査を行いましたので、結果をまとめたいと思います。 参考ブログ 大学W [...]
2021.08.19 WEBシステム開発 goでデータ形式を識別するためのMIMEタイプを判定する方法 業務でアップロードされた画像ファイルのMIMEタイプを判別する必要があったので調査しました。 httpパッケージのDetectContentType 調べてみるとgoのhttpパッケージにDetectContentTypeという関数がありました。 func DetectContentTypeh [...]
2021.08.16 WEBWebデザイン 【Sass実践編】Sassの条件分岐と繰り返し処理とは?Sassでの制御構文の書き方を紹介! 今回はSassの制御構文について解説していきます。 制御構文が使えるようになると、条件によってスタイルを振り分けたり、繰り返し指定するスタイルの記述を短縮できたりするので、理解しておきたい機能です。 制御構文とは 通常プログラムは上から下へ順番に処理されていきます。その流れを途中で分岐させたり、 [...]
2021.08.03 WEBWebデザイン SVGってなに?PhotoshopやIllustratorでSVG画像を書き出す方法を解説します。 JPGやGIFといった画像拡張子のほかに、「SVG」という拡張子を目にしたことがあると思います。 JPGやGIF等の「ビットマップデータ」とは違い、SVGは「ベクターデータ」に分類されます。ベクターデータには拡大しても画質が落ちないという特徴があり、昨今のwebサイトでは、レスポンシブやRetin [...]
2021.08.02 WEBシステム開発 MySQLのJSON型に含まれる値でソートをかける方法 (数値・文字列・Goのtime.Time型) MySQLのJSON型に含まれている中の値で、ソートをかける方法についてまとめたいと思います。 JSON型に変換したGoのtime.Time型をソートする方法も後半でご紹介します。 準備 まずはMySQLのコンテナとサンプルデータを準備していきます。 DockerでMySQLのコンテナをたてます [...]
2021.07.28 WEBシステム開発 React Hook Form(V7)を使って簡単にバリデーションを実装しよう! 現在担当しているプロジェクトで、フロントエンドのバリデーションを実装することとなり「React Hook Form」を採用しました。 Version7 が最近出たばかりであまり情報が出回っておらずつまずいたので使い方や仕様について紹介していきます。 コードは React と Typescript [...]
2021.07.28 WEBWeb全般 404 Not Foundにさようなら!画像のリンク切れチェックもできるWebsite Explorerの使い方 Webサイトを閲覧していてリンクをクリック(タップ)したのに表示されず不満を感じたことがある方は少なくないと思います。 リンク先のページが見られない理由としてはいくつかあるのですが、主に「リンク切れ」と呼ばれる状態が原因です。 リンク切れはユーザーに不満を抱かせるだけでなく、検索エンジンからも評価 [...]
2021.07.19 WEBWebデザイン CSS Grid Layoutを利用して2次元レイアウトを自由自在に操作する ひと昔前はCSSコーディングで段組みのようなレイアウトを実現するにはfloatやtable等を利用するのが主流でした。 CSS3が普及してからはFlexbox Layout(以下Flex Layout)を多用してきましたが、同じくCSS3から利用可能となったCSS Grid Layout(以下Gr [...]
2021.07.16 WEB医療機関ウェブサイト 【2021年度版】集患につなげる病院webサイト運営に必要なこと。コロナ禍だからこそ見直してみよう。 病院Webサイトは、新型コロナウイルス感染症の影響もあり、ユーザーへの情報提供ツールとしてさらに重要な役割を担うようになってきました。 今回は、集患につなげる病院webサイト運営に必要なことをまとめましたので、自院サイトの見直しやリニューアルをお考えの方など是非参考にしてみてください。 webサ [...]
2021.07.07 WEBシステム開発 VueとReactのプロジェクトをHMR(ホットリロード)が爆速と噂の「Vite」を使って構築してみる Vitehttps://vitejs.dev/ Vite(ヴィート)はVue.jsの作者のEvan You氏が開発した次世代フロントエンドツーリングです。 公式では以下のように説明してます。 以下、Google翻訳 On demand file serving over native ESM [...]
2021.07.05 WEB医療機関ウェブサイト 【2021年度版】病院WebサイトのレスポンシブWebデザイン・常時SSL対応状況(関東エリア・東海エリア) この記事は、2021年度版の対応状況です。2023年度版については、下記ページをご覧ください。 【2023年度版】病院WebサイトのレスポンシブWebデザイン・常時SSL対応状況(関東エリア・東海エリア) 以前のブログで関東エリア(東京・神奈川・千葉・埼玉)と東海エリア(静岡、愛知、岐阜、三重 [...]
2021.07.04 WEBWeb全般 web担当者におすすめする「GoogleChrome拡張機能」7選 web担当者の皆さんは、普段どのブラウザを使用していますか? 国内ブラウザシェアトップのGoogleChromeを使用される方が多いかと思います。 GoogleChromeの魅力の一つとして挙げられるのが、豊富な拡張機能(アドオン)です。拡張機能を活用することで、作業効率を高めることができます [...]
2021.06.29 WEBユーザビリティ・UX・UI アプリ・Webサイトを専門家が評価する「ヒューリスティック評価」とは?【目的・調査・評価方法】 前回のブログにて、ユーザビリティテストについて解説しました。 今回は、ユーザビリティテストと同様に、ユーザーにとって使いやすいWebサイト・アプリを作るのに有効な「ヒューリスティック評価」をご紹介します。 数多く存在するWebサイト・アプリにとって、使い勝手のよさは重要なポイントです。ヒューリステ [...]
2021.06.25 WEBユーザビリティ・UX・UI スマートフォン・PCで読みやすいフォントサイズ&行間とは?国内のメディアサイトを調べてみた。 過去記事「可読性の高い文章をデザインするポイント」でも紹介しましたように、webサイトに限らず文章の読みやすさを左右する要素に「フォントサイズ(文字サイズ)」「行間」があります。 フォントサイズが小さく、行間が詰まった文章は視認性や可読性が低く、ユーザにストレスを与えてしまいます。 では、webコ [...]
2021.06.24 WEBWebデザイン 印刷すると⾊が変わる︖RGBとCMYKを理解して、正しくIllustratorの設定を使い分けよう(基礎編) 皆さんは、「印刷してみたら思っていた色より暗くなってしまった」「写真データを書き出したら色が変わってしまった」などの経験はございませんか。それらは恐らく、RGBとCMYKの違いによってもたらされるものが原因です。 今回は、RGBとCMYKそれぞれの特長と、Illustratorを使用する際に使い分 [...]
2021.06.23 WEBユーザビリティ・UX・UI モバイルサイトに最適なボタンサイズは?使いやすいモバイルサイトを目指して ここ最近、モバイル向けのUI設計をする機会が多くなりました。 モバイルデバイスは、直接画面を指で操作しますのでデスクトップのようにマウスを使って繊細な操作をすることができません。特に小さいボタンは、タップしづらく正確性にも欠けます。 そこで今回は、モバイルサイトにおける最適なボタンサイズ(縦幅)を [...]
2021.06.23 WEBシステム開発 インメモリで高速に!GoでRedisを扱う方法と排他制御の実装について 業務でRedisを扱うこととなり、Redisはどんなときに使うべき?というところから学習しました。 バックエンドではGoを使用しているので、Goでの簡単な使い方をまとめたいと思います。 Redisとは Redisとは、Key-Value型のNoSQL(Not only SQL)データベースです。 [...]