タグ

Web制作に関するsoma1080のブックマーク (456)

  • WordPressのテーマ開発を初めて行う人に向けての制作フロー |https://wp.yat-net.com/name

    WordPressでオリジナルのテーマを作成する際のフローをまとめました。サンプルも配布してるので、是非使ってみてください、 テーマ開発をやったことがない、それほどやってないという人でもなるべく分かるように書いていますので、手順通りにやっていただければ、テーマ開発をどうすれば良いのか?をわかってもらえると思います。 尚、執筆時点でのWordPressのバージョンは 4.8.2 です。 この記事を書くに当たり WordPress Codex日語版と、WebDesign Recipes はじめてWordPressのオリジナルテーマを作るときの参考になればと思って書きました を参考にさせていただきました。 目次 テーマのデザインをパーツに パーツの種類 コーディング WordPressの環境構築 必要なファイル テンプレートの種類 トップページのテンプレート化 header.php の編集 i

    WordPressのテーマ開発を初めて行う人に向けての制作フロー |https://wp.yat-net.com/name
  • Color Picker — A handy design tool from Color Supply

    Free Design Tips Get simple actionable web design tips in your inbox every Tuesday. GO

    Color Picker — A handy design tool from Color Supply
  • もう、レスポンシブでいいんじゃない?

    先月末、藤井さん の働く株式会社ザッパラスさん にお邪魔して、レスポンシブWebデザインの基のキ的なお話しをさせていただきました。 題して「もう、レスポンシブでいいんじゃない?」 いま、改めてレスポンシブWebデザインについて考えるきっかけになれば、という視点で内容をまとめてみました。 4年前に「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック 」というを執筆したんですけど、そのころからウェブ制作のデフォルトはとりあえずレスポンシブでいいんじゃない?と思っていたのですが、最近、その思いがより強くなっています。職場のウェブサイトをレスポンシブでリニューアルしてから約5年が経ちますが、やっぱり、あの時レスポンシブを選択しておいてよかったとつくづく感じています。おかげで、Googleさんがモバイルインデックスを優先するという昨今のニュース にもあまり翻弄されなくてすんでいます

    もう、レスポンシブでいいんじゃない?
  • UIデザイナーに必要なのは、決定力のあるデザインを作る能力 | tsublog

    最近、デザイナーに求められるスキルが多くて何を学べば良いかわからなくなってきた。と言う声を聞くようになってきた。 流行りの記事にいくつか目を通すと、デザイナーは「 経営者と対等に話せるコミュニケーション能力、ビジネスセンスを保有していて、イケてるグラフィックを作り、コードまでかけないといけない 」らしい。 スキルを多く保有している方が望ましいのは間違いない。 ただ、 現場デザイナー に最も大事なのは実装面での考慮事項が網羅されて考え込まれた「 決定力のあるデザイン 」を作る力だと思う。 サッカーで言うと、決定力は「 得点を決める能力 」として使われているけど、UIデザインにおいては「 実装面まで考慮された実装可能なデザインであるか 」という言葉として使っている。 魅せるデザインとフィージビリティが考慮されているデザインでは、かなり内容が異なってくるので、現場デザイナーとしては特にこのあたり

    UIデザイナーに必要なのは、決定力のあるデザインを作る能力 | tsublog
  • 動作推奨環境 例文・テンプレート / Maka-Veli .com

    もっとあると思うけど、とりあえずよく使いそうなヤツまとめました。 必要に応じてご自由に加筆・コピペしてご使用ください。 当方、責任は一切負いません。 コピペの場合、URLとOS/ブラウザ等のバージョンに気をつけてください。 推奨環境 OS Windows Vista、Windows 7、Windows 8、Mac OS X 10.4以降 ブラウザ Internet Explorer 9 以上 Google Chrome 最新版 Firefox 最新版 Safari 最新版 ※使用しているバージョンを確認する方法についてはこちらからご確認ください。 Windows Mac PDF PDFファイルを閲覧する場合にはAdobe® Reader® (Acrobat Reader 7.0以上)が必要となります。 Adobe® Reader® のダウンロードはこちら 動画 動画を視聴す

  • Webサイトに必要なfaviconが21個になっていた - IT探検の追憶

    久しぶりにWebサイトのfaviconを変えようと思い、調べてみると、必要なfaviconが大幅に増えていることがわかりました。 その数、何と21個! そんなに増えていたとは。 一応、以下にリストアップしてみます。 faviconのリスト favicon.ico: IE用 favicon-16x16.png: タブ表示用 favicon-32x32.png: Mac版Safari用 favicon-96x96.png: Google TV用 favicon-160x160.png: Opera 12 までのスピード・ダイアル用 favicon-196x196.png: AndroidChrome用 mstile-70x70.png: Windows 8 用 mstile-144x144.png mstile-150x150.png mstile-310x310.png mstile-31

    Webサイトに必要なfaviconが21個になっていた - IT探検の追憶
  • とあるサイトの高速化についてフロントエンドでやったことまとめ。 - Toro_Unit

    業務で携わっている案件なのですが、アクセス数の急増が見込まれるイベントがありまして。準備期間も少なく、バックエンド側でできることがほぼないという状況でサイトを落とさないようにがんばる!というお仕事でした。レガシーソースてんこ盛り。CSSプリプロセッサとか何それ状態。 そこで実施した対策のまとめです。サーバー・アプリケーション・サイトの構成によって、効果の大小はありますが、比較的効果があったと思われるものをつらつらと。 リクエストの削減とファイルサイズの最適化 まず一番最初に考えなければいけないのがリクエスト数です。すごいおおざっぱに言うと、WEBサーバー(ApacheとかNginxとか)への負荷は、PV数×リクエスト数です。PVがそんなに無くてもそのページのリクエストがめちゃくちゃ多いとそれだけでかなりの負荷になります。リクエストを半分にできれば2倍の人数がさばけるってことに、すげーおおざ

    とあるサイトの高速化についてフロントエンドでやったことまとめ。 - Toro_Unit
  • High Performance Web Frontend

    ★追記: https://speakerdeck.com/ahomu/high-performance-web-frontend-2013-qiu のほうがブラッシュアップ版です WCAN 2013 Summer (7/6) で行われた、"High Performance Web Frontend…

    High Performance Web Frontend
  • Pure.css

    CSS with a minimal footprint.Pure is ridiculously tiny. The entire set of modules clocks in at 3.5KB* minified and gzipped. Crafted with mobile devices in mind, it was important to us to keep our file sizes small, and every line of CSS was carefully considered. If you decide to only use a subset of these modules, you'll save even more bytes. * We can add correctly :) the numbers above are individu

  • Web Design Process for The Future

    19. “The primary design principle underlying the Web’s usefulness and growth is universality. ••• And it should be accessible from any kind of hardware that can connect to the Internet: stationary or mobile, small screen or large. Long Live the Web: A Call for Continued Open Standards and Neutrality: Scientific American http://www.scientificamerican.com/article.cfm?id=long-live-the-web by Tim Bern

    Web Design Process for The Future
  • Web制作でクライアントに喜んでいただける成果物や費用以外でのポイント

    Web制作やっているとWebそのものに興味がある方もいらっしゃれば、まったくわからないからプロにお願いしたい、という方もいらっしゃり、千差万別です。 制作側にいるとクライアントには、とにかく企画提案することが大事!というような考えもありますが、対応やアドバイスなどのちょっとした親切さのほうが喜ばれるな、と感じることが多々あります。 コンペなどの新規提案のときはもちとん企画や提案力によるものが非常に大きいと思いますが、制作においては単純に成果物ではなく、その過程における満足度もすごく重要なポイントではないかと思います。 クライアントにとってみれば制作費は安ければ安い方が良いし、デザインも思った通りのものを提示してもらえるのにこしたことはありません。 ただ、予算には限りがありますし、費用以上の制作や提案をしていたら、制作会社の案件としては失敗になる場合もあります。 クライアントへのサービス(付

    Web制作でクライアントに喜んでいただける成果物や費用以外でのポイント
  • WEB制作時に役立つ!ダミーテキストに使える定型文まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    先日、弊社プログラマーの段田さんのブログで、ボーナスアップの道具として利用された野田です。 あれは、久しぶりに傷ついた。 そして、プライベートでもいろんな人にいじられた。 ネットって怖いですね。 さて、今回は、WEB制作に役立つ定型文のご紹介を致します。 僕自身、デザインする際に構成からガッツリ考えるのが大好きっていうか仕事なので、 それにあわせてダミーテキストを考えることが多いです。 デザインを提出する際には、「テキストテキストテキスト」や「ダミーダミーダミー」で提出することは絶対にしません。 お客様の意図を読み取ってこちらからご提案させていただくということも、Webデザイナーには必要なスキルの一つだと思うからです。 あたりまえなことですが、こういう部分に気づかない方も案外いらっしゃいます。 正直、僕もデザインを始めてすぐの頃にはそんな感じでした。 「仮」という言葉に甘えてしまう事は良く

    WEB制作時に役立つ!ダミーテキストに使える定型文まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • dresscording.com

    dresscording.com 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy

  • 「第一回 プログラマ向けデザイン勉強会」の内容を参考にして妻のパン屋のWebサイトをリニューアルしてみた - give IT a try

    はじめに みなさん、明けましておめでとうございます!・・・と言うにはあまりにも遅すぎる時期になって2013年最初のブログ更新となりました。 「そろそろブログ書かなきゃ書かなきゃ〜!」と思っていたのですが、年末からのパン屋のWebサイトのリニューアルに没頭してしまい、間が空いてしまいました。 せっかくなので、2013年最初のエントリではそのお話をしたいと思います。 「第一回 プログラマ向けデザイン勉強会」の発表資料が素晴らしい! 前々からからは「Webサイトのデザインをリニューアルしてほしい」と言われていたのですが、僕自身はあまりデザイン方面には強くないプログラマなので、どうしようかと困っていました。 そんなとき、ネットで見つけたのが「第一回 プログラマ向けデザイン勉強会」でした。 東京の勉強会なので、僕は参加できませんでしたが、発表者の方々のわかりやすいスライドが公開されていたので、だ

    「第一回 プログラマ向けデザイン勉強会」の内容を参考にして妻のパン屋のWebサイトをリニューアルしてみた - give IT a try
  • インストールするだけ! お手軽サイト高速化ツールGoogle mod_pagespeedはスゴかった | 初代編集長ブログ―安田英久

    どれぐらいスゴいかというと、「サーバーにインストールするだけで、あとは設定ファイルをちょちょっといじれば、かなり高速化できちゃう」というぐらいスゴいのです。しかも、どんなサイトでも、どんなCMSを使っていても「インストールするだけ」。 Webサイトを高速化すると、ユーザーに優しいし、場合によっては検索結果での順位にも良い影響が出るかもしれない……それはわかっていても、なかなか格的にサイトを高速化するのは難しいものです。 サーバー側の高速化に加えて、HTMLのつくりや画像のファイルサイズ最適化、さらにはCSSを調整しての画像スプライト化やCSS/JSファイルの結合・最適化によるブラウザとサーバーの通信数削減などなど、実はやらなきゃいけないことがたくさん。 グーグルの提供するmod_pagespeedは、そうしたことの、かなりの部分を自動的に行うものです。 mod_pagespeedはこん

    インストールするだけ! お手軽サイト高速化ツールGoogle mod_pagespeedはスゴかった | 初代編集長ブログ―安田英久
  • 10個あった、バカWebディレクターとWebディレクターバカの違い : あべろぐ

    ※ココで言うディレクターとは、Webディレクターを指します。 (1)バカディレクターはプロジェクトのマネジメントしかやらない。ディレクターバカはプロジェクトのマネジメント以外もやりたがる。バカディレクターは、担当している案件の受注金額がどれくらいなのか、お客さんの熱度はどんなものなのか、営業がどう努力して取ってきた案件なのかを気にしない。やり直しになったデザインの何がダメだったのか気に留めない。ブラウザのバージョンや、クロスブラウザでテストする意識がない。プログラマは異なる言語を話す人たちだと、はなっから理解しようともしない。自分の手が届く範囲でしか仕事をしない。 (2)バカディレクターは約束を守らない。ディレクターバカは約束を設定する。バカディレクターは、約束を守らない。期日までに資料を用意しておくことを忘れてしまう。資料に記載すべき内容に漏れがある。 ディレクターバカは約束を取り付ける

    10個あった、バカWebディレクターとWebディレクターバカの違い : あべろぐ
  • Webパフォーマンス ベストプラクティス - Make the Web Faster

    Webパフォーマンス ベストプラクティス Last updated: 02 October 2012 翻訳:@t32k WebページをPage Speedで調べるとルールに準拠していないものが提示される。このルールというのは、一般的にあなたが開発段階において取り入れるべきフロントエンドのベストプラクティスだ。あなたがPage Speedを使用しようとしまいと、私たちはこの各ルールについてのドキュメントを提供する(たぶんちょうど新しいサイトを開発中でテストする準備が整ってないだろう)。もちろん、これらのページはいつでも参照することができる。私たちはあなたの開発プロセスに取り入れてもらうために、このベストプラクティスを実装するための明確なティップスと提案を提供する。 パフォーマンス ベストプラクティスについて Page Speedはクライアント側からの観点でパフォーマンスを評価し、一般的にペー

  • 「保守・運営」について考える

    こんにちは。WPD-Oliveです!今日も元気です! 制作だけじゃなく「保守・運用」もやってみようぜ! ひとつのウェブサイトを構築して、それで終わりにすることなく、その後もクライアントとお付き合いしていく「保守・運用」。 僕はこれまで制作をメインにしてやってきましたが、今後のことを考えると「保守・運用」についても自分のドメインとしてやっていきたいと考えるようになって来ました。 そこで、今回は、僕の考える「保守・運用」について書きたいと思います。 保守・運用をしていくことの制作者にとってのメリット スキル向上のメリット 制作を続けていると、決められたものを作る能力はしだいしだいに上がっていきます。やったことがないことでも、調べたり新たに開発したりしていくうちに、制作分野の守備範囲が広くなっていくイメージですね。 さて、制作をするときには、(=企画やワイヤーフレームの作成、デザイン、html

    「保守・運営」について考える
  • コーディングが上達するコツ

    2. プロフィール • Webエンジニア兼ディレクター • PHPでの開発が得意です(CakePHP2.1が素晴らしく楽し い!) • 最近は、テスト駆動開発(TDD)に興味があります! • システム寄りのディレクターですが、HTMLのコーディン グは社内で一番早いはず! • Galaxy Nexusを使っています!でもiPhoneが欲しいです! 誰かください!

    コーディングが上達するコツ
  • Webデザイナー(私)によるWeb制作のときに気をつけてることや制作フローとかいろいろ

    私はフリーランスの Web デザイナーとして、クライアントさんの Web サイトを作成するお手伝いをさせていただいています。今回は、私が仕事でデザインするときに気をつけている事や、Web 制作のフローをまとめてみました ...。 Webサイトを作るとき、みなさんはどんな制作フローをたどって作ってますか?私はフリーランス仕事をしていて、最初から最後までひとりで作ることが多いです。今回はふだんデザインする時に気をつけてる事や、いつもしている Webサイトの作成フローをまとめてみました。もっと効率化できることがあるはずだなーと思いつつ、最初から最後までを書いてみました。 また、Webデザイナーってどんな仕事なのっていう質問をときどきいただくので … こんなことしてます … みたいな紹介です。これはあくまで私が Webサイトを作る時にしているフローで、他の Webデザイナーさんや制作会社さんと違