タグ

ブックマーク / maboroshi.biz (12)

  • 最近のサイト実装開始時に確認していること

    このエントリーは、「Webディレクション Advent Calendar 2015」9日目の記事です。 最近のサイト実装開始時に確認するよう注意していることです。 とりあえずこれだけは、っていうライトな感じで。 ひとまず Gitを使ってファイルのやりとりが可能かどうか ここでプロジェクトに対する情熱の半分が決定されると言っても過言ではない プロジェクト管理ツールは導入できるのか リアルコミュニケーション以外のコミュニケーション手段がメールのみというのはホントに厳しい ガイドラインの有無 ガイドラインがある場合、ほとんどが既存サイトで守られていないので、守る必要がないということを共有する SPA的なののとき API仕様があるかどうかの確認 ほどんどの場合、API仕様はこれから作るという状態 実装はAPI仕様が出来てから、話しはそれからだ、という状態なので、API仕様をなるはやで作ってもらうよ

    最近のサイト実装開始時に確認していること
  • 1つのチケットになんでも放り込んでくるのはやめましょう

    このエントリーは、「Webディレクション Advent Calendar 2015」6日目の記事です。 エントリータイトルでほとんど言いたいことが完結していますね。 昨今のWebサイト制作なんかのプロジェクトでは、なにかしらプロジェクト管理ツールを利用するのが一般的です。 RedmineやJIRA、Backlogあたりが一般的でしょう。 これらのツールでは、まずはじめにチケット(課題)を立てるところからそれぞれのタスクがはじまります。 Redmineの日語サイトでは、チケットについて以下のような記載があります。 チケットはRedmine上でタスクを管理するのに使われます。実施すべき作業、修正すべきバグなどの一つ一つのタスクをRedmineプロジェクトにチケットとして登録します。1件のタスクにつき1件のRedmineのチケットを作成し、タスクの内容・優先度・担当者・期日・進捗状況などを記

    1つのチケットになんでも放り込んでくるのはやめましょう
  • http://maboroshi.biz/works/musabi_update_2014.html

  • スマートフォン制作実践講座 2012年11月23日開催のお知らせ | 株式会社まぼろし

    弊社で作成したサンプルページをもとに、スマートフォンサイトをデザインする上での前提知識からHTML5/CSS3による実装方法、JavaScriptライブラリを利用したUIの実装まで、スマートフォンサイト制作に求められる一通りの知識を学んでいただける講座です。 概要対象となる方

    スマートフォン制作実践講座 2012年11月23日開催のお知らせ | 株式会社まぼろし
  • 「background」と「background-size」を利用する時は注意しましょー

    背景画像のサイズは複数の要素で共通なのでまとめて指定し、その後に個別の要素に背景画像を指定するという場合があります。 例えば以下のような見た目を作りたい場合なんかがそうでしょう。 HTMLはインスペクターか何かで見ていただくとして、関係あるCSSは以下のようになっています。 .test li { background-position: center top; background-repeat: no-repeat; -webkit-background-size: 50px 50px; background-size: 50px 50px; } .test .red { background-image: url(http://maboroshi.biz/clearskysource/wp-content/uploads/2012/09/nya01.png); } .test .blu

    「background」と「background-size」を利用する時は注意しましょー
  • CompassでCSSスプライト(Retina対応)

    今はコレです。 $sprite2x: sprite-map("sprite2x/*.png"); $sprite-img:sprite-url($sprite2x); @mixin sprite-background2x($name) { background-image: sprite-url($sprite2x); background-repeat: no-repeat; overflow: hidden; width: image-width(sprite-file($sprite2x, $name)) / 2; height: image-height(sprite-file($sprite2x, $name)) / 2; $ypos: round(nth(sprite-position($sprite2x, $name), 2) / 2); background-positio

    CompassでCSSスプライト(Retina対応)
  • PSDからテキストをコピーする

    Windowsだと出来るか不明です。 こんな感じでFinderでPSDファイルを選択しまして、「Cmd + I」もしくは右クリックから情報をみるとクリックしますと こんなふうになりますので、「レイヤー」部分のテキスト情報をコピーすればOKです。 PSD内のフォルダ分けがキレイすぎてテキストだけを抽出しにくいんですけど、と言ったら牧下さんが教えてくれました。 ありがとうございます!

    PSDからテキストをコピーする
  • Androidのタップハイライトカラーをどうにかしてみる

    どうにもなりませんので、当にどうにかしたい時には最後のJSでどうにかする方法が良いと思います。 思い切ってガラケーユーザーからAndoridユーザーになってはや2ヶ月くらい。 Andoridは一刻も早く爆発したら良いと思います。 スマホサイトのナビゲーションって概ね行全体がタップ出来るっぽくなってますよね。 概ねっていうとアレですが、概ねサイト内にはありますよね、こういう雰囲気の。 この場合、「New」とか「Sold Out」とかのアイコンもリンクテキストと一緒にa要素で包むような感じになると思いますが、そうするとAndroidではタップハイライトカラーがおかしなことになります。 当は行全体に付いてほしい所ですが、リンクテキストにしか付かなくなってしまうような感じです。 サンプル1 ちなみにアイコンに指定している背景を取ると期待通りの結果になります。 アイコンをデバイステキストとCSS

    Androidのタップハイライトカラーをどうにかしてみる
  • IE6, 7対応費用に関しまして | 株式会社まぼろし

    マイクロソフトによってIEの自動アップグレードを3月中旬から国内で開始することが発表されました。これにともない、今後弊社でコーディングを行うサイトに関しましてもIE6, 7を対応ブラウザから除外させていただきます。 これまでもIE6対応をご希望の場合にはコーディング費用の10%を別途お見積もりに記載させていただいておりましたが、今後IE6, 7への対応をご希望の場合には実装技術を精査し、IE6, 7対応費用としてそれぞれ10%〜の追加コストをお見積りさせていただきます。 参考リンク「Internet Explorer の自動アップグレードについてのご案内 - The Official Microsoft Japan Blog - Site Home - TechNet Blogs」

    IE6, 7対応費用に関しまして | 株式会社まぼろし
    popup-desktop
    popup-desktop 2012/03/06
    「今後IE6, 7への対応をご希望の場合には実装技術を精査し、IE6, 7対応費用としてそれぞれ10%〜の追加コストをお見積りさせていただきます。」
  • HTMLだけで実現する何かはプログレッシブ・エンハンスメントではないのかな?

    スミマセン。このエントリーでroll属性とありますが、正確にはrole属性です。 ブログなどでプログレッシブ・エンハンスメントに関するエントリーを読みますと、そのほとんどがCSS3に関するテーマのお話ですよね。なんでHTMLだけのお話でプログレッシブ・エンハンスメントが語られることがほとんどない(まだ僕は聞いたことがない)のかなーと不思議に思ってたりします。 そもそもプログレッシブ・エンハンスメントってなんですか? 僕の中では、「互換性などもふまえてHTMLをしっかりと作りながら、より進んだ技術をサポートしているユーザーエージェント(以下、UA)にはよりよいユーザー体験を提供しましょうね」というのがプログレッシブ・エンハンスメントだと理解していますので、この前提にたってこのエントリーを書いています。 ですのでそもそもその前提が違ってますけど、という場合はご指摘ください。よろしくお願いいたし

    HTMLだけで実現する何かはプログレッシブ・エンハンスメントではないのかな?
  • Zen-Codingを入れてみて、もうちょい自分好みにしたい

    こもりまさあきさんのエントリー「TextMate+Zen-Codingで超速コーディング?」を発端にして、ブログやTwitterでZen-Codingに関する話題が熱くなっています。 こもりさんのエントリーではTextMateにZen-Codingを追加していますが、僕は持っていないのでDreamweaverに入れて使ってみました。 Dreamweaverへのインストール方法 zen codingは超便利!Dreamweaverで使ってみました。 | VIVID COLORS + BLOGを参考にインストールしましたので、ご参照ください。 これできないのかー、ということでちょっとカスタマイズ こもりさんのエントリーを参考にいろいろと書いてみました。Dreamweaverのコードビューを良く使う自分にはたしかにめっちゃ便利ですね。ただインストールした段階ですとちょっと足りないなと思うこともあ

    Zen-Codingを入れてみて、もうちょい自分好みにしたい
  • どたばた会議で公開しましょうか?と言ってしまったモジュール一覧的なもの

    先日「まめことネコゼのどたばた会議」の収録模様がUSTREAMで配信されていました。収録も終わってまめこさんとネコゼさんがまったりとお話している中で、ネコゼさんが作っているモジュール一覧(とかコンポーネントコレクションとか言われているやつ)のお話になったときに、それっぽいのを公開しましょうか?とつぶやいてしまったのでこのエントリーを書いてます。 で、結論から書きますと、とても申し訳ないのですが、実際にクライアントさんに納品したものしかないため、なかなか公開は厳しい感じです。ただ、それではあまりにも申しわけなさ過ぎるので、弊社内でざーーーっくりと決めているコーディングのルールと、今まで他社さんが作ったものなんかも見てきた経験で、モジュール一覧ってこんな感じのことが書かれていますよねということを公開しますね。 株式会社まぼろしのちょっとした決まり 弊社ファイルサーバ内に入っている、コーディング

    どたばた会議で公開しましょうか?と言ってしまったモジュール一覧的なもの
    popup-desktop
    popup-desktop 2010/02/22
    おぉぉぉぉぉぉ!ありがとうございます…!ブログでフォローさせてもらいます!
  • 1