「web制作」カテゴリーアーカイブ

2020年に最適なfont-familyの書き方 – ICS MEDIA

2020年に最適なfont-familyの書き方 - ICS MEDIA

2020年に最適なfont-familyの書き方 - ICS MEDIA

ウェブサイトのフォントは何を指定すればよいのでしょうか? CSSのfont-familyプロパティーに指定可能なフォントは選択肢が多く、HTMLコーダーなら誰もが一度は迷ったことがあるはずです。 font-familyの組み合わせを紹介している記事は多々あります。しかし、必要のない指定や、考察不足なまま紹介している記事を見か...

はてなブックマーク - 2020年に最適なfont-familyの書き方 - ICS MEDIA はてなブックマークに追加

グーグルのエンジニアが警告、「別タブで開く」リンクは実はヤバいんだって!?【SEO情報まとめ】 | 海外&国内SEO情報ウォッチ | Web担当者Forum

グーグルのエンジニアが警告、「別タブで開く」リンクは実はヤバいんだって!?【SEO情報まとめ】 | 海外&国内SEO情報ウォッチ | Web担当者Forum

グーグルのエンジニアが警告、「別タブで開く」リンクは実はヤバいんだって!?【SEO情報まとめ】 | 海外&国内SEO情報ウォッチ | Web担当者Forum

illustration by つきのあめだま リンクを別タブで開くためにHTML上でリンクにtarget="_blank"を指定することには「セキュリティとパフォーマンスの点で問題がある」と、グーグルのエンジニアが注意している。 一般的な書き方だと思うのだが、どういうことなのだろうか。何が問題なのか、どうすればいいのかを、わかりや...

はてなブックマーク - グーグルのエンジニアが警告、「別タブで開く」リンクは実はヤバいんだって!?【SEO情報まとめ】 | 海外&国内SEO情報ウォッチ | Web担当者Forum はてなブックマークに追加

他のCSS本とはかなり異なる!現在、主流の実装・設計方法が徹底解説された良書 -CSS設計完全ガイド | コリス

他のCSS本とはかなり異なる!現在、主流の実装・設計方法が徹底解説された良書 -CSS設計完全ガイド | コリス

他のCSS本とはかなり異なる!現在、主流の実装・設計方法が徹底解説された良書 -CSS設計完全ガイド | コリス

私のCSSはこのままでいいのだろうか、他の人はどのように取り組んでいるのか、CSSのスキルアップを考えているWeb制作者・デベロッパーに、ぜひ手に取ってほしい一冊を紹介します。 本書ではCSSのさまざまな設計手法を解説するだけでなく、最適解となるコードに至るまでの思考プロセスも非常に詳しく解説されています。デ...

はてなブックマーク - 他のCSS本とはかなり異なる!現在、主流の実装・設計方法が徹底解説された良書 -CSS設計完全ガイド | コリス はてなブックマークに追加

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 – Qiita

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita

Help us understand the problem. What is going on with this article? 今回は、Corey Haines(@coreyhainesco)氏の「How I launched a profitable job board with no-code tools in 3 weeks」という記事を、本人の許諾を得て翻訳・掲載しています。 およそ12,000字の長い記事なので、かんたんに内容をまとめると下記...

はてなブックマーク - 【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita はてなブックマークに追加

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 – Qiita

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita

【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita

Help us understand the problem. What is going on with this article? 今回は、Corey Haines(@coreyhainesco)氏の「How I launched a profitable job board with no-code tools in 3 weeks」という記事を、本人の許諾を得て翻訳・掲載しています。 およそ12,000字の長い記事なので、かんたんに内容をまとめると下記...

はてなブックマーク - 【翻訳】コードは書けないけど、1人で作ったwebサービスを収益化した話 - Qiita はてなブックマークに追加

7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語る – Qiita

7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語る - Qiita

7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語る - Qiita

