40代目前の男がフリーランスを目指すブログ

40代目前の男がフリーランスを目指す為の日記です。

html・css

初仕事 -俳優のホームページ制作-

全く日記を更新していなかったのですが、実は11月から知り合いの紹介で初のWebサイト制作の案件を頂き、ついに本格的にお仕事が出来る様になりました。 そして、正式にオファーが来たので日記にてお伝え致します。 内容としては、とある俳優さんのオフィシャ…

自己紹介サイトの制作

しばらく更新していなかったと思いきや、それでも1週間振りだったんですね。もっと月日が経っているのかと感じちゃいました。 何にせよ、結構な無気力状態であった事は事実ですが...。 完璧ではないですが、ようやく自己紹介サイトが形になりました。 https:…

ポートフォリオ作成1日目

10月1日(火)の日記です。 2ヶ月に渡って、 Progate HTML5 CSS3 Bootstrap ランディングページ WordPress これらを学んできました。あっという間に2ヶ月経ってしまった気がします。 そして、それらに関わる書籍も色々と読み、過去に遡ってみたらおおよそ20…

WordPressの勉強12日目

9月30日(月)の日記です。 約1ヶ月に渡ってWordPressを学んできましたが、9月最後という事で、下記書籍の勉強を最後に10月からは本格的にオリジナルテーマ(ポートフォリオ)の作成を実施していきたいと思います。 バージョンとしては5ではなく4となります…

WordPressの勉強11日目

9月25日(水)の日記です。 本日は『グーテンベルグ時代のWordPressノート テーマの作り方(入門編)』のKindle本の3回目の復習を行いました。 ...何で3回もやろうと決めたのかについての理由は、今まで理解出来ていなかったCSS3のGrid Layoutの復習、及びWo…

WordPressの勉強10日目

9月24日(火)の日記です。 『WordPressユーザーのためのPHP入門』を一通り読み終わったので、今度はこの書籍を参考に、9月9日に一度拝見しました「たにぐち まこと氏のプログラミング学習チャンネル」をもう一度復習する事にしました。 たにぐち まことのプ…

WordPressの勉強9日目

9月23日(月)の日記です。 WordPress関連の書籍を2冊勉強しましたが、まだまだオリジナルテーマを独自に制作する為の作り方の理解は出来ておりません。HTML5・CSS3と比較すると覚える内容は沢山あると感じますし、やはり独自のテンプレートに慣れていないの…

『HTML5 & CSS3 ステップアップブック』によるCSS3 Grid Layout の勉強

9月20日(金)の日記です。 前回から『グーテンベルグ時代のWordPressノート テーマの作り方2(ランディングページ&ワンカラムサイト編)』のKindle本を読んだ結果、やはりCSS3におけるGrid Layoutは学んでおく必要があると感じましたので、急遽そのレイアウ…

WordPressの勉強8日目

9月19日(木)の日記です。 『グーテンベルグ時代のWordPressノート テーマの作り方2(ランディングページ&ワンカラムサイト編)』のKindle本をコツコツ進めて、ようやくランディングページが完成しました。 実はこの書籍では従来のスタイルでランディングペ…

WordPressの勉強7日目

9月18日(水)の日記です。 『グーテンベルグ時代のWordPressノート テーマの作り方2(ランディングページ&ワンカラムサイト編)』のKindle本を進めておりますが、2つの発見がありました。 『グーテンベルグ時代のWordPressノート テーマの作り方(入門編)…

WordPressの勉強6日目

9月17日(火)の日記です。 『グーテンベルグ時代のWordPressノート テーマの作り方(入門編)』のKindle書籍を2回通しで読み、WordPressでのサンプルサイト作成の要領が徐々に掴めて来ました。 少なくともオリジナルテーマの制作の仕方がおおよそ理解出来た…

『HTML5 & CSS3 デザインレシピ集』を読んで

9月16日(月)の日記です。 休日であった為、フリーランスに向けてのスキル取得以外の事をメインにやっていましたが、HTML5・CSS3関連で興味が湧いた本があったのでそれを何日かに分けて読んでいました。 狩野祐東氏 著書の『HTML5 & CSS3 デザインレシピ集…

WordPressの勉強5日目(『グーテンベルグ時代のWordPressノート テーマの作り方(入門編)』)

9月13日(金)の日記です。 本日は『グーテンベルグ時代のWordPressノート テーマの作り方(入門編)』のKindle本を元に、まずは通しでサンプルのWprdPressブログの作成を行いました。 WordPressのオリジナルテーマの制作においては、 index.php functions.p…

WordPressの勉強4日目

9月12日(木)の日記です。 『WordPress標準デザイン講座 第2版』を繰り返し勉強し、今度はミス無く1発でhttps://(SSL対応)のサーバーにあげる事が出来ました。 まだまだWordPressのテンプレートやプラグインについては復習していかないとですが、サーバー…

WordPressの勉強3日目(『WordPress標準デザイン講座 第2版』の続き)

9月11日(水)の日記です。 この日は先日紹介した『WordPress標準デザイン講座 第2版』の書籍を学び終えました。 また、事前に購入しておいたロリポップサーバーに、作成したWordPressのサンプルサイトをアップロードして公に公開するところまでを完了させる…

