Mako
未経験からWebデザイナーになりました。
簡単なWebサイトの制作やLPなどのデザイン作成、WordPressの自作テーマ化ができます。
当ブログでは、未経験からWebデザイナーを目指すために行ってきた学習方法や、ポートフォリオサイトの作り方などについて執筆していきます。
できること
【HTML/CSS】
基本的なコーディング
(HTML5/CSS3を用いたマークアップ及びスタイルの装飾)
レスポンシブ対応
(メディアクエリの導入によるビューポートの指定サイトのスマホ対応)
Googleマップ導入
(Googleマップのサイト内埋め込み)
動画挿入
(サイト内への動画形式ファイルの挿入)
フォーム入力内容エラーチェック
(お問合せフォームの必須項目、および任意項目の判定)
【JavaScript (jQuery)】
スマホユーザー向きナビゲーションメニューの導入
(ハンバーガーメニュー/ドロップダウンメニュー/多階層ドロップダウンメニューの導入/タブ切り替えメニュー)
その他、ウェブサイトUI/UX向上に向けての各種jQuery処理の導入
(スライドショー/フェードイン・フェードアウト/スクロールで表示されるトップへ戻るボタンなどの表示/サイトの読み込み速度改善に向けた「LazyLoad」や「lazysizes」を用いた画像遅延読み込み)
【WordPress】
CMSの導入/オリジナルデザイン
(自作HTMLサイトによる静的webコンテンツのWordPressテーマ化/プラグイン「contact form 7」を用いたお問い合わせフォームの実装(メール送受信検証済み)/投稿機能の実装(投稿記事single.php/一覧ページarchive.php)などワードプレスループによる実装/search.phpによる投稿記事検索機能の実装)
【フレームワークの導入】
開発補助ソフトウェアの導入
「Bootstrap3」「Bootstrap4」「Bootstrap5」などを用いたグリッドデザインによるコーディングの効率化
【Photoshop】
デザインソフトの操作/デザインデータの制作
(写真及び画像加工・作成/サイトモックアップ/web用バナーデザイン/LP(ランディングページ)用画像デザイン/ロゴ制作/簡単なイラスト制作/各種印刷媒体の販促物作成)