Help us understand the problem. What is going on with this article? こんにちは、古都ことと言います。普段はブログやらなんやらをやっているのですが、今回ブログのお引っ越しをしたのでその経緯などについてお話ししたいと思います。 先にまとめ ブログをVPSとWordPressで7年間運営してきた 速度面やメンテナンス...

はてなブックマーク - 7年間使ってきたWordPressを捨ててContentful+Gatsby+Netlifyにしたら爆速になったし経緯とか教訓とか語る - Qiita はてなブックマークに追加

SVG形式のファビコンを設置しよう | Webクリエイターボックス

SVG形式のファビコンを設置しよう | Webクリエイターボックス

SVG形式のファビコンを設置しよう | Webクリエイターボックス

2020年2月13日 SVG, Webサイト制作 つ・い・に!ファビコンもSVG形式が対応されるようになりました!SVGを使えばこれまで使われてきたPNGなどのビットマップ形式とは違い、拡大縮小しても画質が劣化しません。つまり、過去記事「クリエイティブなファビコンを設置しよう」で紹介したように多くのサイズを用意する必要は...

はてなブックマーク - SVG形式のファビコンを設置しよう | Webクリエイターボックス はてなブックマークに追加

SVG形式のファビコンを設置しよう | Webクリエイターボックス

SVG形式のファビコンを設置しよう | Webクリエイターボックス

SVG形式のファビコンを設置しよう | Webクリエイターボックス

2020年2月13日 SVG, Webサイト制作 つ・い・に!ファビコンもSVG形式が対応されるようになりました!SVGを使えばこれまで使われてきたPNGなどのビットマップ形式とは違い、拡大縮小しても画質が劣化しません。つまり、過去記事「クリエイティブなファビコンを設置しよう」で紹介したように多くのサイズを用意する必要は...

はてなブックマーク - SVG形式のファビコンを設置しよう | Webクリエイターボックス はてなブックマークに追加

HTML – 任天堂のHPにhタグが使用されていないのは何故でしょうか。|teratail

HTML - 任天堂のHPにhタグが使用されていないのは何故でしょうか。|teratail

HTML - 任天堂のHPにhタグが使用されていないのは何故でしょうか。|teratail

https://www.nintendo.co.jp/ 任天堂の公式ホームページのマークアップについて質問です。 このサイトに見出しで使用するhタグが1つも使用されていないのは、何故でしょうか。 また、ヘッダーでリストが横並びになっているレイアウトは、通常navタグ が使用されることが多いですが、navタグが使われていないのも何か理由...

はてなブックマーク - HTML - 任天堂のHPにhタグが使用されていないのは何故でしょうか。|teratail はてなブックマークに追加

宮澤テクノロジー on Twitter: “これ秘密にしておきたいくらいのライフハックなんですけど、URLを指定するだけでサイトマップを取得してきてくれる超有能Webアプリがあります。デザインの参考にしたり、要件定義したりするのにめちゃ役立ちます。WIREDをキャプチャして… https://t.co/OnfYM4k0zF”

宮澤テクノロジー on Twitter: "これ秘密にしておきたいくらいのライフハックなんですけど、URLを指定するだけでサイトマップを取得してきてくれる超有能Webアプリがあります。デザインの参考にしたり、要件定義したりするのにめちゃ役立ちます。WIREDをキャプチャして… https://t.co/OnfYM4k0zF"

宮澤テクノロジー on Twitter: "これ秘密にしておきたいくらいのライフハックなんですけど、URLを指定するだけでサイトマップを取得してきてくれる超有能Webアプリがあります。デザインの参考にしたり、要件定義したりするのにめちゃ役立ちます。WIREDをキャプチャして… https://t.co/OnfYM4k0zF"

これ秘密にしておきたいくらいのライフハックなんですけど、URLを指定するだけでサイトマップを取得してきてくれる超有能Webアプリがあります。デザインの参考にしたり、要件定義したりするのにめちゃ役立ちます。WIREDをキャプチャして… https://t.co/OnfYM4k0zF

