はじめに 今回の記事では、私の独断と偏見でエンジニアリングにおける必須の書籍を、以下の分野に分けて40冊共有する。 Web開発 行動経済学 ソフトスキル その他 対象とする読者 プログラミング初心者 どの書籍から読み進めればいいかわからないプログラマー なにか新しい書籍を読みたいひと なんとなくタイトルが気になったひと Web開発 『リーダブルコード』 良質なコードの原則と具体的なテクニックを丁寧に解説している。プログラミング初心者はまずこれを読むべき。良質なコード―要は、メンテナンスしやすいコードを書く上で重要なヒントを教えてくれる。コーディングで一生役立つ知識が満載だ。何度読んでも決して色褪せることのない不朽の古典である。 『14歳からのプログラミング』 図解付きでプログラミングの基礎(例：変数、関数、条件分岐)を理解できる。小難しい専門用語が一切なく、初心者でも問題なく理解できるよう
効率よくコーディングを進めるためにChatGPTを使ってみよう
この記事について この記事は、 Web制作の基礎から学べる「Webコーディングスクール」 などの資料制作をお手伝いして頂いているemiさんによる寄稿記事です。 emiと申します。USAGI DESIGN emi.というサイトでWebデザインやコーディング練習用のデザインデータを配布しています。Webデザインをメインにストックイラストレータ、グッズデザインなどしております。 ChatGPTとは ChatGPTはOpenAIが開発した対話型のチャットボットです。質問を入力すると質問に対する回答が出力されます。 今回はChatGPTを使って、効率よくコーディングを進めてみます。 headタグ内のコードをChatGPTで生成しよう HTMLの大枠をChatGPTを使ってコーディングしてみよう グロナビをChatGPTで生成してみよう ボタンをホバーした時のCSSをChatGPTで生成してみよう H
営業、受注、制作、納品、運用と、ウェブ制作の活動は長期に渡り、そのタスクの種類と量は膨大です。だからこそ、基本的なプロセスや使用するドキュメントなどを明確に定義しておかないと、サービスの品質が担当者により大きく変わることになります。 ベイジは社員がまだ5名の頃、各人に委ねた進め方によって以下のようなトラブルが頻発していました。 ミスが発生しても「次から気をつける」と精神論で終わらせてしまう 担当するディレクターやクリエイターによってタスクの抜け漏れが起きる 担当者それぞれが属人的な進め方をしてて品質が安定しない 役割が不明瞭なグレーゾーンのタスクが放置されてしまう 創造的な仕事の時間が、ルーチンや計画にないタスクに奪われてしまう 新しい社員が入る度に同じことを教えないといけない これら問題を解決するため、2014年頃からワークフローを整備するようになりました。ちなみに私が入社したのはこれ以
Webフロントエンド入門
まずはじめに HTML、CSS、JSを学んだ後にモダンなweb制作を行う上でこれから何を学べばいいだろうと手探り状態だった過去があるので、今同じ悩みを抱えている方に向けてこの記事を書こうと思いました。また、自分自身が2023年に多くのことを学んだのでそれの整理になればという思いもあります。 あと、いいね、コメントいただけると記事作成の励みになります😇 この記事の対象者 HTML, CSS, JSはある程度理解した モダンなWeb制作を行いたい これから学ぶべき技術 React, Next.js 一度は聞いたことある人も多いと思います。これは、Webサイトを効率的に開発することを目的に作られたJSのフレームワーク(正確にいうとReactはライブラリ)です。 ReactはFacebook社が開発したもので、それをVercel社がより使いやすくしたものがNext.jsです。 作成するものによっ
レスポンシブの確認ツールやサービスをいろいろ紹介してきましたが、ついに本命とも言える無料ツールの登場です！ Windows, macOS, Linux対応で、しかもオープンソース、快適にレスポンシブの確認ができるResponsively Appを紹介します。5つのデバイスを同時にすれば、制作時間は5倍速くなります。 無料とは思えないほど高性能で、すべてのWeb制作者にお勧めです！ Responsively App Responsively App -GitHub Responsively Appの特徴 Responsively Appのダウンロード Responsively Appの使い方 Responsively Appの特徴 Responsively Appは、レスポンシブのWeb制作に役立つElectronで構築されたブラウザです。 ユーザーインタラクションは、すべてのデバイス間でミ
はじめに 今回はVSCodeでおすすめの拡張機能を分野別に紹介していきます。 拡張機能は下記の分野に分けて紹介していきます。 VSCodeを使う全員向け Web制作関連 HTML&CSS関連 WordPress関連 フロント向け JavaScript React Vue サーバーサイド向け PHP Ruby その他 拡張機能を利用することで開発の生産性を上げることができるので、ぜひ参考にしていただければなと思います。 この記事の対象者 プログラミング初心者の人 分野別におすすめの拡張機能を知りたい人 開発の生産性をより上げたい人 VSCodeを使う人全員向け まずはじめにVSCodeで開発をしている人、全員におすすめをしたい拡張機能を紹介しておきます。 自分自身が使った拡張機能の中で「とりあえず入れて損はない」というものを厳選しています。 それでは紹介していきます。 Japanese La
私のCSSはこのままでいいのだろうか、他の人はどのように取り組んでいるのか、CSSのスキルアップを考えているWeb制作者・デベロッパーに、ぜひ手に取ってほしい一冊を紹介します。 本書ではCSSのさまざまな設計手法を解説するだけでなく、最適解となるコードに至るまでの思考プロセスも非常に詳しく解説されています。デベロッパーの頭の中で考えていることが言語化されており、自分のCSSを見直したい人、より効率的なCSS開発を探究している人にお勧めです。 本書は、CSSの中・上級者向けの内容をていねいに詳しく解説したものです。初心者向けのブログやお店ページの例などは一切なく、モジュールベースのコンポーネントやレイアウトが主体で、プロジェクトレベルのCSS設計について解説されています。
こんにちは。 いつも通りのパーマをかけたらトイプードルみたいになった、どうも柴田です。 さてさて、昨年の11月26日に技術評論社さんより「武器になるHTML」というHTMLだけに特化した初学者向けの書籍を出版させて頂きました。 この記事を読んで下さっている方の中にも、すでに本書をお持ちの方もいらっしゃるかもしれませんね。 ご購入頂きありがとうございます！ ひょっとしたら、もう読み終えられた方もいらっしゃるかもですね。 ということで、本書が発売されて半年近く経ちますが、今更ながら、この本をどういう想いで書いて、どんな方に読んで頂きたいのかについて書いてみたいと思います。 目次 初学者の方に向けたHTMLだけの424ページ「とりあえずこう書いておきましょう」は、ありません一人でも多くの人が利用できるWebサイトを構築するために学校やスクールの先生が教科書としても使いやすいように中級者になっても
はじめに 今回は無料でWeb制作周りの技術を学ぶことができるサービスをまとめました。 これからWeb制作の学習を始めていきたい人やプログラミングの基礎学習をしていきたい人におすすめのサービスなのでぜひ参考にしてみてください。 この記事の対象者 プログラミング初心者~中級者 Web制作を学びたい人 HTMLやCSSをより深めたい人 ポートフォリオを作りたい人 無料コーディング練習所 まずはじめに紹介するのはWebサイトを制作しながらコーディングスキルを身につけることができる無料コーディング練習所です。 こちらのサイトではデザインカンプが用意されており、基本的なコーディング方法から応用的な手法まで実際にWebサイトを制作しながら学ぶことができます。 準備編でがエディタの設定方法や拡張ツールといったコードを書くための基礎の基礎から丁寧に解説をしてくれています。 入門編~上級編ではWebサイトを作
エンジニア職に就いたあと辞めたポエム
補足→ https://anond.hatelabo.jp/20191205212350 これは退職者アドベントカレンダー2019 (https://adventar.org/calendars/4051) 5日目の記事です。最初は自分のブログに書くつもりでしたが、書いてるうちにどこまで筆が滑っているのかわからなくなったので増田に投げることしました。そしたら余計にタガが外れたのはご愛嬌。 What's thisよく見かける「未経験からエンジニアへ！」ストーリーの、あまりなさそうなルートです。よくあるルートのほうはなぜかTwitterで報告して「○○系エンジニア」的な命名をしてから入社その後の動向が闇に葬られているのをかなりの確度で見かけますが、まあ、なんか、いろいろあるんでしょう。逆にそういう成功（？）体験の生存バイアスを強化する情報ばかりあふれていると情報として健全でないように感じます。
ウェブサイトの表示スピードはサイトの健全性における重要な観点の一つです。Googleが提唱するCore Web Vitalsコア・ウェブ・バイタルズと呼ばれる指標の中にもサイト表示スピードに関する項目があり、表示されるまでの時間が単なるユーザー体験だけでなく、SEOでも無視できない存在です。表示スピード低下の要因はネットワークやサーバーサイド、そしてフロントエンドまで広範囲におよびます。本記事ではその中でも画像の読み込みについて改善できるテクニックを改善前と改善後を比べながら紹介します。 改善前サンプルを別ウインドウで開く 改善後サンプルを別ウインドウで開く 画像読み込みBefore / Afeter 上図はLighthouseによるチェックの結果です。Lighthouseはウェブサイト検査ツールで、ウェブページのパフォーマンス、アクセシビリティ、SEOなどの状態を計測できます。Googl
2年ほど前に「SEOの学び方」という記事を公開しました。今回は改めて初級・中級・上級と3つの段階に分けて再整理しました。これからSEO関連のお仕事を始める方、SEOの勉強方法を知りたい方の参考になれば幸いです。 目次 SEOの学び方（初級） SEOは、Web経験がない新卒にはハードなお仕事 世界中の企業がSEOに取り組んでいる理由を理解する SEOはオーディエンスと事業の理解から始まる 自分でサイト運営・集客の経験をする 身近なものを題材にSEO施策を考えてみる 「この領域だけは、自信がある」というスキルの柱をつくる 自分自身もインターネットを活用する SEOの学び方（中級） SEOの全体図を学ぶ 英語 ケーススタディ（他社事例）を研究する 他人にSEOを教える Googleが公開しているドキュメントに全部目を通す 失敗してもいいので、施策を実施する 「今は学ばない」領域を決める 人が検索
「いつかGitHubで働きたい」10年来の空想を現実にしたソフトウェアエンジニアの紆余曲折な人生 - Findy Engineer Lab
長永健介（@kyanny）と申します。現在はGitHubで働いています。10年前、「いつかここで働きたい」と夢見た会社です。 私は子供の頃から「考えること」が好きでした。難しいこともくだらないことも、真面目に考えて自分なりの意見をまとめる癖がありました。成長するにつれて私の思考様式は洗練され、Webとブログに出会ったことで「書く」という手段に昇華されました。書くことで考えていることを言語化し、言語化した自分の考えを読みながらさらに考えを深める ── この活動を繰り返すことで、起こりうる問題に備えたり、問題を多角的に見つめて活路を見出してきました。 とりわけキャリアの選択において「(思考|志向)を言語化する」習慣が大いに役立ちました。この記事では私のキャリアにおけるいくつかの選択と、その時々で考えていたことについて紹介します。 望んでなかった「けものみち」を変えた日記の言葉 Shut the
※ASPも厳密にはクラウドECに入りますが、この記事ではebisumartのような「フルカスタマイズ可能なクラウドEC」をクラウドECと定義します。 ebisumart(エビスマート)公式サイト それでは、次に個人でECサイトを制作する方法を順に解説します。 ①個人の場合は無料ASPから始めよう！ もし、個人でECサイトを始める方は、まずは「BASE」や「STORES」「カラーミーショップ」という誰でもカンタンにECサイトを作れる無料ASPがありますので、こちらでECサイトの制作をするのをおススメします。なぜなら制作費用が0円だからです。しかもEC制作は、まるでFacebookのアカウントを開設するようにカンタンなので、予算が企業に比べて制限のある個人であれば、これを利用しない手はありません。 無料ASPは初期費用、月額費用とも0円ですが、商品が売れた時に「決済手数料」が３％から５％くらい
この記事では、Webデザイン制作を楽にする最新オンラインツール43個をまとめてご紹介します。 コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。 自分のワークフローにうまくツールを導入することで、制作時間の短縮につながるだけでなく、ストレス少なく作業を行うことができます。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. プロトタイプ、アイコンツール 5. コラボ、リモートワークツール 6. 面白、クリエイティブツール Web制作の効率、生産性アップ！話題の最新オンラインツールまとめ Web制作便利ツール Layout Patter
この記事では、Webデザイン制作の面倒な作業をラクにするCSS便利ツール87個をまとめています。なお、新しいツールを随時アップデートしています。 CSS FlexboxやGridをつかったレイアウト生成ツールや、レスポンシブ対応の画像ツール、配色に困ったときに便利なツール、多彩なCSSアニメーション、話題のニューモーフィズムなど、CSSスタイリング時間節約や、さまざまな問題を瞬時に解決することを目的に作成された便利なツールが揃います。 Web制作に活用したい最新ツールと合わせてチェックしてみてはいかがでしょう。 これだけあれば困らない！Web制作を快適にする最新オンラインツール48個まとめ Web制作�の面倒�な作業をラクにするCSS便利ツールまとめ CSS box-shadow Examples さまざまなサイトで実際に使われているCSS box-shadowを集めているライブラリ。お好
Webサイトやアプリをレスポンシブ化するためにメディアクエリに頼っているのであれば、CSSの機能を見直して、昔ながらのブレークポイントを新しい流動的なアプローチで実装ができないか検討する時期かもしれません。 CSSの実装はデバイスベースからコンテンツベースに移行しているのが現状です。grid, flexbox, vh, vw, calc, clamp, min, maxなど、CSSの機能を使用してレスポンシブ対応にするテクニックを紹介します。 You Probably Don't Need Media Queries Anymore by Kathryn Grayson Nanz 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 大局的なgridとflexbox 活躍するCSSのプロパティ 完全に機能するCSSの数学関数
サイゼリヤでコロナ助成金の「不使用」が問題に 独自の”特別休暇“に不満や疑問の声（今野晴貴） - エキスパート - Yahoo!ニュース
「コロナ休業補償」の助成金不使用 サイゼリヤへ申し入れ 人々の暮らしに新型コロナの影響が広がるなか、今日のNHKのニュースで注目すべき出来事が報じられた。国が整備した保護者支援の助成金制度が企業に適切に活用されていないケースがみられるというのだ。 臨時休校に伴う助成活用されず 厚労省 企業に利用促すよう指示（NHK NEWS WEB） NHKの取材に対し、「会社が国の助成金を利用してくれない」と語ったのは、大手飲食チェーンの株式会社サイゼリヤの店舗で働くパート従業員のAさん（30代女性）だ。 実は、この事件は筆者が代表を務めるNPO法人POSSEにAさんが相談を寄せたところから発覚した。 Aさんはその後個人加盟の労働組合・総合サポートユニオンに加入し、会社に対して、「新型コロナウイルス感染症による小学校休業等対応助成金」を利用すること、そして、この制度の対象になる従業員の休業に際して賃金を
鳥取県鳥取市で主にホームページの制作を行っている合同会社フットでWebディレクター兼エンジニアをしている岡村といいます。 このnoteは先日、各地でWebディレクターをされている方々と「Web制作の見積り」というテーマでZoomを使用した情報交換会を行った際に自身がカンペとしてまとめたものをnote用に加筆修正したものです。 情報交換会の実施後にTwitterで「こんなお話しましたー」とつぶやいたところ、普段あまり「いいね」がつかない僕のアカウントにしては結構反応を頂きました。 情報交換会でも「他の人の見積書の作り方を知る機会がないので新鮮だった！」「発見があった！」という声が挙がり、僕自身も新しい気付きがあったので、こういった情報を共有すると参考になる方がいるかも。ということで、非常にざっくりとしていますがまとめてみました。 タイトルにあるように、あくまでも僕たち（合同会社フット）の場合
フロント学習の最高の教材集 - Qiita
はじめに 今回はフロント学習で重宝できる教材をまとめました。 軽く自己紹介として、自分は新卒でフロントエンジニアとして入社し2022年で2年目になります。 実際に実務を通す中で「この教材のおかげで実装がスムーズにできた」「この教材をやってたおかげで理解ができた」といったような場面が2年の間で多々ありました。 今回紹介する教材は自分自身が実際に使ってよかったものかつ、そのほとんどが無料で学べるor低価格の教材になっています。 「フロントエンドを網羅的に学べかつ実務の基礎作り」という目的で教材を紹介します。 この記事の主な対象者 フロントエンドの学習をこれからしていきたい人 何を学べばよいのかがわからない人 HTMLとCSSはある程度かける人 この記事の目標 フロント学習の指針が立てられる 実務現場でも活用できるスキルを学べる教材を知れる JavaScript ドットインストールのJavaSc
2021年11月18日 JavaScript いつも何気なく使っていたコードをふと調べ直してみると、知らないうちに「Deprecated（非推奨）」と書かれている…なんてこともありますよね。今回はJavaScriptを書いていて出くわした非推奨となったものをいくつか紹介します。 document.write 画面にテキストを表示する document.write 。JavaScriptの勉強を始めて最初に書いたコードがこれだったという方もいるのではないでしょうか？これはブラウザーのレンダリングに悪影響が出たり、DOMへの影響などを考慮して「強く非推奨」とされています。 これまでの記述例： document.write('やっほーい'); 解決策1：textContent や innerHTML を使う 代わりに文字列を書き換える textContent や、HTMLも含めた文字列を挿入でき
フリーランスとして一人で制作をしていると、どうしても自身のスタイルの中だけでデザインしがちなので、新たな刺激を求めて書籍やネットを徘徊して見るようにしています。今回は、私が参考にしているギャラリーサイトを11個紹介します。クライアントとの打ち合わせ時も担当者とイメージを共有できるので便利に利用できると思います。ぜひ参考にしてみてください。 URAGAWA担当した制作会社を掲載しているギャラリーサイト。制作会社ごとに見て回れるのはおもしろい。カテゴリ分けも『業界』『タイプ』『特徴』『カラー』『特集』『アワード受賞』『ランキング』と他にはない分類ですが意外と使いやすいです。制作の裏側記事もあってWebデザインの参考だけではなく読み物としても楽しめます。 URAGAWA | 制作会社がわかるWEBデザイン・参考サイト集 紹介文URAGAWAは、クリエイティブカンパニーの情報を蓄積していくことで、
＜この記事の著者＞ ばんか（bamka） - Tech Team Journal Web制作会社の会社員（Webディレクター）として働きつつ、個人でブログ／メディアライターとしても活動するパラレルワーカー。 ChatGPT等AIを公私で駆使し、ITツール・ガジェットを用いて人々の生活をより豊かにするための活用術を提供するブログも運営。 タスク管理、得意ですか？ 自慢じゃありませんが、私は苦手です。あまり好きではありません。 Webディレクターとしては、プロジェクト管理・タスク管理は必須スキルなので、一般的には「上手にやれている方」なのかもしれません。ですがいまだに苦手意識は抜けないままです。 なんで苦手なのかなぁと思い返してみると、要因はいくつか思いつきますが、中でも最も根深い問題は「気持ちに頼りすぎる」という点にあるように思います。 【目次】 やる気の高いときに設定するから長続きしない
はじめに 今回はプログラミング初心者と中級者向けの、プログラミング学習サービスを紹介します。 自分自身が実際に学んできた中でよかったものだけをピックアップしています。 なお、progateやドットインストールといった誰でも知っている学習サービスは省いています。 web制作向け (1) web-design-textbook まずはじめに紹介するのはWeb制作を基礎から実装手法を網羅的に学ぶことができる「web-design-textbook」です。 こちらは基本編~上級編とレベル別になっているので初心者でも入りやすい構成になっています。 かつ問題数もかなり豊富で図を多数用いて解説をしているので独学でも挫折せずに学習を進められる教材になっています。 ぜひこれからWeb制作の学習をはじめたいという人は使ってみてください。 (2) Codestep 次に紹介するのは、HTMLやCSSといった基礎
町山智浩『わたし、定時で帰ります。』を語る
町山智浩さんがTBSラジオ『たまむすび』の中でドラマ『わたし、定時で帰ります。』を紹介。日本社会の抱える労働問題などとあわせて話していました。 番組公式サイトがオープンしました！ 相関図や、劇中写真もちらほら? 放送前にぜひチェックしてください✨https://t.co/StEDg5pjUg#わたし定時で帰ります #わた定 #吉高由里子 #向井理 #中丸雄一 #柄本時生 #泉澤祐希 #シシドカフカ #内田有紀 #ユースケサンタマリア #tbs #火曜ドラマ pic.twitter.com/6DLBo1quFS — 火曜ドラマ「わたし、定時で帰ります。」最終話 6/25放送⏰ (@watashi_teiji) 2019年3月15日 （町山智浩）今日は映画ではなく、日本のテレビドラマ。それも今日の夜に日本で放送されるTBSのドラマ『わたし、定時で帰ります。』についてお話をさせてください。 （赤
＜この記事の著者＞ ばんか（bamka） - Tech Team Journal Web制作会社の会社員として働きつつ、個人でブログ／メディアライターとして活動するパラレルワーカー。 iPhone・iPad・Mac・ITツールを用いて人々の生活をより豊かにするための活用術を提供する「デジタルライフブロガー」です。 Web制作に関わる人にとって、すでに公開されているWebサイトというのは非常に重要な勉強材料です。中には「こういった表現、次のプロジェクトで使ってみよう」「こういう見せ方いいなぁ。いつかやってみたい」と、いつか役立てたいサイトもあるでしょう。 そういった「参考サイト」は、自分だけのデータベース化しておくと便利です。私はNotionを使って、自分だけの参考サイト集を作成しています。 【目次】 自分だけの参考サイトギャラリーをNotionで作ろう 自分専用の参考サイトギャラリーを作る
Web制作者はブックマークしておくと便利！ 各UIコンポーネントのさまざまな実装方法のまとめ -The Component Gallery
Webサイトやアプリでよく使用される各UIコンポーネントのさまざまな実装方法がまとめられたThe Component Galleryを紹介します。 コンポーネントは再利用可能な単一の部品として利用でき、実装するコードや名前の付け方など、Web制作者には非常に勉強になると思います。 The Component Gallery The Component Galleryの特徴 The Component Galleryの利用方法 各UIコンポーネントのまとめ The Component Galleryの特徴 The Component Galleryには、実際のデザインシステムで使用されているUIコンポーネントがまとめられています。フロントエンドのデベロッパーとして毎日経験する問題を解決するために作成されました。 The Component Gallery コンポーネントや要素に名前を付けるの
これまで未経験エンジニアに関する包囲網についてお話をしてきました。このお話は非常によく読んで頂いておりまして、本noteでも2番目のPVになっております。 未経験エンジニア、世間的には駆け出しエンジニアなどとも呼ばれていますが、こちらの状況が徐々に変わってきました。それが今回お話をする未経験フリーランスです。未経験フリーランスとはオンラインサロン・オンラインプログラミングスクールを出た後に直ちにフリーランスになるという状況です。今回はそのようなお話です。 有料設定していますが、最後まで無料でお読みいただけます。もしよければ投げ銭感覚で応援をお願い致します。 ご覧頂きましてありがとうございます。 11月の公開以後、継続的にお読み頂いているものになります。 今は未経験エンジニアより未経験フリーランスの方へと情報商材市場が移ってきた感がありますね。こちらも書かねば。 https://t.co/M
日頃の忙しい業務を少しでも楽にしたい、効率化したいと考えている人にぴったりな、Web制作で使える最新オンラインツールをまとめてご紹介します。 コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。 カテゴリごとに整理しているので、制作フローに新しく追加してみてはいかがでしょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. プロトタイプ、アイコンツール 5. コラボ、リモートワークツール 6. 面白、クリエイティブツール Web制作の効率、生産性アップ！話題の最新オンラインツールまとめ Web制作便利ツール クリックで一発コピペできる、120種類以上のCSSボタンを集めたライブラリ。3Dやグラデーション、レトロな
これはなにか エンジニア、ビジネスサイドの方に向けた、「良い要件定義の作り方」について書いた記事です。 長文がつらつらと書いてある本稿ですが、要するに言いたいことは、 ● 完璧な要件定義など幻想であり、誰がどう作っても不完全である ● そのため、一番危険なのは、とびきり賢い人が出してきた要件定義で、 「あの人が作ったんだから大丈夫」と盲目的に考えること ● 完璧にはならないことを受け入れ、ベストを尽くす姿勢が大事 ●そもそも、アジャイル開発において、完璧な要件定義は求められていない ●良い要件定義には以下のスタンスが必要 ● UXから逆算する ● 削ぎ落とす ● 個ではなく、チームで作る ● レビューを徹底する ● 3つのシナリオを想定する ということです。 ※約1万字あり、また各章について深く掘り下げる項目は別記事を添付しています。そのため、モバイルで通読するにはすこし骨が折れるかもしれ
WordPressの今までの解説書は全部過去のものに、制作の仕様が大きく変わったブロックテーマの使い方がよく分かる解説書 -作って学ぶWordPressブロックテーマ
「ブロックテーマ」とは、WordPressのサイトエディタのために用意された新しいテーマのフォーマットで、Gutenbergのブロックを使用してテンプレートを構成するものです。WordPressが後方互換を考慮するかぎり、今までのクラシックエディタや初期のGutenbergも使用できると思いますが、これからWordPressのテーマを制作するなら、このブロックテーマが必須になります。 WordPressのこれからのテーマ制作の標準「ブロックテーマ」をしっかり学べる解説書を紹介します。 著者はHTMLやCSSをはじめ、JavaScriptの解説書などWeb制作系の解説書で、はずれ無しのエビスコム様。ていねいで詳しい解説は分かりやすく、実践的なサンプルもたくさんあるので、かなり役立つと思います。 本書もWordPressのブロックテーマをその基礎知識から実践的なテクニックまで詳しく解説されてお
SNSだけを見ていると、私たちの会社はいつも平穏でマイペースに仕事をしてるように見えるかもしれない。しかし、所詮は私たちも普通の会社。世の多くの会社が経験する浮き沈みや苦労と無縁ではない。 昨年は創業以来初ともいえる「営業危機」を経験した。幸いにして半年で問題の大半は解消し、数多くの学びを得た。 その一部始終を言語化することで、経験を再利用可能なノウハウとして定着させたい。同時に記事として公開することで、同じ課題で悩む企業や組織の手助けになればと思う。 自負と怠慢 ウェブ制作会社でありながら、マーケティング系のイベントに多数登壇し、マーケティング系のメディアから多数取材が来る。そんなウェブ制作会社は私たちだけだと思っている。マーケティングに強いと市場に認められ、実際にそうだという自負があった。 制作者が社員の大多数を占めるウェブ制作会社にとって、制作をしているだけで自然と仕事が舞い込んでく
東京生まれ、神奈川、埼玉育ち、東京在住。Web制作をしたり小さなバーで主に生ビールを出したりしていたが、流れ流れてデイリーポータルZの編集部員に。趣味はEDMとFX。（動画インタビュー） 前の記事：クリームチーズのKiriをもう一度感じる ＞ 個人サイト まばたきをする体 Twitter @eatmorecakes 必要かつ2000円をほんの少し上回るくらいに抑えたい あと300円で、あと200円で2000円なのに！ そんなときについで買いする商品、できればそれは1000円を超えるものではあってほしくない。 買い物かごがちょうど2000円ぴったりくらいに収まってほしい。 さらに今後絶対に必要なものであることも重要だ。「あと200円」のために不要なものを買うなど言語道断だ。 というわけで、今回はTwitterの #Amazonであと200円_DPZ のハッシュタグで、魅力的かつ少額のAmaz
とんでもねえ会社に転職しちまった
当方氷河期増田 新卒で入った会社が半年で潰れて路頭に迷い、 しばらく弱小スタートアップなどを転々とした後にどうにかWEB制作の正社員の職を見つけた そこは正社員とはいいつつ客先常駐の特定派遣で薄給なうえ5年間昇給も賞与もなしで 待遇はひどいもんだったが楽だったし安定はしてたし 妻子もいるので収入を切らすわけにいかず、なんとか続けていた しかしコロナで色々な案件がぶっ飛んで、ワークシェアリングの名を借りた減給もあり こりゃダメだと意を決して転職活動に踏み切った しかしまあ、ないわな、転職先 アラフォーの管理職経験もなくスペシャリストでもないWEB制作者、俺でも雇わん それでも数撃ってるうちに良さそうな会社に当たった もともと印刷物ベースの会社がIT化をすすめるとかで、社内初のWEB担当者を探していると 正直時代に乗り遅れた斜陽企業感はあったが、待遇は悪くない 年収は450万、これは前職の倍近
※本記事はアフィリエイトプログラムによる収益を得ています PCの文字入力で「→（右向き矢印）」マークを簡単に入力できる方法が便利だと注目を集めています。今まで「みぎ」で変換してた……！ Twitterユーザーで整形外科医のおると（@Ortho_FL／ブログ）さんが投稿。その方法とは、「ー＞」と打って変換するだけで「→」が入力できるというもので、特に「『右』も『→』もよく使う人間ほど恩恵を受ける」とツイートしています。 ATOKで試してみた結果 変換できた！ 実際に試してみたところ、「－＞」から「→」に変換でき、さらに「＜－」から「←（左向き矢印）」にも変換できることを確認しました（※入力ソフトはMicrosoft IMEとATOK）。これまで「みぎ」や「やじるし」から打っていた人はやや慣れが必要ですが、「右」「左」の変換ミスもなくなって結果的に早くなりそうです。 Microsoft IME
こんにちは！株式会社Rabeeのデザイナーのakaneです🐏 今回は、ヘッダー（グローバルナビゲーション）のデザイン事例を調べてみました！パターンごとに分類しながら紹介していくので、どうぞ最後までお楽しみください✍ はじめに：グローバルナビゲーションとは？グローバルナビゲーションとは、Webサイトの全ページに共通して表示される「主要なコンテンツへの案内リンク」です。 一般的には画面上部のヘッダーに設置されることが多く、ユーザーが「今、どこにいるのか？」「目的のページはどこか？」と迷わないように誘導する大切な役割があります。 どんなサイトを作るときもほとんど必須のパーツですが、わたしは気付けばいつも似たようなレイアウトを使いがち…。そこで今回は、グローバルナビゲーションのデザインを100事例見比べて分類してみます🔍 ・ ・ ・ 1. スタンダード型まずは、一般的に「ヘッダー」の言葉で想像
最近のラインディングページで見かけるデザインやアイデア、コピーライティングがまとめられたSaaS Pagesを紹介します。 ヘッダやフッタのデザイン、ナビゲーションのアイデア、CTAや価格一覧やFAQのコンポーネントなど、インスピレーションが刺激されます。
ChatGPTを使用するとWeb制作で困ったときやプログラミングの勉強をしていて知らないことが出てきた時に素早く調べることができる…はずでした。 なぜ「できます」ではなく「できるはずでした」と記載しているのかと言うと、高品質な回答を得るためには質問文に毎回さまざまな定型文を記載しなければならない、回答が表示されるまでに時間がかかるなど、意外と面倒なことが多いからです。 ChatGPTで高品質な回答を得るために たとえばWeb制作全般に関して質問するときは「あなたは世界最高のWeb制作者です。」と質問文の先頭につけると良いです。 あるいは、質問する方がプログラミングを学びたての初心者の方であれば「プログラミング初心者でも理解できるようにわかりやすく解説してください」と質問文の最後につけると良いです。 さらに重要なのが「英語で調べて日本語で回答してください」と最後に付け加えることです。 これは
転職に行き詰まった。誰かアドバイス下さい。
発達障がい（アスペ）持ちの40代後半です。 法学部卒で就活をなめていて全滅し、小さな編プロに入ったものの、ボスもアスペで誰とも仕事が続かない方だったので、私もミッション途中で解雇。 業務委託契約で雇用保険も未加入だったので、日雇いで食いつなぎ、京都リサーチパークの小さなコンサルにアルバイトで入社。 Web制作が商売になり始めた頃でしたので、織物産業系の会社にホームページを売り歩いて実績を積んで正社員になったものの、社長が会社を解散。 その後ポリテクセンターを利用して雇用保険で食いつなぎながら、就活してリクルートの制作会社に入り上京。 でも遠距離恋愛でメンタル悪化して、早々に退職して数年実家で引きこもり。 このままではヤバいと思い、農業実習生に行ってみたけど、休憩時間に水も飲めず挫折。 その後はボランティア活動に参加するようになったら、ITスキルを買われて、研究員として再生可能エネルギーの実
3日間限定「Visual Studio Code完全入門」が全文無料公開されています！ Web制作とプログラミングに特化された解説書
当ブログでも好評だった「Visual Studio Code完全入門」が重版出来🎉を記念して、3日間限定（5/19-5/21）で全文無料公開されているので、紹介します。 「Visual Studio Code完全入門」は、Web制作とプログラミングに特化されたVSCodeの解説書です。実際のワークフローを元に、VSCodeの基本的な機能から効率をアップさせる使い方を学べます。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
エンジニアリングの必須図書 40冊 2023年版
ベイジのウェブ制作ワークフロー2021年版（約100のタスクと解説） | knowledge / baigie
レスポンシブの確認がこれで快適に！複数のスクリーンサイズで同時に確認できる無料ツール -Responsively App
【分野別】VSCodeのおすすめ拡張機能まとめ - Qiita
他のCSS本とはかなり異なる！現在、主流の実装・設計方法が徹底解説された良書 -CSS設計完全ガイド
なぜHTMLだけなのか。拙著「武器になるHTML」の執筆を通して伝えたかったこと - Shibajuku
【2024年最新】Web制作周りを無料で学べる学習サービス集 - Qiita
1ミリ秒でも早く届けたい! HTMLで画像読込を高速化するために取り組んでいること - ICS MEDIA
SEOの学び方 ～ SEO初心者から上級者への道 - SEMリサーチ
EC初心者が10分で理解するECサイト制作の手順と費用相場
わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ
Web制作の面倒な作業をラクにするCSS便利ツール87個まとめ
CSSでメディアクエリはもう必要ないかも -メディアクエリなしで実装するテクニックのまとめ
見積書の作り方・考え方（僕たちの場合）｜岡村 旭 Webディレクター＆エンジニア / foot llc.
まだ使ってる？今は非推奨となったJavaScriptの書き方
Webデザインの参考になるギャラリーサイト11選 | Pulp Note
タスク管理が苦手な人の共通点 - paiza times
【2024年最新版】オススメのプログラミング学習サービス集 - Qiita
Notionを使って自分だけの参考サイト集を作ってみる - paiza times
未経験フリーランスを席捲する「カジュアルな情報商材」｜久松剛／IT百物語の蒐集家
時短してますか？Web制作が変わる最新オンラインツール38個まとめ
完璧な要件定義など幻想である。個ではなく、チームで作る要件定義 - Qiita
営業の崩壊と再生～営業の問題を解決する14の処方箋 | knowledge / baigie
Amazonで2000円まであと200円のときに買うやつ
PCで「→」マークを簡単に入力できる方法がタメになると話題に 「知らなかった」「1発で変換された」
ヘッダー（グローバルナビゲーション）のデザイン事例100選｜akane
Web制作者は要チェック！最近のランディングページで見かけるデザインやアイデアのまとめ -SaaS Pages
ChatGPTを使用して「Web制作者の疑問に答えるWebアプリ」を作りました