Web開発
CSSだけで簡単に1行や複数行の3点リーダーを付ける方法
この方法を知っていれば、1行でも複数行でも3点リーダーを表示でき、レスポンシブルデザインのようなマルチデバイスでもレイアウトが崩れずに表示可能です HTMLのレイアウトでは時には文字がはみ出した際に、3点リーダーと呼ばれる「…」をつける場合があります。 普通に記述してしまえば対応できますが…
最新技術やプログラム、デザインなど様々な情報を提供するサイト
Develop14 pages
Web開発
javascriptで画面ロックする場合は、Workerを使ってみよう
UIロックが発生する場合は画面上の処理と、重い処理を分けることで表示させることが可能です。早速jsでその処理を実装して軽快なUIを作成しましょう。 javascriptで重い処理を書く際やforやwhileなどのループを記述する際に気をつけないといけないのがUIロックです。 とくに重い処理…
Web開発
HUGOでxmlやjsonファイルを複数出力する方法を詳しく解説
Hugoで複数のファイルを出力する方法は？この方法の出力やファイル形式を変えることで、RSSやJSON、AMPなどの形式も出力可能になります。 HUGOは非常に強力な静的HTMLジェネレーターです。 複数のXMLを設置する機会があり、どうやったら設置できるのかなと悪戦苦闘しながら実装で…
Web開発
SVGとCSSでおしゃれでクールな最新のデザインにする
SVGとCSSのみでマルチデバイスの最新トレンドデザインを実装。マスク処理も可能で時間と労力を節約できて、サイトのパフォーマンスも向上します。 出典元：Building UI Components With SVG and CSS - Ahmad Shadeed SVGはアイコンやイラストだけでなく、開発者が時々忘れてしまう隠れた力をたくさん持っています。 CS…
Web開発
2022年のWebデザインの最新トレンドとレイアウト
2022年に期待されるトレンドは？クリエイターは、より「良い」ウェブデザインとされるものの境界を押し広げています。最新トレンドを取り入れましょう。 出典元：Web design trends for 2022 | Layout この2年間で学んだことは、私たちは常に新しいものに適応し続けなければならないということです。2022年に向けて、デ…
Web開発
第0回のテーマ「Webデザイナー、コーダーってなに？」
第0回「Webデザイナー、コーダーってなに？」にです。この講座では現役Web開発者がWeb業界を目指す方に様々な情報をわかりやすい解説しています。 はじめに 「未経験でもWebデザイナー、コーダーになろう」ではWebデザイナーやコーダーなどWeb業界を目指す方に、現役Webデザイナー兼コー…
Web開発
CSSでもできる！知っておくべき重要なヒントとコツ 8選 8選
わずか数行のコードでCSSで洗練されたデザインを作成可能。jsで実装していたことがCSSでも！？そんな効率的に開発するためのテクニックを紹介しています 出典元：8 Essential CSS Tips and Tricks Every Developer Should Know CSSは、HTMLスケルトンを設定した後、Webページにスタイルを追加するために使用されます。さらに、わずか数行…
Web開発
2022年に注目すべきモバイルアプリ開発トレンド 15選
モバイルアプリ開発の新しいトレンドが数多く出現していますが、今回はモバイルアプリ開発のトレンドのTOP15を取り上げます。注目のトレンド満載です。 出典元：Top 15 Mobile App Development Trends to Watch for in 2022 モバイルアプリ開発業界は、驚異的なスピードで進化しています。このデジタルダーウィン時代に生き残り、繁栄する…
Web開発
overflow: scroll で後ろまでスクロールするのを防ぐ方法 - スクロール連鎖の防止
overflow: scroll で後ろの要素がスクロールすることがありますが、CSSを使って、解決する問題、その仕組み、および使用場所について説明します。 出典元：Prevent Scroll Chaining With Overscroll Behavior - Ahmad Shadeed position: fixedの要素があるとしましょう。スクロールがある場合は、要素の下部の境界に到達すると、ブラウザは…
Web開発
現役Webデザイナーが解説する初めてのHTML初心者講座
「現役Webデザイナーが教えるHTML初心者講座」では、HTMLを始める人、難しそうと思っている人、挫折してしまった人でもHTMLがわかる講座です。 はじめに HTMLをこれから始める人、HTMLってプログラムみたいで難しそうと思っている人、HTMLで挫折してしまった人。そういった人たちでも…
Web開発
GASとアナリティクスで、Hugoに人気記事を表示させる
「簡単にできるHugoで人気の記事を表示する方法」の第2回です。スプレッドシートからデータを取得して、PVランキングをHugoと連携する方法を解説します 簡単にできるHugoで人気の記事を表示する方法の2回目になります。 前回（簡単にできるHugoで人気の記事を表示する方法 #01）ではGAS（G…
Web開発
簡単にできるHugoで人気の記事を表示する方法を詳しく解説
データベースもサーバーも不要。Hugoでも簡単に人気の記事を表示する方法を紹介いたします。あなたのサイトにもPVランキングを簡単に設置できます。 Hugoにはさまざまな機能があり、ブログを作るにはもってこいの静的サイトジェネレーターです。 関連記事も取得できて、検索機能もある「至れり尽く…
Web開発
GitHub Pagesを使って無料でSSL付きのサイトを公開する
GitHub Pagesを使ってSSL付きのサイトを無料で公開する方法を解説しています。Hugoと連携することですぐにWebサイトを公開することが可能です。 デザイナーでもできるはじめてのHugoの2回目になります。 前回（デザイナーでもできるはじめてのHugo #01）はHugoのインストールから公…
プログラミング
デザイナーでもできる初めてのHUGOでのサイト作成 #01
サーバーなどを用意するのが手間だなと思う人は、Hugo+GitHubで早く、簡単にサイトを作ってしまうのをオススメします。無料でhttps(SSL)も設定できます。 CMSではWordPressが有名ですが、phpやサーバの準備などに時間がかかってしまったり、ちょっと敷居が高いイメージではないでしょうか。…