読者です 読者をやめる 読者になる 読者になる

今の仕事ってね

こんばんは。 最近色んなキーボード使ってるから、なんか慣れない。 やっぱり自分の買ったやつが一番だなあ。 で、仕事について色々考えてみた。 このままじゃ、なんのスキルも身につかないなーみたいな。 雑用係というか、事務方というか。 単純作業が嫌い…

VBAをやってみた

おひさしぶりになってしまいましたー・・・ 現場も変わって、なんとVBAの必要が出てきた。 データ分析をお願いします。 ・・・ そもそもデータ分析ってえええ。 未知の領域だったんですよ。 そっから、頼る人もいないしググる。データ分析何よっていうよりか…

台風ですね。

こんにちは。 再来週には韓国旅行。3回目の韓国は行きたいこともやりたいこともたくさんあって相当前からウキウキ。 書きたいことはまとまっていないけど、文字にすることの重要さを 手紙屋?僕の就職活動を変えた十通の手紙? この本から学んだのでとりあえず…

ちょっとおもったから、書いてみる

自分の考えをまとめる時間ってのも必要だよね。何がやりたいのか、何をやらせたいのか。結局、家族じゃない限りWinWinじゃなきゃやってけないし文句も出てくる。そんなの当り前のことで、無理強いしたってそれはお互いにとって良くないんじゃないかと思う。 …

ファイルの圧縮にいみはあるのか?

ファイル圧縮する理由 ファイルサイズの軽量化難読化HTTPリクエストの回数を減らすスマホの場合は多少表示速度が変わるかもアクセス数が多いと、表示時間に差が出るため JavaScriptのファイル内容を圧縮する理由など | mtdew2 お世話になりました。

今更だけど、gulpを使ってwordpress公開してみる。

本当は、wordpressとりあえず公開できれば良いかなって思ってたんだけど、 せっかくだから、 gulp(今のお仕事でGrunt使ってるからその関係で)も使えるようになってみる designもロゴとか含めちゃんと恥ずかしくないようなもの作る ってしてみようかなと思っ…

jQuery の deferred ってちょっとわかりにくかった

結局、昨日の続きなんだけど。 まあ結論、非同期処理ってのをはじめて意識しました。 そもそも非同期処理のイメージも湧いていなかったみたいで、、、 今まで動きに関して考える事もなかったからしょうがないんだけど笑 そこで、非同期処理とは。。。 こちら…

jQueryでスクロールアニメーションを実装してみたよ

こんばんは。 結構利用できそうなかっこいいアニメーションを実装したよ。 これが採用されるかどうかはまだ分からないけど、 結構少ないコードでおしゃれな動きが作れたのでいいかなと。 全体はちょっと覚えてないから一部使った物とかを抜粋して。 メインで…

css のautoとか中央寄せとか

最近疑問に思ってた事を。。 何かさ、よく width: 500px; margin: 0 auto; これって、使ってると思ってて。 中央寄せにする時なんだけど。 でも、まあ、全体のコンテンツをこうしちゃうとレイアウトが、 ぐちゃーってなる時もあるから、まあ全体はこれでいい…

JSONに関して調べて、考えてみた。

今の業務で初めてJSON(JavaScript Object Notation)使用! 基本的に、 "test": "テスト例です" こんな感じで文字列として書く。 true,false,[1,true],1,の用に書く。 いわゆる文字列、真偽値、配列、数値が右っかわにかける。 左は絶対""でかこむ。 Sublime…

スマホの画面を作ってみて 可変対応とかハンバーガーメニューとか

こんばんは。 今関わってるサービスがスマホとPC両方なので必然的に両方の、 かつ、IE7,8対応まで迫られるという感じで。 Androidも確か結構変なのに対応が必要w 結構めちゃくちゃだと思いつつもなんとか6末にはリニューアルを。。 そんなこんなで、始めてス…

おまちかねの、ハンバーガーメニュー実装(スマホnotネイティブアプリ)

おなじみのハンバーガーメニュー(今もこの呼び方?w) 参考サイト このサイトの方は本当すごいと思うなあ。よく見つけたなあと。 参考はこれなんだけど、今回元々ある程度他のエンジニアさんがくんでくれてて。それに組み込むのがなかなかこのタイミングでで…

