Contentful

Tech lib 〜 WEBプログラミングの基礎をここに集約 〜 はじめに techlib.circlearound.co.jp Tech libという名前でWEB開発の基礎知識を集めたサイトを作ろうとしているので、お伝えしたいがためのエントリです。後半は弊社が技術的に新たに取り組んだポイントなどを記しました。前半の暑苦しい内容に興味ない方はザッとスクロールどうぞ！ 動機や背景 「WEBにに存在する有益な情報に自分でたどり着く」というのはかなり大事なスキルで、その為にはプログラマーを育てたい弊社のスタンスとして「弊社であまり情報集約や学習用サービスの用意などはしない方が良い」と今まで考えていま…

こんにちは。出口です。 今回は、はてなブログのSEO効果を高めるための施策を行ったので、その辺りの話です。 大きく分けて2つの対応を行いました。 記事下への著者情報の追加 JSON-LDへの著者情報等の追加 どちらもJavaScriptでの対応になります。 記事下への著者情報の追加 まず1つ目、記事下への著者情報の追加です。 はてなブログには、元々著者情報が表示されています。 これは、はてなプロフィールをベースにしているので、はてなID、表示名, はてなプロフィールへのリンクぐらいしか表示されません。 これを次のように改善しました。 画像のようなものが記事の一番下に表示されているはずです。 こ…

本記事は Reactウィーク 3日目の記事です。📍 2日目 ▶▶ 本記事 ▶▶ 4日目 📱 はじめに Pages Router: シンプルなファイルベースのルーティング 主な特徴 利点 欠点 Pages Router を使うべき場面の具体例 App Router: 次世代の柔軟なルーティング 主な特徴 利点 欠点 App Router を使うべき場面の具体例 どちらを選ぶべきか？ Pages Router 利用者が App Router を使い始めて苦戦したポイント まとめ はじめに こんにちは。先日配信されたPerfumeの最新アルバムがかっこよくて、最近なかなか寝付けなくなっているNRIネ…

こんにちは、Cake.jp技術部の福井です。 はじめに ウェブページの速度改善を行う中で、IntersectionObserver APIを利用しました。この記事では、どのようにこのAPIを活用してパフォーマンスを改善したかについて詳しく解説します。 改善前の状態と背景 前提 Cake.jpの商品ページは縦長のスクロールが必要なサイトです。デザインを変更することによる、DOMサイズの縮小を行わない方針です。 速度の問題点 商品ページを表示する速度に当初はFCP（First Contentful Paint）が8.8秒かかっており、ユーザー体験に悪影響を与えていました。特に、ページの初期描画時に…

この記事は、CYBOZU SUMMER BLOG FES '24 (Frontend stage) DAY4 の記事です。 こんにちわ。フロントエンドエキスパートチームの@nus3_です。 サイボウズでは開発、運用に関わる様々なチームや職能の人が集まって交流を深める社内イベントとして開運夏まつり 2024 が 7 月 2 ~ 4 日の 3 日間で開催されました。 開運夏まつり 2024 については詳しくは次の記事をご覧ください。 組織を強くするために！サイボウズ社内テックカンファレンス開催 この開運夏まつり 2024 の初日に Cybozu Frontend Day 2024 Summer と…

前述の施策に加え、さらに詳細な戦略と施策を追加で紹介します。これらの施策はSEOの効果を最大化し、持続的な検索ランキングの向上を目指すために重要です。前回の記事(【完全攻略】MPM流 SEOマニュアル 中小企業が大企業に勝つSEO(3))を読まれていない方はそちらを読んでから、以下を読んでいただけたらと思います。 1. ページ体験の最適化 GoogleはCore Web Vitals（ウェブの基本的な指標）を用いてページ体験を評価します。これらの指標を最適化することは、SEOにおいて重要です。PageSpeed Insightsで調査します。 LCP（Largest Contentful Pa…