はてなブックマーク - 宮澤テクノロジー on Twitter: "これ秘密にしておきたいくらいのライフハックなんですけど、URLを指定するだけでサイトマップを取得してきてくれる超有能Webアプリがあります。デザインの参考にしたり、要件定義したりするのにめちゃ役立ちます。WIREDをキャプチャして… https://t.co/OnfYM4k0zF" はてなブックマークに追加

「Webデザイナーはコーディングできるべきか」という議論に対する私の考え | Stocker.jp / diary

「Webデザイナーはコーディングできるべきか」という議論に対する私の考え | Stocker.jp / diary

「Webデザイナーはコーディングできるべきか」という議論に対する私の考え | Stocker.jp / diary

Webデザイン 「Webデザイナーはコーディングできるべきか」という議論に対する私の考え Wednesday, January 15th, 2020 【平日夜開催】スマートフォン時代のWebデザインスクール 体験レッスン開催!モダンなWebデザイン制作・Adobe XD・Photoshop・UI/UXなど基礎から学べる講座です。 【日曜開催】WordPress でWebサイト...

はてなブックマーク - 「Webデザイナーはコーディングできるべきか」という議論に対する私の考え | Stocker.jp / diary はてなブックマークに追加

要件定義~システム設計ができる人材になれる記事 – Qiita

要件定義~システム設計ができる人材になれる記事 - Qiita

要件定義~システム設計ができる人材になれる記事 - Qiita

Help us understand the problem. What is going on with this article? はじめに プログラミングを勉強していて、こんな事を感じた経験はないでしょうか。 「勉強してもプロダクトが作れない」 「そもそも開発ってどうやるの?」 「要件定義ってなに?」 その悩みを解決するために、まずは開発の全体感を理解しましょう...

はてなブックマーク - 要件定義~システム設計ができる人材になれる記事 - Qiita はてなブックマークに追加

フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと|Pittan|note

フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと|Pittan|note

フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと|Pittan|note

フロントエンドエンジニアとデザイナーさんは日々協力してプロダクトを作っていく関係にあります。デザイナーさんが作ってくれたものをエンジニアが素早く実現できるよう、いくつかエンジニアから意識してほしいことをまとめました。 なんでこんな話になったのか(前置きなので次の章まで飛ばしてOKです) デザイナーさ...

はてなブックマーク - フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと|Pittan|note はてなブックマークに追加

font-familyについて本気で考えてみた – Qiita

font-familyについて本気で考えてみた - Qiita

font-familyについて本気で考えてみた - Qiita

『CSS Advent Calendar 2019』最終日。 担当は本日20代最後の日を迎える私です。 18日目(CSSの単位remの正しい使い方)も書いていますのでよろしくおねがいします。 今年はmacOSのアップデートによりヒラギノが動かなくなったり、 来年初頭にはWindows7がサポート終了、Edgeのブラウザエンジン変更など、 エンドユーザ...

はてなブックマーク - font-familyについて本気で考えてみた - Qiita はてなブックマークに追加

font-familyについて本気で考えてみた – Qiita

font-familyについて本気で考えてみた - Qiita

font-familyについて本気で考えてみた - Qiita

『CSS Advent Calendar 2019』最終日。 担当は本日20代最後の日を迎える私です。 18日目(CSSの単位remの正しい使い方)も書いていますのでよろしくおねがいします。 今年はmacOSのアップデートによりヒラギノが動かなくなったり、 来年初頭にはWindows7がサポート終了、Edgeのブラウザエンジン変更など、 エンドユーザ...

はてなブックマーク - font-familyについて本気で考えてみた - Qiita はてなブックマークに追加

世界中のニュースを検索・収集できる「News API」で情報収集アプリを作ってみた!

世界中のニュースを検索・収集できる「News API」で情報収集アプリを作ってみた!

世界中のニュースを検索・収集できる「News API」で情報収集アプリを作ってみた!