WordPressの勉強2日目(『WordPress標準デザイン講座 第2版』)

9月10日(火)の日記です。 WordPressですが、しばらくは書籍にて基礎を固める事にしました。 参考にさせて頂くのは、野村圭氏・石原隆志氏 著書の『WordPress標準デザイン講座 第2版』です。 最新のWordPress(Gutenberg)に対応しているとの事で、これを元…

WordPressの勉強1日目

9月9日(月)の日記です。 本日からWordPressの勉強を行います。 理由としては、日本のみならず世界中でWordPressが使われている事と、Progateにて習得したPHPのスキルを活かす為です。 今までは単純にHTMLによるWebページ制作が主でしたが、これからはWebフ…

Progateの復習 & 『LP ランディングページの教科書』の本を読んで

9月7日(土)の日記です。 休日という事で、読み終わっていない本を読んだりProgateの復習を行う事にしました。 まずはランディングページの制作に関して参考になるかと思って少しずつ読み進めていた、あびるやすみつ氏著書の『LP ランディングページの教科…

簡易ランディングページの作成6日目

9月6日(金)の日記です。 先日は生のHTML・CSSでランディングページを書きましたが、本日は同じWebページを今度はBootstrap4にて書く事にしました。 目的としてはBootstrapの復習もそうですが、やはり実務ではBootstrapを使う機会が多いと思うので、ランデ…

簡易ランディングページの作成5日目

9月5日(木)の日記です。 本日はひたすらレスポンシブ対応に向けてSASSのコードの見直しと修正を行いました。レスポンシブ化にもそれ程労力を費やさないレイアウトをあらかじめ考えていたのですが、やはり実際に適用させるとなると、そう簡単にはいかないみ…

簡易ランディングページの作成4日目

9月4日(水)の日記です。 何とか、PC版のランディングページが完成しました。 Bootstrap4を使わず生のcssで作ってみた感想ですが、代わりにflexboxを使用したので思った程作成に手間が掛かった様な感じは受けませんでした。「横並びにしたいブロックを floa…

簡易ランディングページの作成3日目

9月3日(火)の日記です。 先日作成したデザインカンプの画像を元に、本日はHTMLにてWebページ制作を開始しました。 ちなみに今回はBootstrap4を使わず生のHTML・CSSでレスポンシブを踏まえたページを制作すると共に、先日Progateで新しく始まったFlexboxの…

簡易ランディングページの作成1日目 & 『文系でもプログラミング副業で月10万円稼ぐ!』を読んで

8月30日(金)の日記です。 Bootstrapにもある程度慣れてきたので、本日からは実際に仕事で制作するとされる「ランディングページ」のスキル取得に向けて勉強を始めました。 ランディングページを簡単に調べたところ、 「検索結果や広告などを経由して訪問者…

Bootstrapの練習6日目 & メールフォームと送信機能の実装

8月29日(木)の日記です。 今回もBootstrap4を用いたサイト制作は行ないましたが、初めての試みで、メールフォームの送信機能の実装を行ないました。 まずは完成形です。 実際に各項目を入力して送信すると、下記の様に完了ページに飛び、メールが送信側と…

Bootstrapの練習5日目

8月28日(水)の日記です。 前回ではBootstrap4を用いてPC版の写経を行ないましたが、今回はこのサンプルサイトを「スマホ」と「タブレット」にも適用するレスポンシブサイトにしてみます。 Bootstrap4の規定に従い、スマホ版は画面横幅が544px以下、そして…

Bootstrapの練習4日目

8月27日(火)の日記です。 先日からBootstrap4の写経を行ないまして、ようやく1つのサンプルサイトが出来上がりました。 結論から言うと、1度ハマりました。 今まではサンプルのコードを書いていたから形に出来ていただけで、いざ写経となると本当に使いこ…

Bootstrapの練習3日目 & jQueryの追加勉強

8月26日(月)の日記です。 本日はBootstrap4の技術取得の前に、以前知り合いから頂いた日経ソフトウェア付録の『プログラマとWebデザイナーをつなぐjQuery教本』という冊子を勉強しました。 内容としてはjQueryの簡単な基礎や応用が書かれているのですが、…

Bootstrapの練習2日目

8月24日(土)の日記です。 Bootstrap4の勉強ですが、『Bootstrap4 フロントエンド開発の教科書』を元にクラス名をザッと理解し、サンプルサイトの制作を行ないました。 非常に濃密な内容ですので一度に全部を覚える事は出来ませんが、1つ1つのクラスがどの…

Bootstrapの練習1日目

8月23日(金)の日記です。 先日はjQueryの復習を行ないましたが、今日からはBootstrapを勉強していきます。 現在はBootstrap4が主流との事ですが、まずはBootstrap3にてサンプルを作ってみました。 感想ですが、びっくりする事に、一切独自のCSSを作る事無…

jQueryの勉強及び復習

8月22日(木)の日記です。 これからも写経は随時続けていきたいと思いますが、今日はjQueryについて新たにインターネット学習サイトおよび書籍にて勉強をする事にしました。 まずは学習サイトですが、下記レッスンが無料で受けられるので20回分、ぶっ通しで…