javascriptの基本操作 皆さんこんにちは、今日はjavascriptの導入から、基礎までをざっとやっていきたいと思います。この記事は自分用のまとめになりますので、説明をざっくりした感じで進めると思いますのでご了承ください。 javascriptの基本操作 javascri…
jQueryの基本的な使い方【保存版】 皆さんこんにちは、迅犬です。今回はjQueryの基本的な使い方を見ていきましょう。 jQueryの導入方法をまず知りたい！という方は以下の記事をご参照いただければと思います。 webdesignzin.hateblo.jp jQueryの基本構文 jQu…
photoshopにおける整列 photoshopで整列機能を使用するには、基準となる選択範囲が必要です。まず選択範囲で基準を指定して、選択したレイヤーを整列させるというイメージで、一緒にフォトショップでの整列を行っていきましょう。 イラストレーターとフォト…
ある特定の色の部分だけを加工する方法 皆さんこんにちは、今回はフォトショップを使って、特定の色を持った一部分のみを加工したい場合に、非常に有効な選択範囲を作る方法と元画像をそのままにその選択範囲化した部分の加工をやっていきます。選択範囲は特…
jQueryとは 簡単に特徴をまとめておきます。 javascriptをより少ない記述でかけるようにしたjavascriptライブラリです。 javascriptのライブラリは他にもありますが、一番ポピュラーで浸透しているものと言っても過言では無いでしょう。 jQueryを入手する jQ…
デザインカンプ制作におけるphotoshop環境設定 イラストレーターでのワイヤーフレーム制作同様、1pxにこだわる作業をしたいためピクセルベースの環境設定をフォトショップにおいてもやっていきたいと思います。 環境設定の単位をピクセルベースにする ①編集→…
メデイアクエリによるレスポンシブ対応の前準備 レスポンシブ対応（マルチデバイス対応）させるには、必ずビューポート設定を行っておきましょう。 <meta name="viewport" content="width=device-width"> なんでビューポート設定が必要なのでしょうかという方はこちらを参考にしてみると納得していただけると思い</meta>…
.htaccessを使ったレスポンシブ対応 今回は.htaccessファイルというものを使って、アクセスされたデバイスによって、見せるindex.htmlを切り替える、.htaccess手法をやっていきましょう。 自己流の理解が入っているので、何か問題や間違いがあればご指摘お受…
リセットCSS そもそもリセットCSSとは、標準的に予め設定されているものをとっぱらって、制作する人が０からCSSを設定するために一旦まっさらな状態に戻すことです。これにより、制作者が、レイアウトを0から設定していくことが出来るため、自分の思い通りに…
ファビコンとタッチアイコン ファビコンとは？.icoとは？という方はこちらの記事にすごくわかりやすく載っています。 yachin29.hatenablog.com favicon.icoはジェネレーターにて生成すると楽。ジェネレーターは色々あるみたいですが、上記のブログと合わせて…
HTML5基本の型 <html lang="ja"><head><meta charset="utf-8"><title>各ページタイトル</title><meta name="description" content="ページ概要文"> </head> <body> <header></header> <nav></nav> <div id="container"></div> <footer></footer> </body> </html>
web制作向けillustratorの作業設定 web制作においてイラストレーターといえば、ロゴを作ったり、バナーを作ったり、webサイト用の部品素材を作ったりと何かと重宝するillustratorですが、イラストレーターでそれらの制作を行う際に、注意しなければならない…
クリッピングマスクと複合パス みなさんこんにちは、迅犬です：D 今回はクリッピングマスクと、クリッピングマスクとよくセットで使われる複合パスについてやっていきましょう。 クリッピングマスクとは？ クリッピングマスクとは、上のオブジェクトの形で下…
イラストレーターのパスファインダー 皆さんお元気ですか？迅犬です：D 今回はパスファインダーをやっていきましょう。複数の図形オブジェクトを組み合わせて新しいカタチを生み出す時にとても便利な機能になりますので、是非この機会に習得してしまいましょ…
イラストレーターの文字ツール 皆さんこんにちは、迅犬です：D。今回は、イラストレーターの文字ツールをやっていきましょう。 まずは、イラストレーターの文字ツールには主に3種類ありますので、そちらからみていきましょう。 イラストレーターの文字ツール…
ベジェ曲線の基礎知識 イラストレーターのベジェ曲線を通して、セグメント、アンカーポイント、パス、方向線といったものを学んでいきましょう。 パスとは？ ベジェ曲線を理解するためにまず理解しなければならないのがパスというものです。 パスとは、簡単…
オブジェクトのグループ化 皆さんこんにちは、迅犬です：D 今回もイラストレーターの基本を勉強していきましょう。 今回は、グループ化についてやっていきます。グループ化とは、複数のオブジェクトを１つのまとまった塊として扱えるようにすることです。操…
イラストレーターで整列をしてみよう こんにちは、迅犬です：D 今回は、覚えると非常に便利な機能、”整列”についてやっていきましょう。 イラストレーターでの整列とは、選択したオブジェクトを、基準となるもの（キーオブジェクトやアートボード）に対して…
イラストレーターで正方形や正円を作る 皆さんお元気ですか？迅犬です。 今回は、イラストレーターで正方形や正円を作る方法を学んでいきましょう。 イラストレーターで正方形を作成する ツールパネルから長方形ツールを選択した状態で、Shiftを押しながらド…
表示の切り替え 皆さんお元気ですか？迅犬です。 今回は、イラストレーターにおける表示の切り替えをショートカットキーを使ってやっていきましょう。 前準備として、横幅700px、高さ500pxの新規ドキュメントを作成しておきましょう。 ※ちなみにこの新規ドキ…
スマートガイドとポイントにスナップ 皆さんお元気ですか？迅犬です。最近涼しくて過ごしやすくなってきましたね。 今回はweb素材や、ワイヤーフレームを作成する際に、イラストレーターにおける作業が非常に効率的になる2つの機能を紹介したいと思います。 …
オブジェクトの移動と複製 皆さんお元気ですか？迅犬です。 さて前回の続きからになります。前回はオブジェクトの選択とその選択したものを解除するということをやりましたね。 今回は、選択したオブジェクトを移動させたり、複製したりといった基本操作を学…
webサイト制作で役立つ無料検証ツール4選 2016年度版 皆さんお元気ですか？最近禁煙し始めました迅犬です。 今回はwebサイト制作又は、ホームページ制作を０からコーディングする際に絶対に欠かせないと思うツールを厳選して４つ紹介させていただきます。 こ…
オブジェクトの選択と解除 皆さんお元気ですか？迅犬です。 さて前回の続きからになります。前回はオブジェクトの作成と削除を行いましたね。 今回は、作成したオブジェクトを選択してみましょう。 複数選択したり、ダイレクトツールでパスだけを選択したり…
オブジェクトの作成と削除 皆さんお元気ですか？迅犬です。 さて前回の続きからになります。前回は新規にドキュメントを作成しましたね。 今回は、そのドキュメント上に、オブジェクトを作ってみたいと思います。 ※オブジェクトとは？＝簡単にいえば、イラス…
illustratorによる新規ドキュメントの作成方法 皆さんお元気していますか？迅犬です。 今回は、イラストレーターのはじめの一歩として、新規ドキュメントの作成方法をご紹介していきます。 イラストレーターを使いこなせれば、web素材やワイヤーフレーム、デ…
このブログの紹介とご挨拶 皆さん初めまして、迅犬と申します。 このwebサイト制作の勉強＠迅では、これからwebサイト制作を始めたいという方や、htmlって何？という方まで幅広い方にとって勉強になるwebサイト制作の基本を紹介して行きたいと思っております…
