サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
自己紹介 https://x.com/mizchi Node.js とフロントエンドの専門家 経歴ゲームクライアント開発 Electron アプリ開発 サードパーティスクリプトフリーランス(2回目) 現在: 1ヶ月でパフォチュする傭兵 Core Web Vitals CI/CD 今日のスコープ 話すこと 主にフロントエンド/アプリケーション視点での計測 とくにエンドユーザーから見たウェブパフォーマンス体験 話さないこと 各クラウドやDBに特化したチューニング 結果として観測できるが、最初からターゲットにはしない パフォーマンス傭兵を始めた経緯 前職でサードパーティがサイト全体に与える影響(CWV)について調査 とにかくいろんなサイトを外部から計測 真の問題を特定しても「弊社とは無関係」で打ち返す以外なく、歯痒い コスパよく直せる部分をみんな放置している！！！ 非機能要件の優先度が上がら
まとめ私個人が運営するサイトをSEO業者に発注したことに関する日記。（契約期間は11月1日から6ヶ月間）業者の担当者とのやりとり、業者がSEOと題して行ったこと、順位変動等について私自身の考えを加えながら紹介中。現時点ではまだ業者名を出すつもりはない。 発注前に「少なくとも1ヶ月以内に月10000セッションをYahoo!から得たい」と言ってあり、業者は「それなら我が社のサービスを今すぐに」と乗っている。業者ははてブでもよく見るWEB担当者フォーラムでよく名称が出てくる企業。発注したのはトップページに対して5キーワードで、サブページ4ページに関して計5キーワードで、Yahoo!・Google・LiveSearchで10位以内。 なるべく頻繁にトップページの5キーワード（キーワード1,2,3,4,5）での順位チェックと順位変動を記録していく。キーワード1がいわゆるビッグキーワード、2,3,4,
ウェブアプリの開発をする時、ユーザーに「どこが分かりにくかったか」や「どこでエラーが発生したのか」などの情報をフィードバックしてもらいたいものですが、そうしたフィードバックを送る作業はなかなかに面倒なもので、全然直接のフィードバックは来ないのにTwitterにはいろんな意見が書かれている……ということはよくあります。「highlight.io」はそうしたフィードバックを勝手にやってくれるツールということで、実際に使って試してみました。 highlight.io: The open source monitoring platform. https://www.highlight.io/ highlight.ioはオープンソースということでセルフホスト版が用意されていますが、今回はどんな機能があるのかについて確かめるためhighlight.ioの開発元が提供するSaaSを利用します。公式サイ
補足しました 2019/1/17 4:05 AMhttps://anond.hatelabo.jp/20190117033500 ブコメやトラバに一部お答えしています ※本文ここから↓ https://anond.hatelabo.jp/20190113133500 元増田へのブコメでも指摘されていたが、ひとくちに「フリーランス」といっても業種、業態、経験、実力、性格などによってその態様は異なる。 そこでひとつのケースとして俺がWeb制作業界でフリーランスとして約１３年間やってきた経験と、そこから得られた知見などを書いてみたい。Webデザイナー、Web系プログラマーには参考になるのではないかと思う。 どういう人間か満員電車やだ遅刻癖あるので会社員向いてない 朝に弱い、生活不規則自分に甘い。問題先送りタイプ。眼の前の楽しそうなことに飛びついて（増田執筆とか）やらなければならないことを後回しに
ウェブ制作でReact(Next) やVue(Nuxt)、jQuery が最近どれぐらい使われているのか調べてみたdate2022.9.4(Sun.)tagsweb developmentFrontendJavaScript ウェブアプリケーション開発でReact やVue を使うのはよくある話かなと思うのですが、マーケティングや広報活動など広告クリエイティブ系のウェブサイト制作ではどれぐらい使われているのかなと思い、暇つぶしにリサーチしてみました。 調査方法母集団ウェブギャラリーサイトをいくつか見て比較的国内系のセレクトが多そうな https://io3000.com/ さんから2022 年に紹介されている 175 件と、ウェブサイトのアワードサイトとして有名な https://www.awwwards.com/websites/ さんで2022.8 以降に Winner と
フィードバックを送信 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 検索エンジン最適化（SEO）スターター ガイド ウェブサイトの構築時には、ユーザーを念頭に置き、見つけやすく閲覧しやすいサイトになるよう工夫するのが普通です。検索エンジンもユーザーの一種ですが、コンテンツを見つけるためにユーザーの手助けをします。SEO（検索エンジン最適化）では、検索エンジンにコンテンツを理解させることで、ユーザーが検索エンジンからサイトを見つけてアクセスすべきかどうかを判断できるようにします。 検索の基本事項では、ウェブサイトがGoogle 検索の表示対象となるために特に重要となる事項を説明しています。Google のインデックスに確実に登録される方法はありませんが、検索の基本事項に沿って作成したサイトはGoogle の検索結果に表示されやすくなります。SEO とは
12月6日の健康医療系アップデートが起こってからもうすぐ2ヶ月が経とうとしています。 アップデートで被害を受けた方々、アフィリエイト収益の方は回復できましたか。うちの某サプリで上がっていた比較サイトのメインキーワードの順位はこんな感じです。 健康医療系アップデートの前までは○○サプリで5位くらいだったサイトです。 全く回復しそうな雰囲気がありません、、、！ 色々と対策をしてみましたが、検索順位はこんな感じで全く戻りそうにないので放置しています。 というか健康医療系アップデート前から比べると前月比で報酬は76%減になってしまい、このままアフィリエイターとして生き残るのが困難となってしまいました。（というか心折れました） （最初、10分の1まで落ちたと思っていましたが、計算してみると4分の1にまで落ちていました。どうでもいいことですが。） ということで、アフィリエイターとしての最後に「100万
どうもko-chですo(･ω･｡) WEBサイト制作の依頼が来たので メモ的な意味も兼ねて、記事を書いていきたいと思います。 まじめな話ですね。 なぜ依頼が僕にきたのか友達のオープンするお店について そもそも僕にできること そもそも僕の経歴技術 実績 先方に確認しなければいけないこと 全体の流れをお互いが認識すること 何の目的でWEBサイトを作るのか WEB集客のコンバージョンについて イメージしているサイトについて WEBサイト構成、ディレクトリ構成 システムが必要かどうかSNS集客との連携 必要画像・写真の用意 文章の作成において 修正回数の上限SNSの更新方法および方向性 今後のWEBサイトの保守 数値計測、改善 納品物をしっかりと決める 記録、打ち合わせの頻度、お互いの宿題について 以上を踏まえての報酬について 久々のWEBサイト制作に対する意気込み その他、最近のこと 前
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?転職ナビのフロントエンドを担当しています、@sueshinです。 Livesense - 関 Advent Calendar 2017、22件目をお送りします。 どうぞ宜しくお願いします。 はじめにフロントエンドでよく注目されるJavaScriptではなく、 地味で渋いまるで関節技のような、GoogleChrome Devtoolsを使った技術をtipsの形式でまとめました。 免責事項 ショートカットなどは全てMacのキーボード操作にしています。Windowsユーザーは適宜読みかえてください。Chromeのバージョンは63系に基づ
はい高いですか？こんなもんですか？以下見積もりの説明です。 リニューアルと言っても、既存サイトはCMS化されておらず、たいして情報もアップされていなかったため、ほぼほぼ新規案件に近い、というイメージです。そのため、旧システムからのデータ移行費用が入っていません。その代わり、商品データベースは既存のものがあり、定期的にそこからデータを吸い出してCMS側の商品ページに反映するというカスタマイズが入っています。色々調査した結果、1週間でできそうという見込みのもとに見積もりしていますが、この要望はなかなか軽く収まらないことが多いですね。コンサルティング費用にどのくらいかけるかというのはサイトの規模感によってまちまちだと思いますが、誰に向けたサイトで、何の目的で、対象となる閲覧環境は、用意するサーバーは、考えられるリスクは、など細かく資料に起こしていき、事前に複数回クライアント往訪のうえ打ち合わせ
デザイナーさんと昼飯を食っていたら急に「どういうデザイナーとだと仕事しやすいですか？」と聞かれ、しばらく考えて色々話したけれどいい感じに伝えられなかったのでここに書き出しておきたい。 先に言っておくと、これはデザイナーさんの良し悪しの話ではなく、あくまで自分の経験的にこういうことを意識してくれていると楽だったなーやりやすかったなーという感想でしかない。人によって仕事のスタイルが違うのは当たり前だし、やり方を強要するつもりはない。ただ、お互いにこういう振る舞いだと仕事しやすいというのを伝え合うのは大事だと思うので、あくまでこういう風に考える開発者もいるんだなぁくらいにとらえてもらうのがいいのかもしれない。 1回目に見せるラフを作るまでがとにかく速い 人に見せる時に、今の完成度やどういう粒度のフィードバックを期待してるかを先に伝えられる 何かフィードバックを受けた時に、なぜ自分がそうしたかを論
なんか、このサイトBootstrapくさい。そう感じることはありませんか? その理由はズバリ、欧文ベースでつくられたフレームワークを文字構造の違う日本語で適用した際に不都合が出てしまっているからです。 それらが醸し出す違和感を放っておくと、Bootstrapくささを生み出す大きな原因になってしまいます。 そもそもの問題として、欧文と比較して和文は文字の要素が多く、文字自体のリズムも少ないため、どうしても複雑で単調に見えてしまいます。 しかし、和文だからといってあきらめることはありません。BootstrapのCSSを少しだけ変えるだけでグッと見た目がよくなる隠し味をご紹介します。 1.line-heightで行間にゆとりを。明朝やゴシックなど、フォントの種類が言葉の印象を表すように、文字の行間は読みやすさ、文章全体の雰囲気を左右します。 欧文をベースに設計されたBootstrapをそのまま
Cats Who Codeのエントリー「50のフリー写真素材サイト集」から、商用サイトでも、リンクやクレジット表記の制限無しで利用できる無料の写真素材サイトをピックアップして紹介します。 50 sites to find free stock images 上記サイトでは、他にも個人サイトのみやリンク・クレジット表記のフリーサイトが紹介されています。 [ad#ad-2]
世界中の多くのWeb制作者・クリエイターが利用しているCodePenから、CSSやJavaScriptを使って実装された2016年にもっとも人気のあったデモを紹介します。Top Pens of 2016 on CodePenTop Pens of 2016では、人気が高かったスゴ技が100個紹介されており、その中からベスト10を紹介します。 当ブログで紹介したものもいくつかあり、初見のものいくつかありました。 I DESIGN WITH CODE ❤ 10位は、Creogram animatedの動画にインスパイアされて実装されたSVGアニメーションのデモ。動きだけでなく、見せ方もうまいです。
ウェブサイトの閲覧方法は、モバイルやタブレットの普及によって大きく変わってきており、あらゆる端末へ対応することがウェブデザイン制作では必須となってきています。このややこしい問題を解決する、もっとも一般的な方法のひとつが、レスポンシブWebデザインです。 レスポンシブWebデザインとは、デスクトップやタブレット、スマートフォンなどさまざまな画面サイズごとにデザインを調整でき、あらゆるデバイスに最適化したWebサイトを、1つのHTMLで実現できる制作手法を指します。 今回はレスポンシブWebデザインに対応した、無料ダウンロードできるHTMLテンプレート素材をまとめてご紹介します。どれも文字テキストや画像イメージを編集するだけで、すぐに高品質なウェブサイトを作成できます。またBoostrapなど人気フレームワークを利用した素材も多く、柔軟にカスタマイズできる点もポイントです。 サイト設計の手間を
ほとんどのモダンブラウザがCSS3対応となったことで、これまではPhotoshopなどのデザインアプリで再現していたようなデザインスタイルも、HMTL/CSSで表現できるようになってきており、その進化はますます加速しています。 今回はHTML とCSS、わずかなJavaScript で実装できる、表現力の高いテキストエフェクト用コードスニペットをまとめてご紹介します。コードニペットは各エフェクト別にカテゴリ分けしているので、ウェブサイト制作に活用したいエフェクトを見つけてみましょう。 ナビメニュー100連発！CSSで表現できるコピペ可能なHTMLスニペットまとめCSS3の広がる可能性！美しいテキストエフェクト用コードスニペット24個まとめCSSスタイリングで表現できる！すごいテキストエフェクト33個まとめ コンテンツ目次 1. アニメーション・テキストエフェクト 2. グリッチ・
実は、bootstrapの知識だけでは足りません（涙）本気でweb制作を仕事にしたいなら、現場で通用する実践的なスキルを「短期集中」で身につけましょう。 【独学 vs スクール】メリットとデメリットを比べて、おすすめの学習方法もお伝えします。 続きはこちらBootstrap、使ってますか？ 便利ですよね。その便利さを物語るように、本当にいろいろなサイトで利用されてます。 ネットで配布されてるWordPressのテーマやHTMLテンプレートのベースに使われていることも多いです。気づいてないうちに使ってしまっているひとも、たくさんいることでしょう。 今回は、便利なのだけど、使いこなすには少し理解が難しい「bootstrapのグリッドシステム」について解説します。bootstrapでレスポンシブデザインを作るとき、欠かせないテクニックです。 グリッドシステムは、頭で理解しようとせず、目で見て
HTML・CSSコーディングを取り巻く状況は、数年前と大きく変わっています。最近では、2016年11月にHTML 5.1が勧告されたり、2015年8月頃にChromeのブラウザーシェアがInternet Explorerを抜いたりといったニュースがありました。また、2017年4月にはWindows Vistaのサポートも終了するため、今後対応すべきはWindows 7のIE 11以降となります（※）。当たり前だと思っていたコーディング技術を今一度見直す時期にきているのではないでしょうか。本記事では2016年に見直した、今の時代に即したコーディング技術を紹介します。 ※ 参考記事「Internet Explorerサポートポリシー変更の重要なお知らせ -Microsoft」 1. meta keywords設定は検索順位に関係がない ウェブコンテンツのキーワードを指定するmeta keyw
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
