私が「Web制作にはMacが適している」と思う理由
先日 iMac 2019のレビュー記事 に「Web制作にMacが適していると思っている理由は別の記事に書きます」と書いたところ結構反応があったため、この記事にまとめることにしました。 先に、Web制作のためにWindows PCを買った方のために説明しておきますが、Windows PCでもWeb制作はできますのでご安心ください。 ただ、私はいくつかの理由でWeb制作にはMacの方がメリットが多いと感じています。 私がMacでWeb制作するようになったきっかけ 私はWindows 95の頃からWindows PCをずっと使用していました。 Windows 95や98の頃はMacでWeb制作するメリットを感じておらず、多くのWebサイトを問題なく閲覧できるWindows PCがベストだと思っていました。 その後Windows XPやWindows Vistaが搭載されたPCをメインで使用してい
「CS6以降のアプリがいつでもすべて使える」という売り文句のAdobe CCで過去のアプリが使えなくなった件
この記事は、2019年に突然Adobe CCの過去バージョンが利用できなくなった件についてまとめた記事です。 このスクリーンショットはAdobe Creative Stationより。現在 記事は削除されています が、インターネットアーカイブ で見ることができます。 何が起きたのか 箇条書きでかいつまんで書くと以下のような感じです。 Adobe Photoshopのようなアプリケーションは毎年メジャーアップデートされ、たとえば2012年はCS6、2013年はCC、2014年はCC 2014のようなバージョン番号が付けられています。 Adobe CCは月額制のデザイン系アプリケーションが使い放題になるサービス月額サービスのAdobe CCに加入すると「CS6以降（CS6を含む）のアプリがいつでも全て使える」という売り文句で有料会員を集めていたところが2019年5月9日頃、突然2017年やそれ
MacBook Pro Late 2016レビュー: おっとTouch BarとUSB-Cの悪口はそこまでだ
MacBook Pro 13インチ Touch Bar モデル（Late 2016）を11/17から使用し、3週間ほど経過したのでレビューを書きました。 MBPの購入を検討している方で、特に「Touch Barってどういうものだろう？不便はないのだろうか？」とか「USB端子が変わったことによるメリットとデメリットは？」という事が気になる方に参考になるように書いています。約15,000文字あります。 Touch BarとUSB-Cについて多くの人が誤解していること レビュー本文の前に、まず大手メディアが報じているMacBook Pro、Touch Bar、USB Type-C（以下USB-C）に関する記事を読んでいると、明らかにまともにMacBook Proを使用せず書かれているとしか思えない、間違いだらけの記事や質が低い記事が多すぎます。 例えば 以下のようなことが書いてある記事は完全に間
CSS3でGoogle検索やはてブを見やすくしたり、キュレーションサイトを目立たなくする方法
Web技術 CSS3でGoogle検索やはてブを見やすくしたり、キュレーションサイトを目立たなくする方法 Wednesday, October 26th, 2016 最近、調べ物をしようとGoogle検索した時にキュレーションサイトなどの役に立たない、あるいは他のサイトの情報をまとめただけのサイトばかり上位に表示されてしまい、ストレスがたまることが多くなってきました。 そこで、検索結果のCSSを上書きしてキュレーションサイトなどを半透明で表示し、ついでに記事が書かれた日付や「未指定」などを目立つようにカスタマイズしました。 ※ このスクリーンショットは、この記事でできるGoogle検索結果のカスタマイズ例です。1件目のNAVERまとめは半透明に、2件目の記事ははてなブックマーク数、サムネイル、記事が公開された日付を目立たせるなどして「役に立つページかどうか」を判断するヒントをわかりやすくし
「PCをWin7のままにしておきたいのに強制的にWin10にするMSが嫌だ！Macに行く！」という方へMacユーザーとして言っておきたいこと
Twitter などで「5年前に買ったPCを Win7 のままにしておきたいのに、強制的に Win10 にする MS が嫌だ！もう Mac に行く！」などというツイートを見かけることがありますが、Mac が大好きで、普段Macユーザー増えることに対して大歓迎のスタンスである私から1つだけ言っておきたいことがあります。 「こっち来んな。以上」 この記事はこれで終わりです…と言いたいところですが、さすがにこれだけでは普段 Mac を使っていない方には投げやり過ぎるかもしれないのでその理由を書いておきます。 5年前に買ったMacを使い続けられるのか 少なくとも メインマシンとして仕事でバリバリ使う のは厳しいです。 私の場合、5年前に買った Mac といえば MacBook Air 2011 ですが、4年前に知人に売却しています。 さすがに Mac を毎年買い換えている方は多くはないと思いますが
文字を使わない検索の世界と、ゆるやかなWebの衰退
TechCrunch Japan に以下のような記事が載っていました。 Googleは使わない、SEO対策しているから——Instagram有名人のGENKINGが語った10代の「リアル」 この記事には以下のように書いてあります。 「Googleで検索すると文字が出てくるし、（検索結果は）SEO対策されている。あとはスポンサー（広告）とかが上がってきて…ネットってリアルじゃない。Instagramは検索することで言葉より画像が表示される」 この中で「Googleで検索すると文字が出てくる」という部分、昔からネットに触れていた方であれば「検索結果をテキストで返すのは当たり前だろww」と言いたくなるかもしれませんが、私はこれからは文字を使わない検索や検索結果が増えそうだと考えています。 例えば iPhone の Siri は音声入力で「近くのラーメン屋は？」と尋ねると地図を返してきます。 In
Chromeが重くなった時にやるべきこと
Google Chrome は軽量で高速なWebブラウザーですが、長く使っていると「重い」と感じるようになってくることがあります。 この記事では「Chromeが重くなった時にやるべきこと」についてまとめています。 1. シークレットウィンドウによる問題の切り分け 最初に書いておきますが、どんなWebブラウザーでも、拡張機能（アドオン/エクステンション）をたくさん入れたり、履歴やキャッシュが溜まってくると重くなるのは必然です。 「最近新しくセットアップした PC なのに Chrome が重い」という方もいらっしゃるかもしれませんが、Chrome を使用して Google にログインした時点で、以前使用していた拡張機能などが再びインストールされるため注意が必要です。 Chrome が拡張や履歴などのせいで重いのか、PC や Chrome そのもののせいで重いのかを切り分ける簡単な方法があります
GoogleとAdobeのフォントNoto Sans（Source Han Sans）の画期的なところ
2014年7月16日に、Google と Adobe がリリースした Noto Sans（Adobe からは Source Han Sans という名称でリリース）というオープンソースのフォントファミリーは「日本のWebデザイン史上に残る画期的なフォント」だと思ったので記事にしました。 これまでの問題 ウエイトの不足 普段Webデザインなどの仕事をされている方でないとあまり気にすることはないかもしれませんが、たとえば Android は、アプリによっては下記のように日本語部分と英数字部分で大きくウエイト（フォントの太さ）が異なることがありました。 ※この画像は、Nexus 7（Android 4.4）で Twitter 公式アプリを表示した時のものです。 Nexus 7 では Chrome ブラウザーなどでは日本語・半角英数字ともに丸ゴシックで表示され、ウエイトもおかしくないのですが、アプ
2014年5月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 Google Google、Windows版 Chromeの拡張機能をウェブストア経由に限定。ストア外入手は導入済みでも無効化 – Engadget Japanese 拡張機能の開発者は、今後も開発のためにローカルでのインストール可能なほか、インラインインストール機能を利用して自分のサイトで配信もできます。 ということで、Chrome の拡張を一般に配布するためには Chrome ウェブストアに登録する必要があるようです。 自分のサイトで拡張を配布するためのインラインインストール方法は、以下のページに書いてあります。 参考: Using Inline Installation – Google Chr
Webデザイナーやコーダーの方でも知っておきたいPHPの便利な使い方
この記事は、普段サーバーサイドスクリプト言語（PHP、Perl、Ruby等）を書いていない方を対象に、PHP を使うとどのようなことができるのか、あるいはできないのかを解説した入門記事です。 キャンペーンページで、指定の時間に受付を終了する たとえばキャンペーンページで、指定の時間までは「お申込みはこちら！」というボタンを表示し、それ以降は「キャンペーンは終了しました」と表示させたいとします。 こういう時、PHP はわりと直感的に書けるので便利です。 "; // 現在時刻が、キャンペーン終了後であれば } else { echo "キャンペーンは終了しました "; } ?> ※コメントで、「日付はUNIXタイムスタンプに変換してから比較したほうがよい」とご指摘いただいたので、strtotime() を使用するよう変更しました。 3行目に “2013-09-01 00:00:00” という箇
Adobe Photoshop CCファーストインプレッション
Adobe Photoshop CC が公開されたので、早速レポートです。 Photoshop CCは、見た目はほぼ Photoshop CS6 と同じですが、パネルを使用したシェイプサイズの変更や角丸の再編集など、Webデザイナーにとっても地味に便利な機能が追加されています。 パネルを使用してシェイプサイズを変更・移動 これまで、長方形などのシェイプのサイズを数値指定で変更するには、Ctrl+Tキーなどを押して自由変形モードにし、「基準点」の「左上」をクリックしてからサイズを変更する必要があり、手間がかかりました。 私の場合は、自作の JSX（スクリプト）でシェイプサイズを変更していたのですが、Fireworks のプロパティインスペクタや、Illustrator の変形パネルのようなものを作ろうかと思っていた矢先に標準機能として搭載されました。 新しいパネルが増えたのではなく、長方形な
「PhotoshopによるWebデザインカンプ制作はFireworksに比べて効率が悪い」という都市伝説について
2013/5/7に、Adobe Fireworks の事実上の開発終了が発表されました。 ただし、「バグ修正やセキュリティ関連のアップデートは継続する」とのことですが、いつまでも使い続けられることを保証するものではないので、Fireworks ユーザーの方はそう遠くないうちに別のアプリケーションに乗り換える必要があると思います。 Adobe、Web画像ツール「Fireworks」終了へ – ITmedia ニュース 移行先アプリケーションの候補の1つである Photoshop について、Twitterを見ていると「Photoshop でのWebデザインは制作効率が悪い」という方が多いようですが、私はそんなことはないと思っています。 なぜそう言えるのかについて、簡単にまとめてみました。 目次 FireworksとPhotoshop、それぞれのメリットとデメリット なぜ「Photoshopは効
[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary
これはもう何年も前から気になってることなのですが。 何故、昔からずっと見出し画像などの文字組みや文字詰めの甘いWebサイトが多いのでしょうか。 私はデザインについて偉そうに言える立場でないのは分かっていますが、折角全体的なデザインや背景、写真、Flashなどの動きはとても美しく、文章構成のしっかりしたサイトなのに、ただ一点文字詰めだけが甘いというサイトがあまりにも多くて、そういうサイトが減る様子もないのがずっと気になっています。 私は以前、ファッション雑誌やビジネス誌の組版（MacのInDesignやQuarkXPressを使って印刷用のデータを作る仕事。DTPとも言う）の仕事をしていて、見出しは言うまでもなく、本文の文字詰めが少し甘いだけでもものすごく怒られたものですが、Webデザインの世界ではそういうのはあまり怒られることがないのでしょうか。 私は、見出しやタイトル画像における文字組み
![[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary](https://cdn-ak-scissors.b.st-hatena.com/image/square/e6e22153e1233d79c8da8733fc112f935fe5ee4a/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fstocker.jp%2Fdiary%2Fwp-content%2Fuploads%2Ftypographic-1-1.png%3Ffit%3D500%252C250%26ssl%3D1)
WordPressのトップページを雑誌や新聞のような段組にする方法
WordPressのブログは一般的に記事タイトルと記事の概要が単純に縦に並ぶだけですが、jQuery Masonry という jQuery プラグインを使用すると、このブログのトップページのように雑誌や新聞のような段組で記事一覧を並べることができます。 jQuery Masonry は WordPress 用に作られたわけではありませんが、WordPress テーマに組み込んでトップページ等で使用することができます。 ただ、公式のドキュメント通りに JavaScript を書いただけでは WordPress テーマではうまく動かないので、やり方をここにまとめておきます。 ここでは、WordPress 3.3 のデフォルトテーマ「TwentyEleven」をベースに解説します。 準備 まず jQuery Masonry 公式サイト のページ中央にある「Download the script
これからWebデザインの勉強を始めたい方のためのまとめ
これからWebデザインやコーディングの勉強を始めたい方、またはWebデザイナーになったばかりの方向けのまとめ記事です。 「無料で始められる…」とか「本を買わなくても…」などのテーマにしようか迷ったのですが、無料ではじめられる記事としては、既にネタ帳さんの以下のようなエントリ↓がありますので、ここでは純粋に私がおすすめしたい記事、本、サイト、ソフトなどを有料無料に関係なく紹介したいと思います。 Web制作の為の無料Webサービス・ツール40*ホームページを作る人のネタ帳 デザイナーからデザインの基礎や原則を学べるエントリーまとめ（webデザイナ向け）*ホームページを作る人のネタ帳 あと、渋谷でWebデザインスクールを開講しています。 詳しくはこちらの記事 をご覧下さい。 デザイン基礎 年末年始にWebデザインを学び直すための3つのステップ いきなり手前味噌で申し訳ないですが、これからWebデ
Twitter/Facebook/RSSリーダーにもなるFlipboardに感動した
昨日は、はじめて iPhone を使った日のような、新鮮で、とても心地よい感動を味わうことができました。 iPhone 版 Flipboard は、私が想像していたより遥かに便利で、快適で、心地よいアプリでした。 iPad 版 Flipboard が素晴らしいという噂は以前から聞いていて気になってはいたのですが、MacBook Air も持っているのに Flipboard だけのために iPad を買うのはちょっとな…と思って買わなかったため今まで Flipboard を使ったことはなかったのですが、ようやく iPhone 版がリリースされたため、昨日はじめて使ってみました。 Flipboard を起動すると、どんなジャンルのニュースを読みたいかを選択する画面になります。 News、Technology、Designなど… 好きなものを選択すると、Flipboard の画面にカテゴリ別に、
WordPressテーマ制作チュートリアル
この記事は、はじめてブログ用のオリジナル WordPress テーマを制作される方向けに書いたチュートリアル記事です。 なぜこの記事を書いたかというと、「WordPress でブログを作ってみたい、でも作り方がわからない」とおっしゃっている方が想像以上に多いことと、私が Webデザインスクールで WordPress ブログテーマの作り方を教えていると、想像以上にテーマ制作の基礎を理解していただくのが難しかったからです。 おそらく、HTML+CSS コーディングができる方であれば、この記事を読めばブログ用のWordPressテーマを制作できるようになるはずです。 このチュートリアルでできるテーマのサンプルファイルも以下からダウンロードできます。 実際のファイルを見ながら（あるいは作りこみながら）読むと理解が深まると思います。 WordPressのインストール まだレンタルサーバを借りていない
新MacBook AirはWeb制作のメインマシンになり得るのか
この記事は、2011年版の MacBook Air について書いています。2012年版の MacBook Air については以下の記事をご覧ください。 MacBook Air 2012のレビューとWeb制作者のための設定など 先日、新しい MacBook Air（13インチ・SSD 128GB）を購入しました。 私は Web制作 のメインマシンにするために購入したのですが、購入するまでは正直「こんな薄いマシンをメインにして大丈夫かな…」と不安でいっぱいでした。 結論から言うと、私の使い方（Web閲覧・Web制作・PhotoshopによるWebデザイン・動画閲覧等）であれば全く問題なく、今まで使っていた MacBook Pro 13インチ（2010年モデル・2.4GHz・メモリ8GBに増設）や、昨年使っていた DELL のデスクトップPC（Core 2 Duo・メモリ4GB）よりも明らかに動
[連載]WordPressでWebサービスを作る方法（1:PHPとは） | Stocker.jp / diary
このブログでは何度も触れていますが、3月に フリー写真素材 :: Free.Stocker という無料写真素材サイトをオープンしました。 このサイトは、WordPress というブログ向けの CMS（コンテンツ管理システム）を使って作りました。 このサービスを作った際の手順をケーススタディとして「PHPやWordPressを全く知らない方でも、WordPressでWebサービスを作り、それをたくさんの方に利用して頂ける方法を分かりやすく学べる記事を書こう」と思い書き始めたのがこの記事ですが、「PHPとは」から「WordPressサイトにおける内部SEO」「ソーシャルメディアマーケティング」まで網羅する特大記事になり、1記事として一度に掲載することが難しくなったので、全10回の連載としてお送りします。 WordPressやPHP初心者の方はぜひ1ページ目からソースコードを書き写しながら、既に
![[連載]WordPressでWebサービスを作る方法（1:PHPとは） | Stocker.jp / diary](https://cdn-ak-scissors.b.st-hatena.com/image/square/947985bcd7f71a4e7f7feaf02c144a8017885e3c/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fstocker.jp%2Fdiary%2Fwp-content%2Fuploads%2F83-1.png%3Ffit%3D500%252C300%26ssl%3D1)
ついに出た！Chrome版「Page Speed」の使い方
2011/3/22に、GoogleがようやくGoogle Chrome版「Page Speed」拡張機能を公開しました。 「Page Speed」は、項目をある程度理解できれば自分や自社のサイトの表示速度の改善にとても役立つツールです。 この記事では、「Page Speed」のインストール方法から各調査項目の見方や改善方法を中心に使い方を解説します。 ぜひ、ご自身のサイトの改善に役立てていただければと思います。 そもそも、なぜサイトの表示速度を速くする必要があるのか？ 例えば、Amazonの調査によると「表示速度が0.1秒遅くなると、売上が1％減少する」といい、Googleの調査によると「表示速度が0.5秒遅くなると、検索数が20％減少する」と言われます。 また、GoogleはWebページの読み込み速度をアルゴリズムに取り入れたことを発表しています。 大手サイトや大規模なECサイトに限らず
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