どうも、まさとらん(@0310lan)です! みなさんは、普段からどのような方法で情報収集をされているでしょうか? お気に入りのニュースサイトをいくつか訪問してみたり、ニュースフィードを読んでみたり、スマホアプリを利用するなど…、さまざまな方法があるかと思います。でも、もっと効率よく欲しい情報を収集してみた...

はてなブックマーク - 世界中のニュースを検索・収集できる「News API」で情報収集アプリを作ってみた! はてなブックマークに追加

仕様の変更に強いコードを書きたいよねって話 – Qiita

仕様の変更に強いコードを書きたいよねって話 - Qiita

仕様の変更に強いコードを書きたいよねって話 - Qiita

この記事は NIJIBOX Advent Calendar2019の13日目の投稿です。 背景 何かしらのロジックを作る際に、仕様変更に強いコードを書きたいぞい!ってエンジニアだったら思いませんか。今の仕様なら動くけど、もし仕様が変わり、そのために関数全書き直しとかしんどみが深すぎます。今回はこのしんどみを少しでも回避できるよ...

はてなブックマーク - 仕様の変更に強いコードを書きたいよねって話 - Qiita はてなブックマークに追加

本当は速くならない「Webサイトの表示高速化アンチパターン」10選|榊原昌彦|note

本当は速くならない「Webサイトの表示高速化アンチパターン」10選|榊原昌彦|note

本当は速くならない「Webサイトの表示高速化アンチパターン」10選|榊原昌彦|note

ベストプラクティスや「高速化につながる!」と紹介されている記事では、逆効果、もしくは効果があるシチュエーションがあまりに限定的な手法が紹介されていることが多いので、アンチパターンとして紹介します。 本記事は「Webパフォーマンス Advent Calendar 2019」2日目の記事です。 https://qiita.com/advent-calenda...

はてなブックマーク - 本当は速くならない「Webサイトの表示高速化アンチパターン」10選|榊原昌彦|note はてなブックマークに追加

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

そろそろSEOをちゃんと勉強しようと思い、Google主催の Webmaster Conference Osaka 2019 に参加してきました。 そのイベントの最初のセッションが Malik Mairaj Syed さんの「SEO Mythbusting」というタイトルで、よくあるSEOにまつわる都市伝説的なものに関してGoogle側が回答していくというものでした。 巷で噂される...

はてなブックマーク - Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO はてなブックマークに追加

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

そろそろSEOをちゃんと勉強しようと思い、Google主催の Webmaster Conference Osaka 2019 に参加してきました。 そのイベントの最初のセッションが Malik Mairaj Syed さんの「SEO Mythbusting」というタイトルで、よくあるSEOにまつわる都市伝説的なものに関してGoogle側が回答していくというものでした。 巷で噂される...

はてなブックマーク - Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO はてなブックマークに追加

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

そろそろSEOをちゃんと勉強しようと思い、Google主催の Webmaster Conference Osaka 2019 に参加してきました。 そのイベントの最初のセッションが Malik Mairaj Syed さんの「SEO Mythbusting」というタイトルで、よくあるSEOにまつわる都市伝説的なものに関してGoogle側が回答していくというものでした。 巷で噂される...

はてなブックマーク - Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO はてなブックマークに追加

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO

そろそろSEOをちゃんと勉強しようと思い、Google主催の Webmaster Conference Osaka 2019 に参加してきました。 そのイベントの最初のセッションが Malik Mairaj Syed さんの「SEO Mythbusting」というタイトルで、よくあるSEOにまつわる都市伝説的なものに関してGoogle側が回答していくというものでした。 巷で噂される...

はてなブックマーク - Googleが答えた「SEOにまつわる都市伝説」まとめ【Webmaster Conference】 | WEMO はてなブックマークに追加

CSSで実装した斜めのラインがギザギザになってしまうのを回避し、滑らかなラインで実装するテクニック | コリス

CSSで実装した斜めのラインがギザギザになってしまうのを回避し、滑らかなラインで実装するテクニック | コリス

CSSで実装した斜めのラインがギザギザになってしまうのを回避し、滑らかなラインで実装するテクニック | コリス

