制作実績掲載OK! デザインカンプ【上級編】

2023/12/02に公開

はじめに

HTML、CSS、jQuery の学習が完了した方を対象に Web 制作上級レベルのデザインカンプを作りました。以下リンクからアクセスできます。
https://www.figma.com/file/v5WcKThfKwNdAsoPbwKUtq/上級編-デザインカンプ?type=design&node-id=0%3A1&mode=design&t=iuvLKEGP3Rad9W3Z-1

Figma デザインカンプからコーディングする方法を知りたい方は、以下の記事をご覧ください。
https://zenn.dev/reskilling_hase/articles/0d6b11fcd1172a
この記事では、Figma デザインカンプからコーディングする方法を画像を交えてご紹介しています。

ポートフォリオへの掲載や著作権について

  • OK なこと

    • デザインカンプをコーディングしたサイトをポートフォリオやブログへ掲載すること
    • デザインカンプを改変し、オリジナルのポートフォリオにすること
  • お願い

    • 掲載する際は『未経験から始める!Web 制作独学ロードマップ』へリンクを貼ること
      URL:https://zenn.dev/reskilling_hase/articles/11ba57549b2e64
    • 検索エンジンにインデックスされない処理をすること(以下の内 1 つ)
    • <head>内に<meta name="robots" content="noindex, nofollow">を記述
    • Basic 認証設定
    • robot.txt 設定
  • 禁止事項

    • 再配布や販売する行為

コンセプト

このデザインカンプは静的サイトから動的サイト(WordPress)化することを意識して作りました。以下の要件を意識しています。

  • 要件
    • 投稿
    • 固定ページ
    • アーカイブ
    • カスタム投稿タイプ
    • カスタムタクソノミー
    • カスタムフィールド
    • アイキャッチ
    • ナビゲーションメニュー
    • サイドバー
    • パンくずリスト
    • ページネーション
    • 条件分岐タグ
    • ループ
    • サブループ

Discussion