Google PageSpeed Insights で確認 ウェブページの読み込み速度をスコア測定 pagespeed.web.dev ```html body { font-family: Arial, sans-serif; line-height: 1.6; margin: 20px; background-color: #f4f4f4; } h1, h2, h3 { color: #333; } .container { max-width: 800px; margin: auto; background: #fff; padding: 20px; border-radius: 8px…

こんにちは、株式会社アドグローブ ソリューション事業部の青山です。 普段Vueなどのフレームワークを使ってウェブ開発を行っていますが、最近注目を集めている新しいフレームワーク「Astro」に興味を持ち、軽く触っていました。端的にいうとAstroは、シンプルさと高速性に特化した静的サイトジェネレーターです。今回は、Astroがどのように静的コンテンツ表示に特化しているのか、他のフレームワークとの速度比較、そして実際にコンテンツコレクションを使ってMarkdownコンテンツを表示する方法について詳しくご紹介します。 Astroの概要と特徴 他のフレームワークとの速度比較 コンテンツコレクションを使…

ここで重要なのは、ユーザーがダイナミックで迅速に反応するアプリケーションを期待しているという点です。そのため、React アプリケーションをより速く、応答性が高く、高性能にすることが重要です。これにより、エンドユーザーは期待するコンテンツをすぐに表示できるようになります。そして、アプリとのスムーズなインタラクションを促進するための最良の方法の一つが、Reactのサーバーサイドレンダリング（SSR）の利用です。 Reactのサーバーサイドレンダリング（SSR）について詳しく見ていき、その使用方法、利点、そしてクライアントサイドレンダリング（CSR）との違いを探ります。これにより、Reactアプリ…

はじめに 最近は、開発チームに対してコミットすることが多く SRE業務にも少し手を出し始めている。 そのときに調べたことをメモする。 Core Web Vitals Core Web Vitals とはGoogleがWebサイトの健全性を示す指標として重視するもので、以下の指標があります。 参考情報 https://web.dev/i18n/ja/vitals/ https://digiful.irep.co.jp/blog/48237963801 Largest Contentful Paint（LCP） そのページで最も有意義なコンテンツが表示されるまでの時間を表します。（単位：秒） Fi…

市場概要 コンテンツ管理ソフトウェアの世界市場規模は、2022年に261億9000万米ドルと推定され、2023年から2030年にかけて年平均成長率（CAGR）10.3％で拡大すると予測されている。コンテンツ管理ソフトウェア（CMS）市場の主な原動力は、企業や個人クリエイターが作成するコンテンツ量の増加である。ソーシャルメディアやデジタル・コミュニケーション・チャネルが拡大し続ける中、大量のデジタル・データを効率的に整理、保存、配布できるソリューションへのニーズが高まっている。さらに、企業はセキュリティ、可視性、コラボレーション、安全性を強化するために、他のビジネス・アプリケーションと統合でき…

Noble Ame’ｓdiaryをご覧の皆さん、こんにちは！ 今日は『一応サコッシュ作ったけどいまいちでした(*´Д｀)商品化は先延ばし～』と言う事で書いていきたいと思います(*^-^*) 前々からサコッシュサコッシュって言ってましたが、なかなか納得がいきません(*´Д｀) まぁ、納得いかない物を商品化してもね、お客様に失礼なんで、納得できるまで作るだけですよ(*^-^*) サコッシュプロトタイプ 見た目はね、そんなに悪くないと思っていますが、マチに使ったブロードの生地が弱すぎて、ダメでした(；一_一) ストラップ部分は本革のテープを使用し、ギボシで留めるようにしています。 長さ調節も穴を開け…

「はてなブログに興味があるけど、どの程度SEO対策ができるの？」 そんな疑問をお持ちの人のために、はてなブロガー歴9年、プロブロガー歴7年のわたしの経験から、ほんとうに効果的な「はてなブログでできるSEO対策」をまとめました。 はてなブログはWordPressほどではないですが、他社のブログサービスよりもSEO対策がしやすいと思います。 具体的な施策はぜんぶで10個です。 優先度が高い順から上から並べ、①は必ず、⑩は余裕があったら、という感じ。 そこまでやらなくても…もアリ ぜひ、ご自身のレベルに合わせて取り入れてみてください。 この記事ではまず、超初心者のために「SEOとは？」という基礎知識…