CSSで斜めのラインを実装する時は、ちょっとした工夫が必要です。 画像やSVGでなく、CSSで実装すると角度やカラーを変更できる利点がありますが、斜めのラインがジャギってギザギザになってしまうことがあります。 CSSグラデーションで実装した斜めのラインがギザギザになってしまうのを回避し、すっきりとした滑らかな...

はてなブックマーク - CSSで実装した斜めのラインがギザギザになってしまうのを回避し、滑らかなラインで実装するテクニック | コリス はてなブックマークに追加

メルカリのようなサービスを、10万円で作る方法を考えてみる|__shinji__|note

メルカリのようなサービスを、10万円で作る方法を考えてみる|__shinji__|note

メルカリのようなサービスを、10万円で作る方法を考えてみる|__shinji__|note

このnoteは、プログラマでない方でも、下記のようなメルカリ風のサービスを簡単に1時間でつくる方法を書いています。 はじめに「メルカリみたいなサービス、どのくらいで作れる?」 プログラマを生業としている方なら一度はこう尋ねられたことがあるのではないでしょうか。メルカリでなくてもUberやAirbnbだったりするか...

はてなブックマーク - メルカリのようなサービスを、10万円で作る方法を考えてみる|__shinji__|note はてなブックマークに追加

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

Webサービスまとめに続いて。 2019年11月時点で僕が個人的に使っているVSCodeのプラグインのまとめです。 # Japanese Language Pack for Visual Studio Code VSCodeを日本語化してくれるプラグイン。 僕は英語弱者なので真っ先にインストールした。

はてなブックマーク - 僕がおすすめするVSCodeのプラグインまとめ|TAK|note はてなブックマークに追加

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

僕がおすすめするVSCodeのプラグインまとめ|TAK|note

Webサービスまとめに続いて。 2019年11月時点で僕が個人的に使っているVSCodeのプラグインのまとめです。 # Japanese Language Pack for Visual Studio Code VSCodeを日本語化してくれるプラグイン。 僕は英語弱者なので真っ先にインストールした。

はてなブックマーク - 僕がおすすめするVSCodeのプラグインまとめ|TAK|note はてなブックマークに追加

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは簡単なコードで書けます。しかし、プロジェクトの規模が大きくなるにつれ、コードが重複したり、未使用のコードが増えたり、!importantでの上書きが増えたり、読みにくいコードになります。 CSSのセレクタの書き方・命名や管理を改善する、シンプルで非常に効果的な5つの原則を紹介します。 Improve your CSS with ...

はてなブックマーク - CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス はてなブックマークに追加

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス

CSSは簡単なコードで書けます。しかし、プロジェクトの規模が大きくなるにつれ、コードが重複したり、未使用のコードが増えたり、!importantでの上書きが増えたり、読みにくいコードになります。 CSSのセレクタの書き方・命名や管理を改善する、シンプルで非常に効果的な5つの原則を紹介します。 Improve your CSS with ...

はてなブックマーク - CSSは奥が深い!セレクタの書き方・命名や管理を改善する5つの原則 | コリス はてなブックマークに追加

2019年時点で僕のVSCode(Visual Studio Code)に入ってるプラグインや設定を紹介します – Shibajuku

2019年時点で僕のVSCode(Visual Studio Code)に入ってるプラグインや設定を紹介します - Shibajuku

2019年時点で僕のVSCode(Visual Studio Code)に入ってるプラグインや設定を紹介します - Shibajuku

こんにちは、実は久しぶりの投稿の、どうもしばおです。 さて、僕(フロントエンドよりのWebデザイナー)は普段からメインのテキストエディターにVSCodeを使っているのですが、今日は僕のVSCodeに入っている、プラグインや設定を公開したいと思います。 僕のオンラインサロンでも、VSCodeを結構使ってて、サロンメンバーに...

はてなブックマーク - 2019年時点で僕のVSCode(Visual Studio Code)に入ってるプラグインや設定を紹介します - Shibajuku はてなブックマークに追加