表示画像部分の、可変対応をしてみた。

こんにちは。 最初の仕様詰めが甘いと、色々やってくうちにあれ?あれあれ? みたいな事がたくさん出てきて。 最近は、その対応に追われてる。 まあ、最初から全部考えつくとか無理だし、学んだ。 で、そこでやってる対応。 今回記事投稿がメインだから、投…

cssだけで三点リーダーを実装 スマホ用だよん

今回関わっているサービスはスマホ対応があって。 最近技術的な事あんまりかけてなかったから。 参考サイト様 結局、有名なtext-overflow: ellipsis;を使えばよくて。 ただ、今回学んだのは幅を固定しないでいけるってこと。 width: 100%;で端末によって幅が…

フロントエンジニアの立ち位置とか、立ち振る舞いとか?

こんばんは。 だらだらとご飯つくって、アニメ見ていたらこんな時間。 今日は、仕事してて思ったフロントとしての他のポジションの人たちとの関わりとかとか。 仕事の流れとしては、 * 仕様書の確認(仕様が口頭のときはなし) * デザインがあればそれと照らし…

最近の勉強法 フロントエンジニアっぽいこととかね。

こんばんは。 こんな幼い文章でも、読んでくれている人がいるみたいで。 何か、お役に立てればとおもって、今日も書いてみる。 そんなエンジニア1年目さんのあれこれ。 最近の勉強法?としては。 まずはやっぱりRSSよんでるかなあ。 それよりも最近はざっく…

wordpressのサイト作成をしてみたよよ

こんばんは。ちょっと、ずっと1人でサイト構築をしたくて。この業界にいるとやっぱりWP触れないって致命傷な気がしてね。 やってみましたよ。思ったよりも時間はかかってしまったけど。 一旦ローカルに構築という事で、私はMacなので必要な物としては * MAM…

FBのLikeBoxを新しいのにしてみる。

書こうと思ってずいぶん、日がたってしまった。。。 既に5月笑 Facebook Like Boxdevelopers.facebook.com 他のサイトで、詳しい事はかなり書かれているので。特に再度書く事もないかとおもうのだけど。 ちょっと困った事とか、あれあれ、ってとこだけ。実…

viewsonicのディスプレイを購入してみた。

こんにちは。 最近HipHopの歌詞の深さに感動して、はまってます。 今使ってるのが、MBAの11インチという小さい画面の結構低スペックの子で。 そろそろ4年くらい使ってるので新しいのに、、、、 とおもったんですが、ちょっとまだ手が出ず。。 ディスプレイ…

scrollTopを使用するにあたってUXを考えてみたの

今日も相変わらずJS様と、戦う日々で。何が書きたいかというと、今日はUX(そんな大げさな事じゃないかも)を 考える事があって。 スマホサイトでね。ディレクターs「ここのページトップへのボタンタップしたら、ふんわりTOPまでもどってほしいんだけど、、、…

sanitize.css ってのがあるらしいよ

sanitize.css 最近使ってる、nomalize.cssの次みたいだね。 最初はriset.cssしか知らなくて、それで良いとおもってたけど、 nomalizeを知って、うわー便利ってなりました。 モダンブラウザとか、スマホに対応しているらしい。 リセットじゃあ、全部スタイル…

マークアップエンジニアとして、立ち振る舞いとか

久々になってしまいましたが。。。 最近は、マークアップエンジニアとして一サービスに関わってます。関わってまだ2ヶ月。 最初は右も左も分からず本当に自信もなかったけど、ある程度コード書いて、なやんでなやんで。下っ端からリーダー的なポジションを任…

WAI-ARIA コーディングの際にアクセシビリティーも気をつけたい、気をつけるべき

コーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション作者: ヘイドン・ピカリング,Heydon Pickering,伊原力也,太田良典,株式会社Bスプラウト出版社/メーカー: ボーンデジタル発売日: 2015/03/27メディア: 単行本(…

HTMLの備忘録てきな

本日3記事め。 書きたいことはいっぱいあるのに、どうも毎日書けないのはなぜだろう。 やっぱり、HTMLの構造ってすごく大事で。 正直、誰にでも書ける(私も数ヶ月前までは結構適当にかいちゃってたw)けど、 それだからこそ腕の見せ所といいますか。 綺麗に…

つかえる!WEBブラウザエディタ、LiveCodingツール Liveweave

こんばんは。 基本、仕事ではSublime3使ってるけどWindowsだからかたまにバグがあって。 くっそーってなるわけです。 Macやっぱいいなあみたいな。 最近Atomを導入して、ちょっと最初packageの入れ方がGUIで戸惑ったけど、慣ればやりやすい。 のりかえは検討…

ごぶさたです。

ご無沙汰になってしまった。。。 1ヶ月くらい間あいて、、、サボりぐせがw SESで出ている某会社についてでもかこうかな。 ここに来て、早1ヶ月くらいになるよ。 社会人になって、初めて稼働200時間越えというものを経験して。 案外すぐなんだなあとw まあ…

GithubPage を作ってみた

GithubPage を作ってみた まずはGithubのアカウントを作成 github これは簡単にできるとおもうー手順通りで問題なかった その次に、みたのがgithubpagesこの手順を踏めば簡単にできるのかなーと思ったんだけど。。。 404notfoundみたいなのが出続ける。。。 …

SESという働き方について

今週は新しい現場(SES)になって環境もガラッと変わって、ちょっと精神的に疲れが笑とはいえ、なんとか乗り切りましたとさ。 最近SESで外に出される事ばっかなんだけど、やっぱり色々思うことはある。客先の正社員でもなく、派遣でもなく、業務委託。まあ、が…

いまさらながらおさらい!SublimeText

SublimeText Downloadから便利ショートカット、Package導入まで。 Download packageControlのインストール ctrl+shift+pで開いて、installと打つ「Package Control: Install Package」を選択 コマンドラインを表示、下記をペースト import urllib.request,os…

セマンティックWEB

Remind セマンティック 要素を、視覚的な見え方ではなく、その意味に基づいて用いる。SEOのためにも重要。 きちんとした構造化を意識してマークアップ リッチスニペット 参考サイト:リッチスニペット googleリッチスニペット 場所としては、googleなどで検索…

議事録のまとめかた

議事録のまとめかた 基本情報を入力する 会議の名称 開始日時 終了日時 開催場所 参加者 5W1Hで要件まとめ。 箇条書きでも問題ない! 各自の宿題みたいなものも書いておくとあれ、これすすんでないの? ってならなくて済むからよい。 事実のみを書く 結局、…

UI designPettern

UI designPettern サーバー側に関わると、できれば良いなーっておもうけど、やりたい! ってあんまりおもえなくて笑 結局皆に触ってもらえる見た目側作る方が個人的にいいなと。 ただ、とはいえ何か秀でた知識もなく凡人レベル。 なんとかしないとーって日々…

git 鍵

git 鍵 Git Labとの接続方法 PuTTYをInstall PuTTYDownload(PuTTYgenを!) 鍵の作成(プログレスバーが動いている間マウス動かす) 鍵を保存(C直下とか ex. sshフォルダを作成し、公開鍵と秘密鍵を保存) Git LabのSSHキー保存のところに保存する SoursTreeをDo…

@keyframes cssアニメーション

@keyframes * IE10以上しか使えない アニメーション作成時に使用する animationの細かい設定(拡大のパーセント、回転の角度とか)が設定できるみたい。 アニメーション中のキーフレームと呼ばれる任意の点ごとにCSSのプロパティ値を指定することで、Transitio…

excel の ヘッダー一括せっていをやってみた

excelを使う機会が頻繁にあったので。 ヘッダーをね、一気に消したい!みたいなのがあって。 wordだと、一つ直せば全部が簡単に治るんだけど、エクセルはシートが違ったりで。 こちらのサイトが参考になりました 一気にシートを選択、そしてページレイアウト…

ロゴつくってみたり?

Logoを作ってみようとおもって。 こんばんは。 何か作ったり、表現したりってことを全然してなくて。 ロゴでも作ってみよっかなとおもいました。 あ、でも作り方がわからなくて笑 Photoshopとかillustratorが使えないとかじゃなくて、とっかかりが分からない…

tooltip button とかプラグインとか使い方の つかえるサイト

Tooltip とか button とかの参考によさそうなまとめサイト まとめサイトの紹介、というか一応bookmarkはしたけどもし誰かのためにもなればみたいな。 私のgoogleはmuzliってやつ使ってるんだけど、 毎日きれいなサイト見てたらなんか感性磨かれそうかなみた…

<button></button> を詳しく

Buttonを作ってみた buttonに利用できそうなプロパティ(使ってたやつ) transition 時間的変化をまとめて指定する transition-propertyの値 transition-durationの値 transition-timing-functionの値 transition-delayの値の順 .sample { background-color:bl…

photoshop とデザインのべんきょう

Photoshop こんなのもしらなかった 恥。 こんばんは。 こんな何気ない、たいした事(私にとっては重要な内容なんだけど)書いてない記事を ちらちらでも見てくれてる人がいるってうれしいモノだね笑 同じような境遇の人にさ、何か刺されば良いなーとかおもって…

background  新?機能

backgroundについて新しく知ったこと まず、基本的なところでいくとbackground1つで、 * background-color * background-image * background-repeat * background-attachment * background-position これがまとめてかけちゃう! たとえば、こんな感じに。`ba…

Sassの詳しい部分

&:hover でhover時のスタイルが充てられる。 .body { background-color: pink; .arm { color: red; &:hover{ color: red; } } } こんな感じに。 もちろん、afterとかvisitedとかも使える。いちいち書かなくてもいいし、何より見やすい。 そして、計算もでき…

Sass をさわってみた。

メタ言語「それのみでは意味をなさない。言語を定義するための言語」 例: cssのメタ言語はsass=Sassという言語で記述したファイルをコンパイルして、CSSファイルを生成する Sass(現在の主流はsassのなかでもscssのほう)に関してのサイトは結構あったよ。 (昔…

JavaScript 配列Array indexOf join

JavaScriptの配列利用 今回使った背景、、、があれば伝わりやすいのかなとおもい。 ツールチップを使って、一行にはまりきらなかった内容を全て出すようにした。 文字数オーバーの時は...を表示して、そこをマウスオーバーすると、ツールチップが出るイメー…

jQueryの引数利用とページネーション

jQueryの引数利用とページネーション 引数ってって話。 この方のが分かりやすかった。引数 $(function(){ $(body).on("moutover",function(){ $(this).css("color","red"); }); }); 簡単に今日やったコード書いてみよっと。 ページネーションを作成していま…

Chromeの便利機能発見!!

Chromeの便利機能発見!! ついつい間隔が空いてしまう。。。 よさそうな、いや、便利なchromeの拡張機能があったので紹介。 実際にこれらは使ってます! Anywhere Translation 翻訳してくれるやつ。google翻訳とかいろいろ飛ばなくてもいいって、手間が省け…

もう一度、positionについて 【css】

CODEPEN こまごました部分をこれ使いながら作ってます。 JsFiddleこっちもあるんだけど、個人的にはRunとか幼くていいから前者推奨w そして、いつになってもpositionプロパティが覚えられなくて。 最初はmarginとpaddingに苦戦 See the Pen gbXLLK by megum…

【css】擬似要素 擬似クラス つかってみたら

擬似要素(クラス) 結構避けてきてた部分ではあったけど、調べてみると 使わずにはいれないなーと。 まずは、デモ HTML <ul> <li>Home</li> <li>About</li> <li>Music</li> </ul> CSS li { list-style: none; display: inline; } li + li:before { content: " →"; } そうすると、 Home→About→Music…

css3の勉強によさげ サイトの紹介!

Codrops | Useful resources and inspiration for creative minds 英語のサイトですー!必要に応じてプロパティ覚えるのも良いんだけど、やっぱり自分の中でのストックは多い方が良い。どんなアニメーションができるとか、できないとか。1にデザイン、2にマ…

opacity css3の透過って?

透過(opacity)を知ったよ 透過ってなんだろうという部分から。 全然難しくなかった。ただ、要素を透明にしていくために使うみたい。 border、padding、background、img、テキスト、他のプロパティ この辺りに利用できるよ。 設定の方法 いくつかあるらしい。…

メディアクエリ とは

メディアクエリ 今更ながらメディアクエリとは何?っておもって。 単に業務系の管理画面しか作ってないと、使わないもん。 (言い訳w) という事で、なんか良さげなサイトから拝借使用とおもったのだけど。 まあ、そもそもメディアクエリを知るきっかけになっ…